/* ============================================================
   Muse Bio — Base styles v3.0.0 (2026-11-08)
   Element defaults built only from tokens.css. Link after
   fonts.css and tokens.css. Components live in ../components/.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: auto; }
body {
  margin: 0;
  background: var(--mb-surface-page);
  color: var(--mb-text-primary);
  font-family: var(--mb-font-body);
  font-size: var(--mb-fs-body);
  font-weight: var(--mb-fw-regular);
  line-height: var(--mb-lh-body);
  font-variant-numeric: proportional-nums;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img, video, svg { max-width: 100%; height: auto; display: block; }
img { border-radius: var(--mb-radius-none); }
/* Photos get the image radius (3.0.0): put .mb-photo on the img or its wrapper. Logos, diagrams and full-bleed images stay square. */
.mb-photo { border-radius: var(--mb-radius-image); overflow: hidden; }

/* ---- Headings: display face for H1–H3, body face for H4–H6. Sentence case always. ---- */
h1, h2, h3, h4, h5, h6 { margin: 0; text-wrap: balance; color: var(--mb-text-primary); }
h1 { font-family: var(--mb-font-display); font-weight: var(--mb-fw-display); font-size: var(--mb-fs-h1); line-height: var(--mb-lh-display); letter-spacing: var(--mb-tracking-h1); max-width: var(--mb-measure-h1); }
h2 { font-family: var(--mb-font-display); font-weight: var(--mb-fw-display); font-size: var(--mb-fs-h2); line-height: var(--mb-lh-heading); letter-spacing: var(--mb-tracking-h2); max-width: 24ch; }
h3 { font-family: var(--mb-font-display); font-weight: var(--mb-fw-display); font-size: var(--mb-fs-h3); line-height: var(--mb-lh-heading); letter-spacing: var(--mb-tracking-h3); }
h4 { font-size: var(--mb-fs-h4); font-weight: var(--mb-fw-medium); line-height: var(--mb-lh-compact); }
h5, h6 { font-size: var(--mb-fs-body); font-weight: var(--mb-fw-medium); line-height: var(--mb-lh-compact); }

p, ul, ol, blockquote, figure { margin: 0; }
p { max-width: var(--mb-measure-body); }
p + p { margin-top: var(--mb-space-4); }
.mb-lede { font-size: var(--mb-fs-lede); line-height: 1.5; max-width: var(--mb-measure-lede); color: var(--mb-text-primary); }
small, .mb-small { font-size: var(--mb-fs-small); }
.mb-caption { font-size: var(--mb-fs-caption); color: var(--mb-text-muted); line-height: var(--mb-lh-compact); }
strong, b { font-weight: var(--mb-fw-medium); }
em, i { font-style: italic; }

/* ---- Labels and data (3.0.0): body face, sentence case, no mono, no uppercase ---- */
.mb-eyebrow {
  font-family: var(--mb-font-body);
  font-size: var(--mb-fs-small);
  font-weight: var(--mb-fw-medium);
  letter-spacing: var(--mb-tracking-eyebrow);
  color: var(--mb-text-accent);
  line-height: var(--mb-lh-compact);
}
.mb-data {
  font-family: var(--mb-font-body);
  font-size: var(--mb-fs-caption);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  color: var(--mb-text-secondary);
}
.mb-cite { font-family: var(--mb-font-body); font-size: var(--mb-fs-caption); color: var(--mb-text-muted); font-variant-numeric: tabular-nums; }
code, kbd, samp { font-family: ui-monospace, Consolas, monospace; font-size: 0.9em; } /* developer docs only, never brand content */
.mb-cite a { color: inherit; }
sup.mb-ref { font-family: var(--mb-font-body); font-weight: var(--mb-fw-medium); font-size: 0.7em; line-height: 0; vertical-align: super; }
sup.mb-ref a { text-decoration: none; color: var(--mb-text-accent); }

/* ---- Links ---- */
a { color: var(--mb-text-accent); text-decoration: underline; text-underline-offset: 0.14em; text-decoration-thickness: 1px; transition: color var(--mb-dur-state) var(--mb-ease); }
a:hover { color: var(--mb-text-accent-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: var(--mb-border-focus) solid var(--mb-focus-ring);
  outline-offset: 3px;
}

/* ---- Lists ---- */
ul, ol { padding-left: 1.25em; }
li { max-width: var(--mb-measure-body); }
li + li { margin-top: var(--mb-space-2); }

/* ---- Rules and tables (the ledger primitive) ---- */
hr { border: 0; border-top: var(--mb-border-width-hairline) solid var(--mb-border-hairline); margin: 0; }
table { border-collapse: collapse; width: 100%; font-size: var(--mb-fs-small); font-variant-numeric: tabular-nums; }
th, td { text-align: left; padding: var(--mb-space-3) var(--mb-space-3); border-bottom: var(--mb-border-width-hairline) solid var(--mb-border-hairline); vertical-align: top; }
th { font-family: var(--mb-font-body); font-size: var(--mb-fs-caption); font-weight: var(--mb-fw-medium); color: var(--mb-text-muted); }
.mb-tablewrap { overflow-x: auto; }

/* ---- Blockquote: anonymized donor voice ---- */
blockquote { font-size: var(--mb-fs-lede); line-height: 1.45; max-width: 36ch; color: var(--mb-text-primary); }
blockquote footer { margin-top: var(--mb-space-3); }

/* ---- Layout helpers ---- */
.mb-container { width: 100%; max-width: var(--mb-container-content); margin-inline: auto; padding-left: var(--mb-gutter-left); padding-right: var(--mb-gutter-right); }
.mb-container--text { max-width: var(--mb-container-text); }
.mb-container--wide { max-width: var(--mb-container-wide); }
.mb-section { padding-block: var(--mb-space-section); }
.mb-band { background: var(--mb-surface-panel); }
.mb-band--ink { background: var(--mb-surface-ink); color: var(--mb-text-on-ink); }
.mb-band--ink h1, .mb-band--ink h2, .mb-band--ink h3, .mb-band--ink h4 { color: var(--mb-text-on-ink); }
.mb-band--ink a { color: var(--mb-accent-on-ink); }
.mb-band--ink .mb-eyebrow { color: var(--mb-accent-on-ink); }
.mb-band--ink .mb-caption, .mb-band--ink .mb-cite, .mb-band--ink .mb-data { color: var(--mb-text-on-ink-muted); }
.mb-band--coral { background: var(--mb-surface-brand); color: var(--mb-text-on-brand); }
.mb-band--coral h1, .mb-band--coral h2, .mb-band--coral h3, .mb-band--coral .mb-eyebrow, .mb-band--coral a { color: var(--mb-text-on-brand); }
.mb-stack { display: grid; gap: var(--mb-space-4); }
.mb-stack--lg { gap: var(--mb-space-6); }
.mb-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.mb-skip-link { position: absolute; left: var(--mb-space-4); top: -100px; background: var(--mb-surface-ink); color: var(--mb-text-on-ink); padding: var(--mb-space-2) var(--mb-space-4); z-index: 100; }
.mb-skip-link:focus { top: var(--mb-space-4); }

/* ---- Motion discipline ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ---- Print ---- */
@media print {
  body { font-size: 10.5pt; color: #000; background: #fff; }
  a { color: #000; text-decoration: none; }
  .mb-band--ink { background: #fff; color: #000; }
}
