:root{--bg:#f4faff;--card:#fff;--ink:#0b1f3a;--muted:#4a6280;--accent:#2f9bff;--button:#1970eb;--button2:#1565d8;--link:#1565d8}
/* --accent is decorative only (no text on or in it); text colours meet WCAG AA 4.5:1 */
*{box-sizing:border-box}body{margin:0;font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink)}
header,main,footer{max-width:880px;margin:0 auto;padding:16px}header img{height:40px}
.hero{padding:40px 0}.hero h1{font-size:40px;margin:0 0 8px}.hero p{color:var(--muted);font-size:18px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.cta a{padding:12px 20px;border-radius:12px;text-decoration:none;font-weight:600}
.primary{background:linear-gradient(135deg,var(--button),var(--button2));color:#fff}.secondary{background:var(--card);color:var(--link);border:1px solid var(--accent)}
.features ul,.prices ul{list-style:none;padding:0;display:grid;gap:10px}.features li,.prices li{background:var(--card);border-radius:12px;padding:14px 16px}
.prices li{display:flex;justify-content:space-between}main article{background:var(--card);border-radius:16px;padding:24px}
footer{color:var(--muted);font-size:14px}footer a{color:var(--link)}
h1,h2{overflow-wrap:anywhere;hyphens:auto}
@media (max-width:480px){main article h1{font-size:24px;line-height:1.25}}