:root{--ink:#0a0a0a;--ink-2:#141414;--paper:#f5f3ee;--line:rgba(255,255,255,0.10);--line-strong:rgba(255,255,255,0.18);--muted:rgba(245,243,238,0.62);--accent:#c8ff3e;--accent-hover:#d8ff66;--pad:max(20px,env(safe-area-inset-left));--sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{background:var(--ink);color:var(--paper);font-family:var(--sans);-webkit-font-smoothing:antialiased}
body{overflow-x:hidden;font-size:16px;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--pad)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--accent);color:var(--ink);padding:8px 12px;border-radius:8px}

/* nav */
.cnav{position:sticky;top:0;z-index:40;background:rgba(10,10,10,0.82);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.cnav .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;gap:16px}
.brand{display:flex;align-items:center;gap:10px}
.brand-mark{width:32px;height:32px;border-radius:8px;background:var(--accent);color:var(--ink);font-family:"Sora","Inter",sans-serif;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;letter-spacing:-0.04em}
.brand-name{font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.cnav-links{display:flex;align-items:center;gap:8px}
.cnav-links a.l{display:none;font-size:14px;color:var(--muted);padding:8px 12px;border-radius:999px}
.cnav-links a.l:hover{color:var(--paper)}
@media (min-width:720px){.cnav-links a.l{display:inline-flex}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:999px;font-size:15px;font-weight:500;min-height:50px;border:1px solid transparent;transition:transform .15s var(--ease),background .2s,border-color .2s;cursor:pointer}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--accent);color:var(--ink)}.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{border-color:var(--line-strong)}.btn-ghost:hover{border-color:var(--paper);background:rgba(255,255,255,.04)}
.btn-sm{padding:9px 16px;min-height:40px;font-size:14px}
.btn-wa{background:#25D366;color:#fff}
.btn svg{width:18px;height:18px}

/* hero */
.chero{padding:48px 0 32px;position:relative;overflow:hidden}
.chero::before{content:"";position:absolute;inset:-20% -10% auto;height:520px;background:radial-gradient(50% 60% at 70% 0%,var(--glow,rgba(200,255,62,.14)),transparent 70%);pointer-events:none}
.crumb{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;gap:8px;align-items:center}
.crumb a:hover{color:var(--paper)}
.ctag{margin-top:28px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.chero h1{margin-top:14px;font-size:clamp(40px,8vw,88px);line-height:1;letter-spacing:-.035em;font-weight:500}
.chero .sub{margin-top:10px;font-size:clamp(18px,2.4vw,24px);color:var(--muted);letter-spacing:-.01em}
.chero .lede{margin-top:22px;font-size:clamp(17px,1.6vw,20px);line-height:1.55;max-width:62ch;color:rgba(245,243,238,.86)}
.cctas{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px}
.facts{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts div{padding:16px 14px 16px 0;border-bottom:1px solid var(--line)}
.facts div:nth-last-child(-n+2){border-bottom:none}
.facts dt{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.facts dd{font-size:15px;font-weight:500}
.facts .live{display:inline-flex;align-items:center;gap:8px}
.facts .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}
.facts .soon::before{background:#ffb35c;box-shadow:0 0 8px #ffb35c}
@media (min-width:820px){.facts{grid-template-columns:repeat(4,1fr)}.facts div{border-bottom:none;padding:20px 20px 20px 0}}

/* gallery */
.gal{padding:24px 0 16px}
.gal-stage{position:relative;border-radius:18px;border:1px solid var(--line);background:radial-gradient(70% 70% at 50% 0%,var(--glow,rgba(200,255,62,.10)),transparent 70%),#0d0d0d;overflow:hidden;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center}
.gal-stage.phones{aspect-ratio:auto;min-height:560px;padding:40px 16px}
.slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:4% 4% 0;opacity:0;transform:translateY(16px) scale(.985);transition:opacity .7s var(--ease),transform .9s var(--ease);pointer-events:none}
.slide.on{opacity:1;transform:none;pointer-events:auto}
.bframe{width:100%;max-width:1100px;border-radius:12px 12px 0 0;overflow:hidden;border:1px solid var(--line-strong);border-bottom:none;box-shadow:0 30px 90px rgba(0,0,0,.6);background:#111;align-self:flex-end}
.bbar{display:flex;align-items:center;gap:10px;padding:9px 12px;background:#1a1a1a;border-bottom:1px solid var(--line)}
.bbar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.16);display:inline-block}
.bbar span{flex:1;margin-left:8px;font-family:var(--mono);font-size:11px;color:var(--muted);background:#0d0d0d;border-radius:6px;padding:5px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bframe img{width:100%;height:auto}
.phones-row{position:relative;display:flex;gap:18px;justify-content:center;align-items:center;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 4px 16px;scrollbar-width:none}
.phones-row::-webkit-scrollbar{display:none}
.pframe{flex:none;width:min(62vw,250px);border-radius:24px;padding:0;background:none;border:none;box-shadow:0 30px 70px rgba(0,0,0,.55);scroll-snap-align:center;transition:transform .6s var(--ease),opacity .6s;opacity:.55;transform:scale(.92)}
.pframe img{border-radius:22px;width:100%;border:1px solid var(--line-strong)}
.pframe.on{opacity:1;transform:scale(1) translateY(-8px)}
.pframe figcaption{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center;padding:12px 4px 4px}
.gal-tabs{margin-top:16px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.gal-tabs::-webkit-scrollbar{display:none}
.gal-tabs button{flex:none;font:inherit;font-size:13px;color:var(--muted);background:transparent;border:1px solid var(--line-strong);border-radius:999px;padding:9px 14px;cursor:pointer;position:relative;overflow:hidden;min-height:40px}
.gal-tabs button:hover{color:var(--paper)}
.gal-tabs button.on{color:var(--ink);background:var(--accent);border-color:var(--accent)}
.gal-tabs button.on::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:var(--p,0%);background:rgba(10,10,10,.45)}

/* sections */
.sec{padding:72px 0;border-top:1px solid var(--line)}
@media (min-width:820px){.sec{padding:110px 0}}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:10px;margin-bottom:18px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent)}
.sec h2{font-size:clamp(28px,4.4vw,48px);line-height:1.08;letter-spacing:-.025em;font-weight:500;max-width:22ch}
.ds{display:grid;grid-template-columns:1fr;gap:20px;margin-top:40px}
@media (min-width:820px){.ds{grid-template-columns:1fr 1fr;gap:24px}}
.ds article{padding:28px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.02)}
.ds article.sol{border-color:rgba(200,255,62,.35);background:linear-gradient(160deg,rgba(200,255,62,.06),transparent 60%)}
.ds .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;display:block}
.ds .sol .k{color:var(--accent)}
.ds p{font-size:17px;line-height:1.6;color:rgba(245,243,238,.86)}
.feat-grid{margin-top:40px;display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media (min-width:640px){.feat-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.feat-grid{grid-template-columns:repeat(4,1fr)}}
.feat{background:var(--ink);padding:26px 22px;display:flex;flex-direction:column;gap:10px;transition:background .25s}
.feat:hover{background:var(--ink-2)}
.feat .n{font-family:var(--mono);font-size:11px;color:var(--accent)}
.feat h3{font-size:18px;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.feat p{font-size:14px;line-height:1.55;color:var(--muted)}
.nums{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media (min-width:820px){.nums{grid-template-columns:repeat(4,1fr)}}
.nums div{background:var(--ink);padding:26px 20px}
.nums b{display:block;font-family:"Sora","Inter",sans-serif;font-size:clamp(30px,4.5vw,48px);font-weight:700;letter-spacing:-.03em;color:var(--accent);line-height:1}
.nums span{display:block;margin-top:10px;font-size:14px;color:var(--muted);line-height:1.4}
.nums-note{margin-top:12px;font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.06em}

/* ai */
.ai-grid{margin-top:40px;display:grid;grid-template-columns:1fr;gap:24px;align-items:start}
@media (min-width:980px){.ai-grid{grid-template-columns:1fr 1.1fr;gap:48px}}
.ai-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.ai-list li{display:flex;gap:14px;font-size:16px;line-height:1.55;color:rgba(245,243,238,.86)}
.ai-list li::before{content:"IA";flex:none;width:28px;height:28px;border-radius:8px;background:rgba(200,255,62,.12);color:var(--accent);font-family:var(--mono);font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-top:-2px}
.chat{border:1px solid var(--line-strong);border-radius:16px;background:#0d0d0d;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.chat-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);background:#121212;font-size:13px;font-weight:500}
.chat-bar span{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);display:flex;gap:6px;align-items:center}
.chat-bar span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}
.chat-body{padding:18px;display:flex;flex-direction:column;gap:12px;min-height:360px}
.msg{max-width:88%;padding:12px 14px;border-radius:14px;font-size:14px;line-height:1.55;opacity:0;transform:translateY(8px);transition:all .45s var(--ease);white-space:pre-line}
.msg.in{opacity:1;transform:none}
.msg.u{align-self:flex-end;background:#1d1d1d;border:1px solid var(--line);border-bottom-right-radius:4px}
.msg.a{align-self:flex-start;background:rgba(200,255,62,.07);border-left:2px solid var(--accent);border-bottom-left-radius:4px}
.msg.sys{align-self:center;font-family:var(--mono);font-size:11px;color:var(--muted);background:none;padding:4px}
.chat-note{padding:0 18px 16px;font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.04em}
.stack{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px}
.stack span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.025)}

/* cta + next */
.ccta{padding:72px 0;border-top:1px solid var(--line);text-align:center;background:radial-gradient(60% 80% at 50% 100%,rgba(200,255,62,.10),transparent 70%)}
.ccta h2{font-size:clamp(28px,5vw,56px);line-height:1.05;letter-spacing:-.03em;font-weight:500;max-width:20ch;margin:0 auto}
.ccta p{margin:16px auto 0;font-size:17px;color:var(--muted);max-width:52ch}
.ccta .cctas{justify-content:center}
.next{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
@media (min-width:720px){.next{grid-template-columns:1fr 1fr}}
.next a{background:var(--ink);padding:28px var(--pad);display:flex;flex-direction:column;gap:6px;transition:background .2s}
.next a:hover{background:var(--ink-2)}
.next small{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.next strong{font-size:22px;font-weight:500;letter-spacing:-.01em}
.next a:last-child{text-align:right;align-items:flex-end}
footer{padding:32px 0 calc(90px + env(safe-area-inset-bottom));font-size:13px;color:var(--muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
footer a:hover{color:var(--paper)}
.wa-float{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));z-index:49;display:inline-flex;align-items:center;gap:10px;height:56px;min-width:56px;padding:0 16px;border-radius:999px;background:#25D366;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.45);transition:transform .2s var(--ease)}
.wa-float svg{width:24px;height:24px;flex:none}
.wa-float span{display:none;font-weight:600;font-size:15px}
.wa-float:hover{transform:translateY(-2px)}
@media (min-width:820px){.wa-float{right:28px;bottom:28px;padding:0 22px 0 18px}.wa-float span{display:inline}}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation:none!important}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}}
.chero .reveal{opacity:1;transform:none}
.phones-row{justify-content:flex-start;padding-left:4px;padding-right:4px}
.phones-row>.pframe:first-child{margin-left:auto}
.phones-row>.pframe:last-child{margin-right:auto}
@media (max-width:640px){.gal-stage.phones{min-height:0;padding:28px 0}.pframe{width:68vw}}
.gal-stage.tablet{aspect-ratio:auto;display:grid;padding:28px 16px}
.gal-stage.tablet .slide{position:relative;inset:auto;grid-area:1/1;padding:0}
.tframe{width:100%;max-width:900px;margin:0 auto;padding:12px;border-radius:30px;background:#1b1b1b;border:1px solid var(--line-strong);box-shadow:0 30px 90px rgba(0,0,0,.6)}
.tframe img{border-radius:18px;width:100%;height:auto}
.tframe.plain{padding:0;background:none;border:none;box-shadow:none}
.tframe.plain img{border-radius:16px}
@media (min-width:820px){.gal-stage.tablet{padding:48px 32px}}
.scale{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media (min-width:820px){.scale{grid-template-columns:repeat(4,1fr)}}
.mods{margin-top:40px;display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:900px){.mods{grid-template-columns:1fr 1fr}}
.mod{border:1px solid var(--line);border-radius:16px;padding:24px;background:rgba(255,255,255,.02)}
.mod h3{font-size:13px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-bottom:14px}
.mod ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.mod li{font-size:15px;line-height:1.5;color:rgba(245,243,238,.86);padding-left:18px;position:relative}
.mod li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.mod li b{color:var(--paper);font-weight:600}
img{height:auto}.pframe img{height:auto;aspect-ratio:auto}
/* ═══ motion layer ═══ */
.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:80;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--sp,0));box-shadow:0 0 12px rgba(200,255,62,.6);pointer-events:none}
.chero .gal{perspective:1600px}
.chero .gal-stage{transform:rotateX(var(--tilt,0deg)) scale(var(--sc,1));transform-origin:50% 0;transition:transform .1s linear;will-change:transform}
.chero h1{background:linear-gradient(100deg,var(--paper) 30%,var(--accent) 50%,var(--paper) 70%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s ease-in-out 1s infinite}
@keyframes shine{0%,60%{background-position:100% 0}100%{background-position:-50% 0}}
.feat-grid .feat,.nums>div,.mods .mod,.ai-list li,.ds article{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .8s var(--ease)}
.feat-grid.in .feat,.nums.in>div,.mods .mod.in,.ai-list.in li,.ds article.in{opacity:1;transform:none}
.feat-grid.in .feat:nth-child(2),.nums.in>div:nth-child(2),.ai-list.in li:nth-child(2){transition-delay:.07s}
.feat-grid.in .feat:nth-child(3),.nums.in>div:nth-child(3),.ai-list.in li:nth-child(3){transition-delay:.14s}
.feat-grid.in .feat:nth-child(4),.nums.in>div:nth-child(4),.ai-list.in li:nth-child(4){transition-delay:.21s}
.feat-grid.in .feat:nth-child(5){transition-delay:.28s}.feat-grid.in .feat:nth-child(6){transition-delay:.35s}.feat-grid.in .feat:nth-child(7){transition-delay:.42s}.feat-grid.in .feat:nth-child(8){transition-delay:.49s}
.spot{position:relative;isolation:isolate}
.spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(200,255,62,.10),transparent 60%)}
.spot:hover::after{opacity:1}
.feat .n{transition:transform .4s var(--ease)}.feat:hover .n{transform:translateX(4px)}
.bframe img,.tframe img{transition:transform 1.2s var(--ease)}
.slide.on .bframe img{animation:kb 9s ease-out both}
@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1)}}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split .w>span{display:inline-block;transform:translateY(110%);transition:transform .9s var(--ease);transition-delay:calc(var(--i)*45ms)}
.split.w-in .w>span{transform:none}
@media (prefers-reduced-motion:reduce){.chero .gal-stage{transform:none}.chero h1{animation:none;color:var(--paper);background:none}.feat-grid .feat,.nums>div,.mods .mod,.ai-list li,.ds article{opacity:1;transform:none}.split .w>span{transform:none}.scroll-progress{display:none}.slide.on .bframe img{animation:none}}