/* ─────────────────────────────────────────────────────────
   theme-exhibit-type.css — the Exhibit type system.
   Source Serif 4 for headlines and prose, IBM Plex Mono for
   labels, buttons, and data figures — layered over the crimson/
   forensic-white palette from theme-crimson-light.css.

   Scoped entirely to .type-exhibit so it never touches member,
   story, or legacy-broker pages that keep DM Sans. Add the class
   to <body> (alongside page-home / page-darkhero etc.) on any
   page that should carry this identity, and link this stylesheet
   after theme-crimson-light.css.
   ───────────────────────────────────────────────────────── */

.type-exhibit {
  --font-serif: 'Source Serif 4', Georgia, serif;
  --font-sans:  'Source Serif 4', Georgia, serif;
}

/* Mono is wider per character than DM Sans; the base .btn's white-space:
   nowrap (fine for short DM Sans labels) pushes a long CTA past a narrow
   viewport once it's set in mono. Let button labels wrap here. */
.type-exhibit .btn { white-space: normal; text-align: center; font-size: .8125rem; }
@media (max-width: 480px) {
  .type-exhibit #nav .btn { white-space: nowrap; font-size: .75rem; padding: .6rem 1rem; }
}

.type-exhibit .btn,
.type-exhibit .nav-link,
.type-exhibit .feeslider-lead,
.type-exhibit .feeslider-end-h,
.type-exhibit .feeslider-end-p,
.type-exhibit .feeslider-note,
.type-exhibit .feeslider-read,
.type-exhibit .fee-lbl,
.type-exhibit .fee-val,
.type-exhibit .who-c-attr,
.type-exhibit .cmp-th,
.type-exhibit .cmp-td,
.type-exhibit .cmp-scroll-hint,
.type-exhibit .finding-n,
.type-exhibit .legal-note strong,
.type-exhibit .form-lbl,
.type-exhibit .form-input {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
}

/* ── Numbered findings — replaces the circular icon badge on the
     homepage's "why cash" cards with an exhibit-style index. Same
     card-panel chrome (border, radius, padding); only the badge and
     stat treatment change. ── */
.type-exhibit .why-card { display: flex; flex-direction: column; }
.type-exhibit .finding-n {
  font-size: 1.375rem;
  font-weight: 600;
  color: var(--ink-3);
  margin-bottom: 1.25rem;
  display: block;
}

/* ── Section eyebrows read as exhibit tags: tracked mono capitals,
     matching the finding numbers and table headers rather than the
     base .eyebrow's quiet serif-prose treatment. ── */
.type-exhibit .eyebrow {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--primary);
}

/* ── Redaction reveal — a figure ships as a solid bar and wipes away
     on scroll-into-view to show the real number underneath. Guarded
     by prefers-reduced-motion and a hard-ceiling timeout (see the
     page script): the figure is never permanently hidden. ── */
.type-exhibit .redact {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-weight: 600;
  color: var(--primary);
}
.type-exhibit .redact-bar {
  position: absolute;
  inset: 1px -3px;
  background: var(--ink);
  transform-origin: left;
  transition: transform 900ms cubic-bezier(.65, 0, .35, 1);
}
.type-exhibit .redact.on .redact-bar { transform: scaleX(0); }

/* ── Hero footnote stays DM Sans, smaller than the base .875rem — it's
     fine print, not an exhibit data figure, and Source Serif 4 at that
     size read heavier than intended. ── */
.type-exhibit .hero-footnote {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: .75rem;
}

/* ── Source Serif 4's natural ascent+descent at this display size is
     taller than the 1.05 line-height .claim-h sets (true for DM Sans,
     not for this serif) — the glyphs naturally overflow the line box
     top and bottom by design, which is fine under normal overflow, but
     the claim headline's curtain-reveal (.claim-kinetic .claim-h in
     style.css) clips to that exact box via clip-path, permanently
     cutting the 'y' and 'g' of "Paying providers in cash." even after
     the reveal completes — clip-path clips overflowing ink regardless
     of the inset amount. Rather than hand-tune a percentage against
     this font's metrics across the display's clamp() range (fragile,
     and font metrics vary slightly by platform), swap the technique
     for this variant: a plain fade + rise, which never clips glyphs. */
.type-exhibit .claim-kinetic .claim-h {
  clip-path: none;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
}
.type-exhibit .claim-kinetic .claim-h.on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .type-exhibit .claim-kinetic .claim-h { opacity: 1; transform: none; transition: none; }
}