/* NYMERO Cosmic Ambient v1.0
   Subtle cosmic atmosphere for all pages (except homepage quiz).
   Three intensity levels: light | medium | heavy
   Include after design-system.css */

/* ─── SHARED CONTAINER ─── */
.ca-layer{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.ca-canvas{position:fixed;inset:0;pointer-events:none;z-index:0}

/* ─── AMBIENT ORBITS (medium + heavy) ─── */
.ca-orbits{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.ca-orbit{position:absolute;top:50%;left:50%;border-radius:50%;border:1px solid rgba(201,168,76,0.065);transform:translate(-50%,-50%)}
.ca-orbit:nth-child(1){width:400px;height:380px;animation:caOrbit 60s linear infinite}
.ca-orbit:nth-child(2){width:700px;height:660px;animation:caOrbit 100s linear infinite reverse;border-color:rgba(201,168,76,0.08)}
.ca-orbit:nth-child(3){width:1000px;height:940px;animation:caOrbit 140s linear infinite;border-color:rgba(201,168,76,0.05)}
.ca-dot{position:absolute;top:-2px;left:50%;border-radius:50%;transform:translateX(-50%)}
.ca-orbit:nth-child(1) .ca-dot{width:5px;height:5px;background:#c9a84c;box-shadow:0 0 14px rgba(201,168,76,0.7)}
.ca-orbit:nth-child(2) .ca-dot{width:4px;height:4px;background:#a68530;box-shadow:0 0 10px rgba(166,133,48,0.5)}
.ca-orbit:nth-child(3) .ca-dot{width:3px;height:3px;background:#a0522d;box-shadow:0 0 8px rgba(160,82,45,0.4)}

@keyframes caOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* ─── AMBIENT AURORA (medium + heavy) ─── */
.ca-aurora{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.ca-aurora-blob{position:absolute;border-radius:50%;filter:blur(120px);will-change:transform;opacity:0.55}
.ca-aurora-blob:nth-child(1){width:500px;height:500px;top:-15%;left:-10%;
  background:radial-gradient(circle,rgba(201,168,76,0.12) 0%,transparent 70%);
  animation:caAurora1 40s ease-in-out infinite}
.ca-aurora-blob:nth-child(2){width:550px;height:550px;bottom:-15%;right:-10%;
  background:radial-gradient(circle,rgba(120,80,40,0.10) 0%,transparent 70%);
  animation:caAurora2 55s ease-in-out infinite}

@keyframes caAurora1{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(40px,30px) scale(1.1)}
  66%{transform:translate(-20px,50px) scale(0.92)}
}
@keyframes caAurora2{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(-35px,-25px) scale(1.08)}
  66%{transform:translate(30px,-40px) scale(0.95)}
}
.ca-aurora-blob:nth-child(3){width:400px;height:400px;top:40%;left:50%;
  background:radial-gradient(circle,rgba(160,82,45,0.08) 0%,transparent 70%);
  animation:caAurora3 70s ease-in-out infinite}
@keyframes caAurora3{
  0%,100%{transform:translate(-50%,0) scale(1)}
  50%{transform:translate(-50%,-40px) scale(1.2)}
}

/* ─── FLOATING PARTICLES (all levels) ─── */
.ca-particles{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.ca-particle{position:absolute;width:2.5px;height:2.5px;border-radius:50%;background:rgba(201,168,76,0.35);
  animation:caFloat var(--dur,20s) linear infinite;
  left:var(--x,50%);top:var(--y,100%)}
.ca-particle:nth-child(odd){background:rgba(201,168,76,0.25);width:2px;height:2px}

@keyframes caFloat{
  0%{transform:translateY(0) translateX(0);opacity:0}
  10%{opacity:1}
  90%{opacity:1}
  100%{transform:translateY(calc(-100vh - 40px)) translateX(var(--drift,20px));opacity:0}
}

/* ─── SHOOTING STAR (triggered via JS) ─── */
.ca-shooting-star{position:fixed;top:15%;left:-10%;width:100px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,168,76,0.6),transparent);
  transform:rotate(-15deg);pointer-events:none;z-index:1;
  animation:caStar 1.2s ease-out forwards;opacity:0}

@keyframes caStar{
  0%{opacity:0;transform:rotate(-15deg) translateX(0)}
  15%{opacity:1}
  100%{opacity:0;transform:rotate(-15deg) translateX(110vw)}
}

/* ─── BURST PARTICLES (triggered via JS) ─── */
.ca-burst{position:fixed;pointer-events:none;z-index:2}
.ca-burst-dot{position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--burst-color,#c9a84c);
  animation:caBurst 0.8s ease-out forwards}

@keyframes caBurst{
  0%{transform:translate(0,0) scale(1);opacity:1}
  100%{transform:translate(var(--bx,30px),var(--by,-40px)) scale(0);opacity:0}
}

/* ─── GLOW PULSE (CSS-only, for hero numbers) ─── */
.ca-glow-pulse{animation:caGlow 3s ease-in-out infinite}
@keyframes caGlow{
  0%,100%{text-shadow:0 0 20px rgba(201,168,76,0.15)}
  50%{text-shadow:0 0 40px rgba(201,168,76,0.3),0 0 80px rgba(201,168,76,0.1)}
}

/* ─── HEAVY: boost aurora opacity ─── */
[data-cosmic="heavy"] .ca-aurora-blob{opacity:0.7}
[data-cosmic="heavy"] .ca-orbit{border-color:rgba(201,168,76,0.14)}
[data-cosmic="heavy"] .ca-orbit:nth-child(2){border-color:rgba(201,168,76,0.10)}
[data-cosmic="heavy"] .ca-orbit:nth-child(3){border-color:rgba(201,168,76,0.06)}

/* ─── IDLE STATE: dim ambient when user reads content ─── */
.ca-idle .ca-orbit,.ca-idle .ca-aurora-blob,.ca-idle .ca-particle{
  animation-play-state:paused!important;
  transition:opacity 2s ease;
  opacity:0.15!important}
.ca-idle .ca-canvas{transition:opacity 2s ease;opacity:0.2}
.ca-idle .ca-orbits{transition:opacity 2s ease;opacity:0.3}
/* Wake: smooth return */
.ca-orbits,.ca-aurora-blob,.ca-particle,.ca-canvas{transition:opacity 1.5s ease}

/* ─── SCROLL REVEAL ─── */
.ca-reveal{opacity:0;transform:translateY(20px);transition:opacity 0.6s cubic-bezier(0.16,1,0.3,1),transform 0.6s cubic-bezier(0.16,1,0.3,1)}
.ca-reveal.ca-visible{opacity:1;transform:translateY(0)}

/* ─── REDUCED MOTION ─── */
@media(prefers-reduced-motion:reduce){
  .ca-layer,.ca-canvas,.ca-orbits,.ca-aurora,.ca-particles,
  .ca-shooting-star,.ca-burst,.ca-glow-pulse{
    animation:none!important;
    display:none!important}
  .ca-reveal{opacity:1!important;transform:none!important;transition:none!important}
}

/* ─── DARK MODE: boost cosmic atmosphere ─── */
body:not(.cosmos-light) .ca-aurora-blob { opacity: 0.7; }
body:not(.cosmos-light) .ca-orbit { border-color: rgba(201,168,76,0.12); }
body:not(.cosmos-light) .ca-orbit:nth-child(2) { border-color: rgba(201,168,76,0.09); }
body:not(.cosmos-light) .ca-orbit:nth-child(3) { border-color: rgba(201,168,76,0.06); }
body:not(.cosmos-light) .ca-particle { background: rgba(201,168,76,0.45); }
body:not(.cosmos-light) .ca-particle:nth-child(odd) { background: rgba(201,168,76,0.35); }
body:not(.cosmos-light) .ca-dot { box-shadow: 0 0 18px rgba(201,168,76,0.7); }

/* Light mode: subtle cosmic effects */
.cosmos-light .ca-aurora-blob { opacity: 0.35; }
.cosmos-light .ca-orbit { border-color: rgba(160,130,50,0.12); }
.cosmos-light .ca-particle { background: rgba(160,130,50,0.25); }

/* ─── MOBILE: reduce aurora size ─── */
@media(max-width:600px){
  .ca-aurora-blob:nth-child(1){width:300px;height:300px}
  .ca-aurora-blob:nth-child(2){width:320px;height:320px}
  .ca-orbit:nth-child(2),.ca-orbit:nth-child(3){display:none}
  .ca-aurora-blob:nth-child(3){width:250px;height:250px}
}