/* ============================================================
   TYPOGRAPHY.CSS
   Single source of truth for fonts, fluid sizes, weights, and
   line-heights across the whole site.

   This file must be loaded BEFORE any stylesheet that uses
   these tokens (custom-style.css, or any other template/page
   specific CSS) — var() falls back to nothing if the variable
   isn't defined yet in the cascade.

   To change a size/weight/font sitewide: edit it here once.
   ============================================================ */

/* ============================= */
/* FONT FACES                     */
/* ============================= */
@font-face {
	font-family: 'Futura LT Book';
	src: url('/wp-content/uploads/2021/10/FuturaLT-Book.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Futura Round Bold';
	src: url('/wp-content/uploads/2021/10/Futura-Round-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ============================= */
/* TYPOGRAPHY SYSTEM               */
/* Single source of truth.        */
/* Change a value here and it     */
/* updates everywhere it's used.  */
/* ============================= */
:root {
	/* Font families */
	--font-heading: "Futura Round Bold", sans-serif;
	--font-body: "Futura LT Book", sans-serif;

	/* Font weights */
	--fw-heading: 500;
	--fw-body: 400;

	/* Fluid heading sizes: clamp(min, preferred, max)
	   Scaled across a 375px (mobile) to 1900px (wide desktop) viewport range,
	   so a 14"-16" laptop (~1440-1512px) sits comfortably in the middle,
	   not near the max. To recalc after changing min/max:
	   slope = (max_px - min_px) / 1525
	   preferred = (min_px - slope*375)/16 "rem" + (slope*100) "vw"       */
	--font-size-h1: clamp(1.8rem, 1.53rem + 1.15vw, 2.9rem);
	--font-size-h2: clamp(1.5rem, 1.23rem + 1.15vw, 2.6rem);
	--font-size-h3: clamp(1.4rem, 1.23rem + 0.73vw, 2.1rem);
	--font-size-h4: clamp(1.3rem, 1.18rem + 0.52vw, 1.8rem);
	--font-size-h5: clamp(1.2rem, 1.13rem + 0.31vw, 1.5rem);
	--font-size-h6: clamp(1rem, 0.93rem + 0.31vw, 1.3rem);

	/* Fluid body/paragraph/span size */
	--font-size-body: clamp(0.89rem, 0.81rem + 0.33vw, 1.2rem);
	--font-size-sm: clamp(0.7rem, 0.67rem + 0.12vw, 0.81rem);

	/* Shared "Load more" / CTA button text size — was duplicated
	   identically across blogs.php and in-the-news.php */
	--font-size-btn: clamp(14px, 1.6vw, 16px);

	/* Line-heights as unitless ratios so they auto-scale with the fluid font-size above       */
	--lh-h1: 1.15;
	--lh-h2: 1.18;
	--lh-h3: 1.22;
	--lh-h4: 1.28;
	--lh-h5: 1.3;
	--lh-h6: 1.35;
	--lh-body: 1.45;
	--lh-sm: 1.4;
}