/* ============================================================
   26-perf — first-screen content shows on first paint (mobile LCP).
   The interior hero's breadcrumb / H1 / subhead / CTA used [data-reveal] (opacity 0 until
   core.js's observer runs), which pushed Largest Contentful Paint to ~9-13s on phones.
   Below-the-fold reveals are unchanged. Home hero: see js/sections/26-perf.js.
   ============================================================ */
.sec-00-inthero [data-reveal] {
  opacity: 1;
  transform: none;
  transition: none;
}

/* Home hero photo: its top inset was -10% of the hero's height, and the hero grows with its
   content, so when the web fonts swapped in and the headline re-wrapped, the whole photo layer
   jumped (desktop CLS up to ~0.37). A viewport-based top edge looks the same (~90px) but
   doesn't move when the content height changes. */
.sec-02-hero__photo {
  top: -10svh;
}

/* Size-matched fallback fonts. Google Fonts load without blocking first paint, so text first
   renders in the fallback; with a plain Arial fallback the hero headline wrapped differently and
   re-centered when the web font arrived (live desktop CLS ~0.3, "Web font loaded"). size-adjust
   matches each fallback's average glyph width to the web font (measured: Bricolage Grotesque
   800 = 92% of Arial, Instrument Sans 400 = 101.6%); line heights are fixed, so width is what
   decides wrapping. */
@font-face {
  font-family: "Bricolage Fallback";
  src: local("Arial"), local("Helvetica"), local("Roboto");
  size-adjust: 92%;
}
@font-face {
  font-family: "Instrument Sans Fallback";
  src: local("Arial"), local("Helvetica"), local("Roboto");
  size-adjust: 101.6%;
}
:root {
  --font-display: "Bricolage Grotesque", "Bricolage Fallback", sans-serif;
  --font-body: "Instrument Sans", "Instrument Sans Fallback", sans-serif;
}

/* Home hero subhead: max-width was 46ch, and "ch" is the width of the current font's "0", so the
   box changed width when the fallback swapped to Instrument Sans and the text re-wrapped by one line.
   In Instrument Sans 1ch = 0.6664em, so 46ch = 30.65em: same width, but font-independent. */
.sec-02-hero__subhead {
  max-width: 30.65em;
}