/*
 * Screen typography, loaded after page-specific styles on every public page.
 * Seven shared sizes; no page-specific size exceptions. The label size retains
 * the previously approved monospace setting. Keep print's own point sizes.
 */
@media screen {
  :root {
    --type-mono: .758625rem;
    --type-small: .875rem;
    --type-body: 1rem;
    --type-lead: 1.25rem;
    --type-title: clamp(1.5rem, 1.25rem + 1vw, 2rem);
    --type-heading: clamp(2.25rem, 1.5rem + 3vw, 4rem);
    --type-display: clamp(2.75rem, 1.8rem + 4vw, 5.5rem);
  }

  /* Navigation, buttons and technical labels use the same monospace size. */
  .crh-brand span, .crh-header-meta, .crh-header nav,
  .crh-eyebrow, .crh-kicker, .crh-section-index, .crh-rail-bottom,
  .crh-button, .crh-textlink, .crh-under-note, .crh-diagram-bar,
  .crh-node, .crh-node b, .crh-cloud, .crh-diagram-foot,
  .crh-standard > span, .crh-standard b, .crh-stat-num,
  .crh-intro-grid > div > b, .crh-principle-list article > span,
  .crh-firm-list article > span, .crh-firm-list article > b,
  .crh-form-top, .crh-contact form label, .crh-contact form button,
  .crh-form-note, .crh-footer, .crh-help-tag, .crh-risk-warning b,
  .crh-benefits-heading, .crh-benefit-title, .crh-benefit-value > span,
  .cr-brand span, .cr-top-meta, .cr-contact, .cr-kicker,
  .cr-progress-item, .cr-progress-mark, .cr-rail-index,
  .cr-big-index small, .cr-sector-num, .cr-sector-monogram,
  .cr-select-mark, .cr-priority-num, .cr-priority-tag, .cr-checkbox,
  .cr-inline-note, .cr-assurance > span, .cr-shell .cr-back,
  .cr-shell .cr-next, .cr-step-hint, .cr-visual-top,
  .cr-node, .cr-node-icon, .cr-cloud, .cr-visual-caption span,
  .cr-visual-bottom, .cr-footer, .cr-result-stamp, .cr-result-facts span,
  .cr-honesty, .cr-shell .cr-brief-button,
  .ed-label, .ed-meta, .ed-index, .ed-category, .ed-callout-label,
  .ed-side-note, .ed-value span, .ed-link, .ed-card-index,
  .ed-article-nav a, .ed-editorial-nav a, .ed-readiness-nav a,
  .about-page .about-identity-note, .about-page .about-source-links a,
  .about-page .about-contact-list a span,
  .cv-route-head, .cv-number small, .cv-notice b, .cv-chat-bar,
  .cv-msg span, .cv-composer button, .cv-send-note,
  .workshop-promo-label, .workshop-promo-meta, .workshop-promo-link,
  .workshop-page .workshop-label, .workshop-section-index,
  .workshop-event-line small, .workshop-facts dt,
  .workshop-outline > summary, .workshop-agenda-heading > span,
  .workshop-interest-form > label:not(.workshop-consent),
  .workshop-submit, .workshop-draft-link, .workshop-privacy,
  .workshop-footer-note,
  .cw-sub, .cw-empty small, .cw-msg-label, .cw-status, .cw-btn, .cw-send,
  .cw--inline .cw-sub, .cw--inline .cw-empty small {
    font-size: var(--type-mono);
  }

  /* Supporting information is smaller, but never at mockup-only sizes. */
  .crh-intro-grid > div > small, .cr-rail-note p, .cr-sector-copy small, .cr-team-label,
  .crh-help-list p, .cv-notice p, .cv-msg p, .cv-empty li,
  .ed-map-note, .workshop-aside-note, .workshop-consent,
  .workshop-status, .workshop-direct-email, .cw-notice,
  .cw--inline .cw-notice, .cr-download-error {
    font-size: var(--type-small);
  }

  /* Main reading text and inputs, including the shared chat client. */
  .crh-page, .cr-shell, .cw,
  .crh-brand, .cr-brand, .crh-footer > a:first-child,
  .crh-rail > p, .crh-intro-grid > div > p,
  .crh-contact-intro > p, .crh-stats article p,
  .crh-principle-list p, .crh-firm-list article p,
  .crh-help-grid > div > .crh-help-lede,
  .crh-contact form input, .crh-contact form textarea,
  .cr-rail-intro > p, .cr-workspace-head p, .cr-result-copy,
  .cr-sector-copy strong, .cr-priority-name, .cr-team-step label,
  .cr-team-options button, .cr-team-options button span,
  .cr-result-facts strong, .cr-cloud b, .crh-cloud b,
  .ed-prose p, .ed-prose li, .ed-value p, .ed-card p,
  .ed-journal-head p, .ed-card-arrow, .ed-location address,
  .about-page .about-company-copy p, .about-page .about-founder-copy p,
  .about-page .about-contact p, .about-page .about-contact-list a,
  .cv-route-copy, .cv-composer textarea,
  .ed-journal-intro .ed-deck, .workshop-copy > p,
  .workshop-promo-description, .workshop-facts dd,
  .workshop-outline-intro, .workshop-agenda p, .workshop-form-intro,
  .workshop-interest-form input[type="text"],
  .workshop-interest-form input[type="email"], .cw-msg, .cw-input {
    font-size: var(--type-body);
  }

  /* Introductions, quotes and prominent supporting text. */
  .crh-lede, .crh-proof-head p, .crh-risk-warning p,
  .cr-assurance p, .cr-visual-caption p, .cr-result-stamp span,
  .cr-note-symbol, .cr-core-icon, .crh-compute b,
  .ed-deck, .ed-callout p, .ed-prose h3,
  .ed-article-body .ed-prose > p:first-child,
  .about-page .about-deck,
  .about-page .about-company-copy p:first-child,
  .about-page .about-founder-copy p:first-child,
  .cv-intro > p, .cv-number a, .cv-number span, .cv-empty p,
  .cv-empty b, .cw-empty, .cw--inline .cw-empty,
  .workshop-deck, .workshop-event-line,
  .workshop-promo--rail .workshop-promo-date,
  .workshop-outline-toggle::before, .workshop-agenda h3 {
    font-size: var(--type-lead);
  }

  /* Repeated card headings and smaller section titles. */
  .crh-principle-list h3, .crh-firm-list article h3,
  .crh-benefits .crh-proof-head > p,
  .cr-workspace h2, .cr-result h2, .cr-big-index,
  .ed-prose h2, .ed-value h2, .ed-card h3, .cv-route h2,
  .cw-title, .cw--inline .cw-title,
  .workshop-promo h2, .workshop-promo-date,
  .workshop-form-panel h2, .workshop-copy .workshop-outline h2 {
    font-size: var(--type-title);
  }

  /* Section headings and figures share one scale across pages. */
  .crh-hero-main h2, .crh-rail h1, .crh-intro h2, .crh-principles h2,
  .crh-firms h2, .crh-contact-intro h2, .crh-stats strong,
  .crh-benefits .crh-benefit-value, .crh-data-boundary h2, .cr-rail h1,
  .ed-band h2, .ed-journal-head h2, .ed-location h2,
  .about-page .about-founder-heading h2, .about-page .about-contact h2,
  .workshop-copy h2 {
    font-size: var(--type-heading);
  }

  /* Page titles use the same fluid size, not individual per-page formulas. */
  .ed-hero h1, .ed-article-hero h1,
  .ed-journal-intro h1, .cv-intro h1,
  .workshop-hero h1, .workshop-copy h1 {
    font-size: var(--type-display);
  }
}