/*
 * ⛔ SELF-HOSTED, not Google Fonts. The handoff linked fonts.googleapis.com,
 * which this site's CSP refuses outright — `style-src 'self'` and
 * `font-src 'self'` in `site/_headers`. The two faces the page asks for were
 * already on the site, so this costs nothing and removes two third-party
 * requests from a page that had none.
 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/fonts/space-grotesk.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal; font-weight: 400 600; font-display: swap;
  src: url('/fonts/ibm-plex-sans.woff2') format('woff2');
}

:root{--H:'Space Grotesk',system-ui,sans-serif;--B:'IBM Plex Sans',system-ui,sans-serif;--sun:#f5c542;--amb:#e0ab52}
html[data-theme=dark]{--bg:#0b0f0d;--bg2:#121916;--line:rgba(232,238,235,.1);--ink:#eef3f0;--mute:rgba(238,243,240,.64);--g:#2ec27f;--gt:#4fd495;--chipOn:#bff2d8;--chipBg:rgba(46,194,127,.14);--glow:rgba(46,194,127,.22);--nav:rgba(11,15,13,.74);--noteBg:rgba(224,171,82,.1);--noteBd:rgba(224,171,82,.3);--noteInk:#f2d9a8;--track:rgba(238,243,240,.14);--nomL:rgba(238,243,240,.5)}
html[data-theme=light]{--bg:#f3f5f4;--bg2:#ffffff;--line:rgba(21,24,28,.1);--ink:#15181c;--mute:rgba(21,24,28,.64);--g:#12a463;--gt:#0b6e41;--chipOn:#0a4f30;--chipBg:#e3f8ec;--glow:rgba(18,164,99,.16);--nav:rgba(243,245,244,.8);--noteBg:#fbeed3;--noteBd:rgba(196,141,46,.35);--noteInk:#6b4610;--track:rgba(21,24,28,.12);--nomL:rgba(21,24,28,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--B);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .4s,color .4s}
a{color:var(--gt);text-decoration:none}a:hover{color:var(--g)}
h1,h2,h3{font-family:var(--H);font-weight:600;letter-spacing:-.025em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}
.num{font-variant-numeric:tabular-nums}
.kick{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--gt)}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;font-weight:600;font-size:15px;border:1px solid transparent;cursor:pointer;transition:transform .2s,background .2s;font-family:var(--B)}
.btn:hover{transform:translateY(-2px)}
.btn-g{background:var(--g);color:#06140d}.btn-g:hover{color:#06140d;filter:brightness(1.1)}
.btn-o{border-color:var(--line);color:var(--ink);background:transparent}.btn-o:hover{color:var(--ink);background:var(--chipBg)}
.play{display:inline-block;line-height:0;transition:transform .2s}
.btn-badge{min-height:56px;border-radius:10px;padding:0 24px;font-size:16px;border:1.5px solid var(--nomL)}.play:hover{transform:translateY(-2px)}
.play img{height:80px;margin:-12px -12px}
nav.top{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:var(--nav);border-bottom:1px solid var(--line)}
nav.top .wrap{display:flex;align-items:center;gap:24px;height:68px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--H);font-weight:600;letter-spacing:.12em;color:var(--ink);font-size:14px}.brand:hover{color:var(--ink)}.brand img{width:30px;height:30px;border-radius:8px}
.links{display:flex;gap:26px;margin-left:auto;font-size:14px}.links a{color:var(--mute)}.links a:hover{color:var(--ink)}
.theme{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}
@media(max-width:820px){.links{display:none}.theme{margin-left:auto}}
.hero{position:relative;padding:64px 0 36px;overflow:hidden}
.hero::before{content:"";position:absolute;left:62%;top:-260px;width:1000px;height:820px;transform:translateX(-50%);background:radial-gradient(closest-side,var(--glow),transparent 70%);pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr}}
.hero h1{font-size:clamp(44px,6.4vw,86px);line-height:.98;margin-top:16px}
.hero h1 em{font-style:normal;color:var(--gt)}
.lede{font-size:clamp(17px,1.6vw,20px);color:var(--mute);margin-top:22px;max-width:36ch}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px;align-items:center}
.fine{font-size:13px;color:var(--mute);margin-top:16px}
.sunmark{width:60px;height:60px;display:block}
.sunmark .sun{fill:var(--sun);transform:translateY(36px);animation:rise 1.6s cubic-bezier(.2,.8,.2,1) .2s forwards}
.sunmark .hz{fill:var(--ink)}
@keyframes rise{to{transform:translateY(0)}}
.calc{margin-top:34px;background:var(--bg2);border:1px solid var(--line);border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:16px;max-width:560px}
.calc-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.calc-h h3{font-size:17px}.calc-h span{font-size:12px;color:var(--mute)}
.ctl{display:grid;grid-template-columns:110px minmax(0,1fr) 96px;gap:14px;align-items:center;font-size:14px}
.ctl output{font-family:var(--H);font-weight:600;font-size:17px;text-align:right}
@media(max-width:520px){.ctl{grid-template-columns:1fr auto}.ctl input{grid-column:1/-1;order:3}}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--g) var(--p,50%),var(--track) var(--p,50%));outline:none;margin:0}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid var(--g);cursor:grab;box-shadow:0 2px 10px rgba(0,0,0,.3)}
input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#fff;border:4px solid var(--g);cursor:grab}
input[type=range]:focus-visible{outline:2px solid var(--g);outline-offset:6px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:8px 14px;font:inherit;font-size:13px;cursor:pointer;transition:.2s}
.chip small{color:var(--mute);margin-left:4px}
.chip[aria-pressed=true]{border-color:var(--g);background:var(--chipBg);color:var(--chipOn);font-weight:600}
.hint{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--mute);margin-top:22px}
.hint i{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 0 0 var(--g);animation:ping 1.8s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(46,194,127,.6)}100%{box-shadow:0 0 0 10px rgba(46,194,127,0)}}

/* phone */
.phone{position:relative;width:var(--pw,330px);padding:4px;border-radius:54px;background:linear-gradient(145deg,#8d9893 0%,#3a4440 18%,#1f2523 48%,#3e4844 80%,#99a49f 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 0 0 1px rgba(0,0,0,.4),0 40px 90px rgba(0,0,0,.45),0 0 70px var(--glow)}
.phone .btnR,.phone .btnL1,.phone .btnL2{position:absolute;width:4px;border-radius:2px;background:linear-gradient(90deg,#5d6864,#9aa5a0)}
.phone .btnR{right:-3px;top:26%;height:64px}.phone .btnL1{left:-3px;top:20%;height:38px}.phone .btnL2{left:-3px;top:28%;height:38px}
.bezel{border-radius:50px;background:#050706;padding:9px}

.scr{position:relative;width:100%;aspect-ratio:390/844;border-radius:41px;overflow:hidden;background:#f5f6f7}
.scr::after{content:"";position:absolute;top:11px;left:50%;width:30%;height:26px;border-radius:14px;background:#050706;transform:translateX(-50%);z-index:60}
.app{position:absolute;left:0;top:0;width:390px;height:844px;zoom:var(--s,.8);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:#f5f6f7;color:#15181c;font-family:var(--B);font-size:15px;line-height:1.45;transition:opacity .55s ease,transform .55s ease}
.float{animation:bob 6.5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.enter.go{animation:phoneIn 2.2s cubic-bezier(.2,.8,.2,1)}
@keyframes phoneIn{from{opacity:0;transform:translateX(90px)}}

/* app ui */
.sbar{height:50px;display:flex;align-items:flex-end;justify-content:space-between;padding:0 30px 6px;font-weight:600;font-size:15px}
.pad{padding:8px 18px 0;display:flex;flex-direction:column;gap:14px}
.c{background:#fff;border:1px solid #e7eaee;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;box-shadow:0 1px 3px rgba(21,24,28,.04)}
.kk{font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#6b7380}
.kk.gr{color:#0b6e41}
.tg{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap}
.tg.g{background:#e3f8ec;color:#0b6e41}.tg.a{background:#fbeed3;color:#8a5d14}.tg.n{background:#eef0f2;color:#4a525d}
.gt{color:#0b6e41}.at{color:#8a5d14}.mt{color:#6b7380}
.hdr{display:flex;align-items:center;gap:10px}
.hdr img{width:36px;height:36px;border-radius:10px}
.hi{font-family:var(--H);font-weight:600;font-size:17px;line-height:1.2}
.ico{width:34px;height:34px;border-radius:50%;border:1px solid #e7eaee;background:#fff;display:grid;place-items:center}
.tap{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left;position:relative;border-radius:14px;transition:box-shadow .3s,background .3s}
.tap .pulse{position:absolute;inset:-6px;border-radius:18px;border:2px solid rgba(18,164,99,.55);animation:tpulse 2.2s ease-out infinite;pointer-events:none}
@keyframes tpulse{0%{opacity:.9;transform:scale(.96)}100%{opacity:0;transform:scale(1.08)}}
.tapped .pulse{display:none}
.big{font-family:var(--H);font-weight:700;font-size:44px;letter-spacing:-.02em;line-height:1.05;display:flex;align-items:center;gap:8px;margin-top:6px}
.ringb{position:relative;width:88px;height:88px;flex:none;border-radius:50%}
.ringb .pulse{border-radius:50%}
.ringb b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--H);font-size:22px;font-weight:600;line-height:1}
.ringb b small{font-family:var(--B);font-size:8.5px;letter-spacing:.12em;font-weight:500;color:#6b7380;margin-top:3px}
.ringc{transition:stroke-dashoffset .7s cubic-bezier(.2,.8,.2,1),stroke .4s}
.bar{height:10px;border-radius:999px;overflow:hidden;display:flex;background:#e7eaee}
.bar i{display:block;height:100%;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.lg{display:flex;align-items:center;gap:8px;font-size:13.5px}.lg b{margin-left:auto;font-weight:600}
.dot{width:8px;height:8px;border-radius:50%;flex:none}
.lnk{font-size:13px;color:#0b6e41;font-weight:500}
.bt{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bt span{min-height:44px;border-radius:10px;display:grid;place-items:center;font-weight:600;font-size:14px}
.bp{background:#12a463;color:#fff}.bs{background:#fff;border:1px solid #d6dbe0}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:14px}.row b{font-weight:600}
.fld{display:flex;flex-direction:column;gap:5px}.fld label{font-size:12px;font-weight:500;color:#5b636e}
.inp{min-height:44px;border:1px solid #d6dbe0;border-radius:10px;background:#fff;padding:10px 12px;font-size:15px;display:flex;align-items:center;transition:border-color .3s,box-shadow .3s}
.inp.on{border-color:#12a463;box-shadow:0 0 0 3px rgba(18,164,99,.15)}
.caret{display:inline-block;width:1.5px;height:18px;background:#12a463;margin-left:1px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hn{font-size:11.5px;color:#737b86;line-height:1.4}
.pill{border:1px solid #e0e4e8;border-radius:999px;padding:6px 13px;font-size:12.5px}
.pill.on{border-color:#12a463;background:#e3f8ec;color:#0a4f30;font-weight:600}
.bnav{position:absolute;left:0;right:0;bottom:0;height:78px;background:#fff;border-top:1px solid #e7eaee;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;font-size:10.5px;color:rgba(21,24,28,.52)}
.bnav span{display:flex;flex-direction:column;align-items:center;gap:3px}.bnav .on{color:#12a463;font-weight:600}
.fab,.bnav .fab{width:56px;height:56px;border-radius:50%;background:#12a463;color:#fff;display:grid;place-items:center;flex-direction:row;gap:0;margin:-30px auto 0;box-shadow:0 8px 20px rgba(18,164,99,.4)}
.scrim{position:absolute;inset:0;background:rgba(8,14,11,.62);z-index:20;opacity:0;pointer-events:none;transition:opacity .35s}
.scrim.on{opacity:1;pointer-events:auto}
.lift{z-index:30;background:#fff!important;box-shadow:0 0 0 8px #fff,0 0 0 11px rgba(46,194,127,.8)}
.coach{position:absolute;left:18px;right:18px;z-index:40;background:#fff;border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:0 20px 50px rgba(0,0,0,.35);opacity:0;transform:translateY(18px) scale(.94);pointer-events:none;transition:opacity .35s,transform .45s cubic-bezier(.2,.9,.3,1.2)}
.coach.on{opacity:1;transform:none;pointer-events:auto}
.coach h5{margin:0;font-family:var(--H);font-weight:600;font-size:17px;flex:1}
.coach .cn{font-size:12.5px;color:#6b7380;line-height:1.5;border-top:1px solid #e7eaee;padding-top:10px}
.coach .ok{align-self:flex-end;min-height:38px;padding:0 18px;border-radius:10px;border:0;background:#12a463;color:#fff;font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.coach .row{opacity:0;transform:translateX(-8px);transition:opacity .35s,transform .35s}
.coach.on .row{opacity:1;transform:none}
.toast{position:absolute;left:50%;top:60px;transform:translate(-50%,-20px);background:#15181c;color:#fff;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:500;display:flex;align-items:center;gap:8px;opacity:0;transition:.45s cubic-bezier(.2,.8,.2,1);z-index:50;white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}
.illu{position:absolute;bottom:84px;left:0;right:0;text-align:center;font-size:10.5px;color:#9aa1ab;z-index:5}

.strip{border-block:1px solid var(--line);padding:18px 0;overflow:hidden;margin-top:48px}
.strip .track{display:flex;gap:48px;width:max-content;animation:scroll 42s linear infinite;font-family:var(--H);font-size:15px;color:var(--mute);white-space:nowrap}
.strip .track b{color:var(--ink);font-weight:600;margin-right:8px}
@keyframes scroll{to{transform:translateX(-50%)}}
section{padding:110px 0}
.sh{display:flex;flex-direction:column;gap:14px;max-width:720px}
.sh h2{font-size:clamp(34px,4.4vw,58px);line-height:1.02}
.sh p{color:var(--mute);font-size:18px}

/* premium showcase */
.prow{display:grid;gap:40px;align-items:center;padding:70px 0}
.p-up{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"head head head" "l ph r"}
.p-up .phd{grid-area:head;text-align:center;align-items:center;margin:0 auto}
.p-up .pph{grid-area:ph}.p-up .pl{grid-area:l}.p-up .pr{grid-area:r}
.pcards{display:flex;flex-direction:column;gap:14px;opacity:0;transition:opacity .9s .5s,transform .9s .5s cubic-bezier(.2,.8,.2,1)}
.pl{transform:translateX(-40px)}.pr{transform:translateX(40px)}.prow.on .pcards{opacity:1;transform:none}
.pcard{border:1px solid var(--line);background:var(--bg2);border-radius:18px;padding:18px 20px;font-size:15px}
.pcard b{display:block;font-family:var(--H);font-size:17px;margin-bottom:4px}.pcard span{color:var(--mute)}
.p-flip{grid-template-columns:minmax(0,.9fr) auto minmax(0,.8fr)}
.pfig{display:flex;flex-direction:column;gap:22px;opacity:0;transform:translateY(30px);transition:opacity .9s .6s,transform .9s .6s}
.prow.on .pfig{opacity:1;transform:none}
.pfig div{border-left:3px solid var(--g);padding-left:16px}.pfig div.a{border-color:var(--amb)}
.pfig b{display:block;font-family:var(--H);font-size:clamp(30px,3.4vw,44px);font-weight:700;letter-spacing:-.02em;line-height:1.05}
.pfig span{color:var(--mute);font-size:14px}
.p-pop{grid-template-columns:1fr;justify-items:center;background:linear-gradient(170deg,#0f4a2f,#0a3421 70%);border-radius:32px;padding:64px 28px 0;overflow:hidden;margin-top:40px;color:#fff}
.p-pop .pbox{text-align:center;align-items:center;max-width:680px}
.p-pop .pbox p{color:#d6f5e4}.p-pop .pbox .kick{color:#8fdfb6}
.p-pop .pbox ul{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px 14px}
.p-pop .pbox li{background:rgba(255,255,255,.08);border-radius:999px;padding:8px 14px;font-size:14px;color:#eaf8f0}
.p-pop .pbox li::before{display:none}
.p-pop .pph{height:520px;align-items:flex-start;overflow:hidden;transform:translateY(200px)}
.p-pop.on .pph{transform:none}
.pph{display:flex;justify-content:center;opacity:0;transition:opacity 1s,transform 1.3s cubic-bezier(.2,.8,.2,1)}
.p-up .pph{transform:translateY(140px) scale(.92)}
.p-flip .pph{transform:perspective(1400px) rotateY(-70deg)}
.prow.on .pph{opacity:1;transform:none}
.pbox{display:flex;flex-direction:column;gap:14px;max-width:500px;opacity:0;transition:opacity .9s .3s,transform .9s .3s cubic-bezier(.2,.8,.2,1)}
.p-up .pbox{transform:translateY(-20px)}.p-flip .pbox{transform:translateX(-40px)}.p-pop .pbox{transform:translateY(30px)}
.prow.on .pbox{opacity:1;transform:none}
.pbox h3{font-size:clamp(28px,3.2vw,42px)}.pbox p{color:var(--mute);font-size:17px}
.pbox ul{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.pbox li{display:flex;gap:12px;font-size:15px}.pbox li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amb);margin-top:9px;flex:none}
@media(max-width:960px){.p-up,.p-flip{grid-template-columns:1fr;grid-template-areas:none;gap:28px;padding:40px 0}.p-up>*{grid-area:auto!important}.p-up .phd{text-align:left;align-items:flex-start;margin:0}.prow .pph{order:-1}.p-pop .pph{height:440px}}
/* intermission */
.inter{min-height:88vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:22px;padding:40px 0}
.inter h2{font-size:clamp(56px,10vw,150px);line-height:.95;letter-spacing:-.04em}
.inter .w{display:inline-block;opacity:0;transform:translateY(60px) rotate(4deg);filter:blur(8px);transition:opacity 1.1s,transform 1.3s cubic-bezier(.16,.84,.3,1),filter 1.1s}
.inter.in .w{opacity:1;transform:none;filter:none}
.inter.in .w:nth-child(2){transition-delay:.18s}.inter.in .w:nth-child(3){transition-delay:.36s}.inter.in .w:nth-child(4){transition-delay:.54s;color:var(--gt)}
.inter p{font-size:clamp(18px,1.8vw,22px);color:var(--mute);max-width:40ch;opacity:0;transition:opacity 1.2s 1s}
.inter.in p{opacity:1}
.inter .kick,.inter .clock{opacity:0;transition:opacity 1s .2s}.inter.in .kick,.inter.in .clock{opacity:1}
.inter .arc{transition:stroke-dashoffset 3s cubic-bezier(.4,0,.2,1) 1.2s}.inter.in .arc{stroke-dashoffset:95}
/* steps */
.steps{position:relative;height:calc(3 * 140vh);margin-top:55vh}
.spin{position:sticky;top:68px;height:calc(100vh - 68px);overflow:hidden}
.srow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;position:absolute;inset:0;padding:20px 0;pointer-events:none}
.srow.on,.srow.txt{pointer-events:auto}
.srow.out .sph{transition:opacity .7s ease-in,transform .9s cubic-bezier(.5,0,.75,0)}
.srow .box{transition:opacity .25s,transform .25s}
.srow.flip .sph{order:2}
.sph{display:flex;justify-content:center;opacity:0;transform:translateX(-160px);transition:opacity 1.8s ease,transform 2.4s cubic-bezier(.16,.84,.3,1)}
.srow.flip .sph{transform:translateX(160px)}
.srow.on .sph{opacity:1;transform:none}
.srow.on .sph.done,.prow.on .pph.done{transition:none;transform:none;will-change:auto}
.sph .phone{transform:none;--pw:min(340px,calc((100vh - 68px - 70px - 26px) * 390 / 844 + 26px))!important}
.box{display:flex;flex-direction:column;gap:14px;max-width:500px;opacity:0;transform:translateY(24px);transition:opacity 1.4s .7s,transform 1.4s .7s cubic-bezier(.2,.8,.2,1)}
.srow.txt .box{opacity:1;transform:none;transition:opacity .45s,transform .5s cubic-bezier(.2,.8,.2,1)}
.box .n{font-family:var(--H);font-size:14px;color:var(--gt);width:40px;height:40px;border-radius:50%;border:1px solid var(--g);display:grid;place-items:center}
.box h3{font-size:clamp(28px,3.2vw,42px)}
.box p{color:var(--mute);font-size:17px}
.box ul{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.box li{display:flex;gap:12px;font-size:15px}
.box li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--g);margin-top:9px;flex:none}
@media(max-width:860px){.steps{height:auto;margin-top:0}.spin{position:static;height:auto;overflow:visible}.srow{position:relative;inset:auto;grid-template-columns:1fr;gap:28px;padding:36px 0;pointer-events:auto}.srow.flip .sph{order:0}.sph .phone{--pw:260px!important}}
.math{margin-top:30px;border:1px solid var(--line);border-radius:22px;padding:26px;background:var(--bg2);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
.math pre{margin:0;font-size:15px;line-height:1.9;color:var(--gt);white-space:pre-wrap}
.math p{color:var(--mute)}
@media(max-width:760px){.math{grid-template-columns:1fr}}

/* chart */
.chart{position:relative;margin-top:44px;border:1px solid var(--line);border-radius:26px;padding:26px 26px 20px;background:var(--bg2)}
.chart svg{width:100%;height:auto;display:block;overflow:visible;touch-action:pan-y;cursor:crosshair}
.chart .draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.6s cubic-bezier(.4,0,.2,1)}
.chart .fadeA{opacity:0;transition:opacity 1.2s 1.6s}
.chart.seen .draw{stroke-dashoffset:0}.chart.seen .fadeA{opacity:1}
.chart .ax{font-size:11px;fill:var(--mute);font-family:var(--B)}
.tip{position:absolute;top:18px;pointer-events:none;background:var(--ink);color:var(--bg);border-radius:12px;padding:9px 12px;font-size:12.5px;line-height:1.4;transform:translateX(-50%);white-space:nowrap;transition:left .08s linear;opacity:0}
.chart.seen .tip{opacity:1;transition:opacity .4s 2.6s,left .08s linear}
.tip b{font-family:var(--H);font-weight:600}
.legend{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:14px;font-size:13px;color:var(--mute)}
.legend span{display:flex;align-items:center;gap:8px}.legend i{width:20px;height:4px;border-radius:2px;display:block}
.legend input{flex:1;min-width:200px}

.feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:44px}
@media(max-width:900px){.feat{grid-template-columns:1fr}}
.fc{border:1px solid var(--line);border-radius:22px;padding:26px;background:var(--bg2);display:flex;flex-direction:column;gap:10px;transition:transform .3s,border-color .3s}
.fc:hover{transform:translateY(-4px);border-color:var(--g)}
.fc h3{font-size:20px}.fc p{color:var(--mute);font-size:15px}
.fc .c2{font-family:var(--H);font-size:24px;font-weight:600;letter-spacing:.02em;color:var(--gt)}
.note{margin-top:22px;border-radius:18px;padding:18px 22px;background:var(--noteBg);border:1px solid var(--noteBd);color:var(--noteInk);font-size:14px}
.prem{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;margin-top:44px}
@media(max-width:860px){.prem{grid-template-columns:1fr}}
.plist{margin:0;padding:0;display:flex;flex-direction:column}
.plist li{list-style:none;display:flex;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px}
.plist li::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--g);flex:none;box-shadow:0 0 0 5px var(--chipBg)}
.price{border-radius:26px;padding:30px;background:linear-gradient(160deg,#0f4a2f,#0a3421);color:#fff;display:flex;flex-direction:column;gap:18px}
.tog{display:inline-flex;align-self:flex-start;background:rgba(0,0,0,.25);border-radius:999px;padding:4px}
.tog button{border:0;background:transparent;color:#bff2d8;font:inherit;font-size:14px;padding:8px 16px;border-radius:999px;cursor:pointer}
.tog button[aria-pressed=true]{background:#fff;color:#0a3421;font-weight:600}
.amt{font-family:var(--H);font-size:64px;font-weight:700;letter-spacing:-.03em;line-height:1}
.amt small{font-size:18px;font-weight:500;color:#bff2d8;letter-spacing:0}
.price p{color:#d6f5e4;font-size:14px}
.faq{margin-top:36px;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font-family:var(--H);font-size:19px;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:24px;color:var(--gt);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--mute);padding:0 0 22px;max-width:70ch}
.final{text-align:center;padding:120px 0;position:relative;overflow:hidden}
.final::before{content:"";position:absolute;left:50%;bottom:-420px;width:900px;height:640px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(245,197,66,.2),transparent 70%)}
.final h2{font-size:clamp(40px,6vw,80px);line-height:1}
.disc{font-size:13px;color:var(--mute);max-width:80ch}
footer{border-top:1px solid var(--line);padding:36px 0 50px}
footer .wrap{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
footer .fl{display:flex;flex-wrap:wrap;gap:20px;font-size:14px}footer .fl a{color:var(--mute)}
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.sunmark .sun{transform:none}.chart .draw{stroke-dashoffset:0}.chart .fadeA{opacity:1}}