/* Sanatan Samruddhi - shared living atmosphere for every public page. */
:root {
  --ss-prana-primary: #8b0000;
  --ss-prana-accent: #ff9933;
}

body {
  --ss-prana-primary: var(--ss-primary, #8b0000);
  --ss-prana-accent: var(--ss-accent, #ff9933);
  --ss-prana-x: 0px;
  --ss-prana-y: 0px;
  position: relative;
  isolation: isolate;
}

/* A slow depth orb keeps inner pages connected to the living homepage. */
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  top: clamp(-230px, -15vw, -110px);
  right: clamp(-230px, -12vw, -90px);
  width: clamp(300px, 42vw, 680px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
  opacity: .42;
  background:
    radial-gradient(circle at 48% 44%, rgba(255,255,255,.76) 0 4%, transparent 5%),
    radial-gradient(circle at 48% 44%, color-mix(in srgb, var(--ss-prana-accent) 20%, transparent) 0 22%, transparent 48%),
    radial-gradient(circle at 50% 50%, transparent 0 57%, color-mix(in srgb, var(--ss-prana-primary) 18%, transparent) 58% 58.7%, transparent 60% 67%, color-mix(in srgb, var(--ss-prana-accent) 26%, transparent) 67.5% 68.2%, transparent 69%);
  border: 1px solid color-mix(in srgb, var(--ss-prana-accent) 25%, transparent);
  box-shadow: 0 0 90px color-mix(in srgb, var(--ss-prana-accent) 17%, transparent), inset 0 0 70px color-mix(in srgb, var(--ss-prana-primary) 10%, transparent);
  transform: translate3d(var(--ss-prana-x), var(--ss-prana-y), 0) rotateX(8deg) rotateY(-12deg);
  transform-style: preserve-3d;
  animation: ss-prana-orbit 24s ease-in-out infinite;
}

/* Fine light particles add movement without turning content into a dashboard. */
body::after {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: .18;
  background:
    radial-gradient(circle at 14% 28%, color-mix(in srgb, var(--ss-prana-accent) 48%, transparent) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 62%, color-mix(in srgb, var(--ss-prana-primary) 36%, transparent) 0 1px, transparent 2px),
    radial-gradient(circle at 34% 84%, color-mix(in srgb, var(--ss-prana-accent) 34%, transparent) 0 1px, transparent 2px);
  background-size: 180px 180px, 240px 240px, 310px 310px;
  background-position: 0 0, 60px 40px, 120px 90px;
  animation: ss-prana-particles 32s linear infinite;
}

@keyframes ss-prana-orbit {
  0%, 100% { transform: translate3d(var(--ss-prana-x), var(--ss-prana-y), 0) rotateX(8deg) rotateY(-12deg) rotateZ(-2deg) scale(.98); }
  50% { transform: translate3d(calc(var(--ss-prana-x) - 9px), calc(var(--ss-prana-y) + 12px), 0) rotateX(-5deg) rotateY(10deg) rotateZ(3deg) scale(1.03); }
}

@keyframes ss-prana-particles {
  from { background-position: 0 0, 60px 40px, 120px 90px; }
  to { background-position: 180px 120px, -80px 180px, 220px -140px; }
}

@media (max-width: 700px) {
  body::before { top: -150px; right: -180px; width: 390px; opacity: .27; }
  body::after { opacity: .11; }
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after { animation: none; transform: none; }
}