/* WikiBlueprint design system, generated from tokens.json v1.0 (2026-09-03). Edit tokens.json, not this file. */
@import url('https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,400;0,500;0,700;1,400&display=swap');

:root {
  /* color */
  --wb-color-navy: #1F3A63;
  --wb-color-gold: #B08A2E;
  --wb-color-gold-light: #D9B45B;
  --wb-color-body: #222222;
  --wb-color-gray: #595959;
  --wb-color-slate: #8A94A6;
  --wb-color-rule: #C9CFDA;
  --wb-color-fill: #EDF2FA;
  --wb-color-white: #FFFFFF;
  --wb-color-navy-deep: #162B4A;
  /* type */
  --wb-font: 'Spectral', Georgia, 'Times New Roman', serif;
  --wb-font-size: 18px;
  --wb-leading: 1.6;
  --wb-leading-heading: 1.15;
  --wb-measure: 68ch;
  --wb-size-display: 3.05rem;
  --wb-size-h1: 2.44rem;
  --wb-size-h2: 1.95rem;
  --wb-size-h3: 1.56rem;
  --wb-size-h4: 1.25rem;
  --wb-size-body: 1.0rem;
  --wb-size-small: 0.83rem;
  /* space */
  --wb-space-1: 4px;
  --wb-space-2: 8px;
  --wb-space-3: 12px;
  --wb-space-4: 16px;
  --wb-space-5: 24px;
  --wb-space-6: 32px;
  --wb-space-7: 48px;
  --wb-space-8: 64px;
  --wb-space-9: 96px;
  --wb-space-10: 128px;
  --wb-max-width: 1120px;
  --wb-gutter: 24px;
  --wb-section-padding: 96px;
  /* rules and radius */
  --wb-rule-gold: 1.67px solid #B08A2E;
  --wb-rule-section: 1px solid #C9CFDA;
  --wb-rule-slate: 1px solid #8A94A6;
  --wb-radius-control: 3px;
}

/* base */
html { font-family: var(--wb-font); font-size: var(--wb-font-size); line-height: var(--wb-leading); color: var(--wb-color-body); background: var(--wb-color-white); -webkit-text-size-adjust: 100%; }
body { margin: 0; }
*, *::before, *::after { box-sizing: border-box; }
h1, h2, h3, h4 { font-weight: 500; color: var(--wb-color-navy); line-height: var(--wb-leading-heading); margin: 0 0 var(--wb-space-4); }
h1 { font-size: var(--wb-size-h1); line-height: 1.1; }
h2 { font-size: var(--wb-size-h2); padding-bottom: var(--wb-space-2); border-bottom: var(--wb-rule-section); margin-top: var(--wb-space-7); }
h3 { font-size: var(--wb-size-h3); margin-top: var(--wb-space-6); }
h4 { font-size: var(--wb-size-h4); font-weight: 700; margin-top: var(--wb-space-5); }
.wb-display { font-size: var(--wb-size-display); font-weight: 500; line-height: 1.05; color: var(--wb-color-navy); margin: 0 0 var(--wb-space-5); }
p, ul, ol { margin: 0 0 var(--wb-space-4); max-width: var(--wb-measure); }
small, .wb-small { font-size: var(--wb-size-small); line-height: 1.5; }
.wb-secondary { color: var(--wb-color-gray); }
a { color: var(--wb-color-navy); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--wb-color-navy-deep); text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--wb-color-gold); outline-offset: 3px; }
strong { font-weight: 700; }
img { max-width: 100%; height: auto; display: block; }

/* layout */
.wb-container { max-width: var(--wb-max-width); margin: 0 auto; padding: 0 var(--wb-gutter); }
.wb-section { padding: var(--wb-section-padding) 0; }
.wb-section-fill { background: var(--wb-color-fill); }
.wb-band { background: var(--wb-color-navy); color: var(--wb-color-white); }
.wb-band h1, .wb-band h2, .wb-band h3, .wb-band h4, .wb-band .wb-display { color: var(--wb-color-white); }
.wb-band h2 { border-bottom-color: rgba(255,255,255,0.25); }
.wb-band a { color: var(--wb-color-white); }
.wb-band .wb-accent { color: var(--wb-color-gold-light); }
.wb-rule-gold { border: 0; border-top: var(--wb-rule-gold); margin: var(--wb-space-5) 0; }
.wb-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wb-space-7); }
@media (max-width: 720px) { .wb-two-col { grid-template-columns: 1fr; } .wb-section { padding: var(--wb-space-8) 0; } html { font-size: 17px; } }

/* header and footer */
.wb-header { display: flex; align-items: center; justify-content: space-between; padding: var(--wb-space-4) 0; }
.wb-header img { height: 40px; width: auto; }
.wb-nav { display: flex; gap: var(--wb-space-5); }
.wb-nav a + a { margin-left: var(--wb-space-5); }
.wb-nav a { text-decoration: none; }
.wb-nav a:hover, .wb-nav a[aria-current="page"] { text-decoration: underline; }
.wb-footer { padding: var(--wb-space-8) 0; }
.wb-footer img { width: 220px; margin-bottom: var(--wb-space-5); }

/* buttons */
.wb-button, button.wb-button { display: inline-block; font: inherit; font-weight: 500; line-height: 1.2; color: var(--wb-color-white); background: var(--wb-color-navy); border: 1px solid var(--wb-color-navy); border-radius: var(--wb-radius-control); padding: 12px 24px; text-decoration: none; cursor: pointer; }
.wb-button:hover { background: var(--wb-color-navy-deep); border-color: var(--wb-color-navy-deep); color: var(--wb-color-white); }
.wb-button-secondary, button.wb-button-secondary { background: transparent; color: var(--wb-color-navy); }
.wb-button-secondary:hover { background: var(--wb-color-fill); color: var(--wb-color-navy); }
.wb-band .wb-button { background: var(--wb-color-white); color: var(--wb-color-navy); border-color: var(--wb-color-white); }
.wb-band .wb-button:hover { background: var(--wb-color-fill); }

/* quote box, callout, metadata */
.wb-quote { background: var(--wb-color-fill); padding: var(--wb-space-6); margin: var(--wb-space-6) 0; max-width: var(--wb-measure); }
.wb-quote p { font-style: normal; margin-bottom: var(--wb-space-3); }
.wb-quote cite { font-style: normal; font-size: var(--wb-size-small); color: var(--wb-color-gray); }
.wb-quote cite strong { color: var(--wb-color-navy); font-weight: 700; }
.wb-callout { background: var(--wb-color-fill); padding: var(--wb-space-5); margin: var(--wb-space-5) 0; }
.wb-callout strong:first-child { color: var(--wb-color-navy); }
.wb-meta { background: var(--wb-color-fill); border-collapse: collapse; width: 100%; }
.wb-meta th { text-align: left; color: var(--wb-color-navy); font-weight: 700; padding: 6px 12px; vertical-align: top; width: 11rem; }
.wb-meta td { padding: 6px 12px; }

/* tables */
.wb-table { width: 100%; border-collapse: collapse; font-size: var(--wb-size-small); }
.wb-table th { text-align: left; color: var(--wb-color-navy); font-weight: 700; background: var(--wb-color-fill); padding: 8px 10px; border-top: var(--wb-rule-section); border-bottom: var(--wb-rule-section); }
.wb-table td { padding: 8px 10px; border-bottom: var(--wb-rule-section); vertical-align: top; }

/* forms */
.wb-input, input.wb-input, textarea.wb-input { font: inherit; color: var(--wb-color-body); background: var(--wb-color-white); border: 1px solid var(--wb-color-slate); border-radius: var(--wb-radius-control); padding: 10px 12px; width: 100%; }
.wb-label { display: block; font-weight: 500; color: var(--wb-color-navy); margin-bottom: var(--wb-space-2); }

/* motion and accessibility */
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
.wb-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }