:root{
  --ink:#0e1424; --muted:#5d6782; --line:#e4e8f2; --bg:#ffffff; --soft:#f5f7fc;
  --night:#070b1a; --night2:#0d1430; --nline:rgba(255,255,255,.09); --nmuted:#9aa6c4;
  --b1:#4f8bff; --b2:#6350f7; --b3:#a24dff;
  --grad:linear-gradient(135deg,var(--b1),var(--b2) 55%,var(--b3));
  --ok:#2fd18b; --warn:#ffb547;
  --r:16px;
  --display:"Space Grotesk",Inter,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
code{font-family:var(--mono);font-size:.85em}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;line-height:1.1}
h2{font-size:clamp(30px,4vw,44px);font-weight:700}
h3{font-size:19px;font-weight:600}
.sub{font-size:clamp(17px,1.6vw,20px);color:var(--muted);max-width:640px}
.dark{background:var(--night);color:#fff}
.dark .sub,.dark p{color:var(--nmuted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:15px;padding:12px 20px;border-radius:999px;transition:transform .15s,background .15s,box-shadow .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 24px rgba(99,80,247,.35)}
.btn-primary:hover{box-shadow:0 10px 30px rgba(99,80,247,.5)}
.btn-quiet{color:#fff;border:1px solid rgba(255,255,255,.22)}
.btn-quiet:hover{background:rgba(255,255,255,.08)}
.btn-light{background:#fff;color:var(--b2)}

/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(7,11,26,.82);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--nline);color:#fff}
.top .wrap{display:flex;align-items:center;gap:32px;height:68px}
.lockup{display:flex;align-items:center;gap:10px}
.wordmark{font-family:var(--display);font-weight:700;letter-spacing:.14em;font-size:15px}
.nav{display:flex;gap:28px;margin-right:auto}
.nav a{color:var(--nmuted);font-size:15px;font-weight:500}
.nav a:hover{color:#fff}
.top .actions{display:flex;gap:10px}
.top .btn{padding:9px 16px;font-size:14px}
.menu-btn{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;margin-left:auto}
.menu-btn span{display:block;height:2px;width:22px;background:#fff;border-radius:2px;margin:0 auto;transition:.2s}

/* hero */
.hero{position:relative;overflow:hidden;padding:96px 0 110px}
.hero .glow{position:absolute;inset:-30% -10% auto auto;width:900px;height:900px;background:radial-gradient(closest-side,rgba(99,80,247,.45),rgba(79,139,255,.18) 45%,transparent 70%);pointer-events:none}
.hero .wrap{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(42px,6vw,72px);font-weight:700;margin-bottom:20px}
.hero .sub{margin-bottom:32px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.shot{position:relative}
.frame{border-radius:var(--r);background:var(--night2);border:1px solid var(--nline);box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 0 1px rgba(99,80,247,.15);overflow:hidden}
.lease{position:absolute;left:-28px;bottom:-34px;width:260px;padding:16px 18px;border-radius:14px;background:rgba(13,20,48,.92);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);box-shadow:0 20px 50px rgba(0,0,0,.5);color:#fff}
.lease-top{display:flex;justify-content:space-between;font-size:12px;color:var(--nmuted)}
.lease-top code{color:#fff}
.lease-time{display:flex;align-items:baseline;gap:10px;margin:6px 0 10px}
.lease-time span{font-family:var(--mono);font-size:30px;font-weight:500}
.lease-time small{font-size:12px;color:var(--nmuted)}
.lease-bar{height:6px;border-radius:6px;background:rgba(255,255,255,.1);overflow:hidden}
.lease-bar i{display:block;height:100%;width:100%;background:var(--grad);transition:width 1s linear}

/* console mock */
.console{font-size:12px;color:#d6dcef}
.c-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--nline);background:rgba(255,255,255,.03)}
.c-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.c-bar span{margin-left:10px;color:var(--nmuted);font-size:12px}
.c-body{display:grid;grid-template-columns:120px 1fr}
.c-side{display:flex;flex-direction:column;gap:2px;padding:12px 10px;border-right:1px solid var(--nline)}
.c-side b,.c-side span{padding:7px 10px;border-radius:8px;color:var(--nmuted);font-weight:500}
.c-side b{background:rgba(99,80,247,.22);color:#fff}
.c-table{width:100%;border-collapse:collapse}
.c-table th{text-align:left;font-weight:500;color:var(--nmuted);padding:12px;border-bottom:1px solid var(--nline);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.c-table td{padding:11px 12px;border-bottom:1px solid var(--nline);font-family:var(--mono);font-size:11.5px;white-space:nowrap}
.c-table td:first-child{color:#fff}
.c-table em{font-style:normal;font-family:Inter,sans-serif;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px}
.c-table em.ok{color:var(--ok);background:rgba(47,209,139,.12)}
.c-table em.warn{color:var(--warn);background:rgba(255,181,71,.12)}

/* runs with */
.runs{background:var(--night);border-top:1px solid var(--nline);padding:30px 0 34px;color:var(--nmuted)}
.runs .wrap{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.runs p{font-size:13px;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap}
.runs ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px}
.runs li{font-family:var(--display);font-weight:600;font-size:16px;color:#c9d1e8}

/* sections */
.section{padding:110px 0}
.section-head{margin-bottom:48px;max-width:760px}
.section-head .sub{margin-top:14px}
.center{text-align:center}
.center .sub{margin:28px auto 0}
.problem{background:linear-gradient(180deg,var(--night),var(--night2));padding:120px 0}
.lines{display:flex;flex-direction:column;gap:6px;font-family:var(--display);font-size:clamp(34px,5.5vw,64px);font-weight:700;letter-spacing:-.03em;line-height:1.08;color:rgba(255,255,255,.35)}
.lines b{color:#fff;font-weight:700}

/* bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-flow:dense;gap:20px}
.tile{display:flex;flex-direction:column;justify-content:space-between;gap:26px;padding:30px;border-radius:20px;background:var(--soft);border:1px solid var(--line);transition:transform .2s,box-shadow .2s;min-height:300px}
.tile:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(14,20,36,.08)}
.tile p{color:var(--muted);margin-top:8px}
.tile.dark{background:var(--night2);border-color:var(--night2)}
.tile.wide{grid-column:span 2}
.vis{border-radius:12px}
.vis-lease{display:flex;flex-direction:column;gap:10px}
.vis-lease .row{display:grid;grid-template-columns:1fr auto 90px;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-family:var(--mono);font-size:12px}
.vis-lease .row.off{opacity:.5}
.vis-lease .row.off span:nth-child(2){color:#c2405a}
.bar{height:6px;border-radius:6px;background:var(--line);overflow:hidden;display:block}
.bar i{display:block;height:100%;background:var(--grad)}
.vis-chain{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.vis-chain .node{display:flex;flex-direction:column;padding:10px 14px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid var(--nline);font-family:var(--mono);font-size:12.5px;color:#fff}
.vis-chain .node small{font-family:Inter,sans-serif;color:var(--nmuted);font-size:11px}
.vis-chain .node.ok{border-color:rgba(47,209,139,.45);background:rgba(47,209,139,.08)}
.vis-chain .arrow{color:var(--nmuted)}
.vis-shot{overflow:hidden;border:1px solid var(--line);background:var(--night2);box-shadow:0 18px 40px rgba(14,20,36,.12)}
.vis-session{display:flex;flex-direction:column;gap:10px}
.vis-session .track{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;background:#fff;border:1px solid var(--line);overflow:hidden;font-family:var(--mono);font-size:12px}
.vis-session .track i{position:absolute;top:0;bottom:0;background:linear-gradient(90deg,rgba(79,139,255,.14),rgba(162,77,255,.14))}
.vis-session span,.vis-session em{position:relative;font-style:normal}
.vis-session em{color:var(--muted)}

/* covers */
.brandband{background:var(--grad);color:#fff}
.cover{padding:100px 0}
.cover h2{margin-bottom:40px}
.cover dl{display:grid;gap:22px}
.cover dl>div{display:grid;grid-template-columns:160px 1fr;gap:20px;align-items:start;padding-top:22px;border-top:1px solid rgba(255,255,255,.25)}
.cover dt{font-family:var(--display);font-weight:600;font-size:18px}
.cover dd{display:flex;flex-wrap:wrap;gap:10px}
.cover dd span{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);font-size:14px;font-weight:500}

/* numbers */
.nums{padding:70px 0;border-bottom:1px solid var(--line)}
.nums ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.nums b{display:block;font-family:var(--display);font-size:64px;line-height:1;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:10px}
.nums span{color:var(--muted)}

/* steps */
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.step{padding:30px;border-radius:20px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;gap:10px}
.step .n{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;font-weight:700;font-family:var(--display)}
.step p{color:var(--muted);flex:1}
.step code{display:block;padding:10px 12px;border-radius:10px;background:var(--night2);color:#cfd7f0;overflow-x:auto}

/* production */
.prod ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.prod li{padding:26px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--nline)}
.prod li h3{margin-bottom:8px}
.prod li p{font-size:15px}

/* faq */
.faq .list{max-width:860px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;font-family:var(--display);font-weight:600;font-size:19px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:4px;top:18px;font-size:26px;font-weight:400;color:var(--b2);transition:transform .2s}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq details p{color:var(--muted);padding:0 0 22px;max-width:760px}

/* band */
.band{padding:90px 0}
.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.band .sub{color:rgba(255,255,255,.85);margin-top:12px}

/* footer */
.foot{background:var(--night);color:var(--nmuted);padding:70px 0 34px;font-size:14px}
.foot .cols{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:32px}
.foot .about{display:flex;flex-direction:column;gap:16px;align-items:flex-start;color:#fff}
.foot .about p{color:var(--nmuted)}
.foot h3{font-family:Inter,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:#fff;margin-bottom:14px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.foot a:hover{color:#fff}
.legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:56px;padding-top:24px;border-top:1px solid var(--nline);font-size:13px}

/* responsive */
@media (max-width:1000px){
  .hero .wrap{grid-template-columns:1fr}
  .lease{left:12px;bottom:-30px}
  .bento{grid-template-columns:1fr 1fr}
  .tile.wide{grid-column:span 2}
  .prod ul,.nums ul{grid-template-columns:1fr 1fr}
  .foot .cols{grid-template-columns:1fr 1fr}
  .foot .about{grid-column:span 2}
}
@media (max-width:820px){
  .nav,.top .actions{display:none}
  .menu-btn{display:flex}
  .top.open .nav{display:flex;position:absolute;top:68px;left:0;right:0;flex-direction:column;gap:0;background:var(--night);border-bottom:1px solid var(--nline);padding:8px 24px 20px}
  .top.open .nav a{padding:12px 0;border-bottom:1px solid var(--nline);font-size:17px}
  .top.open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .top.open .menu-btn span:nth-child(2){opacity:0}
  .top.open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .steps{grid-template-columns:1fr}
  .cover dl>div{grid-template-columns:1fr;gap:12px}
}
@media (max-width:620px){
  .section{padding:76px 0}
  .hero{padding:64px 0 90px}
  .bento,.prod ul{grid-template-columns:1fr}
  .tile.wide{grid-column:auto}
  .nums b{font-size:48px}
  .c-body{grid-template-columns:1fr}
  .c-side{display:none}
  .c-table th:nth-child(3),.c-table td:nth-child(3),.c-table th:nth-child(4),.c-table td:nth-child(4){display:none}
  .vis-lease .row{grid-template-columns:1fr auto}
  .vis-lease .row .bar{grid-column:span 2}
  .foot .cols{grid-template-columns:1fr}
  .foot .about{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}