/* ── METRAC design-scale tokens ──────────────────────────────────
   Single source of truth for layout, spacing, font, and type scale.
   All values are CSS custom properties; inline <style> blocks
   reference them via var() so this file controls the scale.
   ──────────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root {
  /* Layout */
  --max-width:  1280px;
  --section-v:    40px;
  --section-h:    40px;

  /* Font */
  --font: 'Roboto', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Type scale — 9 named roles */
  --fs-hero:     38px;   /* home hero h1 */
  --fs-section:  28px;   /* section headings */
  --fs-lead:     18px;   /* sub-head / lead lines */
  --fs-body:     16px;   /* body copy */
  --fs-nav:      15px;   /* nav links */
  --fs-eyebrow:  15px;   /* eyebrow / label caps */
  --fs-cta:      15px;   /* CTA button label */
  --fs-cta-sub:  12px;   /* CTA button sub-label */
  --fs-small:    13px;   /* meta / small text */
}

body {
  font-family: var(--font);
}