:root{
  --maxw: 1100px;
  --pad: 18px;
  --radius: 14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;color:#111;background:#fff;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid #eee;z-index:10}
.nav{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px var(--pad)}
.nav .brand{display:flex;align-items:center;gap:10px;font-weight:700}
.nav .spacer{flex:1}
.nav a.btn{padding:10px 14px;border:1px solid #111;border-radius:10px;font-weight:600}
.hero{max-width:var(--maxw);margin:32px auto;padding:0 var(--pad);display:grid;gap:24px;grid-template-columns:1.2fr .8fr;align-items:center}
.hero h1{font-size:clamp(28px,4vw,44px);margin:0 0 8px}
.hero p{font-size:clamp(16px,2.2vw,19px);color:#333;margin:0 0 16px}
.hero .card{border:1px solid #eee;padding:18px;border-radius:var(--radius);}
.grid{max-width:var(--maxw);margin:24px auto;padding:0 var(--pad);display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{border:1px solid #eee;padding:18px;border-radius:var(--radius);background:#fff}
.card h3{margin:0 0 6px}
.section{max-width:var(--maxw);margin:32px auto;padding:0 var(--pad)}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid #222;font-weight:700}
.footer{border-top:1px solid #eee;margin-top:36px}
.footer .inner{max-width:var(--maxw);margin:0 auto;padding:18px var(--pad);display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.small{font-size:13px;color:#444}
ul.clean{margin:8px 0;padding-left:18px}
.cta{display:inline-block;padding:12px 16px;border:1px solid #111;border-radius:12px;font-weight:700}
.kicker{letter-spacing:.12em;text-transform:uppercase;font-weight:700;font-size:12px;color:#444}
.hero .imgbox{border:1px solid #eee;border-radius:var(--radius);overflow:hidden}
@media (max-width:900px){.hero{grid-template-columns:1fr}}