/* ============================================================ Global typography override: Poppins + Open Sans ------------------------------------------------------------ 2026-08-20. Replaces inter-typography.css, which stood the whole product on Inter from 2026-07-03. The product now uses the pairing measured on TurboTenant's live dashboard: headings Poppins everything else Open Sans The FILENAME is deliberately family-neutral this time. The previous file was called inter-typography.css, so changing the face meant renaming a file referenced from nine templates, a test, the design sync tool and DESIGN.md. Change the stacks below and nothing needs renaming again. WHY ONE FILE. ~48 templates still carry their own `font-family` declarations, many naming Inter or older marketing faces. Rather than edit all of them, this file forces the current pairing on every text element. `!important` in a stylesheet beats a non-important inline `font-family`, so inline heading styles convert too. The `:not(...)` guard is what keeps this SAFE. It skips the faces that must stay themselves: - icons : , , [class*="fa-"], .fa/.fas/.far/.fab, .material-icons - monospace : 
///, .font-mono,
                    [class*="mono|code|terminal|editor|hljs|token"],
                    [style*="monospace"|"JetBrains"|"Courier"]
     - signature  : [class*="signature|sig-"], [style*="Caveat"|"Brush"|"cursive"]
     - letters    : [style*="Source Serif"]  (letter pages also do not
                    load this file at all)
   Load LAST in each shell so it wins.

   HEADING SPECIFICITY, and this is not optional. The universal rule
   below carries a guard chain of ~20 class selectors, and `:not(.x)`
   takes the specificity of its argument. A plain `h1 { }` rule
   therefore LOSES to it even with !important, and every heading
   silently renders in the body face. Verified live on 2026-08-20: the
   font-weight applied while the font-family did not, which is the
   signature of exactly this bug. The heading rule repeats the same
   guard with `:is(h1..h6)` in place of `*`, which adds one element to
   the count and wins. If you edit one guard, edit both.

   WEIGHTS ARE NOT FORCED. TurboTenant sets every heading to 600. We
   keep our own weight ramp (h1 800, h2/h3 600, and so on) so the
   existing hierarchy survives the face change. Only the family moves.
   ============================================================ */

/* Metric-matched fallback for Open Sans. Before the web font (Google Fonts,
   display=swap) finishes downloading, text renders in local Arial THROUGH this
   @font-face, whose metrics are calibrated so the swap does not change line
   height or wrap points. No reflow means no font-swap layout shift (CLS).
   It MUST sit immediately after "Open Sans" in every stack below.

   Measured in Chrome on 2026-08-20 via canvas TextMetrics, Open Sans against
   local Arial over a 100-character sample:
     size-adjust     = width(Open Sans) / width(Arial) = 101.5%
     ascent-override = (ascent/em) / size-adjust       = 105.4%
     descent-override= (descent/em) / size-adjust      =  28.6%
   The same method reproduced the previous Inter numbers to within 1.7pp,
   which is what validates it. Open Sans sits much closer to Arial in width
   than Inter did (101.5% against 105.6%), so this fallback is a better match
   than the one it replaces. Re-measure if the face ever changes. */
@font-face {
  font-family: "Open Sans Fallback";
  src: local("Arial");
  size-adjust: 101.5%;
  ascent-override: 105.4%;
  descent-override: 28.6%;
  line-gap-override: 0%;
}

/* Poppins is a geometric sans and runs noticeably narrower than Arial
   (measured 94.2% of Arial's width), so headings get their own calibrated
   fallback rather than borrowing the body one. */
@font-face {
  font-family: "Poppins Fallback";
  src: local("Arial");
  size-adjust: 94.3%;
  ascent-override: 94.4%;
  descent-override: 23.3%;
  line-gap-override: 0%;
}

html,
body {
  font-family: "Open Sans", "Open Sans Fallback", ui-sans-serif, system-ui,
    -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  line-height: 1.6;
}

body *:not(i):not(svg):not(pre):not(code):not(kbd):not(samp):not([class*="fa-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.material-icons):not(.font-mono):not([class*="mono"]):not([class*="code"]):not([class*="terminal"]):not([class*="editor"]):not([class*="hljs"]):not([class*="token"]):not([class*="signature"]):not([class*="sig-"]):not([class*="stamp"]):not([style*="monospace"]):not([style*="JetBrains"]):not([style*="Caveat"]):not([style*="Brush"]):not([style*="Courier"]):not([style*="Source Serif"]):not([style*="cursive"]) {
  font-family: "Open Sans", "Open Sans Fallback", ui-sans-serif, system-ui,
    -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* Headings in Poppins. Guard repeated so this out-specifies the rule above:
   see the note in the header block before touching it. */
body
  :is(h1, h2, h3, h4, h5, h6):not(i):not(svg):not(pre):not(code):not(kbd):not(samp):not([class*="fa-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.material-icons):not(.font-mono):not([class*="mono"]):not([class*="code"]):not([class*="terminal"]):not([class*="editor"]):not([class*="hljs"]):not([class*="token"]):not([class*="signature"]):not([class*="sig-"]):not([class*="stamp"]):not([style*="monospace"]):not([style*="JetBrains"]):not([style*="Caveat"]):not([style*="Brush"]):not([style*="Courier"]):not([style*="Source Serif"]):not([style*="cursive"]) {
  font-family: "Poppins", "Poppins Fallback", ui-sans-serif, system-ui,
    -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}