/* Zapier typography tokens.
   Two-face system: Degular Display (substituted → Mona Sans) for hero displays + eyebrows,
   Inter for everything else. Shorthand font tokens: use as `font: var(--type-…)`. */
:root {
  --font-display: 'Mona Sans', 'Inter', system-ui, -apple-system, sans-serif; /* Degular Display substitute */
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  /* ── Display (Degular Display / substitute) ── */
  --type-display-xl: 500 56px/56px var(--font-display);
  --type-display-lg: 500 48px/48px var(--font-display);
  --type-display-md: 500 32px/36px var(--font-display);
  --tracking-display-md: 1px;

  /* ── Sub-display (Inter) ── */
  --type-display-sub-lg: 500 48px/49.92px var(--font-body);
  --type-display-sub-md: 400 32px/40px var(--font-body);
  --type-display-sub-sm: 600 24px/30px var(--font-body);
  --tracking-display-sub-sm: -0.6px;
  --type-display-xs: 700 20px/25px var(--font-body);
  --tracking-display-xs: -0.5px;

  /* ── Body (Inter) ── */
  --type-body-lg: 400 20px/30px var(--font-body);
  --tracking-body-lg: -0.2px;
  --type-body-md: 400 18px/27px var(--font-body);
  --type-body-md-strong: 600 18px/27px var(--font-body);
  --type-body-sm: 400 16px/24px var(--font-body);
  --type-body-sm-strong: 600 16px/24px var(--font-body);
  --type-caption: 400 14px/21px var(--font-body);

  /* ── Labels ── */
  --type-eyebrow: 500 14px/14px var(--font-display); /* ALWAYS uppercase + tracking */
  --tracking-eyebrow: 1px;
  --type-button-md: 600 18px/27px var(--font-body);
  --type-button-sm: 700 14.4px/14.4px var(--font-body);
  --tracking-button-sm: 0.144px;
}