* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.7 Arial, sans-serif; color: #253047; background: #f5f7fb; }
header { padding: 34px 18px; text-align: center; color: white; background: #173b68; }
header h1 { margin: 0; }
nav { padding: 12px; text-align: center; background: #102b4d; }
nav a { display: inline-block; margin: 4px 10px; color: white; text-decoration: none; }
main { max-width: 900px; margin: 26px auto; padding: 0 18px; }
article { padding: 24px; margin-bottom: 20px; background: white; border-radius: 10px; box-shadow: 0 2px 8px #0000000a; }
h2 { color: #173b68; margin-top: 0; }
a { color: #175bb5; overflow-wrap: anywhere; }
footer { padding: 22px 16px; text-align: center; color: white; background: #102b4d; }
footer a { color: white; margin: 0 6px; }
small, .muted { color: #526176; }
@media (max-width: 600px) { nav a { margin: 4px 6px; } }