/* ============================================================
   PREMIUM AURORA LAYER v20 — Award-grade additive styling
   Apple × Active Theory × Awwwards × Jarvis × Vision Pro
   100% additive — does NOT override existing rules.
   ============================================================ */
:root{
  --aurora-cyan:#00e5ff;
  --aurora-violet:#a855f7;
  --aurora-magenta:#ff3d9a;
  --aurora-gold:#f5c563;
  --aurora-deep:#04060c;
  --aurora-glass:rgba(255,255,255,.045);
  --aurora-glass-strong:rgba(255,255,255,.09);
  --aurora-line:rgba(255,255,255,.10);
  --aurora-shadow:0 40px 120px -40px rgba(0,229,255,.45),0 30px 90px -50px rgba(168,85,247,.5);
  --aurora-grad:conic-gradient(from 140deg at 50% 50%,#00e5ff,#a855f7,#ff3d9a,#f5c563,#00e5ff);
  --ease-out-expo:cubic-bezier(.19,1,.22,1);
  --ease-in-out-quint:cubic-bezier(.83,0,.17,1);
}

/* === Universal premium cursor ============================== */
.aurora-cursor{position:fixed;top:0;left:0;width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle,#fff 0%,rgba(255,255,255,.4) 40%,transparent 70%);
  mix-blend-mode:difference;pointer-events:none;z-index:99999;
  transform:translate(-50%,-50%);transition:width .25s var(--ease-out-expo),height .25s var(--ease-out-expo),opacity .3s}
.aurora-cursor.ring{width:46px;height:46px;border:1px solid rgba(255,255,255,.5);background:transparent;
  transition:transform .35s var(--ease-out-expo),width .3s,height .3s,border-color .3s}
.aurora-cursor.is-hover{width:74px;height:74px;border-color:var(--aurora-cyan)}
@media (hover:none){.aurora-cursor{display:none}}

/* === Aurora background ribbons (fixed, GPU only) =========== */
.aurora-ribbons{position:fixed;inset:-20vmax;z-index:0;pointer-events:none;filter:blur(80px) saturate(140%);opacity:.55;mix-blend-mode:screen}
.aurora-ribbons span{position:absolute;inset:auto;width:55vmax;height:55vmax;border-radius:50%;
  background:var(--aurora-grad);animation:auroraFloat 28s var(--ease-in-out-quint) infinite}
.aurora-ribbons span:nth-child(1){top:-10%;left:-10%;animation-delay:-2s}
.aurora-ribbons span:nth-child(2){bottom:-15%;right:-15%;animation-delay:-9s;opacity:.7}
.aurora-ribbons span:nth-child(3){top:35%;left:25%;width:40vmax;height:40vmax;animation-delay:-18s;opacity:.5}
@keyframes auroraFloat{0%,100%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(8vmax,-6vmax,0) rotate(180deg)}}

/* === Vision-Pro style spatial card stack =================== */
.aurora-section{position:relative;padding:160px 6vw;z-index:2}
.aurora-section h2{font-family:"Instrument Serif",serif;font-size:clamp(46px,7vw,118px);line-height:.95;letter-spacing:-.03em;margin:0 0 .35em;
  background:linear-gradient(180deg,#fff 0%,#fff 40%,rgba(255,255,255,.55) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.aurora-section .eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 18px;border:1px solid var(--aurora-line);
  border-radius:999px;background:var(--aurora-glass);backdrop-filter:blur(14px) saturate(160%);font:600 11px/1 "JetBrains Mono",monospace;
  letter-spacing:.25em;text-transform:uppercase;color:var(--aurora-cyan);margin-bottom:28px}
.aurora-section .eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--aurora-cyan);box-shadow:0 0 14px var(--aurora-cyan);animation:auroraPulse 1.8s infinite}
@keyframes auroraPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}
.aurora-section p.lead{font-size:clamp(18px,1.6vw,22px);color:var(--ink-dim,#8a92ad);max-width:62ch;line-height:1.55}

/* === Glass spatial windows (Vision Pro) ==================== */
.spatial-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:28px;margin-top:80px;perspective:1800px}
.spatial-card{grid-column:span 4;min-height:340px;border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  border:1px solid var(--aurora-line);backdrop-filter:blur(24px) saturate(170%);
  padding:32px;position:relative;overflow:hidden;transform-style:preserve-3d;
  transition:transform .8s var(--ease-out-expo),box-shadow .6s,border-color .6s}
.spatial-card::before{content:"";position:absolute;inset:0;background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),rgba(0,229,255,.18),transparent 40%);opacity:0;transition:opacity .4s}
.spatial-card:hover{transform:translateZ(40px) rotateX(6deg) rotateY(-6deg);border-color:rgba(0,229,255,.4);box-shadow:var(--aurora-shadow)}
.spatial-card:hover::before{opacity:1}
.spatial-card .glyph{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;
  background:var(--aurora-grad);color:#06080f;font-weight:700;margin-bottom:18px;box-shadow:0 12px 40px -10px rgba(168,85,247,.6)}
.spatial-card h3{font-size:22px;margin:6px 0 10px;letter-spacing:-.01em}
.spatial-card p{color:var(--ink-dim,#8a92ad);font-size:14px;line-height:1.55;margin:0}
.spatial-card .stat{margin-top:22px;font:700 32px/1 "Space Grotesk",sans-serif;background:var(--aurora-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.spatial-card{grid-column:span 6}}
@media (max-width:680px){.spatial-card{grid-column:span 12;min-height:280px}}

/* === Jarvis mission-control HUD upgrade ==================== */
.mission-control{position:relative;margin:120px auto 0;max-width:1400px;border:1px solid var(--aurora-line);
  border-radius:32px;padding:48px;background:radial-gradient(1200px 600px at 50% 0%,rgba(0,229,255,.08),transparent 60%),
  linear-gradient(180deg,rgba(10,13,24,.85),rgba(4,6,12,.92));overflow:hidden;backdrop-filter:blur(20px)}
.mission-control::before,.mission-control::after{content:"";position:absolute;width:46px;height:46px;border:2px solid var(--aurora-cyan);opacity:.7}
.mission-control::before{top:18px;left:18px;border-right:none;border-bottom:none}
.mission-control::after{bottom:18px;right:18px;border-left:none;border-top:none}
.mc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}
.mc-tile{border:1px solid var(--aurora-line);border-radius:18px;padding:22px;background:rgba(255,255,255,.025);position:relative;overflow:hidden}
.mc-tile .label{font:600 10px/1 "JetBrains Mono",monospace;letter-spacing:.3em;text-transform:uppercase;color:var(--aurora-cyan)}
.mc-tile .value{font:700 38px/1 "Space Grotesk",sans-serif;margin:14px 0 6px;color:#fff}
.mc-tile .delta{font:500 12px/1 "JetBrains Mono",monospace;color:#7cf6c5}
.mc-tile canvas{position:absolute;left:0;right:0;bottom:0;width:100%;height:60px;opacity:.85}
@media (max-width:880px){.mc-grid{grid-template-columns:repeat(2,1fr)}}

/* === Cinematic scroll storyline ============================ */
.storyline{position:relative;padding:200px 6vw 240px;z-index:2}
.story-act{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;margin-bottom:200px;opacity:0;transform:translateY(80px);
  transition:opacity 1.2s var(--ease-out-expo),transform 1.2s var(--ease-out-expo)}
.story-act.in-view{opacity:1;transform:none}
.story-act:nth-child(even){direction:rtl}
.story-act:nth-child(even) > *{direction:ltr}
.story-act .visual{height:480px;border-radius:32px;background:linear-gradient(135deg,rgba(0,229,255,.12),rgba(168,85,247,.12));
  border:1px solid var(--aurora-line);position:relative;overflow:hidden;backdrop-filter:blur(14px)}
.story-act .visual::after{content:"";position:absolute;inset:0;background:var(--aurora-grad);opacity:.18;mix-blend-mode:overlay;animation:auroraFloat 22s linear infinite}
.story-act .act-num{font:700 14px/1 "JetBrains Mono",monospace;letter-spacing:.4em;color:var(--aurora-cyan);margin-bottom:16px}
.story-act h3{font-family:"Instrument Serif",serif;font-size:clamp(36px,5vw,72px);line-height:1;margin:0 0 18px;letter-spacing:-.02em}
.story-act p{color:var(--ink-dim,#8a92ad);font-size:18px;line-height:1.65;max-width:46ch}
@media (max-width:980px){.story-act{grid-template-columns:1fr;gap:36px;margin-bottom:140px}.story-act:nth-child(even){direction:ltr}.story-act .visual{height:320px}}

/* === Magnetic CTA buttons ================================== */
.aurora-cta{position:relative;display:inline-flex;align-items:center;gap:14px;padding:22px 38px;border-radius:999px;
  font:600 16px/1 "Space Grotesk",sans-serif;color:#06080f;background:var(--aurora-grad);background-size:300% 300%;
  border:none;cursor:pointer;overflow:hidden;animation:auroraShift 8s linear infinite;
  box-shadow:0 20px 60px -20px rgba(0,229,255,.6),0 20px 60px -30px rgba(168,85,247,.6);
  transition:transform .35s var(--ease-out-expo)}
.aurora-cta::after{content:"→";font-size:20px;transition:transform .35s var(--ease-out-expo)}
.aurora-cta:hover::after{transform:translateX(6px)}
@keyframes auroraShift{0%{background-position:0% 50%}100%{background-position:300% 50%}}

/* === Premium gaming-style boot overlay ===================== */
.boot-overlay{position:fixed;inset:0;z-index:99998;background:#04060c;display:grid;place-items:center;
  transition:opacity 1s var(--ease-out-expo),visibility 1s}
.boot-overlay.is-gone{opacity:0;visibility:hidden;pointer-events:none}
.boot-stage{position:relative;width:min(640px,86vw);text-align:center}
.boot-logo{font-family:"Instrument Serif",serif;font-size:clamp(38px,6vw,72px);letter-spacing:-.02em;line-height:1;
  background:var(--aurora-grad);-webkit-background-clip:text;background-clip:text;color:transparent;animation:bootGlow 2.6s infinite}
@keyframes bootGlow{0%,100%{filter:drop-shadow(0 0 30px rgba(0,229,255,.5))}50%{filter:drop-shadow(0 0 50px rgba(168,85,247,.7))}}
.boot-sub{margin:18px 0 32px;color:var(--aurora-cyan);font:600 11px/1.6 "JetBrains Mono",monospace;letter-spacing:.4em;text-transform:uppercase}
.boot-bar{position:relative;height:2px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.boot-bar i{position:absolute;left:0;top:0;height:100%;background:var(--aurora-grad);width:0%;transition:width .25s ease}
.boot-pct{margin-top:10px;font:500 11px/1 "JetBrains Mono",monospace;color:var(--ink-dim,#8a92ad);letter-spacing:.3em}
.boot-log{margin-top:28px;max-height:90px;overflow:hidden;font:400 11px/1.6 "JetBrains Mono",monospace;color:#7cf6c5;text-align:left;opacity:.85}
.boot-log div{opacity:0;animation:bootLine .6s forwards}
@keyframes bootLine{to{opacity:1}}
.boot-rings{position:absolute;inset:-120px;border-radius:50%;pointer-events:none}
.boot-rings i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(0,229,255,.25);animation:bootSpin 6s linear infinite}
.boot-rings i:nth-child(2){inset:30px;border-color:rgba(168,85,247,.25);animation-duration:9s;animation-direction:reverse}
.boot-rings i:nth-child(3){inset:60px;border-color:rgba(255,61,154,.25);animation-duration:12s}
@keyframes bootSpin{to{transform:rotate(360deg)}}
.boot-particles{position:absolute;inset:0;pointer-events:none}

/* === Award footer signature =============================== */
.aurora-sign{padding:120px 6vw;text-align:center;position:relative;z-index:2}
.aurora-sign h2{font-family:"Instrument Serif",serif;font-size:clamp(48px,8vw,140px);line-height:.95;letter-spacing:-.03em;margin:0 0 18px}
.aurora-sign p{color:var(--ink-dim,#8a92ad);max-width:60ch;margin:0 auto 36px;font-size:18px;line-height:1.6}
.aurora-marquee{margin-top:80px;overflow:hidden;border-top:1px solid var(--aurora-line);border-bottom:1px solid var(--aurora-line);padding:28px 0}
.aurora-marquee .track{display:flex;gap:80px;animation:marquee 38s linear infinite;white-space:nowrap;font-family:"Instrument Serif",serif;
  font-size:clamp(28px,4vw,56px);color:rgba(255,255,255,.6)}
.aurora-marquee .track span{display:inline-flex;align-items:center;gap:80px}
.aurora-marquee .track span::after{content:"✦";color:var(--aurora-cyan)}
@keyframes marquee{to{transform:translateX(-50%)}}