/* ==========================================================================
   The Director — typographic polish layer
   --------------------------------------------------------------------------
   Loaded AFTER the Webflow stylesheet, so every rule here simply overrides.
   Nothing in the generated Webflow CSS was edited: delete this one file and
   the page renders exactly as it did on webflow.io.
   ========================================================================== */

:root{
  /* Palatino Linotype ships on macOS and Windows but not on Android or most
     Linux builds, where the original stack fell through to a generic serif.
     Book Antiqua / Palladio / Georgia catch those cases with a similar
     old-style colour instead. */
  --serif: "Palatino Linotype", "Book Antiqua", Palatino, "URW Palladio L",
           "P052", Georgia, "Times New Roman", serif;
  --sans:  Arial, "Helvetica Neue", Helvetica, sans-serif;

  --measure: 68ch;   /* ~68 characters per line — the readable range is 60–75 */
  --leading-body: 1.65;
  --leading-display: 1.12;
}

/* --------------------------------------------------------------------------
   1. Leading
   Webflow compiled its responsive line-heights to fixed px values, which
   collapsed below the font size at the mobile breakpoint (.chapter-title was
   22.5px text on a 15px line — ratio 0.67 — so any wrapped heading overlapped
   itself). Unitless ratios scale correctly at every width.
   -------------------------------------------------------------------------- */
.heading-hero        { line-height: 1.05; letter-spacing: -.02em; }
.heading-intro       { line-height: 1.18; letter-spacing: -.01em; }
.chapter-title       { line-height: 1.15; letter-spacing: -.01em; }
.chapter-head        { line-height: 1.3; }
.paragraph-2,
.paragraph-2-copy    { line-height: 1.15; letter-spacing: -.01em; }
.chapter-text,
.paragraph-intro     { line-height: var(--leading-body); }
.link-2              { line-height: 1.5; }
.navigator           { line-height: 1.7; }
.text-block          { line-height: 1.2; }   /* was 2.0 inside a button */

/* --------------------------------------------------------------------------
   2. Measure
   On a 1440px screen .chapter-text ran the full 1094px container — about 127
   characters per line, nearly double the readable maximum. max-width only
   constrains the over-wide blocks; the narrower two-column bios are untouched.
   -------------------------------------------------------------------------- */
.chapter-text        { max-width: var(--measure); }
.paragraph-intro     { max-width: 62ch; }
/* .paragraph-2 already sits at ~20 characters per line on desktop, and a ch-based
   cap there only narrows it further on phones, so it is deliberately left alone. */

/* Paragraph rhythm: space between paragraphs should relate to the leading. */
.chapter-text        { margin-bottom: 1.15em; }
.chapter-text:last-child { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   3. Wrapping
   balance evens out the last line of short headings; pretty prevents single
   word widows in body copy. Both degrade silently on older browsers.
   -------------------------------------------------------------------------- */
.heading-hero, .heading-intro, .chapter-title,
.chapter-head, .paragraph-2, .paragraph-2-copy { text-wrap: balance; }
.chapter-text, .paragraph-intro                { text-wrap: pretty; }

/* --------------------------------------------------------------------------
   4. Font stacks + rendering on dark ground
   Light text on black blooms optically; antialiased rendering thins it back
   to the intended weight on macOS.
   -------------------------------------------------------------------------- */
.heading-hero, .heading-intro, .chapter-title, .chapter-head,
.paragraph-2, .paragraph-2-copy { font-family: var(--serif); }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* --------------------------------------------------------------------------
   5. Numerals
   Chapter numbers and the "< 01" nav suffixes line up when they use tabular,
   lining figures rather than proportional ones.
   -------------------------------------------------------------------------- */
.chapter-number, .navigator { font-variant-numeric: tabular-nums lining-nums; }

/* --------------------------------------------------------------------------
   6. Form
   16px minimum on inputs stops iOS Safari zooming the page on focus, and a
   visible focus ring restores keyboard accessibility.
   -------------------------------------------------------------------------- */
.text-field, .text-field-2, .textarea { font-size: 16px; line-height: 1.5; }
.text-field:focus, .text-field-2:focus, .textarea:focus,
.submit-button-2:focus-visible, .navigator:focus-visible,
a:focus-visible, button:focus-visible {
  outline: 2px solid #9a9a9a;
  outline-offset: 2px;
}
.form-title { letter-spacing: .04em; text-transform: uppercase; font-size: 12px; }

/* --------------------------------------------------------------------------
   7. Housekeeping
   -------------------------------------------------------------------------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){ html { scroll-behavior: auto; } }

::selection { background: #9a9a9a; color: #000; }

/* The "Made in Webflow" badge is injected at runtime by webflow.js and is
   only required on Webflow-hosted sites. */
.w-webflow-badge { display: none !important; }
