:root{--bg:#fff;--fg:#1c2733;--muted:#5d6b7a;--brand:#0e7fb8;--dark:#12202d;--soft:#f2f6f9}
@media(prefers-color-scheme:dark){:root{--bg:#0f1720;--fg:#e8eef4;--muted:#9fb0c0;--soft:#17222d;--dark:#0a1118}}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--fg);line-height:1.6}
a{color:inherit;text-decoration:none}.wrap{max-width:1100px;margin:auto;padding:0 20px}
.top{background:var(--dark);color:#fff;font-size:14px;padding:8px 0}.top .wrap{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
header.nav{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--soft);z-index:5}
header.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-weight:800;font-size:22px;color:var(--brand)}nav a{margin-left:20px;font-weight:600}nav a:hover{color:var(--brand)}
.hero{background:linear-gradient(120deg,#0e7fb8,#12202d);color:#fff;padding:90px 0;text-align:center}
.hero small{letter-spacing:2px;opacity:.85}.hero h1{font-size:clamp(32px,6vw,56px);margin:10px 0 24px}
.btn{display:inline-block;background:#fff;color:#0e7fb8;padding:12px 28px;border-radius:30px;font-weight:700}
section{padding:60px 0}section.alt{background:var(--soft)}h2{text-align:center;font-size:30px;margin:0 0 8px}
.lead{text-align:center;color:var(--muted);max-width:640px;margin:0 auto 36px}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{background:var(--bg);border:1px solid var(--soft);border-radius:12px;overflow:hidden;text-align:center}
.card .img{height:150px;background:linear-gradient(135deg,#bcd9e8,#7fb3cf)}.card b{display:block;padding:16px}
.step{padding:22px;background:var(--bg);border-radius:12px;border:1px solid var(--soft)}
.step span{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;font-weight:700;margin-bottom:8px}
.cols{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.cols p{color:var(--muted)}
footer{background:var(--dark);color:#cfd9e2;padding:40px 0 90px;font-size:14px}footer .wrap{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.call{position:fixed;right:16px;bottom:16px;background:#1fa855;color:#fff;padding:14px 22px;border-radius:30px;font-weight:700;box-shadow:0 4px 14px #0004}
@media(max-width:700px){nav a{margin-left:12px;font-size:14px}}
