:root{--bg:#f3f6fb;--surface:#fff;--text:#13233f;--muted:#627087;--line:rgba(16,24,41,.08);--accent:#2f6cf4;--accent2:#174dc8;--shadow:0 22px 50px rgba(15,23,42,.08);--max:1100px}
*{box-sizing:border-box}
body{margin:0;font-family:"Manrope","Segoe UI",sans-serif;color:var(--text);background:linear-gradient(180deg,#eef4fb 0%,#f8fbff 45%,#eef4fb 100%)}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.shell{width:min(var(--max),calc(100% - 40px));margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(247,250,254,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(16,24,41,.05)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;gap:12px;font-size:1.02rem;font-weight:800}
.brand img{width:36px;height:36px;border-radius:10px}
.nav-links{display:flex;gap:12px;flex-wrap:wrap}
.nav-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 15px;border-radius:999px;background:rgba(255,255,255,.84);box-shadow:inset 0 0 0 1px rgba(16,24,41,.05);color:var(--muted);font-size:.9rem;font-weight:700}
main{padding:34px 0 44px}
.hero,.card,.cta{border-radius:30px;background:#fff;border:1px solid rgba(16,24,41,.05);box-shadow:var(--shadow)}
.hero{padding:32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);gap:24px;align-items:center}
.eyebrow{display:inline-flex;min-height:34px;align-items:center;padding:0 14px;border-radius:999px;background:rgba(47,108,244,.08);color:#2751a0;font-size:.82rem;font-weight:800}
h1{margin:16px 0 14px;font-size:clamp(2.25rem,4.5vw,3.8rem);line-height:.98;letter-spacing:-.05em}
.lead,.card p,.footer-copy{margin:0;color:var(--muted);line-height:1.75}
.actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.button,.ghost{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:999px;font-weight:800}
.button{color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 18px 30px rgba(47,108,244,.18)}
.ghost{background:#fff;box-shadow:inset 0 0 0 1px rgba(16,24,41,.08)}
.hero-visual{padding:16px;border-radius:26px;background:linear-gradient(180deg,#f7faff,#eef4ff);overflow:hidden}
.hero-visual img{width:100%;border-radius:18px;box-shadow:0 22px 44px rgba(15,23,42,.12)}
.section{margin-top:24px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{padding:22px}
.card h2,.cta h2,.steps h2{margin:0 0 12px;font-size:1.25rem;line-height:1.15;letter-spacing:-.03em}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.step{padding:22px;border-radius:24px;background:#fff;border:1px solid rgba(16,24,41,.05);box-shadow:var(--shadow)}
.step strong{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--accent),#68a4ff);color:#fff;margin-bottom:14px}
.faq{display:grid;gap:14px}
.faq-item{padding:18px 20px;border-radius:20px;background:linear-gradient(180deg,#f8fbff,#ffffff);border:1px solid rgba(16,24,41,.05)}
.faq-item h3{margin:0 0 8px;font-size:1rem;line-height:1.4}
.cta{padding:30px;text-align:center}
.footer-copy{margin-top:22px;padding:0 0 8px;text-align:center;font-size:.9rem}
@media (max-width:920px){.hero,.grid,.steps{grid-template-columns:1fr}.nav{flex-direction:column;padding:14px 0}}
@media (max-width:720px){.shell{width:min(100%,calc(100% - 24px))}.hero,.card,.cta,.step{padding:22px;border-radius:24px}.actions{flex-direction:column}.button,.ghost{width:100%}}
