.hero{padding:4.5rem 0 2.5rem}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin:0 0 1rem;max-width:20ch}
.hero p.lede{font-size:1.15rem;color:var(--muted);max-width:var(--measure);margin:0 0 1.75rem}
.signup{display:flex;gap:.6rem;flex-wrap:wrap;max-width:32rem}
.signup input[type=email]{flex:1 1 15rem;padding:.8rem 1rem;border:1px solid var(--rule);border-radius:var(--radius);background:var(--surface);color:var(--fg);font:inherit}
.signup button{padding:.8rem 1.3rem;border:0;border-radius:var(--radius);background:var(--accent);color:var(--on-accent);font:inherit;font-weight:600;cursor:pointer}
.signup button:hover{background:var(--accent-strong)}
.fine{font-size:.85rem;color:var(--muted);margin-top:.6rem}
.section{padding:2.5rem 0;border-top:1px solid var(--rule)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1.25rem}
.step{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:1.25rem}
.step b{color:var(--accent)}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:1.5rem;max-width:44rem}
.tag{display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;background:var(--accent-soft);color:var(--accent);padding:.2rem .6rem;border-radius:999px;margin-right:.4rem}
.tag.warn{background:#fdf1e3;color:#8a4b08}
.card dl{display:grid;grid-template-columns:9rem 1fr;gap:.4rem 1rem;margin:1rem 0 0}
.card dt{color:var(--muted)}
.card dd{margin:0}

@media (max-width:34rem){.card dl{grid-template-columns:1fr;gap:.15rem 0}.card dt{margin-top:.6rem;font-size:.85rem}}
