/* ==========================================================================
   THH Font Overrides (Performance + CLS) — optimized
   ========================================================================== */

:root{
  --thh-font-primary:"Poppins","Poppins Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --thh-font-body:   "Poppins","Poppins Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  /* If you truly want Josefin only in selective areas, DO NOT set it as body.
     Use it on specific below-the-fold sections/classes instead. */
}

/* ---- 1) CLS-safe fallback fonts (no downloads) -------------------------- */
/* Provide both 400 + 700 so bold text doesn’t reflow */
@font-face{
  font-family:"Poppins Fallback";
  src:local("Arial");
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
  size-adjust:105%;
  ascent-override:90%;
  descent-override:22%;
  line-gap-override:0%;
}

@font-face{
  font-family:"Josefin Sans Fallback";
  src:local("Arial");
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
  size-adjust:112%;
  ascent-override:92%;
  descent-override:24%;
  line-gap-override:0%;
}

/* ---- 2) Webfonts (ONLY what you use) ----------------------------------- */
/* Poppins 400 (critical) */
@font-face{
  font-family:"Poppins";
  src:
    local("Poppins Regular"),
    local("Poppins"),
    url("/wp-content/themes/yootheme-thr/fonts/poppins-5d280ea4.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;          /* keep swap for above-the-fold */
  size-adjust:105%;
  ascent-override:90%;
  descent-override:22%;
  line-gap-override:0%;
}

/* Poppins 700 (ONLY if you truly use bold AND the file exists) */
@font-face{
  font-family:"Poppins";
  src:
    local("Poppins Bold"),
    local("Poppins"),
    url("/wp-content/themes/yootheme-thr/fonts/poppins-700.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;          /* still fine; it’s the same family */
  size-adjust:105%;
  ascent-override:90%;
  descent-override:22%;
  line-gap-override:0%;
}

/* Josefin Sans 400 (non-critical) */
@font-face{
  font-family:"Josefin Sans";
  src:
    local("Josefin Sans Regular"),
    local("Josefin Sans"),
    url("/wp-content/themes/yootheme-thr/fonts/josefinsans-eec66087.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:optional;      /* big PSI/CLS help: don’t chase it on slow loads */
  size-adjust:112%;
  ascent-override:92%;
  descent-override:24%;
  line-gap-override:0%;
}

/* ---- 3) Force ONE font above-the-fold ---------------------------------- */
header,
.uk-navbar, .uk-navbar-container,
.uk-section:first-of-type,
.uk-cover-container, .uk-hero, .hero, .page-hero,
h1, h2, h3, .uk-heading-large, .uk-heading-medium{
  font-family:var(--thh-font-primary) !important;
}

/* ---- 4) Default body font ------------------------------------------------ */
html, body{
  font-family:var(--thh-font-body) !important;
}

/* ---- 5) If you still want Josefin anywhere, scope it narrowly ------------ */
/* Example: only “content body” blocks (below the fold), not global */
/*
.article-body, .entry-content, .uk-article{
  font-family:"Josefin Sans","Josefin Sans Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*/
