:root { color-scheme: light; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:#f5f7fc; color:#192237; }
* { box-sizing: border-box; }
body { margin:0; line-height:1.65; }
header { background:#17263f; color:#fff; padding:30px 18px; }
header .shell {display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center;}
.brand {font-weight:750; font-size:1.15rem; letter-spacing:.01em;}
header nav {display:flex; gap:18px; flex-wrap:wrap;}
header a {color:#dce9ff; text-decoration:none;}
header a:hover, footer a:hover {text-decoration:underline;}
main {max-width:850px; margin:34px auto 50px; padding:0 18px;}
article {background:white; border:1px solid #e1e7f0; border-radius:16px; padding:30px 36px; box-shadow:0 8px 25px rgba(20,40,70,.05);}
h1 {font-size:2rem; line-height:1.25; margin:0 0 22px;}
h2 {font-size:1.18rem; margin-top:30px;}
p {margin:12px 0;}
li {margin:9px 0;}
.callout {padding:15px 19px; background:#eef4ff; border-left:4px solid #3867d6; border-radius:6px; margin:22px 0;}
a {color:#2858b4;}
footer {max-width:850px; margin:0 auto 50px; padding:0 18px; font-size:.88rem; color:#566477;}
footer a {color:#2858b4;}
@media(max-width:550px){article {padding:22px 20px;} h1{font-size:1.6rem}}