/**
 * Out-N-Out Skincare — Font faces
 * -----------------------------------------------------------------------------
 * Family/weight mapping is VERIFIED from the live site:
 *   Heading: Butler  (weight 500)
 *   Body/UI: Jost    (weights 400 / 500 / 700)
 *
 * IMPORTANT (licensing): The actual font FILES are NOT bundled. They are
 * commercial/self-hosted fonts and must be legally supplied before shipping.
 * Drop the licensed files into assets/fonts/ using the names below and these
 * rules activate automatically. Until then, the fallbacks in tokens.css
 * (--oon-font-heading / --oon-font-body) render instead — no silent substitute
 * font is introduced. See assets/fonts/README.md.
 *
 * font-display: swap matches the live site's loading behaviour.
 */

/* ---- Butler (headings) --------------------------------------------------- */
@font-face {
	font-family: "Butler";
	src: url("../fonts/butler-medium.woff2") format("woff2"),
		url("../fonts/butler-medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

/* ---- Jost (body / UI) ----------------------------------------------------
 * Jost is the live site's body font (Shopify `M-Body-Font`). It is an
 * open-source SIL OFL family, so the actual file IS bundled — a single variable
 * font covering the 100–900 weight axis (Regular 400 / Medium 500 / SemiBold
 * 600 / Bold 700 all resolve from it). This activates `--oon-font-body: "Jost"`
 * so the site renders Jost instead of the system-ui fallback, matching live.
 */
@font-face {
	font-family: "Jost";
	src: url("../fonts/jost-variable.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Jost";
	src: url("../fonts/jost-variable-italic.woff2") format("woff2");
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}