:root{--bg:#040a1c;--ink:#eef2ff;--mut:#a9b4d6;--violet:#7c5cff;--lilac:#b9c6ff;--blue:#4fb8ff;--ocean:#2f7bff;--line:rgba(255,255,255,.15);--glass:rgba(6,14,38,.86);--gut:clamp(16px,5vw,80px);}
*{box-sizing:border-box;margin:0}
html{background:var(--bg);scroll-behavior:auto;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:400 1rem/1.6 Inter,system-ui,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
.serif{font-family:"Instrument Serif",Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.01em;line-height:1.02}
.mono{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-weight:500;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
.big{font-size:clamp(2.7rem,6.6vw,6rem)}
.kicker{color:var(--lilac);margin-bottom:1rem}
.skip{position:fixed;left:12px;top:-60px;z-index:60;background:#fff;color:#111;padding:.6rem 1rem;border-radius:8px}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.stage{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;background:var(--bg)}
body.no-gl::before{content:"";position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse at 30% 20%,#17307a,transparent 55%),radial-gradient(ellipse at 75% 70%,#2a1680,transparent 55%),var(--bg)}
.veil{position:fixed;inset:0;z-index:1;background:radial-gradient(ellipse at 50% 50%,rgba(4,10,28,.5),rgba(4,10,28,.8));opacity:0;pointer-events:none}
main,footer{position:relative;z-index:2}

/* glass surface used by panels, cards and the form */
.glass{background:linear-gradient(135deg,rgba(14,28,70,.9),rgba(8,18,48,.9) 45%,var(--glass));border:1px solid var(--line);border-radius:22px;backdrop-filter:blur(22px) saturate(1.1);-webkit-backdrop-filter:blur(22px) saturate(1.1);box-shadow:0 30px 80px rgba(20,40,170,.28),inset 0 1px 0 rgba(255,255,255,.18)}

.nav{position:fixed;z-index:40;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem var(--gut);background:linear-gradient(rgba(4,10,28,.6),rgba(4,10,28,0));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);-webkit-mask:linear-gradient(#000 70%,transparent);mask:linear-gradient(#000 70%,transparent)}
.logo{display:flex;align-items:center;gap:.6rem;font:800 1.05rem/1 Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.logo img{width:34px;height:34px}
.logo small{display:block;font-size:.55rem;letter-spacing:.34em;font-weight:600;color:var(--blue);margin-top:3px}
.nav nav{display:flex;gap:1.8rem;font-size:.9rem;color:var(--mut)}
.nav nav a:hover,.nav nav a:focus-visible{color:var(--ink)}
.cta,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.65rem 1.3rem;border-radius:999px;border:1px solid transparent;background:linear-gradient(120deg,#2f7bff,#8b5cff);color:#fff;font-weight:600;font-size:.92rem;box-shadow:0 10px 36px rgba(60,100,255,.45);transition:transform .25s,box-shadow .25s}
.cta:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 14px 44px rgba(90,110,255,.6)}
.btn.ghost{background:rgba(255,255,255,.06);border-color:var(--line);box-shadow:none;backdrop-filter:blur(8px)}

/* word-split headings: each word rises through a mask, staggered by --i, driven by --r (0..1) from the scroll */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .14em;margin:-.04em -.02em -.14em}
.w>i{display:inline-block;font-style:inherit;--k:clamp(0,calc(var(--r,1) * 2.1 - var(--i) * .17),1);transform:translateY(calc((1 - var(--k)) * 112%));opacity:var(--k)}

/* marquee: the track is slid by scroll, no clock */
.marquee{overflow:hidden;padding:1.1rem 0;border-block:1px solid var(--line);background:rgba(4,10,28,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.marquee .track{display:flex;align-items:center;gap:2.2rem;width:max-content;will-change:transform;font:400 clamp(1.8rem,4vw,3.2rem)/1 "Instrument Serif",Georgia,serif;color:var(--ink)}
.marquee i{width:10px;height:10px;border-radius:50%;background:var(--blue);flex:none}
.marquee.alt .track{color:transparent;-webkit-text-stroke:1px rgba(185,198,255,.65)}

.rail{position:fixed;z-index:30;right:clamp(10px,1.8vw,28px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;opacity:0;pointer-events:none;transition:opacity .4s}
.rail.on{opacity:1;pointer-events:auto}
.rail a{display:grid;place-items:center;width:30px;height:30px}
.rail i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.3);transition:transform .3s,background .3s}
.rail a.cur i{background:var(--blue);transform:scale(1.7)}
.pause{position:fixed;z-index:45;right:clamp(12px,2vw,28px);bottom:clamp(12px,2vw,28px);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(10,22,54,.6);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.pause[hidden]{display:none}
.pause svg{width:20px;height:20px}
.pause .ic-play{display:none}.pause[aria-pressed="true"] .ic-play{display:block}.pause[aria-pressed="true"] .ic-pause{display:none}

@media (max-width:760px){
  .nav nav{display:none}
  .logo{font-size:.95rem}
  .cta{min-height:40px;padding:.5rem 1rem;font-size:.85rem}
  .rail{display:none}
  .mono{font-size:.7rem}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition-duration:.01ms!important}
  .w>i{transform:none!important;opacity:1!important}
}