*{box-sizing:border-box}
:root{--ink:#20252b;--muted:#59636d;--line:#dfe4e8;--panel:#fff;--soft:#f4f6f8;--accent:#315f78;--accent2:#e7f0f4}
html{scroll-behavior:smooth}
body{margin:0;background:var(--soft);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.75}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{width:min(980px,92%);margin:auto}
nav{background:#243a46;color:#fff;border-bottom:1px solid #1c303a}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:15px 0}
.brand{color:#fff;font-weight:800;font-size:1.05rem}
.links{display:flex;flex-wrap:wrap;gap:18px}
.links a{color:#dce7eb;font-size:.94rem}
main{padding:38px 0 65px}
.hero{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:38px;margin-bottom:22px}
h1{font-size:clamp(2rem,5vw,3.25rem);line-height:1.15;margin:0 0 14px;color:#243a46}
h2{font-size:1.65rem;line-height:1.3;margin:0 0 14px;color:#294655}
h3{font-size:1.1rem;margin:22px 0 7px;color:#334e5b}
.lead{font-size:1.14rem;max-width:800px;color:var(--muted);margin:0}
.section{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:30px;margin-bottom:22px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.card{background:#fafbfc;border:1px solid var(--line);border-radius:10px;padding:22px}
.card h3{margin-top:0}
.card p:last-child{margin-bottom:0}
ul,ol{padding-left:23px}
li{margin:7px 0}
.note{background:var(--accent2);border-left:4px solid var(--accent);padding:15px 18px;border-radius:6px;margin:20px 0}
.checklist{margin:0;padding-left:22px}
.checklist li::marker{content:"✓  "}
table{width:100%;border-collapse:collapse;margin:18px 0}
th,td{padding:12px 14px;border:1px solid var(--line);text-align:left;vertical-align:top}
th{background:#f1f4f6;color:#294655}
.small{font-size:.92rem;color:var(--muted)}
footer{background:#243a46;color:#dce7eb;padding:28px 0}
footer strong{display:block;margin-bottom:5px}
footer span{font-size:.9rem;color:#c1d0d6}
@media(max-width:700px){
.nav-inner{align-items:flex-start;flex-direction:column}
.links{gap:10px 15px}
.hero,.section{padding:23px}
.grid{grid-template-columns:1fr}
}