/* COMO — dark, modern, gaming-editorial */
:root{
  --bg:#050505;
  --bg-1:#0b0b0d;
  --bg-2:#101013;
  --surface:#141418;
  --line:rgba(255,255,255,0.07);
  --line-2:rgba(255,255,255,0.14);
  --text:#f5f5f4;
  --text-dim:#a1a1aa;
  --text-mute:#71717a;
  --gold:#EEC13C;
  --gold-soft:rgba(238,193,60,0.12);
  --gold-line:rgba(238,193,60,0.35);
  --red:#f87171;
  --green:#86efac;
  --r-sm:6px;
  --r-md:12px;
  --r-lg:18px;
  --maxw:1320px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Space Grotesk", system-ui, sans-serif;
  font-feature-settings:"ss01","ss02","cv01";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

.mono{font-family:"JetBrains Mono", ui-monospace, monospace; font-feature-settings:"zero","ss02"; letter-spacing:0.02em}
.eyebrow{font-family:"JetBrains Mono", ui-monospace, monospace; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-mute)}
.gold{color:var(--gold)}
.dim{color:var(--text-dim)}
.mute{color:var(--text-mute)}

.container{max-width:var(--maxw); margin:0 auto; padding:0 32px}
.section{padding:120px 0; position:relative}
.section + .section{border-top:1px solid var(--line)}

.rule{height:1px; background:var(--line); width:100%}
.rule-gold{height:1px; background:linear-gradient(90deg, transparent, var(--gold-line), transparent)}

/* --------- NAV --------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  background:rgba(5,5,5,0.55);
  border-bottom:1px solid var(--line);
}
.nav-inner{display:flex; align-items:center; gap:32px; height:64px}
.brand{display:flex; align-items:center; gap:10px; font-weight:600; letter-spacing:0.04em; font-size:18px}
.brand-mark{height:30px; width:auto; display:block}
.brand-mark-lg{height:36px; width:auto; display:block}
.nav-links{display:flex; gap:28px; margin-left:24px}
.nav-links a{font-size:14px; color:var(--text-dim)}
.nav-links a:hover{color:var(--text)}
.nav-cta{margin-left:auto; display:flex; gap:10px}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  height:40px; padding:0 16px;
  border-radius:999px;
  font-weight:500; font-size:14px;
  transition:transform .15s ease, background .2s ease, border-color .2s ease;
}
.btn-primary{background:var(--gold); color:#1a1500; border:1px solid var(--gold)}
.btn-primary:hover{transform:translateY(-1px); background:#fbcf4f}
.btn-ghost{border:1px solid var(--line-2); color:var(--text)}
.btn-ghost:hover{border-color:var(--text-dim)}
.btn-lg{height:52px; padding:0 22px; font-size:15px; border-radius:999px}

/* --------- HERO --------- */
.hero{padding:160px 0 80px; position:relative; overflow:hidden}
.hero-grid{display:grid; grid-template-columns: 1.05fr 0.95fr; gap:64px; align-items:center}
.hero h1{
  font-size:clamp(56px, 8.4vw, 124px);
  line-height:0.92; letter-spacing:-0.035em;
  font-weight:600;
  margin:24px 0 28px;
}
.hero h1 .accent{
  color:var(--gold);
  font-style:italic;
  font-weight:500;
}
.hero h1 .strike{position:relative; white-space:nowrap}
.hero-sub{font-size:19px; line-height:1.55; color:var(--text-dim); max-width:560px; margin-bottom:36px}
.hero-actions{display:flex; gap:12px; align-items:center; flex-wrap:wrap}
.avail{display:flex; align-items:center; gap:14px; margin-top:36px; padding-top:24px; border-top:1px solid var(--line); max-width:560px}
.live-dot{width:8px; height:8px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,0.15); animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(34,197,94,0.15)} 50%{box-shadow:0 0 0 6px rgba(34,197,94,0.05)}}

/* hero HUD demo */
.hud{
  position:relative;
  background:linear-gradient(180deg, #0d0d10, #08080a);
  border:1px solid var(--line);
  border-radius:24px;
  padding:24px;
  box-shadow: 0 30px 80px -30px rgba(0,0,0,0.8), 0 0 0 1px rgba(255,255,255,0.02) inset;
}
.hud::before{
  content:""; position:absolute; inset:-1px; border-radius:25px; padding:1px;
  background:linear-gradient(180deg, rgba(238,193,60,0.5), transparent 40%, transparent 80%, rgba(238,193,60,0.2));
  -webkit-mask:linear-gradient(#000,#000) content-box, linear-gradient(#000,#000);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
}
.hud-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px}
.hud-pill{display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,0.04); border:1px solid var(--line); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-dim); font-family:"JetBrains Mono", monospace}
.hud-rec{display:flex; align-items:center; gap:6px; font-size:11px; letter-spacing:0.14em; color:#ef4444; font-family:"JetBrains Mono", monospace}
.hud-rec .blip{width:6px; height:6px; border-radius:50%; background:#ef4444; animation:pulse-red 1s infinite}
@keyframes pulse-red{50%{opacity:0.3}}

.hud-vs{display:grid; grid-template-columns:1fr auto 1fr; gap:16px; align-items:stretch}
.player{
  background:#0a0a0c;
  border:1px solid var(--line);
  border-radius:14px;
  padding:18px;
  position:relative;
}
.player.you{border-color:rgba(238,193,60,0.45)}
.player-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
.player-name{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.16em; color:var(--text-dim)}
.you .player-name{color:var(--gold)}
.player-tag{font-family:"JetBrains Mono", monospace; font-size:10px; letter-spacing:0.12em; color:var(--text-mute)}
.player-count{font-family:"Space Grotesk", sans-serif; font-size:76px; line-height:1; font-weight:600; letter-spacing:-0.04em; margin:6px 0 8px}
.player.you .player-count{color:var(--gold)}
.player-bar{height:4px; background:rgba(255,255,255,0.06); border-radius:999px; overflow:hidden}
.player-bar > i{display:block; height:100%; background:var(--gold); border-radius:999px}
.player.ai .player-bar > i{background:#f4f4f5}

.vs-col{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px}
.vs-badge{
  width:46px; height:46px; border-radius:50%;
  border:1px solid var(--gold-line); color:var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family:"JetBrains Mono", monospace; font-weight:600; font-size:14px;
  background:radial-gradient(circle, rgba(238,193,60,0.12), transparent 70%);
}
.vs-gap{font-family:"JetBrains Mono", monospace; font-size:10px; letter-spacing:0.12em; color:var(--text-mute); text-align:center}
.vs-gap b{display:block; font-size:16px; color:var(--text); letter-spacing:-0.01em; margin-top:2px}

.hud-row{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-top:18px}
.chip{
  font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.06em;
  background:rgba(255,255,255,0.03); border:1px solid var(--line);
  padding:9px 10px; border-radius:8px;
  display:flex; align-items:center; gap:6px; color:var(--text-dim);
}
.chip .dot{width:6px; height:6px; border-radius:50%; background:#22c55e}
.hud-exercise{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:rgba(255,255,255,0.02); border:1px solid var(--line); border-radius:12px; margin-top:14px}
.hud-exercise .ex-name{font-family:"JetBrains Mono", monospace; font-size:12px; letter-spacing:0.1em; color:var(--text)}
.hud-exercise .ex-target{font-family:"JetBrains Mono", monospace; font-size:11px; color:var(--text-mute)}
.hud-stake{margin-top:10px; padding:12px 16px; border-radius:12px; border:1px dashed var(--gold-line); display:flex; align-items:center; justify-content:space-between; background:rgba(238,193,60,0.04)}
.hud-stake b{color:var(--gold); font-family:"JetBrains Mono", monospace; letter-spacing:0.04em}

/* trust bar */
.trust{
  display:flex; gap:0; align-items:center; justify-content:space-between;
  margin-top:80px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:24px 0;
  flex-wrap:wrap;
}
.trust .t{display:flex; align-items:center; gap:10px; font-family:"JetBrains Mono", monospace; font-size:12px; letter-spacing:0.08em; color:var(--text-dim); text-transform:uppercase}
.trust .t svg{color:var(--gold)}

/* --------- METRICS --------- */
.metrics-grid{display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid var(--line); border-left:1px solid var(--line)}
.metric{padding:48px 32px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); position:relative}
.metric .label{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-mute)}
.metric .value{font-size:64px; line-height:1; letter-spacing:-0.04em; font-weight:600; margin:18px 0 10px}
.metric .meta{font-size:14px; color:var(--text-dim); line-height:1.5}
.metric.featured .value{color:var(--gold)}
.metric .corner{position:absolute; top:14px; right:14px; font-family:"JetBrains Mono", monospace; font-size:10px; color:var(--text-mute)}

/* --------- SECTION HEADER --------- */
.sec-head{display:grid; grid-template-columns: 1fr 1fr; gap:80px; align-items:end; margin-bottom:64px}
.sec-head h2{font-size:clamp(42px, 5.6vw, 80px); line-height:1; letter-spacing:-0.03em; font-weight:600; margin:14px 0 0}
.sec-head h2 .accent{color:var(--gold); font-style:italic; font-weight:500}
.sec-head p{font-size:18px; color:var(--text-dim); line-height:1.5; max-width:480px; margin:0}
.sec-num{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.2em; color:var(--text-mute); text-transform:uppercase}

/* --------- FEATURES --------- */
.features{display:grid; grid-template-columns: repeat(6, 1fr); gap:1px; background:var(--line)}
.feature{
  background:var(--bg);
  padding:40px 32px;
  display:flex; flex-direction:column;
  min-height:380px;
  position:relative;
}
.feature.span-3{grid-column:span 3}
.feature.span-2{grid-column:span 2}
.feature.span-4{grid-column:span 4}
.feature.span-6{grid-column:span 6}
.feat-num{font-family:"JetBrains Mono", monospace; font-size:11px; color:var(--text-mute); letter-spacing:0.16em; margin-bottom:24px}
.feat-icon{
  width:48px; height:48px; border-radius:12px;
  background:linear-gradient(180deg, rgba(238,193,60,0.18), rgba(238,193,60,0.04));
  border:1px solid var(--gold-line);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold);
  margin-bottom:24px;
}
.feat-title{font-size:30px; letter-spacing:-0.02em; line-height:1.05; font-weight:600; margin:0 0 12px}
.feat-desc{font-size:15px; line-height:1.55; color:var(--text-dim); margin:0}
.feat-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:32px}
.tag{font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.08em; padding:5px 10px; border:1px solid var(--line); border-radius:999px; color:var(--text-dim); text-transform:uppercase}

/* feature graphic placeholders */
.feat-graphic{
  margin-top:24px; height:120px; border-radius:10px;
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,0.025) 0 10px, transparent 10px 20px),
    rgba(255,255,255,0.02);
  border:1px dashed var(--line-2);
  display:flex; align-items:center; justify-content:center;
  font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.1em; color:var(--text-mute); text-transform:uppercase;
}

/* --------- KÖHLER --------- */
.kohler{display:grid; grid-template-columns: 1fr 1fr; gap:64px; align-items:center}
.kohler-card{
  background:var(--bg-1);
  border:1px solid var(--line);
  border-radius:20px;
  padding:36px 36px 28px;
  position:relative;
  overflow:hidden;
  display:flex; flex-direction:column;
}
.kohler h2{font-size:clamp(48px, 6vw, 88px); line-height:0.95; letter-spacing:-0.03em; font-weight:600; margin:14px 0 24px}
.kohler h2 .accent{color:var(--gold); font-style:italic; font-weight:500}
.kohler p{font-size:18px; line-height:1.6; color:var(--text-dim); margin:0 0 20px}
.kohler-stats{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-top:36px}
.kohler-stats .k{padding:18px 0; border-top:1px solid var(--line)}
.kohler-stats .v{font-size:36px; line-height:1; font-weight:600; letter-spacing:-0.02em; color:var(--gold)}
.kohler-stats .l{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-mute); margin-top:10px}

/* graph */
.graph{height:440px; position:relative; margin-top:18px}
.graph svg{width:100%; height:100%; display:block}

/* --------- AI LAYERS --------- */
.layers{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line)}
.layer{background:var(--bg); padding:48px; min-height:360px; display:flex; flex-direction:column; position:relative}
.layer-head{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:24px}
.layer-num{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.2em; color:var(--gold)}
.layer-perf{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.08em; color:var(--text-mute); text-align:right}
.layer h3{font-size:32px; letter-spacing:-0.02em; line-height:1.05; font-weight:600; margin:18px 0 14px}
.layer p{font-size:15px; line-height:1.6; color:var(--text-dim); margin:0 0 20px}
.layer-stack{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto}
.stack-pill{font-family:"JetBrains Mono", monospace; font-size:10.5px; padding:6px 10px; border:1px solid var(--line); border-radius:6px; color:var(--text-dim); letter-spacing:0.05em}

/* --------- MOAT TABLE --------- */
.moat{border:1px solid var(--line); border-radius:18px; overflow:hidden}
.moat table{width:100%; border-collapse:collapse}
.moat th, .moat td{padding:22px 28px; text-align:left; border-bottom:1px solid var(--line); font-size:15px}
.moat thead th{background:var(--bg-1); font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-mute); font-weight:500}
.moat tbody tr:last-child td{border-bottom:0}
.moat td.feature-cell{font-weight:500; color:var(--text)}
.moat td.cell{text-align:center; color:var(--text-mute)}
.moat th.cell{text-align:center}
.moat .yes{display:inline-flex; align-items:center; gap:6px; color:var(--gold); font-family:"JetBrains Mono", monospace; font-size:12px; letter-spacing:0.08em}
.moat .no{font-family:"JetBrains Mono", monospace; font-size:12px; color:var(--text-mute)}
.moat .partial{font-family:"JetBrains Mono", monospace; font-size:12px; color:#a3a3a3}
.moat .col-como{background:rgba(238,193,60,0.04)}
.moat th.col-como{background:linear-gradient(180deg, rgba(238,193,60,0.1), rgba(238,193,60,0.04)); color:var(--gold)}

/* --------- PARTNERSHIPS --------- */
.partners{display:grid; grid-template-columns:1.2fr 0.8fr; gap:32px}
.partner-card{
  background:var(--bg-1); border:1px solid var(--line); border-radius:20px; padding:40px;
  display:flex; flex-direction:column; min-height:420px;
}
.partner-card h3{font-size:32px; letter-spacing:-0.02em; margin:14px 0 12px; font-weight:600}
.partner-card p{font-size:15px; line-height:1.6; color:var(--text-dim); margin:0 0 20px}
.partner-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:auto; padding-top:24px; border-top:1px solid var(--line)}
.partner-stats .v{font-size:24px; font-weight:600; letter-spacing:-0.02em; color:var(--gold)}
.partner-stats .l{font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.1em; color:var(--text-mute); text-transform:uppercase; margin-top:6px}

/* --------- ROADMAP --------- */
.roadmap{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.road-card{
  position:relative;
  background:var(--bg-1); border:1px solid var(--line); border-radius:20px;
  padding:40px; min-height:340px; overflow:hidden;
  display:flex; flex-direction:column;
}
.road-card .future{position:absolute; top:24px; right:24px; font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.16em; color:var(--gold); padding:5px 10px; border:1px solid var(--gold-line); border-radius:999px; text-transform:uppercase}
.road-card h3{font-size:34px; letter-spacing:-0.02em; line-height:1.05; margin:32px 0 14px; font-weight:600}
.road-card p{font-size:15px; line-height:1.6; color:var(--text-dim); margin:0 0 18px}
.road-price{font-family:"JetBrains Mono", monospace; font-size:14px; color:var(--text); letter-spacing:0.04em; margin-top:auto; padding-top:24px; border-top:1px solid var(--line)}
.road-price b{color:var(--gold)}

/* --------- BUSINESS MODEL --------- */
.revenue{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden}
.rev{background:var(--bg); padding:32px; min-height:280px; display:flex; flex-direction:column}
.rev .n{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.2em; color:var(--text-mute)}
.rev .price{font-size:48px; line-height:1; letter-spacing:-0.03em; font-weight:600; margin:24px 0 6px; color:var(--gold)}
.rev .price small{font-size:14px; color:var(--text-dim); font-weight:400; letter-spacing:0}
.rev h4{font-size:18px; font-weight:600; letter-spacing:-0.01em; margin:0 0 8px}
.rev p{font-size:13.5px; line-height:1.5; color:var(--text-dim); margin:0}
.rev ul{margin:14px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px}
.rev li{font-family:"JetBrains Mono", monospace; font-size:11px; color:var(--text-dim); display:flex; align-items:center; gap:8px}
.rev li::before{content:""; width:4px; height:4px; background:var(--gold); border-radius:50%}

/* --------- TEAM --------- */
.team{display:grid; grid-template-columns:1fr 1fr; gap:32px}
.founder{
  background:var(--bg-1); border:1px solid var(--line); border-radius:20px;
  padding:36px; display:flex; flex-direction:column; gap:24px;
}
.founder-top{display:flex; gap:24px; align-items:flex-start}
.avatar{
  width:96px; height:96px; flex-shrink:0; border-radius:18px;
  background:repeating-linear-gradient(135deg, rgba(238,193,60,0.18) 0 8px, rgba(238,193,60,0.04) 8px 16px);
  border:1px solid var(--gold-line);
  display:flex; align-items:center; justify-content:center;
  font-family:"JetBrains Mono", monospace; font-size:24px; color:var(--gold); font-weight:600;
}
.founder-meta .role{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.16em; color:var(--gold); text-transform:uppercase}
.founder-meta h3{font-size:30px; letter-spacing:-0.02em; line-height:1; margin:8px 0 4px; font-weight:600}
.founder-meta .equity{font-family:"JetBrains Mono", monospace; font-size:12px; color:var(--text-mute)}
.founder ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px}
.founder li{font-size:14px; color:var(--text-dim); display:flex; gap:10px; line-height:1.5}
.founder li::before{content:"▸"; color:var(--gold); flex-shrink:0; font-size:10px; padding-top:5px}

.team-extra{display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden; margin-top:24px}
.team-extra .te{background:var(--bg); padding:24px}
.te .role-l{font-family:"JetBrains Mono", monospace; font-size:10.5px; letter-spacing:0.16em; color:var(--gold); text-transform:uppercase}
.te h4{font-size:18px; margin:8px 0 4px; font-weight:600; letter-spacing:-0.01em}
.te p{margin:0; font-size:13px; color:var(--text-dim); line-height:1.5}

/* --------- PRESS --------- */
.press-row{display:flex; gap:0; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.press-row .p{flex:1; padding:32px 24px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:10px}
.press-row .p:last-child{border-right:0}
.press-row .p .name{font-size:18px; font-weight:600; letter-spacing:-0.01em}
.press-row .p .topic{font-family:"JetBrains Mono", monospace; font-size:10.5px; color:var(--text-mute); letter-spacing:0.1em; text-transform:uppercase}

/* --------- FINAL CTA --------- */
.final{
  text-align:center; padding:160px 0;
  background:
    radial-gradient(ellipse at center top, rgba(238,193,60,0.12), transparent 60%),
    var(--bg);
  border-top:1px solid var(--line);
  position:relative;
}
.final h2{font-size:clamp(64px, 11vw, 180px); line-height:0.9; letter-spacing:-0.04em; font-weight:600; margin:0}
.final h2 .accent{color:var(--gold); font-style:italic; font-weight:500}
.final p{font-size:19px; color:var(--text-dim); max-width:580px; margin:32px auto; line-height:1.5}
.stores{display:flex; gap:14px; justify-content:center; margin-top:36px; flex-wrap:wrap}
.store{
  display:inline-flex; align-items:center; gap:14px;
  padding:12px 22px 12px 16px;
  border-radius:14px;
  background:#0e0e10;
  border:1px solid rgba(255,255,255,0.10);
  color:var(--text);
  min-width:220px;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
  box-shadow:0 8px 24px -10px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.04);
}
.store:hover{
  transform:translateY(-2px);
  border-color:var(--gold-line);
  background:#131316;
}
.store img{height:38px; width:38px; display:block; flex-shrink:0}
.store .txt{display:flex; flex-direction:column; line-height:1; text-align:left}
.store .small{font-family:"JetBrains Mono", monospace; font-size:10px; color:var(--text-mute); letter-spacing:0.12em; text-transform:uppercase}
.store .big{font-size:18px; font-weight:600; letter-spacing:-0.01em; margin-top:6px}
.store .big .gold-dot{color:var(--gold)}

/* --------- FOOTER --------- */
.footer{padding:80px 0 40px; border-top:1px solid var(--line); background:var(--bg-1)}
.footer-grid{display:grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap:48px; margin-bottom:64px}
.footer-grid h5{font-family:"JetBrains Mono", monospace; font-size:11px; letter-spacing:0.16em; color:var(--text-mute); text-transform:uppercase; margin:0 0 18px; font-weight:500}
.footer-grid ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px}
.footer-grid a{font-size:14px; color:var(--text-dim)}
.footer-grid a:hover{color:var(--text)}
.foot-brand p{font-size:14px; color:var(--text-dim); line-height:1.6; max-width:340px; margin:18px 0 24px}
.socials{display:flex; gap:8px}
.social{
  width:38px; height:38px; border-radius:10px;
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:var(--text-dim); transition:all .2s ease;
}
.social:hover{color:var(--gold); border-color:var(--gold-line); background:var(--gold-soft)}
.foot-bottom{display:flex; align-items:center; justify-content:space-between; padding-top:32px; border-top:1px solid var(--line); font-size:12.5px; color:var(--text-mute); font-family:"JetBrains Mono", monospace; letter-spacing:0.06em}
.foot-bottom .legal{display:flex; gap:24px}

/* --------- RESPONSIVE --------- */
@media (max-width: 1100px){
  .hero-grid, .kohler, .partners, .team, .roadmap{grid-template-columns:1fr; gap:48px}
  .features{grid-template-columns:1fr 1fr}
  .feature.span-3, .feature.span-2, .feature.span-4{grid-column:span 1}
  .features .feature:nth-child(5){grid-column:span 2}
  .layers{grid-template-columns:1fr}
  .metrics-grid{grid-template-columns:1fr 1fr}
  .revenue{grid-template-columns:1fr 1fr}
  .sec-head{grid-template-columns:1fr; gap:24px; align-items:start}
  .footer-grid{grid-template-columns:1fr 1fr}
  .team-extra{grid-template-columns:1fr}
  .press-row{flex-direction:column}
  .press-row .p{border-right:0; border-bottom:1px solid var(--line)}
}
@media (max-width: 640px){
  .container{padding:0 20px}
  .section{padding:80px 0}
  .hero{padding:120px 0 40px}
  .nav-links{display:none}
  .metrics-grid{grid-template-columns:1fr}
  .features{grid-template-columns:1fr}
  .features .feature:nth-child(5){grid-column:span 1}
  .revenue{grid-template-columns:1fr}
  .moat{overflow-x:auto}
  .moat table{min-width:600px}
  .footer-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column; gap:14px; align-items:flex-start}
  .player-count{font-size:56px}
}