/* SAVVA typography. Two typefaces carry the entire system; no third face is ever introduced.
   Hierarchy is built with size, weight and space. Source: Brand Guidelines pp.12-14. */
:root {
  --font-display: "Le Monde Livre", "Le Monde Livre Std", Georgia, serif;
  --font-sans: "League Spartan", "Helvetica Neue", Arial, sans-serif;

  /* Weights actually in use */
  --weight-extralight: 200;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;   /* League Spartan default for body copy */
  --weight-semibold: 600; /* Le Monde Livre Demi — the display cut */
  --weight-bold: 700;
  --weight-extrabold: 800;
  --weight-black: 900;

  /* Size scale — px, deliberately sparse */
  --size-display-1: 76px;
  --size-display-2: 56px;
  --size-h1: 44px;
  --size-h2: 34px;
  --size-h3: 26px;
  --size-h4: 20px;
  --size-body-lg: 18px;
  --size-body: 16px;
  --size-body-sm: 14px;
  --size-caption: 13px;
  --size-label: 12px;
  --size-micro: 11px;

  /* Leading */
  --leading-display: 1.06;
  --leading-heading: 1.18;
  --leading-body: 1.62;
  --leading-tight: 1.35;

  /* Tracking — the letterspaced sans carries the operational register */
  --tracking-display: -0.015em;
  --tracking-heading: -0.005em;
  --tracking-body: 0.005em;
  --tracking-label: 0.18em;      /* caps labels, buttons, nav */
  --tracking-descriptor: 0.34em; /* SAFARI LOGISTICS lockup descriptor */

  /* Composed roles */
  --type-display-1: var(--weight-semibold) var(--size-display-1)/var(--leading-display) var(--font-display);
  --type-display-2: var(--weight-semibold) var(--size-display-2)/var(--leading-display) var(--font-display);
  --type-h1: var(--weight-semibold) var(--size-h1)/var(--leading-heading) var(--font-display);
  --type-h2: var(--weight-semibold) var(--size-h2)/var(--leading-heading) var(--font-display);
  --type-h3: var(--weight-semibold) var(--size-h3)/var(--leading-heading) var(--font-display);
  --type-h4: var(--weight-medium) var(--size-h4)/var(--leading-tight) var(--font-sans);
  --type-body: var(--weight-medium) var(--size-body)/var(--leading-body) var(--font-sans);
  --type-body-lg: var(--weight-regular) var(--size-body-lg)/var(--leading-body) var(--font-sans);
  --type-body-sm: var(--weight-medium) var(--size-body-sm)/var(--leading-body) var(--font-sans);
  --type-label: var(--weight-semibold) var(--size-label)/1.2 var(--font-sans);
  --type-quote: italic var(--weight-regular) var(--size-h3)/1.45 var(--font-display);
}