:root{--bg:#f6f8fb;--card:#ffffff;--text:#162033;--muted:#64748b;--accent:#2563eb;--line:#dbe3ef}
*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}
header{padding:28px 8%;display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid var(--line)}
.logo{font-weight:800;font-size:20px}nav a{margin-left:20px;color:var(--muted);text-decoration:none}
.hero{padding:72px 8%;display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center}
h1{font-size:46px;line-height:1.05;margin:0 0 18px}.lead{font-size:19px;color:var(--muted);line-height:1.6}
.btn{display:inline-block;margin-top:24px;padding:14px 20px;border-radius:12px;background:var(--accent);color:#fff;text-decoration:none;font-weight:700}
.card{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:0 16px 40px rgba(15,23,42,.08)}
.grid{padding:20px 8% 70px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.item{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}
.item h3{margin:0 0 10px}.item p{color:var(--muted);line-height:1.55}
footer{padding:28px 8%;border-top:1px solid var(--line);color:var(--muted)}
@media(max-width:850px){.hero,.grid{grid-template-columns:1fr}h1{font-size:34px}nav{display:none}}