@property --n { syntax: '<integer>'; initial-value: 0; inherits: false; }
body{margin:0;background:#0E1013}
.mz{--void:#07080A;--ink9:#0E1013;--ink8:#15181C;--ink7:#1D2126;--ink6:#2A2F36;--ink5:#4A5057;--steel:#8A9199;--mist:#A8AEB6;--bone:#F6F4EF;--body:#E4E2DC;--hv:#DDF04C;--amber:#E8A33D;--sage:#6FBF8C;--rust:#F0725C;--line:rgba(246,244,239,.08);--sans:'Archivo',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;--ease:cubic-bezier(.2,.8,.2,1);container:mz/inline-size;background:var(--ink9);color:var(--body);font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
.mz *{box-sizing:border-box}
a{color:inherit;text-decoration:none}
a:hover{color:#F6F4EF}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px}
.mono{font-family:var(--mono);font-weight:500;font-size:12.5px;line-height:1.2;letter-spacing:.16em;text-transform:uppercase}
.kick{color:var(--hv);margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mk{display:block;width:26px;height:26px;transform:skewX(-10deg);flex:none}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:square;stroke-linejoin:miter;flex:none}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(14,16,19,.76);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
.nav .wrap{height:72px;display:flex;align-items:center;gap:32px}
.logo{display:flex;align-items:center;gap:12px;color:var(--bone)}
.logo b{font-weight:800;font-stretch:120%;font-size:21px;letter-spacing:-.02em}
.links{display:flex;gap:30px;margin-left:auto;font-size:15px;color:var(--mist)}
.links a{padding:12px 0}

/* buttons, inputs */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 24px;border:0;border-radius:0;cursor:pointer;font:600 16px/1 var(--sans);white-space:nowrap;transition:transform .25s var(--ease),background-color .2s,color .2s,border-color .2s}
.btn-hv{background:var(--hv);color:var(--ink9)}
.btn-hv:hover{background:#E9F883;transform:translateY(-2px)}
.btn-hv:active{transform:translateY(0)}
.btn .ar{width:20px;height:20px;transition:transform .25s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn-ghost{height:44px;padding:0 18px;background:transparent;color:var(--bone);border:1px solid var(--ink6);font-size:15px}
.btn-ghost:hover{border-color:var(--hv);color:var(--hv)}
.btn:focus-visible,.in:focus-visible,.links a:focus-visible,summary:focus-visible,.seg:focus-visible{outline:2px solid var(--hv);outline-offset:3px}
.wl{margin-top:36px;max-width:580px}
.row{display:flex;gap:10px}
.in{flex:1;min-width:0;height:56px;padding:0 18px;border-radius:4px;border:1px solid var(--ink6);background:var(--ink8);color:var(--bone);font:400 17px/1 var(--sans);transition:border-color .2s,box-shadow .2s}
.in::placeholder{color:var(--steel)}
.in:focus{outline:none;border-color:var(--hv);box-shadow:0 0 0 4px rgba(221,240,76,.14)}
.in[aria-invalid="true"]{border-color:var(--rust)}
.fine{margin:14px 0 0;font-size:14px;color:var(--steel)}
.err{margin:14px 0 0;font-size:14.5px;color:var(--rust)}

/* cut-corner container: 1px hairline that follows the 45deg cut */
.cut{--c:26px;position:relative;padding:1px;background:var(--ink6);clip-path:polygon(0 0,calc(100% - var(--c)) 0,100% var(--c),100% 100%,0 100%)}
.cut-in{height:100%;background:var(--ink8);clip-path:polygon(0 0,calc(100% - var(--c) + .6px) 0,100% calc(var(--c) - .6px),100% 100%,0 100%)}
.ok{max-width:580px;margin-top:36px;animation:stamp .32s var(--ease) both}
.ok .cut-in{display:flex;gap:16px;align-items:center;padding:18px 22px}
.ok .ck{flex:none;width:44px;height:44px;display:grid;place-items:center;background:var(--hv);color:var(--ink9)}
.ok b{display:block;color:var(--bone);font-size:17px;font-weight:600}
.ok b+span{display:block;color:var(--mist);font-size:15px}

/* phones */
.phone{position:absolute;width:var(--pw);aspect-ratio:780/1696;padding:calc(var(--pw)*.034);border-radius:calc(var(--pw)*.155);background:#050607;transform:rotate(var(--r,0deg));box-shadow:inset 0 0 0 1.5px #30353C,0 0 0 1px rgba(0,0,0,.6),0 50px 90px -30px rgba(0,0,0,.85)}
.phone img{display:block;width:100%;height:100%;object-fit:cover;border-radius:calc(var(--pw)*.125)}
.fl{animation:enter 1.1s var(--ease) both,float 7s ease-in-out 1.2s infinite}
.chip{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;height:44px;padding:0 16px;background:rgba(21,24,28,.94);border:1px solid var(--ink6);color:var(--bone);box-shadow:0 22px 40px -18px rgba(0,0,0,.85);white-space:nowrap}
.dot{width:8px;height:8px;background:var(--hv);flex:none;animation:pulse 1.6s ease-out infinite}
.plate-amber{background:var(--amber);color:var(--ink9);border:0}
.plate{height:auto;padding:14px 16px 12px;flex-direction:column;align-items:flex-start;gap:8px;background:var(--bone);color:var(--ink9);border:0}
.plate b{font-weight:800;font-stretch:125%;font-size:40px;line-height:.82;letter-spacing:-.045em}

/* hero */
.hero{position:relative;overflow:hidden;padding:76px 0 196px;border-bottom:1px solid var(--line)}
.grid-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(110% 85% at 74% 36%,#000 18%,transparent 70%);mask-image:radial-gradient(110% 85% at 74% 36%,#000 18%,transparent 70%)}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:32px;align-items:center}
.eyebrow{margin:0;display:inline-flex;align-items:center;gap:12px;height:38px;padding:0 14px;border:1px solid var(--ink6);background:rgba(21,24,28,.7);color:var(--bone);animation:fadeUp .8s var(--ease) both}
.hd{margin:30px 0 0;font-weight:800;font-stretch:125%;font-size:clamp(60px,9.6cqi,142px);line-height:.86;letter-spacing:-.045em;color:var(--bone)}
.ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ln>span{display:block;animation:rise 1s var(--ease) both}
.ln+.ln>span{animation-delay:.12s}
.hd i{font-style:normal;color:var(--hv)}
.lede{max-width:560px;margin:30px 0 0;font-size:20px;line-height:1.5;color:var(--mist);animation:fadeUp .9s .3s var(--ease) both}
.lede b{color:var(--bone);font-weight:600}
.hero .wl,.hero .ok{animation:fadeUp .9s .42s var(--ease) both}
.meta{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:40px;color:var(--steel);animation:fadeUp .9s .54s var(--ease) both}
.meta span{display:inline-flex;align-items:center;gap:9px}
.meta span::before{content:"";width:6px;height:6px;background:var(--ink5)}
.stage{position:relative;width:580px;height:690px;margin-left:auto}
.stage .p1{--pw:268px;--r:-7deg;left:14px;top:84px;animation-delay:.3s,1.4s}
.stage .p2{--pw:302px;--r:4deg;right:26px;top:0;z-index:2;animation-delay:.12s,1.25s}
.stage .c1{left:-26px;top:40px;animation-delay:.9s,2s}
.stage .c2{left:-8px;bottom:176px;animation-delay:1.05s,2.3s}
.stage .c3{right:-14px;bottom:96px;animation-delay:1.2s,2.6s}
.route{position:absolute;left:0;bottom:0;width:100%;height:150px;pointer-events:none}
.route .case{fill:none;stroke:var(--ink9);stroke-width:14;stroke-linejoin:miter}
.route .trk{fill:none;stroke:var(--hv);stroke-width:4;stroke-linejoin:miter;stroke-dasharray:1;animation:draw 2.8s .5s cubic-bezier(.65,.05,.25,1) both}
.route rect{fill:var(--bone);transform-box:fill-box;transform-origin:center;animation:pop .45s var(--ease) both}
.route .end{fill:var(--hv)}

/* marquee */
.mq{overflow:hidden;padding:28px 0;background:var(--void);border-bottom:1px solid var(--line)}
.mq-track{display:flex;width:max-content;animation:marquee 42s linear infinite}
.mq-item{display:flex;align-items:center;gap:36px;padding-right:36px;font-weight:800;font-stretch:125%;font-size:56px;line-height:1;letter-spacing:-.03em;color:var(--bone);white-space:nowrap}
.mq-item.o{color:transparent;-webkit-text-stroke:1.5px var(--ink5)}

/* manifesto */
.mf{padding:150px 0 130px}
.mf-lines{margin:30px 0 0;font-weight:700;font-stretch:110%;font-size:clamp(32px,4.5cqi,64px);line-height:1.06;letter-spacing:-.03em;color:#6F767F}
.mf-lines span{display:block}
.mf-lines .yes{color:var(--bone);display:flex;align-items:center;gap:.28em;margin-top:.3em}
.mf-lines .yes .mk{width:.8em;height:.8em}
.pr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:88px}
.pr>div{padding-top:24px;border-top:1px solid var(--line)}
.pr h3{margin:14px 0 0;font-size:20px;font-weight:700;letter-spacing:-.015em;color:var(--bone)}
.pr p{margin:8px 0 0;color:var(--mist);font-size:16px}

/* features */
.ft{position:relative;padding:130px 0;border-top:1px solid var(--line)}
.ft.alt{background:var(--void)}
.ft>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.ft.flip .media{order:2}
.fstage{position:relative;width:540px;height:650px;margin:0 auto}
.fstage .rvp{position:absolute;inset:0}
.ft h2,.sec h2,.demo h2{margin:18px 0 0;font-weight:800;font-stretch:118%;font-size:clamp(38px,4.6cqi,66px);line-height:.96;letter-spacing:-.035em;color:var(--bone)}
.ft .bd,.sec .bd,.demo .bd{margin:22px 0 0;max-width:540px;font-size:19px;color:var(--mist)}
.facts{list-style:none;margin:34px 0 0;padding:0;border-top:1px solid var(--line)}
.facts li{display:flex;gap:18px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}
.ico{flex:none;width:44px;height:44px;display:grid;place-items:center;background:var(--ink8);border:1px solid var(--ink6);color:var(--hv)}
.facts b{display:block;color:var(--bone);font-weight:600;font-size:17px;line-height:1.35}
.facts b+span{display:block;margin-top:3px;color:var(--mist);font-size:15.5px;line-height:1.45}
.big{margin-top:34px}
.bn{margin:0;display:flex;align-items:baseline;font-weight:800;font-stretch:125%;font-size:124px;line-height:.8;letter-spacing:-.05em;color:var(--bone)}
.cnt{--n:var(--to)}
.cnt::after{counter-reset:n var(--n);content:counter(n)}
.big .mono{margin:16px 0 0;color:var(--steel)}
.rail{height:10px;margin-top:20px;max-width:540px;background:repeating-linear-gradient(90deg,var(--ink5) 0 1px,transparent 1px 9px)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:34px;max-width:540px}
.tile{padding:18px 18px 16px;border:1px solid}
.tile b{display:block;font-weight:800;font-stretch:125%;font-size:44px;line-height:.85;letter-spacing:-.04em}
.tile .mono{display:block;margin-top:12px}
.t-ok{border-color:#2E5B41;background:#132019;color:var(--sage)}
.t-soon{border-color:#6B5023;background:#221C12;color:var(--amber)}
.t-late{border-color:#6E2C22;background:#261512;color:var(--rust)}
.alert{position:absolute;z-index:3;width:350px;padding:22px 22px 20px;background:#221C12;border:1px solid #6B5023;color:var(--bone);box-shadow:0 30px 60px -24px rgba(0,0,0,.9)}
.al-top{display:flex;gap:14px;align-items:flex-start}
.al-top .ic{color:var(--amber);margin-top:2px}
.al-top b{display:block;font-size:17.5px;font-weight:700;letter-spacing:-.01em}
.al-top b+span{display:block;margin-top:4px;color:var(--mist);font-size:14.5px}
.bar{height:6px;margin:18px 0;background:var(--ink6)}
.bar i{display:block;height:100%;width:97%;background:var(--amber);transform-origin:left;animation:fillx 1.8s 1s var(--ease) both}
.al-btns{display:flex;gap:10px}
.al-btns span{display:inline-flex;align-items:center;height:44px;padding:0 16px;font-weight:600;font-size:15px}
.al-btns .b1{background:var(--amber);color:var(--ink9)}
.al-btns .b2{border:1px solid var(--ink5);color:var(--mist)}
.alt-lbl{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:34px;max-width:540px}
.alt-lbl .mono:last-child{color:var(--hv)}
.bars{display:flex;align-items:flex-end;gap:4px;height:130px;margin-top:16px;max-width:540px}
.bars i{flex:1;background:#BCD12F;transform-origin:bottom}
.axis{display:flex;justify-content:space-between;margin-top:10px;max-width:540px;color:var(--steel)}
.segs{display:inline-flex;gap:0;margin-top:34px;border:1px solid var(--ink6);padding:4px;background:var(--ink8)}
.seg{height:44px;padding:0 18px;border:0;background:transparent;color:var(--mist);font:600 15px/1 var(--sans);cursor:pointer;transition:background-color .2s,color .2s}
.seg:hover{color:var(--bone)}
.seg.on{background:var(--bone);color:var(--ink9)}
.dstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:20px;max-width:540px;border:1px solid var(--line);animation:fade .45s var(--ease) both}
.dstats div{padding:20px 18px 18px}
.dstats div+div{border-left:1px solid var(--line)}
.dstats b{display:block;font-weight:800;font-stretch:122%;font-size:36px;line-height:.9;letter-spacing:-.04em;color:var(--bone)}
.dstats .mono{display:block;margin-top:10px;color:var(--steel)}
.swap{animation:fade .5s var(--ease) both}
.card{position:absolute;z-index:3;width:340px;box-shadow:0 30px 60px -24px rgba(0,0,0,.9)}
.card .cut-in{padding:20px}
.card .row2{display:flex;gap:14px;align-items:center}
.card .ico{background:var(--ink7)}
.card b{display:block;color:var(--bone);font-weight:700;font-size:16.5px;line-height:1.25}
.card b+span{display:block;margin-top:4px;color:var(--mist);font-size:14px}
.card .kick{margin-bottom:8px}
.confirmed{display:inline-flex;align-items:center;gap:8px;height:40px;margin-top:16px;padding:0 14px;border:1px solid var(--ink5);color:var(--bone);font-weight:600;font-size:14.5px}
.confirmed .ic{width:18px;height:18px;color:var(--hv)}

/* photo band */
.band{position:relative;height:660px;overflow:hidden;display:flex;align-items:flex-end;border-top:1px solid var(--line)}
.band img{position:absolute;left:0;top:-10%;width:100%;height:120%;object-fit:cover}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,8,10,.94) 8%,rgba(7,8,10,.35) 55%,rgba(7,8,10,.15))}
.band .wrap{position:relative;z-index:1;width:100%;padding-bottom:84px}
.band h2{margin:16px 0 0;max-width:900px;font-weight:800;font-stretch:125%;font-size:clamp(44px,7cqi,104px);line-height:.88;letter-spacing:-.045em;color:var(--bone)}
.band p{margin:22px 0 0;max-width:560px;font-size:19px;color:var(--body)}

/* benefits, faq */
.sec{padding:130px 0;border-top:1px solid var(--line)}
.bn3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:60px}
.bn3 .cut-in{padding:34px 30px 32px}
.bn3 .num{font-family:var(--mono);font-size:13px;letter-spacing:.16em;color:var(--hv)}
.bn3 h3{margin:48px 0 0;font-weight:800;font-stretch:112%;font-size:30px;line-height:1.02;letter-spacing:-.03em;color:var(--bone)}
.bn3 p{margin:14px 0 0;color:var(--mist);font-size:16px}
.faq>.wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;align-items:start}
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:76px;padding:18px 0;font-weight:600;font-size:19px;color:var(--bone)}
.qa summary::-webkit-details-marker{display:none}
.qa summary .ic{color:var(--hv);transition:transform .3s var(--ease)}
.qa details[open] summary .ic{transform:rotate(45deg)}
.qa details p{margin:0;padding:0 48px 26px 0;color:var(--mist);font-size:16.5px;animation:fadeUp .4s var(--ease) both}

/* final cta, footer */
.cta{position:relative;overflow:hidden;padding:150px 0 140px;border-top:1px solid var(--line)}
.cta .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cta::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(14,16,19,.97) 34%,rgba(14,16,19,.72) 70%,rgba(14,16,19,.55))}
.cta>.wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:center}
.cta h2{margin:18px 0 0;font-weight:800;font-stretch:125%;font-size:clamp(46px,6.2cqi,92px);line-height:.88;letter-spacing:-.045em;color:var(--bone)}
.cta .bd{margin:24px 0 0;max-width:540px;font-size:19px;color:var(--body)}
.cstage{position:relative;width:380px;height:640px;margin:0 auto}
.cstage .p3{--pw:300px;--r:4deg;left:40px;top:10px}
.cstage .c4{left:-44px;top:118px;animation-delay:.2s,1.3s}
.foot{padding:44px 0 56px;background:var(--void);border-top:1px solid var(--line)}
.foot .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px}
.foot .mono{color:var(--steel)}
.foot .end{margin-left:auto;color:var(--steel);font-size:14px}

/* demo video */
.phone video{display:block;width:100%;height:100%;object-fit:cover;border-radius:calc(var(--pw)*.125);background:#000}
.icf{fill:currentColor;stroke:none}
.demo{padding:130px 0;border-top:1px solid var(--line);background:var(--void)}
.demo>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"copy phone" "list phone";column-gap:72px;align-items:start}
.d-copy{grid-area:copy;align-self:end}
.d-phone{grid-area:phone;align-self:center}
.d-list{grid-area:list;list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--line)}
.d-list li{border-bottom:1px solid var(--line)}
.dstage{position:relative;width:440px;height:760px;margin:0 auto}
.dstage .pv{--pw:340px;left:50px;top:10px}
.dstage .c-rec{left:-6px;top:64px}
.pp{position:absolute;z-index:3;left:18px;bottom:96px;width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--ink6);background:rgba(21,24,28,.94);color:var(--bone);cursor:pointer;transition:border-color .2s,color .2s}
.pp:hover{border-color:var(--hv);color:var(--hv)}
.pp:focus-visible,.chap:focus-visible{outline:2px solid var(--hv);outline-offset:3px}
.chap{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:14px;align-items:start;width:100%;min-height:44px;padding:18px 0 20px;background:none;border:0;text-align:left;color:var(--steel);cursor:pointer;font:inherit}
.chap b{display:block;font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--mist);transition:color .2s}
.chap .d-t>span{display:block;margin-top:3px;font-size:15px;color:var(--steel)}
.chap:hover b,.chap.on b{color:var(--bone)}
.chap.on .d-n{color:var(--hv)}
.d-n,.d-time{padding-top:4px}
.d-bar{position:absolute;left:0;right:0;bottom:-1px;height:2px}
.d-bar i{display:block;height:100%;background:var(--hv);transition:width .3s linear}

.dstage .pv{transition:transform .9s var(--ease)}
.dstage.t0 .pv{transform:rotate(-2deg)}
.dstage.t1 .pv{transform:rotate(2.5deg) translateY(-8px)}
.dstage.t2 .pv{transform:rotate(-1.5deg) translateY(4px)}
.dstage.t3 .pv{transform:rotate(2deg) translateY(-6px)}
.dstage.t4 .pv{transform:rotate(-2.5deg)}
.call{animation:callIn .6s var(--ease) both}
.call.k0{right:-34px;top:250px}
.call.k1{right:-40px;top:150px}
.call.k2{right:-30px;top:330px}
.call.k3{right:-44px;top:420px}
.call.k4{right:-36px;top:200px}
.hvt{color:var(--hv)}
@keyframes callIn{from{opacity:0;transform:translateX(28px) scale(.92)}}

/* motion */
@keyframes rise{from{transform:translateY(106%)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}}
@keyframes fade{from{opacity:0}}
@keyframes enter{from{opacity:0;transform:translateY(70px) rotate(var(--r,0deg))}}
@keyframes float{50%{transform:translateY(-12px) rotate(var(--r,0deg))}}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes pop{0%{transform:scale(0)}60%{transform:scale(1.35)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(221,240,76,.55)}100%{box-shadow:0 0 0 10px rgba(221,240,76,0)}}
@keyframes stamp{from{opacity:0;transform:scale(1.2)}}
@keyframes fillx{from{transform:scaleX(0)}}
@keyframes barUp{from{transform:scaleY(.05)}}
@keyframes count{from{--n:0}}
@keyframes par{from{transform:translateY(-7%)}to{transform:translateY(7%)}}
@keyframes slideUp{from{opacity:0;transform:translateY(110px)}}
@supports (animation-timeline: view()){
.rv{animation:fadeUp linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
.rvp{animation:slideUp linear both;animation-timeline:view();animation-range:entry 0% cover 38%}
.bars i{animation:barUp linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
.cnt{animation:count linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
.bar i{animation:fillx linear both;animation-timeline:view();animation-range:entry 30% cover 50%}
.band img{animation:par linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
}
.still *,.still *::before,.still *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion: reduce){.mz *,.mz *::before,.mz *::after{animation:none!important;transition:none!important}}

/* laptop */
@container mz (max-width: 1240px){
.stage{zoom:.86}
.fstage{zoom:.9}
}
@container mz (max-width: 1100px){
.stage{zoom:.7}
.fstage{zoom:.75}
.dstage{zoom:.82}
}
/* phone */
@container mz (max-width: 900px){
.wrap{padding:0 20px}
.links{display:none}
.nav .wrap{height:64px}
.nav .btn-ghost{margin-left:auto}
.hero{padding:44px 0 124px}
.hero .wrap,.ft>.wrap,.cta>.wrap,.faq>.wrap{grid-template-columns:minmax(0,1fr);gap:40px}
.hd{font-size:clamp(56px,19cqi,120px);font-stretch:118%}
.lede,.ft .bd,.sec .bd,.demo .bd,.cta .bd,.band p{font-size:17px}
.row{flex-direction:column}
.row .in{flex:none;width:100%;height:56px}
.row .btn{width:100%}
.meta{gap:10px 18px}
.stage{zoom:.6;margin:0 auto}
.route{height:100px}
.mq{padding:20px 0}
.mq-item{font-size:38px;gap:24px;padding-right:24px}
.mf{padding:96px 0 80px}
.pr{grid-template-columns:minmax(0,1fr);gap:28px;margin-top:56px}
.ft,.sec{padding:88px 0}
.ft.flip .media{order:0}
.fstage{zoom:.62}
.bn{font-size:96px}
.tile b{font-size:36px}
.dstats b{font-size:28px}
.segs{display:flex}
.seg{flex:1;padding:0 10px}
.band{height:560px}
.band .wrap{padding-bottom:56px}
.bn3{grid-template-columns:minmax(0,1fr);margin-top:40px}
.bn3 h3{margin-top:28px;font-size:26px}
.qa summary{font-size:17px;min-height:64px}
.cta{padding:96px 0 88px}
.cstage{zoom:.72}
.demo{padding:88px 0}
.demo>.wrap{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "phone" "list";row-gap:36px}
.d-list{margin-top:0}
.dstage{zoom:.76}
.chap b{font-size:17px}
.stage .c3{right:0}
.dstage .call{right:0}
.dstage .c-rec{left:0}
.foot .end{margin-left:0}
}

#garagem .fstage .phone{--pw:310px;--r:-4deg;left:110px;top:10px}
#manutencao .fstage .phone{--pw:300px;--r:3deg;left:40px;top:0}
#manutencao .alert{right:-6px;bottom:70px;animation-delay:.3s,1.5s}
#sessoes .fstage .phone{--pw:310px;--r:4deg;left:120px;top:6px}
#disciplinas .fstage .phone{--pw:310px;--r:-3deg;left:110px;top:6px}
#comunidade .fstage .phone{--pw:300px;--r:3deg;right:20px;top:0}
#comunidade .c-crew{left:-10px;top:120px;animation-delay:.25s,1.6s}
#comunidade .c-ach{left:10px;bottom:70px;width:320px;animation-delay:.4s,1.9s}

/* static site */
html{background:#0E1013;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
.if{display:contents}
[hidden]{display:none!important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.btn[disabled]{opacity:.65;cursor:progress;transform:none}
.fine.is-err{color:var(--rust)}
section[id],main[id]{scroll-margin-top:72px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:12px 16px;background:var(--hv);color:var(--ink9);font-weight:600}
.skip:focus{top:12px}