/* Design tokens: the only place colors, fonts, spacing and type sizes are defined. */
:root {
  /* Colors */
  --orange: #ff8200;
  --gray: #4b4b4b;
  --white: #ffffff;
  --offwhite: #f5f5f0;
  --stone: #e5e2db;
  --charcoal: #2b2b2b;
  --error: #b42318;

  /* Map-only colors: the network map's speed bands (1–3 days, a warm ramp), the area outside
     the selected time, and the supplier pins (by key in suppliers.json). Never use them anywhere else. */
  --map-day-1: #ff8200;
  --map-day-2: #ffbb33;
  --map-day-3: #f7e4a1;
  --map-outside: #c2beb5;
  --map-supplier-sanmar: #ff8200;
  --map-supplier-ss: #3f8f9a;
  --map-supplier-lat: #26506e;

  /* Fonts (Adobe Fonts project zue1iee) */
  --font-heading: bebas-neue, "Arial Narrow", sans-serif;
  --font-body: bricolage-grotesque, system-ui, sans-serif;

  /* Spacing */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 32px;
  --space-4: 64px;
  --space-5: 128px;
  --gutter: max(20px, 5vw);

  /* Radius */
  --radius-pill: 999px;
  --radius-card: 16px;
  --radius-small: 8px;

  /* Layout */
  --content-max: 1760px;
  --measure: 70ch;
  --header-height: 70px;       /* header bar at the top of the page */
  --header-height-slim: 56px;  /* header bar after scrolling */

  /* Type sizes: fluid from a 390px-wide phone to a 1440px-wide desktop.
     Each value is clamp(phone size, scaling formula, desktop size). */
  --size-h1: clamp(3rem, 2.0714rem + 3.8095vw, 5.5rem);          /* 48 → 88px */
  --size-h2: clamp(1.875rem, 1.5036rem + 1.5238vw, 2.875rem);    /* 30 → 46px */
  --size-h3: clamp(1.625rem, 1.4625rem + 0.6667vw, 2.0625rem);   /* 26 → 33px */
  --size-h4: clamp(1.375rem, 1.2357rem + 0.5714vw, 1.75rem);     /* 22 → 28px (also eyebrow) */
  --size-h5: clamp(1.25rem, 1.1571rem + 0.381vw, 1.5rem);        /* 20 → 24px */
  --size-lead: clamp(1.125rem, 1.0786rem + 0.1905vw, 1.25rem);   /* 18 → 20px */
  --size-body: clamp(1rem, 0.9768rem + 0.0952vw, 1.0625rem);     /* 16 → 17px */
  --size-nav: 1.0625rem;                                         /* 17px (header menu) */
  --size-button: 1rem;                                           /* 16px */
  --size-label: 0.875rem;                                        /* 14px */
  --size-small: 0.875rem;                                        /* 14px */
  --size-chip: 0.75rem;                                          /* 12px */

  /* Line heights */
  --leading-h1: 1;
  --leading-h2: 1.05;
  --leading-h3: 1.1;
  --leading-h4: 1.1;
  --leading-h5: 1.1;
  --leading-lead: 1.5;
  --leading-body: 1.5;
  --leading-nav: 1.2;
  --leading-button: 1;
  --leading-label: 1.4;
  --leading-small: 1.5;
  --leading-chip: 1;

  /* Letter spacing */
  --tracking-h5: 0.03em;
  --tracking-nav: 0.04em;
  --tracking-label: 0.05em;
  --tracking-chip: 0.05em;
}