:root{font-family:"Segoe UI",sans-serif;color:#172b3a;background:#f7fafc;line-height:1.65}
*{box-sizing:border-box}body{margin:0;border-top:7px solid #23758c}
header,main,footer{max-width:780px;padding:26px 30px;margin:auto}
header{display:flex;gap:20px;align-items:center;justify-content:space-between;border-bottom:1px solid #c4d8e3}
.brand{font-weight:700;color:#172b3a;text-decoration:none}nav{display:flex;gap:20px;flex-wrap:wrap}
main{padding-top:46px;padding-bottom:38px;min-height:60vh}h1{font-size:clamp(2rem,5vw,3rem);line-height:1.15;letter-spacing:-.025em;margin:0 0 24px}
.intro{font-size:1.24rem;color:#285d72;margin-bottom:30px}h2{font-size:1.18rem;margin:30px 0 8px}p{margin:0 0 18px}
a{color:#155f80;text-underline-offset:4px}a:hover{color:#15354d}a:focus-visible{outline:3px solid #23758c;outline-offset:5px}
footer{border-top:1px solid #c4d8e3;color:#425a6b;font-size:.9rem}code{overflow-wrap:anywhere}
@media(max-width:540px){header{display:block}nav{margin-top:14px;gap:16px}header,main,footer{padding-left:22px;padding-right:22px}}