:root { --pad: clamp(16px, 3vw, 32px); --max: 1100px; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:#0c1116; background:#f6f8fb; }
header.hero { display:grid; place-items:center; text-align:center; padding:10vh var(--pad) 6vh; background:linear-gradient(180deg,#e9f2ff,transparent); }
.logo { width:180px; height:auto; margin-bottom:12px; }
h1 { font-size: clamp(28px, 5vw, 48px); margin: 8px 0; }
p { max-width: 60ch; margin: 0 auto; line-height: 1.5; }
a.cta { display:inline-block; margin-top:20px; padding:12px 18px; border-radius:10px; text-decoration:none; background:#0b5fff; color:#fff; font-weight:600; }
section.grid { max-width: var(--max); margin: 40px auto; padding: 0 var(--pad); display:grid; gap:18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.waitlist { max-width: var(--max); margin: 40px auto; padding: 0 var(--pad) 40px; }
#waitlist-form { display:grid; grid-template-columns: 1fr 1fr auto; gap:10px; margin-top:10px; }
#waitlist-form input, #waitlist-form button { padding:12px; border-radius:10px; border:1px solid #ccd7e2; }
#waitlist-form button { border:none; background:#0b5fff; color:#fff; font-weight:700; cursor:pointer; }
footer { padding: 32px; text-align:center; color:#667; }
.small { font-size: 12px; color:#667; }
@media (max-width: 680px) { #waitlist-form { grid-template-columns: 1fr; } }