/* Typography — brand guidelines p.5–8:
   Roboto Bold = headings/titles (principal), Roboto Regular = secondary, Roboto "Hollow" (outline) = tertiary/decorative.
   Nunito Sans = subheadings/subtitles. Nunito = running text. */
:root{
  --font-display:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-subhead:"Nunito Sans","Nunito",system-ui,sans-serif;
  --font-body:"Nunito","Nunito Sans",system-ui,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;

  --fw-regular:400;/* @kind font */--fw-medium:500;/* @kind font */--fw-semibold:600;/* @kind font */--fw-bold:700;/* @kind font */--fw-black:900;/* @kind font */

  /* Scale (px) — website uses Porto text-1…text-12 (0.8em→~4em) */
  --fs-xs:12px;--fs-sm:14px;--fs-base:16px;--fs-md:18px;--fs-lg:20px;
  --fs-xl:24px;--fs-2xl:30px;--fs-3xl:36px;--fs-4xl:48px;--fs-5xl:64px;--fs-6xl:80px;

  --lh-tight:1.1;/* @kind font */--lh-snug:1.25;/* @kind font */--lh-normal:1.5;/* @kind font */--lh-relaxed:1.7;/* @kind font */
  --ls-tight:-0.01em;/* @kind font */--ls-normal:0;/* @kind font */--ls-caps:0.06em;/* @kind font */--ls-wide:0.18em;/* @kind font */

  /* Semantic roles */
  --type-display:var(--fw-bold) var(--fs-5xl)/var(--lh-tight) var(--font-display);
  --type-h1:var(--fw-bold) var(--fs-4xl)/var(--lh-tight) var(--font-display);
  --type-h2:var(--fw-bold) var(--fs-3xl)/var(--lh-snug) var(--font-display);
  --type-h3:var(--fw-bold) var(--fs-xl)/var(--lh-snug) var(--font-display);
  --type-subtitle:var(--fw-regular) var(--fs-lg)/var(--lh-normal) var(--font-subhead);
  --type-eyebrow:var(--fw-bold) var(--fs-sm)/1 var(--font-subhead);
  --type-body:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body);
  --type-small:var(--fw-regular) var(--fs-sm)/var(--lh-normal) var(--font-body);
  --type-button:var(--fw-bold) var(--fs-sm)/1 var(--font-display);
}