:root{
  --bg:#0b0f17;
  --panel:#111827;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --line:#1f2937;
  --accent:#7c3aed;
  --accent2:#22c55e;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; }
a{ color:inherit; }

.wrap{ max-width: 980px; margin: 0 auto; padding: 18px 18px; }

.header{
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid var(--line);
  position:sticky; top:0; background:rgba(11,15,23,0.85); backdrop-filter: blur(10px);
}

.brand{ font-weight:800; letter-spacing:0.2px; }
.nav a{ margin-left:14px; text-decoration:none; color:var(--muted); }
.nav a:hover{ color:var(--text); }

.hero{ padding: 48px 0 18px; }
.hero h1{ font-size: 44px; line-height:1.05; margin:0 0 14px; }
.lede{ font-size: 18px; color:var(--muted); max-width: 760px; }

.cta{ display:flex; gap:12px; margin: 18px 0 14px; flex-wrap:wrap; }
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 12px 16px; border-radius: 12px; text-decoration:none;
  border:1px solid var(--line);
}
.btn.primary{ background: linear-gradient(135deg, var(--accent), #2563eb); border: none; }
.btn.ghost{ color:var(--text); background: transparent; }
.btn:hover{ transform: translateY(-1px); }

.proof{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 14px; }
.pill{
  font-size: 12px; color: var(--muted);
  border:1px solid var(--line);
  padding: 8px 10px; border-radius: 999px;
  background: rgba(17,24,39,0.6);
}

.section{ padding: 26px 0; border-top: 1px solid var(--line); }
.section h2{ margin:0 0 12px; font-size: 22px; }
.muted{ color:var(--muted); }

.grid3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 820px){
  .hero h1{ font-size: 34px; }
  .grid3{ grid-template-columns: 1fr; }
}

.card{
  background: rgba(17,24,39,0.7);
  border:1px solid var(--line);
  border-radius: 16px;
  padding: 14px 14px;
}

.card h3{ margin:0 0 8px; font-size: 16px; }
.card p{ margin:0; color: var(--muted); line-height:1.45; }

.bullets{ margin: 0; padding-left: 18px; color: var(--muted); }
.bullets li{ margin: 8px 0; }

.founder .muted{ margin-top:-6px; }

.footer{
  border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:12px;
  color:var(--muted);
  padding-top: 18px;
  padding-bottom: 30px;
  flex-wrap:wrap;
}
