/* ============================================================
   MARKS METALL — TYPOGRAPHY TOKENS
   Display: Saira (engineered grotesque, used uppercase for headlines)
   Body:    Roboto (brand typeface)
   Mono:    Roboto Mono (specs, dimensions, part numbers)
   ============================================================ */
:root {
  --font-display: 'Saira', 'Roboto', system-ui, sans-serif;
  --font-body:    'Roboto', system-ui, -apple-system, sans-serif;
  --font-mono:    'Roboto Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Weights */
  --fw-light: 300;     /* @kind font */
  --fw-regular: 400;   /* @kind font */
  --fw-medium: 500;    /* @kind font */
  --fw-semibold: 600;  /* @kind font */
  --fw-bold: 700;      /* @kind font */

  /* Type scale (fluid-ready px values) */
  --fs-display-2xl: 88px;  /* hero monster */
  --fs-display-xl: 64px;
  --fs-display-lg: 48px;
  --fs-h1: 38px;
  --fs-h2: 30px;
  --fs-h3: 23px;
  --fs-h4: 19px;
  --fs-lead: 19px;   /* intro paragraph */
  --fs-body: 16px;
  --fs-sm: 14px;
  --fs-xs: 13px;
  --fs-2xs: 11px;    /* eyebrow / label */

  /* Line heights */
  --lh-tight: 1.05;    /* @kind other */
  --lh-snug: 1.2;      /* @kind other */
  --lh-heading: 1.3;   /* @kind other */
  --lh-body: 1.7;      /* @kind other */
  --lh-relaxed: 1.85;  /* @kind other */

  /* Tracking */
  --ls-tight: -0.02em; /* @kind other */
  --ls-normal: 0;      /* @kind other */
  --ls-wide: 0.04em;   /* @kind other */
  --ls-wider: 0.12em;  /* @kind other */
  --ls-mono: 0.02em;   /* @kind other */
}