*,*::before,*::after{box-sizing:border-box}
:root{
  --accent:#c9972b;--accent-rgb:201,151,43;
  --accent-dim:rgba(201,151,43,.1);
  --bg:#0a0a0b;--panel:#101013;--line:#1e1e22;
  --t1:#e8e8ea;--t2:#9a9aa3;--t3:#5c5c64;
  --r:6px;--max:1060px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--t1);
  font-family:var(--font);font-size:15px;line-height:1.6;
  background:
    radial-gradient(ellipse 60% 42% at 50% 0%,rgba(201,151,43,.07),transparent 70%),
    var(--bg);
}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:radial-gradient(ellipse 70% 60% at 50% 18%,#000 15%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 18%,#000 15%,transparent 78%);
}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}
main,.nav,.footer{position:relative;z-index:1}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
main section.wrap{padding-top:60px}
.mono-label{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  color:var(--t3);margin:72px 0 10px;text-transform:uppercase;
}
h1{font-size:clamp(1.9rem,3.6vw,2.7rem);line-height:1.15;margin:0 0 14px;letter-spacing:-.015em;font-weight:700}
h2{font-size:1.45rem;margin:0 0 8px;letter-spacing:-.01em;font-weight:700}
h3{font-size:.98rem;margin:0 0 6px}
.sub{color:var(--t2);max-width:640px;margin:0 0 24px}
.lead{color:var(--t2);max-width:560px;margin:0}
/* NAV */
.nav{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--line);z-index:20}
.nav-inner{max-width:var(--max);margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--t1);font-weight:700}
.brand-mark{width:28px;height:28px;border-radius:5px;display:grid;place-items:center;background:var(--t1);color:#000;font-size:12px;font-weight:700}
.nav-links{display:flex;gap:20px;margin-left:8px}
.nav-links a{color:var(--t2);text-decoration:none;font-size:.9rem}
.nav-links a:hover{color:var(--t1)}
.nav-cta{margin-left:auto}
.nav-burger{display:none;margin-left:auto;background:transparent;border:1px solid var(--line);color:var(--t1);border-radius:5px;padding:7px 12px}
/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:5px;
  padding:9px 18px;font-weight:600;font-size:.9rem;text-decoration:none;cursor:pointer;border:1px solid var(--line);transition:border-color .15s}
.btn-lg{padding:12px 20px}
.btn-primary{background:var(--t1);color:#000;border-color:var(--t1)}
.btn-primary:hover{background:#fff}
.btn-secondary{background:transparent;color:var(--t1)}
.btn-secondary:hover{border-color:var(--t3)}
/* HERO */
.hero{border-bottom:1px solid var(--line)}
.hero-inner{max-width:var(--max);margin:0 auto;padding:64px 24px 56px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 28px}
.hero-specs{display:grid;grid-template-columns:repeat(4,auto);gap:24px;justify-content:start;border-top:1px solid var(--line);padding-top:20px}
.spec-num{display:block;font-family:var(--mono);font-size:1.1rem;color:var(--t1)}
.spec-lab{font-size:.78rem;color:var(--t3)}
.hero-visual{display:flex;flex-direction:column;gap:10px}
.app-mock{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel)}
.mock-titlebar{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);font-size:.82rem;font-weight:600}
.mock-ver{font-family:var(--mono);font-size:11px;color:var(--t3);font-weight:400}
.mock-body{display:grid;grid-template-columns:160px 1fr;min-height:280px}
.mock-side{border-right:1px solid var(--line);padding:12px}
.mock-nav{padding:7px 10px;border-radius:4px;color:var(--t2);font-size:.8rem;margin-bottom:2px}
.mock-nav.active{background:var(--accent-dim);color:var(--t1)}
.mock-content{padding:12px;display:flex;flex-direction:column;gap:8px}
.mock-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:5px;padding:9px 10px}
.mock-badge{width:32px;height:32px;border-radius:4px;background:var(--accent-dim);color:var(--accent);display:grid;place-items:center;font-size:10px;font-weight:700;font-family:var(--mono)}
.mock-name{font-size:.82rem}
.mock-power{width:20px;height:20px;border-radius:50%;border:1px solid var(--line);margin-left:auto}
.mock-power.on{background:var(--accent);border-color:var(--accent)}
.mock-foot{display:flex;gap:8px;flex-wrap:wrap}
.mock-foot span{font-family:var(--mono);font-size:11px;color:var(--t3);border:1px solid var(--line);border-radius:4px;padding:3px 8px}
.mock-cap{font-family:var(--mono);font-size:11px;color:var(--t3);margin:0}
/* MODULES */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 16px}
.tab{border:1px solid var(--line);background:transparent;color:var(--t2);border-radius:5px;padding:7px 14px;cursor:pointer;font-size:.85rem;font-family:var(--mono)}
.tab.active{background:var(--t1);color:#000;border-color:var(--t1)}
.mod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mod{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:15px}
.mod-top{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.abbr{width:34px;height:34px;border-radius:4px;background:var(--accent-dim);color:var(--accent);display:grid;place-items:center;font-weight:700;font-size:11px;font-family:var(--mono)}
.mod strong{font-size:.92rem;display:block}
.mod small{color:var(--t3);font-family:var(--mono);font-size:11px}
.mod p{color:var(--t2);font-size:.85rem;margin:8px 0 10px;min-height:42px}
.tags{display:flex;gap:6px;flex-wrap:wrap}
.tags span{font-family:var(--mono);font-size:11px;border:1px solid var(--line);border-radius:4px;padding:2px 7px;color:var(--t3)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin-left:auto}
/* DETAILS */
.detail-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.detail{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.detail p{margin:0;color:var(--t2);font-size:.88rem}
/* THEMES */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.theme-card{background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:10px;cursor:pointer;text-align:left;color:var(--t1)}
.theme-card:hover{border-color:var(--t3)}
.theme-card.active{border-color:var(--accent)}
.swatches{display:flex;gap:4px;margin-bottom:8px}
.swatches i{flex:1;height:12px;border-radius:2px;display:block}
.theme-card span{font-family:var(--mono);font-size:11px}
/* STEPS */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.step{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;gap:12px}
.step .n{font-family:var(--mono);color:var(--t3);font-size:.85rem}
.step p{margin:0;color:var(--t2);font-size:.86rem}
/* DOWNLOAD */
.dl-box{margin:72px 0;border:1px solid var(--line);border-radius:8px;padding:32px;display:flex;justify-content:space-between;gap:24px;align-items:center;background:var(--panel)}
.dl-box .mono-label{margin-top:0}
.dl-actions{text-align:right;flex:none}
.req{font-family:var(--mono);font-size:11px;color:var(--t3);margin:10px 0 0}
/* FOOTER */
.footer{border-top:1px solid var(--line)}
.foot-inner{display:flex;justify-content:space-between;gap:12px;padding:16px 24px;color:var(--t3);font-family:var(--mono);font-size:11px;flex-wrap:wrap}
/* BENTO GRID */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.b-span2{grid-column:span 2}
.bento-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:18px;min-height:250px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px}
.bento-card h3{margin:10px 0 2px}
.bento-card p{margin:0;color:var(--t2);font-size:.86rem}
.flow{display:flex;align-items:stretch;gap:0;margin-bottom:6px}
.flow-node{flex:1;border:1px solid var(--line);border-radius:5px;padding:10px;display:flex;gap:10px;align-items:center;background:var(--bg)}
.flow-node strong{display:block;font-size:.82rem}
.flow-node small{color:var(--t3);font-size:.72rem}
.flow-node .mono{font-family:var(--mono);font-size:10px}
.flow-key{font-family:var(--mono);font-size:11px;font-weight:700;background:var(--accent-dim);color:var(--accent);border-radius:4px;padding:4px 8px;flex:none}
.flow-link{width:26px;flex:none;position:relative}
.flow-link i{position:absolute;left:50%;top:8px;bottom:8px;width:1px;background:var(--line);display:block}
.flow-link i::after{content:"";position:absolute;left:-2px;top:0;width:5px;height:5px;border-radius:50%;background:var(--t3)}
.bento-card:hover .flow-link i{background:var(--accent)}
.bento-card:hover .flow-link i::after{background:var(--accent)}
.status-rows{display:flex;flex-direction:column;gap:6px;margin-bottom:6px}
.status-row{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:5px;padding:8px 10px;font-family:var(--mono);font-size:11px;color:var(--t2)}
.pill{border:1px solid var(--line);border-radius:4px;padding:2px 8px;color:var(--t3);font-size:10px}
.pill.on{color:var(--accent);border-color:var(--accent)}
.bars{display:flex;align-items:flex-end;gap:5px;height:110px;border:1px solid var(--line);border-radius:5px;padding:10px;background:var(--bg);margin-bottom:6px}
.bars i{flex:1;background:var(--t3);border-radius:2px;min-height:8px}
.bento-card:hover .bars i{background:var(--accent)}
.bars-cap{font-size:10px;color:var(--t3);margin-bottom:2px}
.prof-rows{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.prof-row{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:5px;padding:8px 10px;font-size:.82rem}
.prof-row.active{border-color:var(--accent)}
.prof-row .mono{font-family:var(--mono);font-size:10px;color:var(--t3)}
.theme-dots{display:flex;gap:6px;margin-bottom:2px}
.theme-dots i{width:22px;height:22px;border-radius:4px;display:block;border:1px solid var(--line)}
/* REVEAL */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease}
.reveal.in{opacity:1;transform:none}
/* DEMO CONTROLS */
.demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.demo-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:18px;position:relative}
.demo-card h3{margin:12px 0 2px}
.demo-card p{margin:0;color:var(--t2);font-size:.85rem}
.demo-stage{border:1px solid var(--line);border-radius:5px;background:var(--bg);min-height:96px;display:flex;align-items:center;justify-content:center;padding:16px}
.bind-pill{font-family:var(--mono);font-size:.85rem;background:var(--panel);border:1px solid var(--line);color:var(--t1);border-radius:5px;padding:8px 22px;cursor:pointer}
.bind-pill:hover{border-color:var(--accent)}
.bind-pill.listening{border-color:var(--accent);color:var(--accent)}
.dslider{display:flex;align-items:center;gap:12px;width:100%}
.dslider-track{position:relative;flex:1;height:4px;background:var(--line);border-radius:2px;cursor:pointer;touch-action:none}
.dslider-fill{position:absolute;left:0;top:0;bottom:0;background:var(--accent);border-radius:2px;width:55%}
.dslider-thumb{position:absolute;top:50%;left:55%;width:14px;height:14px;border-radius:50%;background:#fff;transform:translate(-50%,-50%)}
.dslider-val{font-family:var(--mono);font-size:.85rem;min-width:24px;text-align:right}
.demo-row{width:100%}
.demo-row .mock-power{cursor:pointer}
/* DETAIL VISUALS */
.keys{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.keys span{font-family:var(--mono);font-size:11px;border:1px solid var(--line);border-radius:4px;padding:3px 8px;color:var(--t2)}
.bars.sm{height:64px;margin-bottom:12px}
.sysline{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--t2);border:1px solid var(--line);border-radius:5px;padding:10px;background:var(--bg);margin-bottom:12px}
.livedot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;flex:none}
.detail{position:relative}
.detail::before,.demo-card::before{content:"";position:absolute;top:-1px;left:-1px;width:10px;height:10px;border-top:1px solid var(--t3);border-left:1px solid var(--t3)}
.detail::after,.demo-card::after{content:"";position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-bottom:1px solid var(--t3);border-right:1px solid var(--t3)}
/* FOOTER */
.foot-grid{display:grid;grid-template-columns:1fr;gap:24px;padding:40px 0 24px}
.foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:720px}
.foot-col a,.foot-col span{display:block;color:var(--t2);font-size:.85rem;text-decoration:none;margin-bottom:8px}
.foot-col a:hover{color:var(--t1)}
.foot-title{font-family:var(--mono);font-size:11px;color:var(--accent);margin:0 0 12px}
.foot-strip{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;font-family:var(--mono);font-size:11px;color:var(--t3)}
.strip-left{display:flex;align-items:center;gap:8px}
/* LAZY SECTIONS (load on scroll, 3D rise) */
.js .lazy-sec{opacity:0;transform:perspective(900px) translateY(36px) rotateX(6deg);transition:opacity .6s ease,transform .6s ease}
.js .lazy-sec.in{opacity:1;transform:none}
.loading{font-family:var(--mono);font-size:11px;color:var(--t3);grid-column:1/-1}
/* HERO 3D ON SCROLL */
.hero-visual{perspective:1200px}
.app-mock{will-change:transform}
/* FEATURE GRID */
.gm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.gm-wide{grid-column:span 2}
.gm-card{background:#141417;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:22px;min-height:320px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 1px 2px rgba(0,0,0,.5)}
.gm-card h3{margin:10px 0 4px;font-size:1.25rem;font-weight:600}
.gm-card p{margin:0;color:var(--t2);font-size:.9rem;max-width:32rem}
.gm-flowbox{background:rgba(10,10,12,.9);border:1px solid rgba(255,255,255,.08);border-bottom:0;border-radius:0 0 14px 14px;padding:16px;max-width:24rem;width:100%;margin:0 auto 26px}
.gm-node{display:flex;align-items:center;gap:12px;background:#101013;border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 12px;box-shadow:0 1px 2px rgba(0,0,0,.4)}
.gm-node strong{display:block;font-size:.75rem}
.gm-node small{display:block;color:var(--t2);font-size:.72rem}
.gm-node.dim{opacity:.5;transform:scale(.98);transition:opacity .4s ease,transform .4s ease}
.gm-ico{width:32px;height:32px;flex:none;border-radius:8px;display:grid;place-items:center}
.gm-ico svg{width:16px;height:16px}
.gm-ico.blue{background:rgba(59,130,246,.15);color:#60a5fa}
.gm-ico.purple{background:rgba(168,85,247,.15);color:#c084fc}
.gm-ico.green{background:rgba(16,185,129,.15);color:#34d399}
.gm-conn{position:relative;width:1px;height:24px;margin:0 auto;background:rgba(255,255,255,.12)}
.gm-conn i{position:absolute;top:0;left:0;width:100%;height:0;display:block}
.gm-conn.c-blue i{background:#3b82f6}
.gm-conn.c-purple i{background:#a855f7}
.gm-card:hover .gm-node.dim{opacity:1;transform:scale(1)}
.gm-card:hover .gm-node.d1{transition-delay:.4s}
.gm-card:hover .gm-node.d2{transition-delay:1s}
.gm-card:hover .gm-conn.c-blue i{height:100%;transition:height .3s linear .1s}
.gm-card:hover .gm-conn.c-purple i{height:100%;transition:height .3s linear .7s}
.gm-bonus{overflow:hidden;height:0;opacity:0;display:flex;align-items:center;justify-content:space-between;background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.2);border-radius:8px;padding:0 12px;transition:height .4s ease,opacity .4s ease,margin .4s ease}
.gm-card:hover .gm-bonus{height:36px;opacity:1;margin-top:8px;padding:0 12px;transition-delay:1.3s}
.gm-ok{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:600;letter-spacing:.06em;color:#34d399}
.gm-ok svg{width:14px;height:14px}
.gm-ms{font-size:9px;font-weight:700;color:#34d399;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);border-radius:4px;padding:2px 8px}
.gm-shield{position:relative;flex:1;min-height:190px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:12px}
.gm-gridbg{position:absolute;inset:0;background-image:linear-gradient(to right,rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.06) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse 60% 60% at center,#000 30%,transparent 100%)}
.gm-beam{position:absolute;background:var(--accent);opacity:0}
.gm-beam.hb1,.gm-beam.hb2{left:0;right:0;top:50%;height:1px}
.gm-beam.vb1,.gm-beam.vb2{top:0;bottom:0;left:50%;width:1px}
.gm-card:hover .gm-beam{opacity:1}
.gm-card:hover .hb1{animation:beamx 2s linear infinite}
.gm-card:hover .hb2{animation:beamx 2.5s linear .5s infinite}
.gm-card:hover .vb1{animation:beamy 2.2s linear .2s infinite}
.gm-card:hover .vb2{animation:beamy 1.8s linear .8s infinite}
@keyframes beamx{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes beamy{from{transform:translateY(-100%)}to{transform:translateY(100%)}}
.gm-stat{display:flex;flex-direction:column;margin-bottom:20px}
.gm-stat span{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--t2)}
.gm-stat strong{font-size:1.6rem;font-variant-numeric:tabular-nums}
.gm-stat small{font-size:.85rem;font-weight:500;color:var(--t2)}
.gm-chart{display:flex;align-items:flex-end;gap:6px;height:120px;overflow:hidden;margin-bottom:8px}
.gm-chart i{flex:1;background:var(--accent);opacity:.75;border-radius:2px 2px 0 0;min-height:10px}
.gm-card:hover .gm-chart i{animation:barbounce 2s ease-in-out infinite}
.gm-card:hover .gm-chart i:nth-child(2n){animation-delay:.15s}
.gm-card:hover .gm-chart i:nth-child(3n){animation-delay:.3s}
@keyframes barbounce{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.65)}}
.gm-svcs{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.gm-svc span{font-size:10px;font-weight:600;color:var(--t1)}
.gm-svc span b{color:var(--accent);font-weight:700}
.gm-keycap{position:relative;font-family:var(--mono);font-size:1.6rem;font-weight:700;color:var(--t1);background:#101013;border:1px solid rgba(255,255,255,.16);border-bottom-width:3px;border-radius:10px;padding:18px 34px;filter:drop-shadow(0 12px 24px rgba(201,151,43,.25))}
.gm-bgs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.gm-bgs span{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:10px;color:var(--t3)}
.gm-bgs i{height:72px;border-radius:6px;border:1px solid rgba(255,255,255,.12);display:block}
.bg-glow{background:radial-gradient(circle at 50% 40%,rgba(201,151,43,.5),transparent 70%),#101013}
.bg-solid{background:#1c1c22}
.bg-grad{background:linear-gradient(135deg,#c9972b,#6d28d9)}
.bg-img{background:linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)),repeating-linear-gradient(45deg,#232329 0 8px,#1a1a1f 8px 16px)}
.gm-ticks{display:flex;gap:3px;margin-top:6px}
.gm-ticks i{flex:1;height:8px;border-radius:1px;background:var(--accent);opacity:.2}
.gm-card:hover .gm-ticks i{animation:tickblink .4s ease forwards}
.gm-card:hover .gm-ticks i:nth-child(2){animation-delay:.03s}
.gm-card:hover .gm-ticks i:nth-child(3){animation-delay:.06s}
.gm-card:hover .gm-ticks i:nth-child(4){animation-delay:.09s}
.gm-card:hover .gm-ticks i:nth-child(5){animation-delay:.12s}
.gm-card:hover .gm-ticks i:nth-child(6){animation-delay:.15s}
.gm-card:hover .gm-ticks i:nth-child(7){animation-delay:.18s}
.gm-card:hover .gm-ticks i:nth-child(8){animation-delay:.21s}
.gm-card:hover .gm-ticks i:nth-child(9){animation-delay:.24s}
.gm-card:hover .gm-ticks i:nth-child(10){animation-delay:.27s}
.gm-card:hover .gm-ticks i:nth-child(11){animation-delay:.3s}
.gm-card:hover .gm-ticks i:nth-child(12){animation-delay:.33s}
.gm-card:hover .gm-ticks i:nth-child(13){animation-delay:.36s}
.gm-card:hover .gm-ticks i:nth-child(14){animation-delay:.39s}
@keyframes tickblink{to{opacity:.9}}
.gm-bellwrap{position:relative;display:flex;justify-content:center;padding:28px 0 40px}
.gm-bell{position:relative;width:48px;height:48px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.04);display:grid;place-items:center;color:var(--t1)}
.gm-bell svg{width:20px;height:20px}
.gm-ping{position:absolute;top:10px;right:10px;width:8px;height:8px;border-radius:50%;background:var(--accent);transform:scale(0)}
.gm-card:hover .gm-bell{animation:belllift .4s ease forwards}
.gm-card:hover .gm-bell svg{animation:bellring .5s ease .1s}
.gm-card:hover .gm-ping{transform:scale(1)}
@keyframes belllift{to{transform:translateY(-10px)}}
@keyframes bellring{0%,100%{transform:rotate(0)}20%{transform:rotate(-15deg)}40%{transform:rotate(15deg)}60%{transform:rotate(-15deg)}80%{transform:rotate(15deg)}}
.gm-toast{position:absolute;top:82px;left:50%;transform:translate(-50%,-20px) scale(.95);opacity:0;display:flex;align-items:center;gap:10px;width:220px;background:rgba(16,16,20,.85);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:10px 12px;backdrop-filter:blur(8px)}
.gm-toast i{width:8px;height:8px;flex:none;border-radius:50%;background:var(--accent)}
.gm-toast strong{display:block;font-size:11px}
.gm-toast small{display:block;color:var(--t2);font-size:10px}
.gm-card:hover .gm-toast{opacity:1;transform:translate(-50%,0) scale(1);transition:all .4s ease .2s}
@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;padding:40px 24px}
  .mod-grid,.detail-list,.steps,.bento,.demo-grid,.gm-grid{grid-template-columns:1fr}
  .gm-bgs{grid-template-columns:repeat(2,1fr)}
  .gm-wide{grid-column:span 1}
  .foot-grid{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:repeat(2,1fr)}
  .b-span2{grid-column:span 1}
  .dl-box{flex-direction:column;align-items:stretch}
  .dl-actions{text-align:left}
  .nav-links,.nav-cta{display:none}
  .nav-links.open{display:flex;position:absolute;top:55px;left:12px;right:12px;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:12px;flex-direction:column}
  .nav-burger{display:block}
  .hero-specs{grid-template-columns:repeat(2,1fr)}
  .mock-body{grid-template-columns:130px 1fr}
}