:root { --ink:#172332; --muted:#526273; --paper:#f8fafb; --blue:#126c91; --aqua:#d8f1f0; --yellow:#ffe7a7; --line:#dce5ea; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial, Helvetica, sans-serif; line-height:1.6; }
a { color:inherit; }
.skip-link { position:absolute; left:-999px; top:0; background:#fff; padding:.7rem 1rem; z-index:2; }.skip-link:focus { left:1rem; }
.hero { background:linear-gradient(125deg,#e0f5f4 0%,#eaf4fb 60%,#fff1c8 100%); padding:1rem max(1.25rem, calc((100% - 1100px)/2)) 5.5rem; }
.nav { align-items:center; display:flex; justify-content:space-between; max-width:1100px; margin:auto; }.brand { font-size:1.25rem; font-weight:800; text-decoration:none; }.brand span { color:var(--blue); }.menu { display:flex; gap:1.25rem; }.menu a { font-weight:700; text-decoration:none; }.menu a:hover { color:var(--blue); }.menu-button { display:none; }
.hero-content { max-width:740px; margin:5.5rem auto 0; }.eyebrow { color:var(--blue); font-size:.82rem; font-weight:800; letter-spacing:.1em; margin:0 0:.55rem; text-transform:uppercase; }h1,h2,h3,p { margin-top:0; }h1 { font-size:clamp(2.45rem,7vw,5rem); letter-spacing:-.045em; line-height:1.04; margin-bottom:1.2rem; }h2 { font-size:clamp(1.8rem,4vw,2.7rem); letter-spacing:-.03em; line-height:1.13; }.lead { color:var(--muted); font-size:1.15rem; max-width:650px; }.button { background:var(--blue); border-radius:.4rem; color:white; display:inline-block; font-weight:700; margin-top:.8rem; padding:.75rem 1.05rem; text-decoration:none; }.button:hover { background:#095776; }
main { max-width:1100px; margin:auto; padding:0 1.25rem 4rem; }.intro { display:grid; gap:2.5rem; grid-template-columns:1.15fr .85fr; padding:5rem 0; }.intro p { color:var(--muted); font-size:1.08rem; margin:auto 0; }.topics { padding:1rem 0 4rem; }.section-heading { margin-bottom:1.7rem; }.card-grid { display:grid; gap:1rem; grid-template-columns:repeat(4,1fr); }.card { background:var(--white); border:1px solid var(--line); border-radius:.8rem; padding:1.35rem; }.number { color:var(--blue); font-size:.82rem; font-weight:800; }.card h3 { font-size:1.22rem; margin:.65rem 0 .55rem; }.card p { color:var(--muted); font-size:.96rem; margin:0; }.wide-card { grid-column:span 2; }.checklist { background:var(--aqua); border-radius:1rem; display:grid; gap:2rem; grid-template-columns:1fr 1fr; margin:0 0 4rem; padding:2.6rem; }.checklist h2 { margin-bottom:0; }.checklist ul { margin:auto 0; padding-left:1.25rem; }.checklist li { margin:.45rem 0; }.help { background:var(--white); border-left:6px solid var(--yellow); padding:2.5rem; }.help h2 { margin-bottom:.8rem; }.help p:last-child { color:var(--muted); margin-bottom:0; }.notice { color:#48545f; font-size:.92rem; margin:2.5rem 0 0; padding:1.1rem 1.25rem; text-align:center; }footer { background:#172332; color:#dce8ed; padding:1.7rem 1.25rem; text-align:center; }footer p { margin:0; }
@media (max-width:760px) { .hero { padding-bottom:4rem; }.hero-content { margin-top:4rem; }.menu-button { background:transparent; border:1px solid var(--ink); border-radius:.35rem; color:var(--ink); display:block; font:inherit; padding:.35rem .6rem; }.menu { background:#fff; box-shadow:0 8px 25px #17233225; display:none; flex-direction:column; padding:1rem; position:absolute; right:1.25rem; top:3.8rem; }.menu.open { display:flex; }.intro,.checklist { grid-template-columns:1fr; }.intro { gap:1rem; padding:3.5rem 0; }.card-grid { grid-template-columns:repeat(2,1fr); }.wide-card { grid-column:span 2; }.checklist,.help { padding:1.7rem; } }
@media (max-width:440px) { .card-grid { grid-template-columns:1fr; }.wide-card { grid-column:span 1; } }