/* Gabarito loads from Google Fonts (see styles.css). SF Pro is Apple's system face —
   not redistributable; it resolves on Apple devices and falls back elsewhere. */
:root{
  --font-display:"Gabarito",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-ui:"Gabarito",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-system:"SF Pro Display","SF Pro Text","SF Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* Sizes as used in the Figma file */
  --fs-hero:60px;     /* splash wordmark, SemiBold */
  --fs-display:40px;  /* SemiBold */
  --fs-h1:30px;       /* screen headers */
  --fs-h2:24px;
  --fs-title:20px;    /* most common Gabarito size alongside 14px */
  --fs-body:16px;     /* nav labels, button labels (Medium) */
  --fs-small:14px;    /* chips, captions, shortcut labels */
  --fs-tiny:12px;

  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */

  --lh-tight:100%;
  --lh-header:34px;
  --lh-button:18px;
  --lh-body:22px;
  --ls-body:0.2px;

  /* Semantic */
  --type-header:var(--fw-regular) var(--fs-h1)/var(--lh-header) var(--font-display);
  --type-title:var(--fw-regular) var(--fs-title)/1.2 var(--font-display);
  --type-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-ui);
  --type-label:var(--fw-regular) var(--fs-small)/14px var(--font-ui);
  --type-button:var(--fw-medium) var(--fs-body)/var(--lh-button) var(--font-ui);
}