:root {
  color-scheme: light;
  --background: #f7f9fc;
  --foreground: #192a43;
  --primary: #174db0;
  --primary-foreground: #ffffff;
  --border: #cbd5e4;
}
* { box-sizing: border-box; }
html { font-size: 16px; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: Arial, Helvetica, sans-serif; line-height: 1.75; }
a { color: var(--primary); text-underline-offset: 0.22em; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--primary); outline-offset: 5px; }
.site-header { max-width: 72rem; margin: auto; padding: 2rem clamp(1.25rem, 5vw, 4rem); display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border-bottom: 1px solid var(--border); }
.wordmark { color: var(--foreground); font-weight: 700; font-size: 1.125rem; text-decoration: none; }
.wordmark span { margin-left: 0.4rem; color: #51637b; font-weight: 400; }
nav { display: flex; gap: 1.5rem; flex-wrap: wrap; }
nav a { color: var(--foreground); font-size: 0.9375rem; }
main { max-width: 48rem; padding: clamp(2.5rem, 7vw, 5rem) 1.5rem 5rem; margin: auto; }
.eyebrow { margin: 0 0 1.2rem; font-size: 0.875rem; color: #425d82; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; }
h1 { margin: 0 0 1.1rem; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.35rem, 6vw, 3.7rem); line-height: 1.13; font-weight: 400; letter-spacing: -0.035em; }
h2 { margin: 2.6rem 0 0.65rem; font-size: 1.25rem; line-height: 1.35; font-weight: 700; }
p { margin: 0 0 1.1rem; font-size: 1.0625rem; }
.lead { font-size: 1.3rem; color: #425775; margin-bottom: 2rem; }
.page-links { border-top: 1px solid var(--border); margin-top: 2.5rem; padding-top: 1.5rem; display: flex; gap: 1.5rem 2rem; flex-wrap: wrap; }
footer { max-width: 72rem; margin: auto; border-top: 1px solid var(--border); padding: 1.5rem clamp(1.25rem, 5vw, 4rem); display: flex; gap: 0.5rem 2rem; justify-content: space-between; flex-wrap: wrap; font-size: 0.875rem; color: #51637b; }
.skip-link { position: absolute; left: 1rem; top: -6rem; padding: 0.5rem 1rem; background: white; }
.skip-link:focus { top: 0.5rem; }
@media (max-width: 35rem) { .site-header { align-items: flex-start; flex-direction: column; padding-top: 1.25rem; padding-bottom: 1.25rem; gap: 0.75rem; } }
