/*
 * Serotiva — self-hosted from /public/fonts/serotiva.
 * Commercial webfont package (woff2 + woff). font-display: swap so
 * fallback renders first and swaps in Serotiva when it loads.
 * text-rendering: optimizeLegibility per vendor recommendation.
 *
 * The "Serotiva fallback" face at the bottom is metric-matched via
 * size-adjust / ascent-override so the fallback sits at roughly the
 * same metrics while Serotiva is loading, minimising CLS.
 */

@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-light-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-light-webfont.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-lightitalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-lightitalic-webfont.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-regular-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-italic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-italic-webfont.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-medium-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-medium-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-mediumitalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-mediumitalic-webfont.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-semibold-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-semibold-webfont.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-semibolditalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-semibolditalic-webfont.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-bold-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-bolditalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-bolditalic-webfont.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-extrabold-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-extrabold-webfont.woff") format("woff");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-extrabolditalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-extrabolditalic-webfont.woff") format("woff");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-black-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-black-webfont.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
  text-rendering: optimizeLegibility;
}
@font-face {
  font-family: "Serotiva";
  src: url("/fonts/serotiva/serotiva-blackitalic-webfont.woff2") format("woff2"),
       url("/fonts/serotiva/serotiva-blackitalic-webfont.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
  text-rendering: optimizeLegibility;
}

/* Metric-matched fallback — occupies the slot while Serotiva loads. */
@font-face {
  font-family: "Serotiva fallback";
  src: local("Inter"), local("Segoe UI"), local("Helvetica Neue"), local("Arial");
  size-adjust: 98%;
  ascent-override: 92%;
  descent-override: 22%;
  line-gap-override: 0%;
}
