:root { color-scheme: light; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #23344b; background: #f5f8fb; line-height: 1.65; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #126177; text-underline-offset: .2em; overflow-wrap: anywhere; }
a:hover { color: #102239; }
a:focus-visible { outline: 3px solid #12a1ae; outline-offset: 4px; }
header, footer { max-width: 920px; margin: auto; padding: 25px 28px; }
header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { color: #102239; font-size: 23px; font-weight: 750; text-decoration: none; }
.brand span { display: inline-block; color: #607288; font-size: 14px; font-weight: 450; margin-left: 5px; }
main { max-width: 864px; margin: 10px auto 36px; padding: 46px 54px; background: white; border: 1px solid #e0e8ef; border-radius: 20px; }
.eyebrow { color: #126177; letter-spacing: .13em; font-size: 12px; font-weight: 750; margin: 0 0 10px; }
h1 { color: #102239; font-size: clamp(32px, 7vw, 46px); line-height: 1.15; letter-spacing: -.025em; margin: 0 0 10px; }
.updated { color: #607288; font-size: 14px; margin-bottom: 30px; }
h2 { color: #102239; font-size: 22px; line-height: 1.35; margin: 34px 0 12px; }
p { margin: 0 0 16px; }
aside { border-left: 4px solid #12899b; border-radius: 0 12px 12px 0; padding: 18px 21px; background: #eef8f9; margin: 26px 0; }
aside strong { display: block; color: #102239; margin-bottom: 4px; }
code { font-size: .9em; overflow-wrap: anywhere; }
footer { color: #607288; font-size: 13px; padding-top: 0; padding-bottom: 35px; }
@media (max-width: 620px) { header { padding: 22px 20px; align-items: flex-start; } header > a:last-child { font-size: 14px; } .brand span { display: block; margin: 0; } main { margin: 0 12px 28px; padding: 30px 23px; border-radius: 14px; } h2 { font-size: 21px; } footer { padding-left: 24px; } }