:root{--n:#001050;--b:#0047E4;--s:#009EFE;--c:#01D7FD;--m:#F1F6FF;--t:#2B3558;--l:#D9E3F7}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:17px/1.65 Figtree,system-ui,sans-serif;color:var(--t);background:#fff}
h1,h2,h3{font-family:'Bricolage Grotesque',Figtree,sans-serif;color:var(--n);line-height:1.1;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(2.3rem,7.5vw,4.4rem);font-weight:700}h2{font-size:clamp(1.8rem,5vw,2.8rem);font-weight:600}h3{font-size:1.3rem;font-weight:600}
p{margin:0 0 1em;max-width:62ch}a{color:var(--b)}
.w{max-width:1080px;margin:auto;padding:0 20px}.sec{padding:72px 0}.mist{background:var(--m)}
header{position:sticky;top:0;z-index:9;background:#fff;border-bottom:1px solid var(--l)}
header .w{display:flex;align-items:center;justify-content:space-between;height:68px;gap:12px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--n);font:700 1.15rem 'Bricolage Grotesque',sans-serif}.logo img{height:40px}
nav{display:flex;gap:22px;align-items:center}nav a{text-decoration:none;color:var(--t);font-weight:600;font-size:.95rem}
details.m{display:none}
.btn{display:inline-block;padding:14px 24px;border-radius:999px;background:linear-gradient(90deg,var(--b),var(--s));color:#fff;font-weight:600;text-decoration:none;border:0;font-size:1rem;cursor:pointer}
.btn.o{background:none;color:var(--b);border:1.5px solid var(--b)}.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.hero{padding:64px 0 24px;background:radial-gradient(60% 70% at 95% 0,rgba(1,215,253,.2),transparent)}
.hero p.lead{font-size:1.2rem;max-width:56ch}
ol.j{display:flex;list-style:none;padding:0;margin:44px 0 0}
ol.j li{flex:1;position:relative;padding-top:26px;font-weight:600;color:var(--n);font-size:.95rem}
ol.j li:before{content:"";position:absolute;top:0;left:0;width:14px;height:14px;border-radius:50%;background:var(--b)}
ol.j li:after{content:"";position:absolute;top:6px;left:18px;right:6px;border-top:2px solid var(--s)}
ol.j li:last-child:after{display:none}
ol.j li.x:before{background:#fff;border:2px solid var(--b)}ol.j li.x:after{border-top:2px dashed var(--b)}
ol.j small{display:block;font-weight:400;color:var(--t);font-size:.82rem;line-height:1.4;padding-right:10px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.rows a{display:flex;justify-content:space-between;gap:20px;padding:22px 0;border-top:1px solid var(--l);text-decoration:none;color:var(--t)}
.rows a:last-child{border-bottom:1px solid var(--l)}.rows h3{margin:0 0 4px}.rows a:hover h3{color:var(--b)}.rows span{font-size:.95rem}
.band{background:var(--n);color:#d6e2ff}.band h2{color:#fff}.band a{color:#7fe3ff}
.chk label{display:flex;gap:12px;padding:12px 0;border-top:1px solid rgba(255,255,255,.18);cursor:pointer}.chk input{width:20px;height:20px;margin-top:4px;accent-color:var(--c)}
.band .btn{background:var(--c);color:var(--n)}.band .btn.o{background:none;color:#fff;border:1.5px solid #fff}
.steps{counter-reset:s;list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.steps li{counter-increment:s;border-top:3px solid var(--s);padding-top:14px}.steps li:before{content:counter(s);font:700 1.6rem 'Bricolage Grotesque';color:var(--b);display:block}
.steps b{color:var(--n)}
.lv{border-left:3px solid var(--s);padding:2px 0 2px 18px;margin-bottom:22px}.lv h3{margin-bottom:.2em}.lv p{margin:0}
ul.p{padding-left:1.1em}ul.p li{margin-bottom:.5em}
details.f{border-top:1px solid var(--l);padding:16px 0}details.f:last-of-type{border-bottom:1px solid var(--l)}details.f summary{font-weight:600;color:var(--n);cursor:pointer}details.f p{margin:.6em 0 0}
.note{font-size:.92rem;color:#51608a}
.ph{border-radius:20px;max-width:100%;width:340px;aspect-ratio:4/5;object-fit:cover;background:var(--m)}
footer{background:#000a33;color:#b9c8f0;padding:56px 0 100px;font-size:.95rem}footer a{color:#fff;text-decoration:none}footer .g{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}footer p{margin:.3em 0}
.prose{max-width:720px}.prose h2{font-size:1.6rem;margin:1.8em 0 .5em}.prose ul{padding-left:1.2em}.prose li{margin-bottom:.5em}
.bar{position:fixed;left:0;right:0;bottom:0;display:none;gap:10px;padding:10px;background:#fff;border-top:1px solid var(--l);z-index:9}.bar a{flex:1;text-align:center}
a:focus-visible,summary:focus-visible,input:focus-visible,button:focus-visible{outline:3px solid var(--c);outline-offset:2px}
@media(max-width:760px){nav{display:none}details.m{display:block;position:relative}details.m summary{list-style:none;font-weight:600;padding:10px 14px;border:1.5px solid var(--l);border-radius:999px;cursor:pointer}
details.m div{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--l);border-radius:14px;padding:10px 18px;width:220px;box-shadow:0 10px 30px rgba(0,16,80,.12)}details.m a{display:block;padding:9px 0;text-decoration:none;color:var(--n);font-weight:600}
.sec{padding:52px 0}.two,.steps,footer .g{grid-template-columns:1fr}ol.j{flex-direction:column;gap:18px}ol.j li{padding:0 0 0 30px}ol.j li:before{top:5px}
ol.j li:after{top:22px;bottom:-16px;left:6px;right:auto;border-top:0;border-left:2px solid var(--s)}ol.j li.x:after{border-left:2px dashed var(--b)}
.bar{display:flex}.hdr-btn{display:none}}
.hero{position:relative;overflow:hidden}.hero .w{position:relative;z-index:1}
.hero:after{content:"";position:absolute;right:-140px;top:-90px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--c),var(--b));opacity:.16;filter:blur(34px);animation:fl 9s ease-in-out infinite alternate;pointer-events:none}
@keyframes fl{to{transform:translate(-50px,70px) scale(1.15)}}
h1,h2{text-wrap:balance}p{text-wrap:pretty}
.btn{transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,71,228,.3)}
.bn{display:inline-block;margin-left:6px;animation:bn 1.4s ease-in-out infinite}@keyframes bn{50%{transform:translateY(4px)}}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}.rv.in{opacity:1;transform:none}
.rows a{transition:padding-left .25s,background .25s;align-items:center}.rows a:hover{padding-left:14px;background:linear-gradient(90deg,rgba(0,112,253,.08),transparent)}
.ar{flex:none;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--l);display:grid;place-items:center;font-size:1.2rem;color:var(--b);transition:all .25s}
.rows a:hover .ar{background:var(--b);color:#fff;border-color:var(--b);transform:translateX(4px)}
.steps li{transition:transform .25s}.steps li:hover{transform:translateY(-6px)}.lv{transition:border-color .25s,padding-left .25s}.lv:hover{border-color:var(--b);padding-left:26px}
.chk label:hover{background:rgba(255,255,255,.06)}
@keyframes pl{0%,100%{box-shadow:0 0 0 0 rgba(0,112,253,.45)}50%{box-shadow:0 0 0 9px rgba(0,112,253,0)}}
ol.j li:before{animation:pl 2.4s infinite}ol.j li:nth-child(2):before{animation-delay:.4s}ol.j li:nth-child(3):before{animation-delay:.8s}ol.j li:nth-child(4):before{animation-delay:1.2s}ol.j li:nth-child(5):before{animation-delay:1.6s}
.tg{display:inline-flex;background:#fff;border:1.5px solid var(--l);border-radius:999px;padding:4px;margin:36px 0 0}.tg button{border:0;background:none;padding:10px 18px;border-radius:999px;font:600 .95rem Figtree,sans-serif;color:var(--t);cursor:pointer}.tg button.on{background:var(--b);color:#fff}
.lane{position:relative;height:200px;margin-top:8px}.lane .ln{position:absolute;left:0;right:0;top:61px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--b),var(--c))}
.st{position:absolute;top:44px;width:25%;text-align:center}.st i{display:block;width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--b);margin:0 auto;transition:border-color .2s,transform .2s}.st b{display:block;margin-top:12px;color:var(--n);font-size:.9rem;line-height:1.3}
.st.hit i{border-color:#ff5a6e;transform:scale(1.2)}.st.pop i{animation:po .6s}@keyframes po{40%{transform:scale(1.5);background:var(--c)}}
.d{position:absolute;top:53px;left:0;width:18px;height:18px;border-radius:50%;background:var(--b);box-shadow:0 0 0 5px rgba(0,112,253,.2);z-index:2}.d.lost{background:#ff5a6e;box-shadow:0 0 0 5px rgba(255,90,110,.25)}
.cnt{display:flex;gap:26px;flex-wrap:wrap;font-weight:600;color:var(--n);margin:0}.cnt span b{font:700 1.5rem 'Bricolage Grotesque',sans-serif;color:var(--b);margin-left:6px}.cnt .lo b{color:#ff5a6e}
.fo{display:flex;gap:32px;align-items:center}.fo img{flex:none;width:150px;height:150px;border-radius:50%;object-fit:cover;object-position:top;border:4px solid #fff;box-shadow:0 8px 28px rgba(0,71,228,.25)}
@media(max-width:760px){.fo{flex-direction:column;align-items:flex-start}.st b{font-size:.76rem}.st{width:25%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}