@font-face { font-family:'Fraunces'; src:url('/static/fraunces-400.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('/static/fraunces-600.woff2') format('woff2'); font-weight:600; font-display:swap; }

:root {
  --bg:#ffffff; --fg:#14171a; --muted:#5b636b; --card:#f6f8f7;
  --line:#e4e8e6; --accent:#00a600; --accent-ink:#0a3d0a; --brand:#00D800;
  --maxw:900px;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0e1110; --fg:#eef2f0; --muted:#9aa4a0; --card:#171b19;
    --line:#252b28; --accent:#00D800; --accent-ink:#d7ffd7; --brand:#00D800; }
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--fg);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6; }
h1,h2,h3 { font-family:'Fraunces',Georgia,serif; font-weight:600; line-height:1.2; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 20px; }

header.site { border-bottom:1px solid var(--line); }
header.site .wrap { display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand { display:flex; align-items:center; gap:10px; font-family:'Fraunces',Georgia,serif; font-size:20px; }
.brand img { width:28px; height:28px; border-radius:6px; }
nav a { color:var(--fg); margin-left:20px; font-size:15px; }

.hero { padding:72px 0 40px; }
.hero h1 { font-size:clamp(32px,5vw,52px); margin:0 0 16px; }
.hero p.lead { font-size:20px; color:var(--muted); max-width:640px; margin:0 0 28px; }

.btn { display:inline-block; background:var(--brand); color:#04220a; font-weight:600;
  padding:12px 22px; border-radius:10px; border:none; cursor:pointer; font-size:16px; }
.btn:hover { text-decoration:none; filter:brightness(1.05); }
.btn[disabled], .btn.placeholder { opacity:.55; cursor:default; }

section { padding:40px 0; }
.steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.step { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:20px; }
.step h3 { margin:0 0 8px; font-size:18px; }
.step p { margin:0; color:var(--muted); }

.pricing { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.plan { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:24px; }
.plan.featured { border-color:var(--brand); }
.plan .price { font-family:'Fraunces',Georgia,serif; font-size:32px; margin:6px 0 12px; }
.plan ul { padding-left:18px; margin:0; color:var(--muted); }

footer.site { border-top:1px solid var(--line); margin-top:40px; padding:24px 0; color:var(--muted); font-size:14px; }
footer.site a { color:var(--muted); margin-right:16px; }

article.legal { padding:48px 0; }
article.legal h1 { font-size:34px; margin-bottom:8px; }
article.legal h2 { font-size:22px; margin-top:32px; }
article.legal p, article.legal li { color:var(--fg); }
.note { background:var(--card); border:1px solid var(--line); border-left:3px solid var(--accent);
  padding:12px 16px; border-radius:8px; color:var(--muted); font-size:14px; }
.center { text-align:center; }