*{box-sizing:border-box;margin:0;padding:0}
body{font:16px/1.6 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#1d2733;background:#fafbfc}
a{color:#1f5f8b;text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
.top{background:#fff;border-bottom:1px solid #e3e8ee}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-size:22px;font-weight:700;color:#1d2733}
.logo span{display:block;font-size:12px;font-weight:400;color:#6b7785;margin-top:-4px}
nav a{margin-left:22px;color:#3c4a59}
.hero{background:#eef3f7;padding:64px 0}
.hero h1{font-size:32px;line-height:1.25;margin-bottom:16px;max-width:620px}
.hero p{font-size:18px;color:#3c4a59;max-width:620px;margin-bottom:28px}
.btn{display:inline-block;background:#1f5f8b;color:#fff;padding:12px 22px;border-radius:6px}
.btn:hover{background:#184c70;text-decoration:none}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;padding:48px 20px}
.cards article{background:#fff;border:1px solid #e3e8ee;border-radius:8px;padding:24px}
.cards h2{font-size:19px;margin-bottom:8px}
.page{padding:48px 20px}
.page h1{font-size:28px;margin-bottom:24px}
.page h2{font-size:20px;margin:28px 0 8px}
.page p,.page li{color:#3c4a59}
.page ul{margin:8px 0 0 20px}
.note{background:#fff;border-left:3px solid #1f5f8b;padding:16px 20px;margin-top:28px}
footer{border-top:1px solid #e3e8ee;padding:24px 0;color:#6b7785;font-size:14px;margin-top:40px}
@media(max-width:600px){.hero h1{font-size:26px}nav a{margin-left:14px}}