@font-face{font-family:"Archivo";src:url(/fonts/archivo.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
:root{
  --white:#ffffff;--paper:#f5f8fb;--mist:#eef1f4;--line:#dfe5ec;--muted:#5d6b7a;--ink:#0b1f3a;--ink-2:#071428;
  --sky:#4aa8ff;--sky-ink:#1d6fd1;--baby:#e3f0ff;--baby-2:#cfe6ff;--neon:#d4ff3a;--neon-d:#c2f01f;
  --focus:#1d6fd1;
  --font:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --lift:0 1px 2px rgba(11,31,58,.06),0 12px 24px -16px rgba(11,31,58,.28);
  --tick-box:#0b1f3a;--tag-fg:var(--sky-ink);--tag-bg:linear-gradient(transparent 62%,var(--neon) 62% 92%,transparent 92%);color-scheme:light;
}
:root[data-theme="dark"]{--tick-box:var(--baby-2);--tag-fg:#0b1f3a;--tag-bg:var(--neon);color-scheme:dark;--white:#0b1626;--paper:#0e1b2e;--mist:#122238;--line:#21334d;--muted:#9fb0c4;--ink:#eef4fb;--ink-2:#f5f9ff;
    --sky:#6cb9ff;--sky-ink:#8cc8ff;--baby:#14294a;--baby-2:#1a3560;--focus:#d4ff3a;
    --lift:0 1px 2px rgba(0,0,0,.4),0 12px 24px -16px rgba(0,0,0,.7)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--tick-box:var(--baby-2);--tag-fg:#0b1f3a;--tag-bg:var(--neon);color-scheme:dark;--white:#0b1626;--paper:#0e1b2e;--mist:#122238;--line:#21334d;--muted:#9fb0c4;--ink:#eef4fb;--ink-2:#f5f9ff;
    --sky:#6cb9ff;--sky-ink:#8cc8ff;--baby:#14294a;--baby-2:#1a3560;--focus:#d4ff3a;
    --lift:0 1px 2px rgba(0,0,0,.4),0 12px 24px -16px rgba(0,0,0,.7)}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;accent-color:var(--sky-ink);caret-color:var(--sky-ink);scrollbar-color:var(--line) transparent}
body{margin:0;background:var(--white);color:var(--ink);font:400 1.0625rem/1.6 var(--font);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
::selection{background:var(--neon);color:#0b1f3a}
a{color:var(--sky-ink);text-underline-offset:.18em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--white);padding:.6rem 1rem;z-index:10}
.skip:focus{left:0}
.wrap{max-width:76rem;margin:0 auto;padding:0 1.25rem}

/* header */
header.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--white) 88%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.25rem}
.logo{font:800 1.55rem/1 var(--font);letter-spacing:-.035em;color:var(--ink);text-decoration:none}
.logo i{display:inline-block;width:.42em;height:.42em;background:var(--sky);border-radius:50%;margin-left:.1em}
.top-nav{display:flex;align-items:center;gap:.6rem}
.nav-link{font-weight:600;font-size:.95rem;color:var(--ink);text-decoration:none;padding:.5rem .6rem;border-radius:8px}
.nav-link:hover{background:var(--mist);color:var(--ink)}
.nav-login{font-weight:600;font-size:.95rem;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:.5rem .95rem;min-height:42px;display:inline-flex;align-items:center;transition:border-color .2s var(--ease),background .2s var(--ease)}
.top-nav .nav-login:hover{border-color:var(--ink);background:var(--mist);color:var(--ink)}
.theme-toggle{display:inline-grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s var(--ease),background .2s var(--ease),transform .3s var(--ease)}
.theme-toggle:hover{border-color:var(--ink);background:var(--mist)}
.theme-toggle:active{transform:rotate(-20deg) scale(.94)}
.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .sun{display:none}
.theme-toggle[data-mode="dark"] .sun{display:block}
.theme-toggle[data-mode="dark"] .moon{display:none}
body{transition:background-color .35s var(--ease),color .35s var(--ease)}
@media (max-width:40rem){.nav-link{display:none}}
.logo,.nav-login,.nav-link,.top-nav .btn{white-space:nowrap}
.nav-cta .short{display:none}
@media (max-width:34rem){
  .nav-cta .long{display:none}.nav-cta .short{display:inline}
  .top-nav{gap:.4rem}
  .nav-login{padding:.45rem .7rem;min-height:40px}
  .theme-toggle{width:40px;height:40px}
  .top-nav .btn-sm{min-height:40px;padding:.45rem .8rem}
}
@media (max-width:21rem){.theme-toggle{display:none}}

/* type */
h1,h2,h3{font-family:var(--font);margin:0 0 .55em;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(2.8rem,7vw,5.6rem);font-weight:800;line-height:.98;letter-spacing:-.045em;font-stretch:92%}
h2{font-size:clamp(2rem,4.6vw,3.4rem);font-weight:800;line-height:1.02;letter-spacing:-.035em}
h3{font-size:1.25rem;font-weight:700;letter-spacing:-.015em}
p{text-wrap:pretty}
.lede{font-size:clamp(1.15rem,2.4vw,1.4rem);line-height:1.5;max-width:34rem;color:var(--muted);margin:0 0 2rem}
.note{max-width:40rem;color:var(--muted)}

/* buttons */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:var(--neon);color:#0b1f3a;border:0;border-radius:12px;padding:1rem 1.6rem;min-height:52px;text-decoration:none;font:700 1.02rem/1.2 var(--font);cursor:pointer;box-shadow:0 1px 0 rgba(11,31,58,.18),inset 0 -2px 0 rgba(11,31,58,.12);transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease)}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.btn:hover{background:var(--neon-d);color:#0b1f3a;transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(11,31,58,.55),inset 0 -2px 0 rgba(11,31,58,.12)}
.btn:hover::after{transform:translateX(120%)}
.btn:active{transform:translateY(0)}
.btn-sm{min-height:42px;padding:.55rem 1rem;border-radius:10px;font-size:.95rem}
.text-link{font-weight:700;color:var(--ink);text-decoration:none;background:linear-gradient(var(--sky),var(--sky)) 0 100%/100% 2px no-repeat;padding-bottom:2px;transition:background-size .3s var(--ease)}
.text-link:hover{color:var(--ink);background-size:0 2px}

/* hero */
.hero{display:grid;gap:3rem;padding:4rem 0 4.5rem;align-items:center}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem}
.hero-note{margin:1.75rem 0 0;font-size:.95rem;color:var(--muted);max-width:30rem}
@media (min-width:60rem){.hero{grid-template-columns:1.12fr .88fr;gap:4.5rem;padding:6.5rem 0 6rem}}
.js h1 .w{display:inline-block;opacity:0;transform:translateY(.45em);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js h1.go .w{opacity:1;transform:none}
.js .hero-copy>p,.js .hero-actions{opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease) .45s,transform .9s var(--ease) .45s}
.js .hero-copy.go>p,.js .hero-copy.go .hero-actions{opacity:1;transform:none}

/* the checklist card, on a baby-blue panel */
.checklist{position:relative;margin:0;background:var(--white);border:1px solid var(--line);border-radius:18px;padding:1.6rem 1.6rem 1.15rem;box-shadow:var(--lift)}
.checklist::before{content:"";position:absolute;inset:-1.4rem;z-index:-1;border-radius:28px;background:linear-gradient(150deg,var(--baby-2),var(--baby) 60%,transparent)}
@media (max-width:60rem){.checklist::before{inset:-.8rem -.6rem}}
.js .checklist{opacity:0;transform:translateY(24px) scale(.98);transition:opacity 1s var(--ease) .25s,transform 1s var(--ease) .25s}
.js .checklist.go{opacity:1;transform:none}
.checklist-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1.1rem;margin-bottom:.4rem;border-bottom:1px solid var(--line)}
.checklist-name{margin:0;font:800 1.4rem/1.1 var(--font);letter-spacing:-.025em}
.checklist-name span{display:block;margin-top:.3rem;font:500 .85rem/1.3 var(--font);letter-spacing:0;color:var(--muted)}
.counter{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}
.housing{display:block;background:#0b1f3a;border-radius:10px;padding:.5rem .6rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.seg{width:4.6rem;height:auto;display:block}
.seg .on{fill:var(--neon)}
.seg .off{fill:rgba(212,255,58,.12)}
.counter-label{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{display:flex;align-items:center;gap:.8rem;padding:.66rem 0;font-size:1rem;color:var(--ink);border-bottom:1px solid var(--line)}
.ticks li:last-child{border-bottom:0}
.box{flex:none;display:grid;place-items:center;width:1.45rem;height:1.45rem;border-radius:7px;background:var(--tick-box);border:1.5px solid var(--tick-box)}
.box svg{width:1rem;height:1rem;fill:none;stroke:var(--neon);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:0}
.ticks .last{font-weight:700}
.ticks .last .box{background:var(--neon);border-color:var(--neon)}
.ticks .last .box svg{stroke:#0b1f3a}
.checklist figcaption{margin-top:.9rem;font-size:.8rem;color:var(--muted)}
.js .ticks li{color:var(--muted);transition:color .5s var(--ease)}
.js .ticks .box{background:transparent;border-color:var(--line);transition:background .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.js .ticks .box svg{stroke-dashoffset:16;transition:stroke-dashoffset .45s var(--ease)}
.js .ticks li.done{color:var(--ink)}
.js .ticks li.done .box{background:var(--tick-box);border-color:var(--tick-box);transform:scale(1.12)}
.js .ticks li.done .box svg{stroke-dashoffset:0}
.js .ticks li.last.done .box{background:var(--neon);border-color:var(--neon)}
.js .ticks li.settled .box{transform:none}


/* rules ticker */
.ticker{background:#0b1f3a;color:#eef4fb;overflow:hidden;border-block:1px solid #0b1f3a}
.ticker-track{display:flex;width:max-content;animation:roll 42s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker ul{display:flex;list-style:none;margin:0;padding:0}
.ticker li{display:flex;align-items:center;gap:.5rem;padding:1.05rem 2.25rem;font-size:.95rem;font-weight:500;white-space:nowrap;color:#c9d6e6}
.ticker li::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--sky);margin-right:1.5rem;opacity:.9}
.ticker b{font-weight:800;color:var(--neon);font-size:1.05rem}
@keyframes roll{to{transform:translateX(-50%)}}

/* what you get */
.value{padding:5rem 0 5.5rem}
.value>.wrap>h2{margin-bottom:2.75rem;max-width:18ch}
.value-lead{display:grid;gap:1.25rem}
.lead-item{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:2rem 1.75rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.lead-item:hover{transform:translateY(-4px);box-shadow:var(--lift)}
.lead-item h3{font-size:clamp(1.75rem,3vw,2.35rem);font-weight:800;line-height:1.02;letter-spacing:-.035em;margin:0 0 .8rem;max-width:15ch}
.lead-item p{margin:0;color:var(--muted);font-size:1.08rem;max-width:32rem}
.lead-item:first-child{background:#0b1f3a;border-color:#0b1f3a}
.lead-item:first-child h3{color:#fff}
.lead-item:first-child h3::after{content:"";display:block;width:3.5rem;height:6px;border-radius:3px;background:var(--neon);margin-top:1.1rem}
.lead-item:first-child p{color:#c9d6e6}
.lead-item:nth-child(2){background:var(--baby)}
.lead-item.soon{background:var(--white);border:1.5px dashed var(--baby-2)}
.soon-tag{display:inline-flex;align-self:flex-start;margin:0 0 1rem;padding:.25rem .65rem;border-radius:999px;background:var(--neon);color:#0b1f3a;font-size:.8rem;font-weight:800;letter-spacing:.02em}
.lead-item:nth-child(2) h3::after{content:"";display:block;width:3.5rem;height:6px;border-radius:3px;background:var(--sky);margin-top:1.1rem}
.value-run{display:grid;margin:2.5rem 0 0;gap:0}
.value-run>div{padding:1.25rem 0;border-top:1px solid var(--line)}
.value-run dt{font:800 1.15rem/1.3 var(--font);letter-spacing:-.015em;margin-bottom:.3rem}
.value-run dd{margin:0;color:var(--muted)}
@media (min-width:60rem){
  .value{padding:7.5rem 0}
  .value-lead{grid-template-columns:repeat(3,1fr);gap:1.25rem}
  .lead-item{padding:2.75rem 2.5rem;min-height:20rem;display:flex;flex-direction:column;justify-content:flex-end}
  .value-run{grid-template-columns:repeat(4,1fr);column-gap:2rem;margin-top:3.5rem}
}

/* navy band with drifting lane lines */
.band{position:relative;overflow:hidden;background:#0b1f3a;color:#eef4fb}
.lanes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.lanes path{fill:none;stroke:#1f3d66;stroke-width:2;stroke-dasharray:22 18;animation:drive 9s linear infinite}
.lanes path.neon{stroke:var(--neon);stroke-width:2.5;stroke-dasharray:none;opacity:.85;animation:none}
@keyframes drive{to{stroke-dashoffset:-400}}
.band-inner{position:relative;padding:5.5rem 1.25rem;display:grid;gap:2.5rem}
.band h2{font-size:clamp(2.3rem,5.8vw,4.6rem);margin:0;max-width:15ch;color:#fff}
.band-points{display:grid;gap:1.25rem}
.band-points p{margin:0;color:#c9d6e6;font-size:1.08rem;max-width:34rem;padding:1.25rem 1.4rem;border:1px solid #21406b;border-radius:16px;background:#0e2546}
.band-points strong{display:block;color:#fff;font:800 1.2rem/1.3 var(--font);letter-spacing:-.015em;margin-bottom:.3rem}
@media (min-width:60rem){.band-inner{grid-template-columns:1.15fr 1fr;align-items:center;padding:8rem 1.25rem;gap:4.5rem}}

/* early access */
.invite{padding:4.5rem 0 6.5rem}
@media (min-width:60rem){.invite{padding:7rem 0 7.5rem}}
.pass{max-width:54rem;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--lift)}
.pass-top{position:relative;padding:2.25rem 1.5rem 1.75rem;border-radius:24px 24px 0 0;background:linear-gradient(160deg,var(--baby),var(--white) 70%)}
.pass-top h2{margin-bottom:.4em}
.pass-top .note{margin:0}
.pass-stub{position:relative;display:grid;gap:1.1rem;padding:2rem 1.5rem 1.85rem;border-top:1px solid var(--line)}
@media (min-width:44rem){.pass-top{padding:2.75rem 2.75rem 2rem}.pass-stub{grid-template-columns:1fr 1fr;padding:2.25rem 2.75rem 2.5rem;column-gap:1.25rem}.span-2{grid-column:1/-1}}

/* form */
form{display:grid;gap:1.1rem}
label{display:block;font-weight:700;font-size:.92rem;margin-bottom:.35rem}
input,select{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:1px solid #b7c3d1;border-radius:10px;padding:.75rem .85rem;min-height:50px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
input:hover,select:hover{border-color:var(--sky)}
input:focus,select:focus{outline:none;border-color:var(--sky-ink);box-shadow:0 0 0 4px rgba(74,168,255,.22)}
.hint{font-size:.85rem;color:var(--muted);margin:.4rem 0 0}
.hp{position:absolute;left:-9999px}
.pass-stub .btn{width:100%}
@media (min-width:44rem){.pass-stub .btn{width:auto}}

/* scroll reveals: content is readable without JS; with JS it rises in once */
.js .reveal{opacity:.001;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal-group>*{opacity:.001;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal-group.in>*{opacity:1;transform:none}
.js .reveal-group.in>*:nth-child(2){transition-delay:.08s}
.js .reveal-group.in>*:nth-child(3){transition-delay:.16s}
.js .reveal-group.in>*:nth-child(4){transition-delay:.24s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ticker-track,.lanes path{animation:none}
  .js .reveal,.js .reveal-group>*,.js h1 .w,.js .hero-copy>p,.js .hero-actions,.js .checklist{opacity:1;transform:none;transition:none}
  .js .ticks li,.js .ticks .box,.js .ticks .box svg{transition:none}
  .btn,.btn::after,.lead-item{transition:none}
}

/* legal and thanks pages */
.legal{max-width:44rem;padding:3rem 0 3.5rem}
.legal h1{font-size:clamp(2.2rem,6vw,3.2rem)}
.legal h2{font-size:1.45rem;margin-top:2rem}
.legal li{margin-bottom:.4rem}
.meta{color:var(--muted);font-size:.95rem}
footer{border-top:1px solid var(--line);padding:1.75rem 0 2.5rem;font-size:.92rem;color:var(--muted);background:var(--paper)}
footer .wrap{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between}
footer nav{display:flex;gap:1.25rem;flex-wrap:wrap}