/* Habitat — Typography system
   Plus Jakarta Sans, every role — display, headlines, body, labels, bylines, data.
   No monospace anywhere. One family does the work of color; emphasis comes from real weight (800)
   and wide letter-tracking (labels/eyebrows), not a second typeface. */
:root {
  /* ---- Families (--font-serif/--font-mono kept as aliases for backwards compatibility — all three resolve to the same family) ---- */
  --font-serif: var(--font-sans);
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-mono: var(--font-sans);

  /* Semantic family aliases */
  --font-display: var(--font-serif);
  --font-body: var(--font-sans);
  --font-label: var(--font-mono);

  /* ---- Weights (display runs heavy; body caps at 600) ---- */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 800;

  /* ---- Type scale (web product) ---- */
  --size-numeral: 140px;   /* Cover / chapter numeral, Plus Jakarta Sans 800 */
  --size-display: 58px;    /* Display headline */
  --size-h1: var(--size-display);
  --size-h2: 32px;
  --size-h3: 24px;
  --size-h4: 20px;
  --size-lead: 22px;       /* Article standfirst / lede, Plus Jakarta Sans */
  --size-body: 18px;
  --size-body-sm: 16px;
  --size-caption: 14px;
  --size-eyebrow: 12px;    /* Plus Jakarta Sans uppercase, 0.18em tracking */
  --size-byline: var(--size-caption); /* Supporting text, natural case */
  --size-source: var(--size-caption); /* Readable source lines / footnotes */
  --size-action: 12px;
  --size-wordmark: 52px;

  /* ---- Line heights ---- */
  --leading-tight: 1.05;   /* Numerals, big display */
  --leading-display: 1.08; /* Primary headline */
  --leading-section: 1.15;
  --leading-card: 1.25;
  --leading-lead: 1.55;
  --leading-action: 1.5;
  --leading-snug: 1.35;
  --leading-body: 1.7;     /* Body copy */

  /* ---- Tracking ---- */
  --tracking-display: -0.025em;
  --tracking-heading: -0.02em;
  --tracking-wordmark: -0.06em;
  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-eyebrow: 0.18em;
  --tracking-byline: var(--tracking-normal);
  --tracking-label: 0.14em;
}

/* Reference web breakpoints; Elementor uses its configured site breakpoints. */
@media (max-width: 1024px) {
  :root {
    --size-display: 48px;
    --size-h2: 30px;
    --size-lead: 20px;
    --size-wordmark: 48px;
  }
}
@media (max-width: 767px) {
  :root {
    --size-display: 36px;
    --size-h2: 28px;
    --size-h3: 23px;
    --size-lead: 18px;
    --size-eyebrow: 11px;
    --size-wordmark: 42px;
  }
}
