/* =============================================================================
   msgp-base.css — MSGP base typography + utilities
   Extracted verbatim from the former shared/styles/tokens.css tail. The official
   MSGP cascade provides TOKENS only; this is the base element/utility layer the
   app depends on (heading caps, .msgp-* classes, ::selection, reduced-motion).
   Load AFTER the cascade + innovo-aliases shim, BEFORE app.css.
   ============================================================================= */

html { font-family: var(--font-body); color: var(--fg-primary); background: var(--bg-canvas); }
body { margin: 0; font-size: var(--fs-body); line-height: var(--lh-body); -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums lining-nums; }

h1, h2, h3, h4, h5, h6 { margin: 0; font-family: var(--font-display); color: var(--fg-primary); letter-spacing: var(--tr-default); font-feature-settings: "ss01","cv11"; }

h1, .msgp-h1   { font-size: clamp(36px, 3.4vw, var(--fs-h1)); font-weight: var(--fw-regular); line-height: var(--lh-display); }
h1.caps, .msgp-h1--caps { text-transform: uppercase; letter-spacing: var(--tr-caps); }
h2, .msgp-h2   { font-size: var(--fs-h2); font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: var(--tr-caps); line-height: var(--lh-heading); }
h3, .msgp-h3   { font-size: var(--fs-h3); font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: var(--tr-caps); line-height: 0.98; }
h4, .msgp-h4   { font-size: var(--fs-h4); font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: var(--tr-caps); text-decoration: underline; text-underline-offset: 0.22em; text-decoration-thickness: 2px; }

.msgp-eyebrow  { font-size: var(--fs-eyebrow); font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: var(--tr-eyebrow); color: var(--fg-secondary); }

p, .msgp-body  { font-size: var(--fs-body); line-height: var(--lh-body); color: var(--fg-primary); text-wrap: pretty; }
.msgp-body-sm  { font-size: var(--fs-body-sm); }
.msgp-body-lg  { font-size: var(--fs-body-lg); }
strong, .msgp-emphasis { font-weight: var(--fw-bold); }
small, .msgp-caption   { font-size: var(--fs-caption); font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: var(--tr-eyebrow); color: var(--fg-tertiary); }

code, kbd, pre, .msgp-mono { font-family: var(--font-mono); font-size: var(--fs-mono); font-variant-numeric: tabular-nums; }

a, .msgp-link { color: var(--fg-primary); text-decoration: underline; text-underline-offset: 0.18em; text-decoration-thickness: 1.5px; }
a:hover, .msgp-link:hover { text-decoration-thickness: 2.5px; }

.msgp-tabular { font-variant-numeric: tabular-nums lining-nums; }
.msgp-endmark::after { content: " ★"; color: var(--fg-brand); }

::selection { background: var(--army-gold); color: var(--army-black); }
p, li, dd, dt, td, th { hyphens: none; text-align: start; }

@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 1ms; --motion-base: 1ms; --motion-slow: 1ms; }
  *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}