:root{
  --bg:#02070d;
  --bg2:#06111b;
  --ink:#f4efe4;
  --muted:#9aa2aa;
  --gold:#e6aa37;
  --gold2:#ffd477;
  --line:rgba(232,174,61,.28);
  --glass:rgba(4,12,20,.68);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:
  radial-gradient(circle at 50% -10%,rgba(21,59,87,.26),transparent 34%),
  linear-gradient(#02070d,#030a11 45%,#02070d);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
#starfield{position:fixed;inset:0;width:100%;height:100%;z-index:-3}
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.022;
  background-image:radial-gradient(rgba(255,255,255,.6) .45px,transparent .45px);
  background-size:5px 5px;mix-blend-mode:screen
}
.cursor-glow{
  position:fixed;width:480px;height:480px;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(215,151,46,.06),transparent 66%);
  transform:translate(-50%,-50%)
}
.topbar{
  position:fixed;top:0;left:0;right:0;height:92px;z-index:50;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 4.8vw;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:linear-gradient(rgba(2,7,13,.88),rgba(2,7,13,.34));
  backdrop-filter:blur(14px)
}
.wordmark{display:inline-flex;flex-direction:column;width:max-content}
.wordmark span{
  font-family:Georgia,"Times New Roman",serif;font-size:26px;letter-spacing:.29em;font-weight:400
}
.wordmark em{
  margin-top:3px;color:var(--gold);font-family:Georgia,"Times New Roman",serif;
  font-size:12px;letter-spacing:.08em
}
.topbar nav{display:flex;gap:34px}
.topbar nav a{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#aab2ba;transition:.25s
}
.topbar nav a:hover{color:var(--gold2)}
.sound-btn{
  justify-self:end;border:1px solid var(--line);color:#d8d0c2;background:rgba(3,10,17,.55);
  padding:12px 15px;font-size:9px;letter-spacing:.16em;cursor:pointer;display:flex;align-items:center;gap:9px
}
.sound-dot{width:6px;height:6px;border-radius:50%;background:#6b7075;box-shadow:0 0 0 0 rgba(230,170,55,.6)}
body.sound-on .sound-dot{background:var(--gold2);animation:soundPulse 1.8s infinite}
@keyframes soundPulse{50%{box-shadow:0 0 0 7px rgba(230,170,55,0)}}

.hero{
  min-height:100svh;position:relative;display:flex;align-items:center;justify-content:center;
  padding:128px 5vw 60px;overflow:hidden
}
.hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:31vh;
  background:linear-gradient(transparent,rgba(2,7,13,.75) 55%,#02070d);
  pointer-events:none
}
.hero-inner{position:relative;z-index:7;text-align:center;max-width:1120px;width:100%}
.hero-kicker,.micro{
  color:#d7c7a7;font-size:10px;letter-spacing:.32em;text-transform:uppercase
}
.hero h1{
  margin:16px 0 4px;font-family:Georgia,"Times New Roman",serif;font-weight:400;
  font-size:clamp(72px,11.5vw,180px);letter-spacing:.22em;line-height:.88;
  text-shadow:0 0 38px rgba(255,234,193,.10)
}
.tagline{
  margin:18px 0 0;color:var(--gold);font-family:Georgia,"Times New Roman",serif;
  font-style:italic;font-size:clamp(24px,3vw,44px);letter-spacing:.035em
}
.hero-copy{
  margin:34px auto 0;color:#aeb5bb;font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(17px,1.8vw,25px);line-height:1.55;max-width:730px
}
.hero-cta{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:38px}
.cta-gold,.cta-line{
  padding:15px 20px;font-size:9px;letter-spacing:.20em;text-transform:uppercase;transition:.3s
}
.cta-gold{
  background:linear-gradient(100deg,#c8861e,#f2bf57 55%,#cf8e22);color:#081018;
  box-shadow:0 10px 40px rgba(210,145,31,.19)
}
.cta-gold:hover{transform:translateY(-2px);box-shadow:0 16px 60px rgba(210,145,31,.26)}
.cta-line{border:1px solid var(--line);color:#d7d9db;background:rgba(2,7,13,.3)}
.trust-row{
  margin:76px auto 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:repeat(4,1fr);max-width:1080px;background:rgba(3,10,17,.24);
  backdrop-filter:blur(6px)
}
.trust-row>div{padding:19px 20px;border-right:1px solid var(--line);display:grid;gap:5px}
.trust-row>div:last-child{border-right:0}
.trust-icon{color:var(--gold);font-size:23px}
.trust-row strong{font-family:Georgia,serif;font-size:14px;font-weight:400}
.trust-row small{color:#838d96;font-size:9px;letter-spacing:.04em}
.scroll-cue{
  position:absolute;z-index:9;bottom:24px;left:50%;transform:translateX(-50%);
  font-size:8px;letter-spacing:.23em;color:#6f7982
}
.scroll-cue span{color:var(--gold);margin-left:8px}
.eclipse{position:absolute;border-radius:50%;aspect-ratio:1;z-index:2}
.eclipse-left{width:min(34vw,520px);left:-9vw;top:11vh}
.eclipse-right{width:min(28vw,420px);right:-5vw;top:17vh}
.eclipse .disc,.launch-eclipse .disc{
  position:absolute;inset:15%;background:radial-gradient(circle at 40% 35%,#06101a,#000 72%);border-radius:50%;z-index:6;
  box-shadow:inset -18px -18px 50px rgba(0,0,0,.8)
}
.eclipse .ring,.launch-eclipse .ring{
  position:absolute;inset:14.3%;border-radius:50%;z-index:5;
  box-shadow:0 0 8px #fff2ce,0 0 22px #ffd37b,0 0 58px rgba(231,155,48,.75),0 0 150px rgba(219,123,35,.23)
}
.flare{position:absolute;inset:5%;border-radius:50%;z-index:3;filter:blur(1px)}
.flare-a{
  background:repeating-conic-gradient(from 12deg,
    transparent 0 5deg,rgba(255,229,181,.38) 6deg,transparent 8deg 18deg,
    rgba(231,153,48,.26) 20deg,transparent 22deg 32deg);
  animation:rotateSlow 44s linear infinite
}
.flare-b{
  inset:0;background:repeating-conic-gradient(from 2deg,
    transparent 0 10deg,rgba(255,239,205,.17) 11deg,transparent 13deg 27deg);
  filter:blur(5px);animation:rotateReverse 66s linear infinite
}
.flare-c{
  inset:-8%;background:radial-gradient(circle,transparent 47%,rgba(225,145,49,.10) 54%,transparent 70%);
  filter:blur(12px)
}
@keyframes rotateSlow{to{transform:rotate(360deg)}}
@keyframes rotateReverse{to{transform:rotate(-360deg)}}

.experience{padding:14vh 4.5vw 17vh;position:relative}
.section-head{text-align:center;max-width:760px;margin:0 auto 70px}
.section-head span,.concept-header span{
  font-size:9px;letter-spacing:.24em;color:var(--gold);text-transform:uppercase
}
.section-head h2{
  font-family:Georgia,serif;font-weight:400;font-size:clamp(44px,6vw,86px);
  letter-spacing:-.04em;margin:18px 0 12px
}
.section-head p{color:#87929b;font-family:Georgia,serif;font-size:20px}
.phones{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1540px;margin:auto;
  perspective:1600px
}
.phone-card{
  padding:25px 18px 20px;border:1px solid rgba(230,170,55,.15);
  background:linear-gradient(180deg,rgba(8,18,29,.82),rgba(3,9,15,.48));
  box-shadow:0 30px 80px rgba(0,0,0,.34);transition:transform .45s ease,border-color .45s ease,box-shadow .45s ease;
  position:relative;overflow:hidden
}
.phone-card:before{
  content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 20%,rgba(255,211,121,.055),transparent 48%);
  transform:translateX(-130%);transition:transform .8s ease
}
.phone-card:hover{
  transform:translateY(-13px) rotateX(2deg);border-color:rgba(230,170,55,.42);
  box-shadow:0 42px 100px rgba(0,0,0,.48),0 0 40px rgba(201,134,28,.07)
}
.phone-card:hover:before{transform:translateX(130%)}
.phone-label{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.phone-label span{font-family:Georgia,serif;letter-spacing:.12em;font-size:19px}
.phone-label small{font-size:8px;letter-spacing:.16em;color:#848d96}
.phone-copy{color:#adb4ba;font-family:Georgia,serif;font-size:14px;line-height:1.4;margin-bottom:14px;min-height:40px}
.phone-shell img{width:100%;display:block;filter:drop-shadow(0 22px 34px rgba(0,0,0,.65))}
.cinematic-band{
  margin:0 3.5vw 16vh;min-height:78vh;position:relative;display:flex;align-items:center;
  border:1px solid rgba(230,170,55,.17);overflow:hidden;
  background:radial-gradient(circle at 70% 50%,rgba(201,132,25,.12),transparent 24%),
             radial-gradient(circle at 30% 40%,rgba(35,86,122,.12),transparent 27%),
             linear-gradient(115deg,#030911,#06121c 55%,#02070d)
}
.band-content{position:relative;z-index:6;margin-left:8vw;max-width:720px}
.band-content h2,.science h2,.launch h2{
  font-family:Georgia,serif;font-weight:400;letter-spacing:-.045em;
  font-size:clamp(55px,7.2vw,108px);line-height:.92;margin:22px 0 28px
}
.band-content p,.science-copy>p,.launch-card>p{
  max-width:650px;color:#9aa5ad;font-family:Georgia,serif;font-size:clamp(18px,1.6vw,24px);line-height:1.58
}
.band-eclipse{
  position:absolute;right:7vw;width:min(42vw,650px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,#000 0 55%,#090d12 56% 57%,transparent 58%);
  box-shadow:0 0 6px #ffedc9,0 0 33px rgba(255,209,124,.7),0 0 110px rgba(227,141,39,.24)
}
.band-eclipse div{
  position:absolute;inset:-9%;border-radius:50%;
  background:repeating-conic-gradient(transparent 0 13deg,rgba(255,224,170,.11) 14deg,transparent 16deg 32deg);
  animation:rotateSlow 60s linear infinite;filter:blur(4px)
}
.orbit{position:absolute;border:1px solid rgba(230,170,55,.10);border-radius:50%;right:-10vw;top:50%;transform:translateY(-50%) rotate(-18deg)}
.orbit-1{width:65vw;height:21vw}.orbit-2{width:78vw;height:30vw}.orbit-3{width:94vw;height:40vw}
.feature-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(230,170,55,.15);
  margin:0 4vw 16vh;border:1px solid rgba(230,170,55,.15)
}
.feature{position:relative;background:#030a11;padding:5.5vw 4vw;min-height:360px;overflow:hidden}
.feature:after{
  content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-100px;bottom:-100px;
  background:radial-gradient(circle,rgba(230,170,55,.10),transparent 68%)
}
.feature-no{position:absolute;right:26px;top:23px;color:#4f5962;font-family:ui-monospace,monospace;font-size:9px}
.feature-icon{font-size:34px;color:var(--gold);margin-bottom:58px}
.feature h3{font-family:Georgia,serif;font-size:32px;font-weight:400;margin:0 0 16px}
.feature p{color:#8e99a2;line-height:1.7;max-width:410px;font-size:14px}
.science{
  min-height:84vh;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;padding:10vh 7vw 14vh;
  background:linear-gradient(180deg,transparent,rgba(7,17,27,.5),transparent)
}
.science h2 em,.launch h2 em{color:var(--gold);font-weight:400}
.metrics{display:flex;gap:1px;background:var(--line);margin-top:50px;max-width:650px}
.metrics div{background:#030a11;padding:24px 28px;display:grid;gap:5px;flex:1}
.metrics strong{color:var(--gold2);font-size:18px;letter-spacing:.05em}
.metrics small{color:#7f8992}
.science-visual{display:flex;justify-content:center;align-items:center;min-height:560px}
.solar-system{width:min(38vw,530px);aspect-ratio:1;position:relative;border-radius:50%}
.core{
  position:absolute;width:88px;height:88px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);
  background:#000;box-shadow:0 0 5px #fff3d4,0 0 28px #ffc85b,0 0 90px rgba(219,125,24,.38)
}
.path{position:absolute;border:1px solid rgba(230,170,55,.17);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-18deg)}
.p1{width:44%;height:21%}.p2{width:70%;height:38%}.p3{width:98%;height:58%}
.planet{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--gold2);box-shadow:0 0 20px rgba(255,205,101,.6)}
.planet-a{left:72%;top:31%}.planet-b{left:18%;top:58%}
.concept{
  margin:0 4vw 16vh;border:1px solid rgba(230,170,55,.2);background:#030910;
  box-shadow:0 40px 110px rgba(0,0,0,.45);overflow:hidden
}
.concept-header{padding:22px 25px;border-bottom:1px solid rgba(230,170,55,.16);display:flex;justify-content:space-between;gap:20px}
.concept-header strong{font-family:Georgia,serif;font-weight:400}
.concept img{display:block;width:100%;height:auto}
.launch{
  min-height:90vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:12vh 5vw
}
.launch:before{
  content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 100%,rgba(216,139,34,.13),transparent 40%)
}
.launch-eclipse{position:absolute;width:min(68vw,900px);aspect-ratio:1;border-radius:50%;bottom:-52%;left:50%;transform:translateX(-50%)}
.launch-card{
  position:relative;z-index:8;text-align:center;padding:70px 8vw;border:1px solid rgba(230,170,55,.27);
  background:linear-gradient(180deg,rgba(4,12,20,.72),rgba(2,7,13,.88));backdrop-filter:blur(10px);
  max-width:920px;box-shadow:0 35px 100px rgba(0,0,0,.55)
}
.launch h2{margin-top:18px}
.launch-card>p{margin:0 auto 32px}
.launch-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.launch-actions a{
  padding:14px 18px;border:1px solid rgba(230,170,55,.25);font-size:10px;letter-spacing:.11em;
  background:rgba(2,7,13,.4);transition:.25s
}
.launch-actions a:hover{border-color:var(--gold);color:var(--gold2)}
.platforms{margin-top:26px;color:#67727b;font-size:9px;letter-spacing:.10em}
.platforms a{color:inherit;transition:color .25s ease}
.platforms a:hover{color:var(--gold2)}
.platforms span{margin:0 .22em}
footer{
  border-top:1px solid rgba(255,255,255,.08);padding:32px 5vw;
  display:flex;align-items:center;justify-content:space-between;gap:25px;color:#6f7981;font-size:9px;letter-spacing:.12em;text-transform:uppercase
}
.footer-mark em{text-transform:none}
.reveal{opacity:0;transform:translateY(35px);transition:opacity .95s cubic-bezier(.2,.7,.2,1),transform .95s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:1100px){
  .topbar{grid-template-columns:1fr auto}.topbar nav{display:none}
  .phones{grid-template-columns:repeat(2,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .science{grid-template-columns:1fr}.science-visual{min-height:470px}.solar-system{width:min(70vw,530px)}
  .eclipse-left{width:48vw;left:-22vw}.eclipse-right{width:38vw;right:-18vw}
  .band-eclipse{right:-9vw;opacity:.7}
}
@media(max-width:720px){
  .topbar{height:78px;padding:0 5vw}.wordmark span{font-size:20px}.wordmark em{font-size:10px}
  .sound-btn{padding:10px 11px}.sound-btn #soundText{display:none}
  .hero{padding-top:112px}
  .hero h1{font-size:20vw;letter-spacing:.12em}
  .trust-row{grid-template-columns:repeat(2,1fr);margin-top:52px}
  .trust-row>div:nth-child(2){border-right:0}.trust-row>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .phones{grid-template-columns:1fr;max-width:430px}
  .phone-card{padding:24px 22px}
  .cinematic-band{margin-left:0;margin-right:0;min-height:76vh}
  .band-content{margin:0;padding:0 8vw}.band-eclipse{right:-45vw;width:110vw;opacity:.38}
  .feature-grid{grid-template-columns:1fr;margin-left:0;margin-right:0}
  .feature{min-height:300px;padding:13vw 8vw}
  .science{padding-left:8vw;padding-right:8vw}.metrics{flex-direction:column}
  .concept{margin-left:0;margin-right:0}.concept-header{flex-direction:column}
  .launch-card{padding:55px 7vw}
  footer{flex-direction:column;align-items:flex-start}
}


/* v0.4: replace old CSS-built eclipses with modern transparent PNG corona assets */
.eclipse,
.band-eclipse,
.launch-eclipse{
  overflow: visible;
}
.eclipse img,
.band-eclipse img,
.launch-eclipse img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
  filter:
    drop-shadow(0 0 12px rgba(255, 226, 170, .16))
    drop-shadow(0 0 36px rgba(221, 146, 40, .14))
    drop-shadow(0 0 90px rgba(176, 103, 26, .10));
}

.eclipse-left img{
  opacity: .92;
  animation: heroCoronaFloatA 18s ease-in-out infinite alternate;
}
.eclipse-right img{
  opacity: .76;
  animation: heroCoronaFloatB 22s ease-in-out infinite alternate;
}
.band-eclipse img{
  opacity: .80;
  animation: heroCoronaFloatC 26s ease-in-out infinite alternate;
}
.launch-eclipse img{
  opacity: .92;
  animation: heroCoronaFloatA 20s ease-in-out infinite alternate;
}

@keyframes heroCoronaFloatA{
  from{ transform: translate3d(0,0,0) scale(1.00); }
  to  { transform: translate3d(-10px,8px,0) scale(1.03); }
}
@keyframes heroCoronaFloatB{
  from{ transform: translate3d(0,0,0) scale(1.00); }
  to  { transform: translate3d(12px,10px,0) scale(1.04); }
}
@keyframes heroCoronaFloatC{
  from{ transform: translate3d(0,0,0) scale(1.00); }
  to  { transform: translate3d(-8px,6px,0) scale(1.02); }
}

/* Make the PNG-based eclipses sit a bit more elegantly in the layout */
.eclipse-left{ width:min(34vw,520px); left:-8vw; top:10vh; }
.eclipse-right{ width:min(28vw,420px); right:-4vw; top:17vh; }
.band-eclipse{
  position:absolute;
  right:6vw;
  width:min(42vw,650px);
  aspect-ratio:1;
  border-radius:50%;
}
.launch-eclipse{
  position:absolute;
  width:min(68vw,900px);
  aspect-ratio:1;
  border-radius:50%;
  bottom:-52%;
  left:50%;
  transform:translateX(-50%);
}

@media(max-width:1100px){
  .eclipse-left{ width:48vw; left:-20vw; }
  .eclipse-right{ width:38vw; right:-16vw; }
  .band-eclipse{ right:-8vw; opacity:.82; }
}
@media(max-width:720px){
  .band-eclipse{ right:-42vw; width:110vw; opacity:.42; }
}


/* =========================================================
   v0.5: CSS-animated modern coronas
   Goal: subtle premium motion, not aggressive VFX
   ========================================================= */

.eclipse,
.band-eclipse,
.launch-eclipse{
  isolation:isolate;
}

.eclipse::before,
.eclipse::after,
.band-eclipse::before,
.band-eclipse::after,
.launch-eclipse::before,
.launch-eclipse::after{
  content:"";
  position:absolute;
  inset:-4%;
  border-radius:50%;
  pointer-events:none;
  z-index:0;
}

.eclipse::before,
.band-eclipse::before,
.launch-eclipse::before{
  background:
    radial-gradient(circle,
      rgba(255,234,192,.10) 0%,
      rgba(245,191,92,.09) 26%,
      rgba(232,144,42,.06) 42%,
      transparent 68%);
  filter: blur(18px);
  animation: coronaAuraBreath 8.5s ease-in-out infinite;
}

.eclipse::after,
.band-eclipse::after,
.launch-eclipse::after{
  background:
    radial-gradient(circle,
      transparent 38%,
      rgba(255,235,191,.07) 54%,
      rgba(243,183,73,.06) 58%,
      transparent 72%);
  filter: blur(10px);
  animation: coronaHaloPulse 11s ease-in-out infinite;
}

.eclipse img,
.band-eclipse img,
.launch-eclipse img{
  position:relative;
  z-index:1;
  transform-origin:center center;
  will-change:transform, opacity, filter;
}

.eclipse-left img{
  animation:
    coronaBreathA 9s ease-in-out infinite,
    coronaDriftA 20s ease-in-out infinite,
    coronaGlowA 7.5s ease-in-out infinite;
}

.eclipse-right img{
  animation:
    coronaBreathB 11s ease-in-out infinite,
    coronaDriftB 24s ease-in-out infinite,
    coronaGlowB 8.5s ease-in-out infinite;
}

.band-eclipse img{
  animation:
    coronaBreathC 12s ease-in-out infinite,
    coronaDriftC 28s ease-in-out infinite,
    coronaGlowC 9.5s ease-in-out infinite;
}

.launch-eclipse img{
  animation:
    coronaBreathLaunch 10s ease-in-out infinite,
    coronaDriftLaunch 22s ease-in-out infinite,
    coronaGlowLaunch 8s ease-in-out infinite;
}

/* Premium subtle breathing: tiny scale changes */
@keyframes coronaBreathA{
  0%,100%{ transform:scale(1) rotate(0deg); }
  50%{ transform:scale(1.028) rotate(.35deg); }
}
@keyframes coronaBreathB{
  0%,100%{ transform:scale(1.01) rotate(0deg); }
  50%{ transform:scale(1.034) rotate(-.4deg); }
}
@keyframes coronaBreathC{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.022); }
}
@keyframes coronaBreathLaunch{
  0%,100%{ transform:scale(1.01); }
  50%{ transform:scale(1.03); }
}

/* Gentle positional drift */
@keyframes coronaDriftA{
  0%,100%{ translate:0 0; }
  30%{ translate:-8px 3px; }
  60%{ translate:6px -5px; }
}
@keyframes coronaDriftB{
  0%,100%{ translate:0 0; }
  40%{ translate:8px 5px; }
  70%{ translate:-5px -6px; }
}
@keyframes coronaDriftC{
  0%,100%{ translate:0 0; }
  35%{ translate:-7px 4px; }
  70%{ translate:5px -4px; }
}
@keyframes coronaDriftLaunch{
  0%,100%{ translate:0 0; }
  50%{ translate:0 -8px; }
}

/* Light intensity shifts */
@keyframes coronaGlowA{
  0%,100%{
    opacity:.92;
    filter:
      drop-shadow(0 0 10px rgba(255,226,170,.14))
      drop-shadow(0 0 32px rgba(221,146,40,.13))
      drop-shadow(0 0 85px rgba(176,103,26,.09));
  }
  50%{
    opacity:.98;
    filter:
      drop-shadow(0 0 12px rgba(255,230,185,.20))
      drop-shadow(0 0 42px rgba(227,156,54,.18))
      drop-shadow(0 0 105px rgba(190,112,28,.13));
  }
}
@keyframes coronaGlowB{
  0%,100%{
    opacity:.76;
    filter:
      drop-shadow(0 0 8px rgba(255,226,170,.10))
      drop-shadow(0 0 28px rgba(221,146,40,.10))
      drop-shadow(0 0 70px rgba(176,103,26,.06));
  }
  50%{
    opacity:.86;
    filter:
      drop-shadow(0 0 12px rgba(255,230,185,.16))
      drop-shadow(0 0 38px rgba(227,156,54,.14))
      drop-shadow(0 0 96px rgba(190,112,28,.11));
  }
}
@keyframes coronaGlowC{
  0%,100%{
    opacity:.80;
    filter:
      drop-shadow(0 0 10px rgba(255,230,185,.12))
      drop-shadow(0 0 34px rgba(223,151,46,.12))
      drop-shadow(0 0 92px rgba(176,103,26,.09));
  }
  50%{
    opacity:.90;
    filter:
      drop-shadow(0 0 14px rgba(255,233,194,.18))
      drop-shadow(0 0 48px rgba(229,161,60,.18))
      drop-shadow(0 0 116px rgba(188,109,28,.13));
  }
}
@keyframes coronaGlowLaunch{
  0%,100%{
    opacity:.92;
    filter:
      drop-shadow(0 0 11px rgba(255,226,170,.14))
      drop-shadow(0 0 34px rgba(221,146,40,.13))
      drop-shadow(0 0 98px rgba(176,103,26,.11));
  }
  50%{
    opacity:1;
    filter:
      drop-shadow(0 0 14px rgba(255,234,194,.20))
      drop-shadow(0 0 46px rgba(229,160,58,.18))
      drop-shadow(0 0 124px rgba(190,112,28,.14));
  }
}

@keyframes coronaAuraBreath{
  0%,100%{ opacity:.55; transform:scale(1); }
  50%{ opacity:.82; transform:scale(1.06); }
}
@keyframes coronaHaloPulse{
  0%,100%{ opacity:.35; transform:scale(1); }
  50%{ opacity:.60; transform:scale(1.035); }
}

/* Respect reduced-motion users */
@media (prefers-reduced-motion: reduce){
  .eclipse::before,
  .eclipse::after,
  .band-eclipse::before,
  .band-eclipse::after,
  .launch-eclipse::before,
  .launch-eclipse::after,
  .eclipse img,
  .band-eclipse img,
  .launch-eclipse img{
    animation:none !important;
    transform:none !important;
    translate:0 0 !important;
  }
}


/* v0.5.1 language selector */
.top-actions{justify-self:end;display:flex;align-items:center;gap:10px}
.language-picker{position:relative}
.language-btn{
  height:38px;min-width:58px;padding:0 12px;border:1px solid var(--line);
  background:rgba(3,10,17,.55);color:#d8d0c2;font-size:9px;letter-spacing:.15em;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;
  backdrop-filter:blur(12px)
}
.language-btn:hover{border-color:rgba(230,170,55,.55);color:#fff}
.language-chevron{color:var(--gold);font-size:11px}
.language-menu{
  position:absolute;right:0;top:46px;width:172px;display:none;z-index:120;
  background:rgba(3,10,17,.97);border:1px solid rgba(230,170,55,.28);
  box-shadow:0 18px 55px rgba(0,0,0,.48);backdrop-filter:blur(18px)
}
.language-picker.open .language-menu{display:block}
.language-menu button{
  width:100%;padding:13px 14px;border:0;border-bottom:1px solid rgba(255,255,255,.06);
  background:transparent;color:#bac2c9;cursor:pointer;display:flex;justify-content:space-between;
  text-align:left;font-size:11px
}
.language-menu button:last-child{border-bottom:0}
.language-menu button:hover{background:rgba(230,170,55,.08);color:#fff}
.language-menu button span{color:var(--gold);font-size:9px;letter-spacing:.12em}
@media(max-width:720px){
  .top-actions{gap:7px}
  .language-btn{min-width:46px;height:36px;padding:0 9px}
  .language-menu{width:150px}
}


/* =========================================================
   UMBRYA 60s Eclipse Cycle Background
   ========================================================= */
.hero{
  overflow:hidden;
}
.hero-inner, .scroll-cue{
  position:relative;
  z-index:7;
}
.hero-eclipse-cycle{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  opacity:1;
}
main{position:relative;z-index:1}
.hero-eclipse-cycle .cycle-glow,
.hero-eclipse-cycle .cycle-sun,
.hero-eclipse-cycle .cycle-corona,
.hero-eclipse-cycle .cycle-diamond,
.hero-eclipse-cycle .cycle-moon{
  position:absolute;
  border-radius:50%;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  will-change:transform, opacity, filter;
}
.hero-eclipse-cycle .cycle-sun{
  aspect-ratio:1;
  background:
    radial-gradient(circle, rgba(255,246,219,.95) 0 16%, rgba(255,219,135,.92) 22%, rgba(244,169,63,.72) 44%, rgba(224,118,28,.32) 62%, rgba(224,118,28,0) 74%);
  box-shadow:
    0 0 20px rgba(255,230,180,.32),
    0 0 45px rgba(240,170,80,.26),
    0 0 120px rgba(219,121,32,.12);
}
.hero-eclipse-cycle .cycle-glow{
  aspect-ratio:1;
  background:
    radial-gradient(circle, rgba(255,214,120,.20) 0, rgba(255,176,62,.11) 25%, rgba(238,122,31,.06) 46%, rgba(238,122,31,0) 72%);
  filter:blur(20px);
}
.hero-eclipse-cycle .cycle-moon{
  aspect-ratio:1;
  background:radial-gradient(circle at 40% 35%, #09131f 0, #000 70%, #000 100%);
  box-shadow: inset -18px -14px 40px rgba(0,0,0,.55);
}
.hero-eclipse-cycle .cycle-corona{
  aspect-ratio:1;
  background:
    repeating-conic-gradient(from 0deg,
      rgba(255,245,223,0.00) 0deg 5deg,
      rgba(255,248,232,.14) 5.5deg 6.2deg,
      rgba(248,210,135,.10) 6.2deg 7.1deg,
      rgba(255,245,223,0.00) 7.1deg 12.5deg);
  mix-blend-mode:screen;
  filter: blur(5px);
}
.hero-eclipse-cycle .cycle-diamond{
  width:0;
  height:0;
  background: radial-gradient(circle, rgba(255,255,242,1) 0 12%, rgba(255,225,162,.95) 28%, rgba(248,181,73,.52) 48%, rgba(248,181,73,0) 70%);
  box-shadow:
    0 0 18px rgba(255,255,236,.55),
    0 0 42px rgba(255,208,125,.36);
  opacity:0;
}

@keyframes eclipseMoonSweep {
  0%   { transform:translate(calc(-50% + 24vw), -50%); }
  16%  { transform:translate(calc(-50% + 16vw), -50%); }
  30%  { transform:translate(calc(-50% + 7vw), -50%); }
  42%  { transform:translate(calc(-50% + 1vw), -50%); }
  52%  { transform:translate(calc(-50% - 0.2vw), -50%); }
  64%  { transform:translate(calc(-50% - 1.1vw), -50%); }
  78%  { transform:translate(calc(-50% - 7vw), -50%); }
  92%  { transform:translate(calc(-50% - 16vw), -50%); }
  100% { transform:translate(calc(-50% - 24vw), -50%); }
}
@keyframes eclipseCoronaLife {
  0%, 18% { opacity:.08; transform:translate(-50%,-50%) scale(.92) rotate(0deg); filter:blur(6px) brightness(.9); }
  32% { opacity:.18; transform:translate(-50%,-50%) scale(.98) rotate(8deg); filter:blur(5px) brightness(1); }
  42% { opacity:.42; transform:translate(-50%,-50%) scale(1.02) rotate(22deg); filter:blur(5px) brightness(1.12); }
  50% { opacity:.78; transform:translate(-50%,-50%) scale(1.06) rotate(34deg); filter:blur(4px) brightness(1.30); }
  58% { opacity:.72; transform:translate(-50%,-50%) scale(1.05) rotate(48deg); filter:blur(4px) brightness(1.24); }
  68% { opacity:.38; transform:translate(-50%,-50%) scale(1.00) rotate(58deg); filter:blur(5px) brightness(1.06); }
  100%{ opacity:.10; transform:translate(-50%,-50%) scale(.94) rotate(70deg); filter:blur(6px) brightness(.92); }
}
@keyframes eclipseSunPulse {
  0%, 25% { opacity:.70; filter:saturate(.92) brightness(.94); }
  40% { opacity:.58; filter:saturate(.90) brightness(.90); }
  50% { opacity:.18; filter:saturate(.85) brightness(.82); }
  56% { opacity:.22; filter:saturate(.88) brightness(.85); }
  72% { opacity:.52; filter:saturate(.95) brightness(.92); }
  100% { opacity:.72; filter:saturate(1) brightness(.98); }
}
@keyframes eclipseGlowPulse {
  0%, 28% { opacity:.18; transform:translate(-50%,-50%) scale(.96); }
  40% { opacity:.26; transform:translate(-50%,-50%) scale(1.00); }
  50% { opacity:.56; transform:translate(-50%,-50%) scale(1.12); }
  60% { opacity:.48; transform:translate(-50%,-50%) scale(1.08); }
  78% { opacity:.28; transform:translate(-50%,-50%) scale(1.01); }
  100% { opacity:.18; transform:translate(-50%,-50%) scale(.96); }
}
@keyframes diamondRingFlash {
  0%, 58% { opacity:0; width:0; height:0; }
  61% { opacity:0; width:0; height:0; }
  63% { opacity:.95; width:72px; height:72px; }
  67% { opacity:.50; width:60px; height:60px; }
  72%,100% { opacity:0; width:0; height:0; }
}
@keyframes diamondTravel {
  0%, 58% { transform:translate(calc(-50% + 0vw), -50%); }
  63% { transform:translate(calc(-50% + 7.3vw), calc(-50% - 1.5vw)); }
  67% { transform:translate(calc(-50% + 8.4vw), calc(-50% - 1.8vw)); }
  72%,100% { transform:translate(calc(-50% + 10vw), calc(-50% - 2vw)); }
}

.hero-eclipse-cycle .cycle-moon{ animation:eclipseMoonSweep 60s linear infinite; }
.hero-eclipse-cycle .cycle-corona{ animation:eclipseCoronaLife 60s ease-in-out infinite; }
.hero-eclipse-cycle .cycle-sun{ animation:eclipseSunPulse 60s ease-in-out infinite; }
.hero-eclipse-cycle .cycle-glow{ animation:eclipseGlowPulse 60s ease-in-out infinite; }
.hero-eclipse-cycle .cycle-diamond{
  animation: diamondRingFlash 60s ease-in-out infinite, diamondTravel 60s linear infinite;
}
@media (prefers-reduced-motion: reduce){
  .hero-eclipse-cycle .cycle-moon,
  .hero-eclipse-cycle .cycle-corona,
  .hero-eclipse-cycle .cycle-sun,
  .hero-eclipse-cycle .cycle-glow,
  .hero-eclipse-cycle .cycle-diamond{
    animation:none !important;
  }
}


/* Variant B: hero event / more visible */
.hero-eclipse-cycle.variant-b{ opacity:.92; }
.hero-eclipse-cycle.variant-b .cycle-sun,
.hero-eclipse-cycle.variant-b .cycle-glow,
.hero-eclipse-cycle.variant-b .cycle-moon,
.hero-eclipse-cycle.variant-b .cycle-corona{
  width:min(58vw, 700px);
  height:min(58vw, 700px);
}
.hero-eclipse-cycle.variant-b .cycle-corona{
  width:min(74vw, 900px);
  height:min(74vw, 900px);
  opacity:.24;
  filter:blur(4px);
}
.hero-eclipse-cycle.variant-b .cycle-glow{
  width:min(86vw, 1040px);
  height:min(86vw, 1040px);
}
.hero-eclipse-cycle.variant-b .cycle-sun,
.hero-eclipse-cycle.variant-b .cycle-glow,
.hero-eclipse-cycle.variant-b .cycle-corona,
.hero-eclipse-cycle.variant-b .cycle-moon,
.hero-eclipse-cycle.variant-b .cycle-diamond{
  left:69%; top:43%;
}
.hero-eclipse-cycle.variant-b .cycle-diamond{
  box-shadow:
    0 0 24px rgba(255,255,240,.75),
    0 0 70px rgba(255,208,125,.45);
}


/* v0.5.2 B+ : brighter corona tuning */
.hero-eclipse-cycle.variant-b .cycle-corona{
  opacity:.34 !important;
  filter:blur(3px) brightness(1.24) saturate(1.05) !important;
}
.hero-eclipse-cycle.variant-b .cycle-glow{
  filter:blur(18px) brightness(1.16) !important;
}
.hero-eclipse-cycle.variant-b .cycle-sun{
  box-shadow:
    0 0 24px rgba(255,235,194,.36),
    0 0 60px rgba(245,182,88,.32),
    0 0 150px rgba(224,126,34,.16) !important;
}
@keyframes eclipseCoronaLife_Brighter {
  0%, 18% { opacity:.16; transform:translate(-50%,-50%) scale(.92) rotate(0deg); filter:blur(5px) brightness(1.00) saturate(1.0); }
  32% { opacity:.28; transform:translate(-50%,-50%) scale(.98) rotate(8deg); filter:blur(4px) brightness(1.12) saturate(1.03); }
  42% { opacity:.54; transform:translate(-50%,-50%) scale(1.02) rotate(22deg); filter:blur(4px) brightness(1.26) saturate(1.06); }
  50% { opacity:.92; transform:translate(-50%,-50%) scale(1.06) rotate(34deg); filter:blur(3px) brightness(1.50) saturate(1.10); }
  58% { opacity:.84; transform:translate(-50%,-50%) scale(1.05) rotate(48deg); filter:blur(3px) brightness(1.42) saturate(1.08); }
  68% { opacity:.48; transform:translate(-50%,-50%) scale(1.00) rotate(58deg); filter:blur(4px) brightness(1.18) saturate(1.04); }
  100%{ opacity:.18; transform:translate(-50%,-50%) scale(.94) rotate(70deg); filter:blur(5px) brightness(1.02) saturate(1.0); }
}
.hero-eclipse-cycle.variant-b .cycle-corona{
  animation:eclipseCoronaLife_Brighter 60s ease-in-out infinite !important;
}


/* v0.5.2 B+ hotfix: remove duplicate dark eclipse behind the cinematic-band corona */
.band-eclipse{
  background:none !important;
  box-shadow:none !important;
}
.band-eclipse::before,
.band-eclipse::after{
  display:none !important;
}


/* Legal links — added for public release; no visual changes outside footer */
.footer-links{display:flex;align-items:center;gap:9px}
.footer-links a{color:#7f8992;text-decoration:none;transition:color .2s ease}
.footer-links a:hover{color:#d9a13a}
.footer-links span{color:#4f5962}