/* ═══════════════════════════════════════════════════════════
   Aurora — static DOM layers ported from www.loxtu.com
   (no canvas, no JS required; pure CSS drift blobs)
   ═══════════════════════════════════════════════════════════ */

.aurora {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.aurora-layer {
  position: absolute;
  inset: 0;
  opacity: 1;
  transition: opacity 1s ease;
  will-change: transform;
}

.aurora-blob {
  position: absolute;
  border-radius: 9999px;
  pointer-events: none;
}

/* Dark palette — teal / gold wash (loxtu.com dark) */
[data-theme="dark"] .aurora-blob-a {
  top: -15%; left: -15%; width: 70%; height: 70%;
  background: radial-gradient(circle,
    rgba(45, 212, 191, 0.45) 0%,
    rgba(45, 212, 191, 0.18) 50%,
    transparent 100%);
  filter: blur(160px);
}
[data-theme="dark"] .aurora-blob-b {
  bottom: -20%; right: -20%; width: 75%; height: 75%;
  background: radial-gradient(circle,
    rgba(13, 148, 136, 0.35) 0%,
    rgba(13, 148, 136, 0.12) 50%,
    transparent 100%);
  filter: blur(180px);
}
[data-theme="dark"] .aurora-blob-c {
  top: -25%; left: 20%; width: 60%; height: 60%;
  background: radial-gradient(circle,
    rgba(244, 183, 64, 0.18) 0%,
    rgba(244, 183, 64, 0.05) 50%,
    transparent 100%);
  filter: blur(200px);
}
[data-theme="dark"] .aurora-blob-d {
  bottom: -15%; left: -15%; width: 55%; height: 55%;
  background: radial-gradient(circle,
    rgba(45, 212, 191, 0.22) 0%,
    rgba(45, 212, 191, 0.08) 50%,
    transparent 100%);
  filter: blur(140px);
}
[data-theme="dark"] .aurora-blob-e {
  top: 30%; right: -10%; width: 50%; height: 50%;
  background: radial-gradient(circle,
    rgba(56, 189, 248, 0.14) 0%,
    rgba(56, 189, 248, 0.04) 55%,
    transparent 100%);
  filter: blur(160px);
}
[data-theme="dark"] .aurora-blob-f {
  bottom: 10%; left: 35%; width: 45%; height: 45%;
  background: radial-gradient(circle,
    rgba(129, 140, 248, 0.12) 0%,
    transparent 60%);
  filter: blur(150px);
}

/* Light palette — soft sky / cream (loxtu.com light) */
[data-theme="light"] .aurora-blob-a {
  top: -15%; left: -15%; width: 70%; height: 70%;
  background: radial-gradient(circle,
    rgba(186, 230, 253, 0.55) 0%,
    rgba(186, 230, 253, 0.22) 50%,
    transparent 100%);
  filter: blur(160px);
}
[data-theme="light"] .aurora-blob-b {
  bottom: -20%; right: -20%; width: 75%; height: 75%;
  background: radial-gradient(circle,
    rgba(204, 251, 241, 0.45) 0%,
    rgba(204, 251, 241, 0.18) 50%,
    transparent 100%);
  filter: blur(180px);
}
[data-theme="light"] .aurora-blob-c {
  top: -25%; left: 20%; width: 60%; height: 60%;
  background: radial-gradient(circle,
    rgba(254, 243, 199, 0.28) 0%,
    rgba(254, 243, 199, 0.08) 50%,
    transparent 100%);
  filter: blur(200px);
}
[data-theme="light"] .aurora-blob-d {
  bottom: -15%; left: -15%; width: 55%; height: 55%;
  background: radial-gradient(circle,
    rgba(186, 230, 253, 0.32) 0%,
    rgba(186, 230, 253, 0.12) 50%,
    transparent 100%);
  filter: blur(140px);
}
[data-theme="light"] .aurora-blob-e {
  top: 30%; right: -10%; width: 50%; height: 50%;
  background: radial-gradient(circle,
    rgba(2, 132, 199, 0.10) 0%,
    transparent 60%);
  filter: blur(160px);
}
[data-theme="light"] .aurora-blob-f {
  bottom: 10%; left: 35%; width: 45%; height: 45%;
  background: radial-gradient(circle,
    rgba(14, 165, 233, 0.08) 0%,
    transparent 60%);
  filter: blur(150px);
}

@keyframes driftLayer1 {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  50%  { transform: translate3d(1.5%, -1.5%, 0) scale(1.02); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes driftLayer2 {
  0%   { transform: translate3d(0, 0, 0) scale(1.02); }
  50%  { transform: translate3d(-1.5%, 1.5%, 0) scale(0.98); }
  100% { transform: translate3d(0, 0, 0) scale(1.02); }
}

.aurora-layer-1 { animation: driftLayer1 24s ease-in-out infinite; }
.aurora-layer-2 { animation: driftLayer2 24s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
  .aurora-layer-1,
  .aurora-layer-2 { animation: none; }
}
