:root{--bg:#0A0A0B;--panel:#121214;--panel2:#18181B;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--tx:#F4F2EE;--mut:#8B8B92;--em:#FF5B1F;--fl:#FFB547;--ease:cubic-bezier(.16,1,.3,1);
 --disp:'Clash Display',system-ui,sans-serif;--body:Satoshi,system-ui,sans-serif;--mono:'Geist Mono',ui-monospace,monospace;
 /* legacy tokens used by app.css */--tc:#FF5B1F;--tc2:#FF8A4C;--tcd:#E2470F;--ink:#0A0A0B;--ink2:#121214;--cream:#18181B;--r:18px}
*{box-sizing:border-box}html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--tx);font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--em);color:#000}
h1,h2,h3,h4{font-family:var(--disp);font-weight:500;line-height:.92;letter-spacing:-.04em;margin:0}
h2 em,h1 em{font-style:normal;color:var(--em)}
a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}
.wrap{max-width:1360px;margin:0 auto;padding:0 32px}
.mono,.eyebrow{font:400 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.eyebrow{display:inline-flex;gap:10px;align-items:center}.eyebrow:before{content:"";width:6px;height:6px;background:var(--em);border-radius:50%;box-shadow:0 0 12px var(--em)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;font:500 15px var(--body);padding:15px 24px;border-radius:999px;transition:transform .5s var(--ease),background .3s,color .3s,box-shadow .3s;white-space:nowrap;will-change:transform}
.btn-p{background:var(--em);color:#0A0A0B;box-shadow:0 0 0 0 rgba(255,91,31,0),0 10px 40px -10px rgba(255,91,31,.6)}.btn-p:hover{box-shadow:0 0 0 6px rgba(255,91,31,.15),0 10px 50px -8px rgba(255,91,31,.8)}
.btn .ar{transition:transform .4s var(--ease)}.btn:hover .ar{transform:translateX(4px)}
.btn-line,.btn-ghost{color:var(--tx);background:rgba(255,255,255,.04);border:1px solid var(--line2)}.btn-line:hover,.btn-ghost:hover{background:var(--tx);color:var(--bg)}
/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:18px 32px;mix-blend-mode:normal;transition:background .4s,backdrop-filter .4s}
.nav.scrolled{background:rgba(10,10,11,.6);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.logo{font:600 20px var(--disp);letter-spacing:-.03em;display:flex;align-items:center;gap:10px}
.logo i{width:20px;height:20px;border-radius:5px;background:var(--em);box-shadow:0 0 18px rgba(255,91,31,.7);display:grid;place-items:center}
.logo i:after{content:"";border-left:6px solid #0A0A0B;border-top:4px solid transparent;border-bottom:4px solid transparent;margin-left:2px}.logo b{font-weight:600;color:var(--tx)}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:4px;border:1px solid var(--line);border-radius:999px;background:rgba(18,18,20,.5);backdrop-filter:blur(12px)}
.nav ul a{display:block;padding:8px 14px;border-radius:999px;font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);transition:color .2s,background .2s}.nav ul a:hover{color:var(--tx);background:rgba(255,255,255,.06)}
.nav .r{display:flex;gap:6px;align-items:center;justify-content:flex-end}.nav .login{font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:10px 14px;cursor:pointer;color:var(--mut)}.nav .login:hover{color:var(--tx)}
.nav .btn{padding:10px 18px;font-size:14px}
/* sections */
section{padding:160px 0;position:relative}
.sh{max-width:1000px;margin:0 0 80px}.sh.c{margin:0 auto 80px;text-align:center}
.sh h2{font-size:clamp(48px,7vw,120px);margin:22px 0 22px}.sh p{font-size:19px;color:var(--mut);margin:0;max-width:620px}.sh.c p{margin:0 auto}
.dark{background:transparent}
/* before/after */
.ba-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center}
.ba{position:relative;aspect-ratio:4/5;border-radius:20px;overflow:hidden;user-select:none;cursor:ew-resize;background:#fff;touch-action:pan-y;border:1px solid var(--line)}
.ba .a,.ba .b{position:absolute;inset:0}.ba .a img{width:100%;height:100%;object-fit:cover;background:#c3c0c1}
.ba .b{clip-path:inset(0 0 0 var(--p,50%))}.ba .b video{width:100%;height:100%;object-fit:cover}
.ba .h{position:absolute;top:0;bottom:0;left:var(--p,50%);width:1px;background:var(--em);box-shadow:0 0 18px var(--em)}
.ba .h:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:var(--em);box-shadow:0 0 30px var(--em)}
.ba .lb{position:absolute;top:16px;font:400 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:7px 10px;border-radius:6px;background:rgba(10,10,11,.75);color:var(--tx);backdrop-filter:blur(8px)}.ba .l1{left:16px}.ba .l2{right:16px;background:var(--em);color:#000}
.checks{list-style:none;padding:0;margin:40px 0 0;border-top:1px solid var(--line)}
.checks li{display:flex;gap:18px;padding:18px 0;border-bottom:1px solid var(--line);font-size:17px}
.checks li i{font:400 11px var(--mono);color:var(--em);font-style:normal;padding-top:5px;min-width:28px}
/* features (bento) */
.feat{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.fc{grid-column:span 2;position:relative;background:var(--bg);padding:40px 34px 38px;min-height:280px;overflow:hidden;transition:background .4s}
.fc:hover{background:#0E0E10}.fc.w{grid-column:span 3}
.fc:before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,91,31,.14),transparent 45%);opacity:0;transition:opacity .4s}.fc:hover:before{opacity:1}
.fc .ic{font:400 11px var(--mono);color:var(--em);margin-bottom:60px;letter-spacing:.08em}.fc .ic svg{display:none}
.fc h3{font-size:30px;margin-bottom:12px;letter-spacing:-.03em}.fc p{color:var(--mut);margin:0;font-size:16px;max-width:420px}
.fmts{display:flex;gap:10px;align-items:flex-end;margin-top:30px}.fmts div{border:1px solid var(--line2);border-radius:6px;display:grid;place-items:center;font:400 10px var(--mono);color:var(--mut)}
.fmts div:first-child{border-color:var(--em);color:var(--em);box-shadow:0 0 20px -4px rgba(255,91,31,.6)}
.wave{display:flex;gap:3px;align-items:center;height:44px;margin-top:30px}.wave i{width:3px;border-radius:3px;background:var(--em);animation:w 1.2s ease-in-out infinite;box-shadow:0 0 8px rgba(255,91,31,.6)}@keyframes w{50%{transform:scaleY(.3)}}
/* how */
.how{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.hs{padding:40px 0;border-top:1px solid var(--line);opacity:.3;transition:opacity .6s}.hs.on{opacity:1}
.hs .n{font:400 11px var(--mono);letter-spacing:.08em;color:var(--em)}.hs h3{font-size:44px;margin:16px 0 12px}.hs p{color:var(--mut);margin:0;max-width:440px}
.how-vis{position:sticky;top:120px;height:520px;border-radius:22px;background:radial-gradient(500px 300px at 50% 100%,rgba(255,91,31,.18),transparent 70%),var(--panel);border:1px solid var(--line);overflow:hidden}
.scr{position:absolute;inset:40px;display:grid;place-items:center;opacity:0;transform:translateY(24px);transition:all .8s var(--ease)}.scr.on{opacity:1;transform:none}
.mock{width:100%;max-width:420px;background:var(--panel2);border-radius:16px;border:1px solid var(--line2);padding:22px;box-shadow:0 40px 80px -30px #000}
.mock .url{display:flex;gap:10px;align-items:center;border:1px solid var(--em);border-radius:10px;padding:12px 14px;font:400 12px var(--mono);color:var(--tx)}.mock .url b{margin-left:auto;background:var(--em);color:#000;border-radius:6px;padding:5px 9px;font-weight:400}
.mock .ph{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.mock .ph img{aspect-ratio:1;object-fit:cover;border-radius:8px;background:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--line2);border-radius:999px;padding:7px 12px;font:400 11px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--mut)}.chip.on{border-color:var(--em);color:var(--em);background:rgba(255,91,31,.08)}
.outs{display:flex;gap:12px;align-items:flex-end;justify-content:center}.outs video{border-radius:10px;object-fit:cover;box-shadow:0 30px 50px -20px #000}
/* pricing */
#pricing{background:radial-gradient(900px 400px at 50% 0,rgba(255,91,31,.10),transparent 70%)}
.tog{display:inline-flex;border:1px solid var(--line2);border-radius:999px;padding:4px;position:relative;margin-top:34px}
.tog button{position:relative;z-index:2;border:0;background:none;font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:10px 18px;border-radius:999px;cursor:pointer;color:var(--mut);transition:color .3s}
.tog button.on{color:#000}.tog .k{position:absolute;z-index:1;top:4px;bottom:4px;border-radius:999px;background:var(--em);transition:all .5s var(--ease)}
.tog em{font-style:normal;margin-left:6px;opacity:.8}
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.plan{background:var(--bg);padding:34px 28px;display:flex;flex-direction:column;position:relative;transition:background .4s}
.plan:hover{background:#0E0E10}
.plan.hot{background:linear-gradient(180deg,rgba(255,91,31,.12),rgba(255,91,31,0) 60%),#0E0E10}.plan.hot:after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--em);box-shadow:0 0 20px var(--em)}
.plan .tg{font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-bottom:28px}.plan.hot .tg{color:var(--em)}
.plan h3{font-size:30px}.plan .ds{font-size:15px;color:var(--mut);margin:10px 0 28px;min-height:48px}
.plan .pr{display:flex;align-items:baseline;gap:8px}.plan .pr b{font:500 64px var(--disp);letter-spacing:-.05em}.plan .pr span{font:400 11px var(--mono);color:var(--mut);text-transform:uppercase}
.plan .bil{font:400 11px var(--mono);color:var(--mut);min-height:18px;margin:6px 0 28px;text-transform:uppercase;letter-spacing:.04em}
.plan ul{list-style:none;padding:0;margin:0 0 34px;font-size:15px;flex:1;border-top:1px solid var(--line)}.plan li{padding:11px 0 11px 22px;position:relative;border-bottom:1px solid var(--line);color:#CFCDC8}
.plan li:before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--em)}
.plan .btn{width:100%}
.topup{margin-top:16px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border:1px solid var(--line);border-radius:18px;padding:22px 28px;font-size:16px;color:var(--mut)}.topup b{font:500 22px var(--disp);color:var(--tx);letter-spacing:-.02em}
.cost{margin-top:18px;font:400 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut);text-align:center}
/* testimonials */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tq{border:1px dashed var(--line2);border-radius:18px;padding:30px;position:relative}
.tq .ph{font:400 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--em)}
.tq p{font:500 24px/1.2 var(--disp);letter-spacing:-.02em;margin:22px 0 26px}.tq .who{display:flex;gap:12px;align-items:center;font:400 11px var(--mono);text-transform:uppercase;color:var(--mut)}.tq .who i{width:28px;height:28px;border-radius:50%;background:var(--panel2);border:1px solid var(--line2)}
/* faq */
.faqg{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}
.faq{border-top:1px solid var(--line)}.faq details{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:26px 0;font:500 24px var(--disp);letter-spacing:-.02em;transition:color .3s}.faq summary:hover{color:var(--em)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:14px;height:14px;position:relative;margin-top:8px;transition:transform .5s var(--ease)}.faq summary i:before,.faq summary i:after{content:"";position:absolute;left:0;top:50%;width:14px;height:1px;background:currentColor}.faq summary i:after{transform:rotate(90deg)}
.faq details[open] summary i{transform:rotate(45deg);color:var(--em)}.faq p{margin:0 0 28px;color:var(--mut);max-width:640px}
/* cta + footer */
.cta{position:relative;border-radius:28px;border:1px solid var(--line);padding:120px 40px;text-align:center;overflow:hidden;background:radial-gradient(600px 300px at 50% 110%,rgba(255,91,31,.45),transparent 70%),var(--panel)}
.cta h2{font-size:clamp(48px,7.5vw,128px);margin:26px 0 24px}.cta p{color:var(--mut);font-size:19px;margin:0 0 40px}
footer{padding:100px 0 30px;border-top:1px solid var(--line)}
.fg{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:40px;padding-bottom:70px}
.fg h4{font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-bottom:20px}
.fg a{display:block;padding:5px 0;font-size:15px;color:#CFCDC8}.fg a:hover{color:var(--em)}.fg a.logo{display:flex;margin-bottom:14px}
.news{display:flex;margin-top:26px;border:1px solid var(--line2);border-radius:999px;padding:5px;max-width:380px}
.news input{flex:1;border:0;background:none;padding:0 14px;font:400 15px var(--body);outline:none;min-width:0;color:var(--tx)}.news .btn{padding:10px 18px;font-size:13px}
.fb{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:24px;border-top:1px solid var(--line);font:400 11px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--mut)}
.big{font:600 clamp(80px,21vw,360px)/.8 var(--disp);letter-spacing:-.06em;text-align:center;margin-top:60px;user-select:none;background:linear-gradient(180deg,#1C1C1F,#0A0A0B 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* reveal */
.rv{opacity:0;transform:translateY(40px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}.rv.in{opacity:1;transform:none}.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}.split .w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease)}.split.in .w>span{transform:none}
/* modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:60;padding:20px}.modal.on{display:flex;animation:fi .3s}@keyframes fi{from{opacity:0}}
.box{background:var(--panel);border:1px solid var(--line2);border-radius:22px;width:100%;max-width:880px;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;animation:pu .5s var(--ease)}@keyframes pu{from{transform:translateY(24px);opacity:0}}
.box .art{background:#000;position:relative}.box .art video{width:100%;height:100%;object-fit:cover;opacity:.85}.box .art p{position:absolute;left:24px;right:24px;bottom:22px;color:#fff;font:500 28px/1 var(--disp);letter-spacing:-.03em;margin:0}
.box .frm{padding:44px 40px;position:relative}.box h3{font-size:36px;margin-bottom:8px}.box .sub{color:var(--mut);font-size:15px;margin:0 0 24px}
.x{position:absolute;top:16px;right:16px;border:1px solid var(--line2);background:none;width:34px;height:34px;border-radius:50%;font-size:16px;cursor:pointer;color:var(--tx)}
label{display:block;font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:18px 0 8px}
input,select,textarea{width:100%;padding:14px 15px;border:1px solid var(--line2);border-radius:10px;font:400 15px var(--body);background:#0E0E10;color:var(--tx);transition:border-color .2s,box-shadow .2s}
input:focus,select:focus{outline:none;border-color:var(--em);box-shadow:0 0 0 4px rgba(255,91,31,.15)}
.sso button{display:flex;gap:10px;align-items:center;justify-content:center;width:100%;border:1px solid var(--line2);background:transparent;color:var(--tx);border-radius:10px;padding:12px;font:500 14px var(--body);cursor:pointer}
.or{display:flex;align-items:center;gap:12px;color:var(--mut);font:400 10px var(--mono);text-transform:uppercase;margin:18px 0 0}.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}
.sw{font-size:14px;margin-top:18px;text-align:center;color:var(--mut)}.sw a{color:var(--em);cursor:pointer}.err{color:#FF6B6B;font-size:13px;min-height:18px;margin-top:8px}.tiny{font:400 10px var(--mono);text-transform:uppercase;color:var(--mut);margin-top:14px;text-align:center}
.works{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;overflow:hidden}
.works .wrap{display:flex;align-items:center;gap:40px}.works small{font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);white-space:nowrap}
.logos{display:flex;gap:56px;align-items:center;color:#6E6E75;animation:mq 30s linear infinite;flex:none}.logos span{display:flex;align-items:center;gap:10px;font:500 20px var(--disp);letter-spacing:-.02em}.logos svg{width:22px;height:22px;fill:currentColor}
.mq{display:flex;gap:56px;mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);overflow:hidden;flex:1}@keyframes mq{to{transform:translateX(calc(-100% - 56px))}}
@media(max-width:1020px){.nav ul{display:none}.nav{grid-template-columns:1fr auto}.feat{grid-template-columns:1fr 1fr}.fc,.fc.w{grid-column:span 1}.plans{grid-template-columns:1fr 1fr}.ba-grid,.how,.faqg{grid-template-columns:1fr;gap:50px}.how-vis{display:none}.hs{opacity:1}.tgrid{grid-template-columns:1fr}.fg{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.wrap{padding:0 20px}section{padding:100px 0}.nav{padding:14px 16px}.nav .login{display:none}.feat,.plans{grid-template-columns:1fr}.plan.hot{order:-1}.fc{min-height:auto}.fc .ic{margin-bottom:30px}.cta{padding:70px 22px}.fg{grid-template-columns:1fr 1fr}.fg>div:first-child{grid-column:1/-1}.box{grid-template-columns:1fr}.box .art{display:none}.box .frm{padding:34px 22px}.hs h3{font-size:34px}.works small{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.split .w>span{transform:none}}