:root{
  --bg:#0F1720;
  --surface:#16212C;
  --surface-2:#1D2B38;
  --border:#28394A;
  --ink:#EAF0F5;
  --muted:#8FA3B3;
  --accent:#2FBF71;
  --accent-dark:#22954F;
  --accent-soft:#173325;
  --warn:#E8A33D;
  --warn-soft:#332711;
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --radius: 12px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-ui);
  background:var(--bg);
  color:var(--ink);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; }
img,svg{ max-width:100%; display:block; }
.wrap{ max-width:1040px; margin:0 auto; padding:0 20px; }
header.site{
  border-bottom:1px solid var(--border);
  position:sticky; top:0; background:rgba(15,23,32,0.92); backdrop-filter: blur(6px); z-index:10;
}
header.site .wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 20px; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--ink); }
.brand .mark{ width:28px; height:28px; border-radius:8px; background:var(--accent); display:flex; align-items:center; justify-content:center; color:#0F1720; font-weight:800; }
nav.site a{ color:var(--muted); margin-left:22px; font-size:14px; }
nav.site a:hover{ color:var(--ink); }
main{ padding: 48px 0 80px; }
.hero{ text-align:center; padding: 40px 0 24px; }
.hero h1{ font-size:2.4rem; line-height:1.2; margin:0 0 16px; }
.hero p.sub{ color:var(--muted); font-size:1.15rem; max-width:640px; margin:0 auto 28px; }
.cta{ display:inline-block; background:var(--accent); color:#0F1720; font-weight:700; padding:14px 26px; border-radius:999px; }
.cta:hover{ background:var(--accent-dark); text-decoration:none; }
.pill{ display:inline-flex; align-items:center; gap:8px; background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:6px 14px; font-size:13px; color:var(--muted); margin-bottom:20px; }
.pill strong{ color:var(--accent); }
.grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; margin-top:40px; }
.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:24px; }
.card h3{ margin-top:0; }
.section{ padding:56px 0; border-top:1px solid var(--border); }
.section h2{ font-size:1.6rem; margin-bottom:8px; }
.section p.lede{ color:var(--muted); max-width:640px; }
.guardrails{ list-style:none; padding:0; margin:24px 0 0; display:grid; gap:14px; }
.guardrails li{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px 18px; display:flex; gap:12px; align-items:flex-start; }
.guardrails li .check{ color:var(--accent); font-weight:800; }
.pricing-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-top:32px; }
.price-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:26px; }
.price-card.featured{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.price-card h3{ margin:0 0 6px; }
.price-card .amount{ font-size:2rem; font-weight:800; margin:10px 0; }
.price-card .amount span{ font-size:0.9rem; color:var(--muted); font-weight:400; }
.disclosure{ background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:18px 20px; color:var(--muted); font-size:14px; margin-top:16px; }
footer.site{ border-top:1px solid var(--border); padding:36px 0; color:var(--muted); font-size:13px; }
footer.site .wrap{ display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center; justify-content:space-between; }
footer.site a{ color:var(--muted); }
footer.site a:hover{ color:var(--ink); }
.draft-banner{ background:var(--warn-soft); color:var(--warn); border-bottom:1px solid var(--border); padding:10px 0; font-size:13px; text-align:center; }
form.stack{ display:grid; gap:14px; max-width:480px; margin-top:20px; }
form.stack label{ font-size:13px; color:var(--muted); display:block; margin-bottom:6px; }
form.stack input, form.stack select, form.stack textarea{
  width:100%; background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:10px 12px; color:var(--ink); font-family:inherit; font-size:14px;
}
form.stack button{ background:var(--accent); color:#0F1720; font-weight:700; border:none; border-radius:999px; padding:12px 22px; cursor:pointer; }
form.stack button:hover{ background:var(--accent-dark); }
.legal h1{ font-size:1.8rem; }
.legal h2{ font-size:1.2rem; margin-top:32px; }
.legal p, .legal li{ color:var(--muted); }