/* ==========================================================================
   The Measurement Lab — Spacing, Radius, Borders & Shadows
   Minimal, restrained system. Soft rounded corners on content areas, no
   decorative stripes or accent bars, no heavy shadows.
   ========================================================================== */

:root {
  /* ---- Spacing scale (4px base) ---- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* ---- Corner radii (subtle) ---- */
  --radius-sm: 4px;   /* labels, chips, table cells   */
  --radius-md: 8px;   /* cards, content areas         */
  --radius-lg: 12px;  /* large slide content cards    */
  --radius-pill: 999px;

  /* ---- Borders ---- */
  --border-hairline: 1px solid var(--tml-grey-border);
  --border-divider-rule: 2px solid var(--tml-terracotta);

  /* ---- Shadows (used very sparingly — flat brand) ---- */
  --shadow-none: none;
  --shadow-card: 0 1px 3px rgba(26, 26, 46, 0.08);
  --shadow-raised: 0 4px 16px rgba(26, 26, 46, 0.10);

  /* ---- Layout (deck / document — not used by the website) ---- */
  --slide-w: 1280px;
  --slide-h: 720px;
  --doc-w: 816px;   /* US Letter @ 96dpi */
  --doc-margin: 96px; /* 1in */

  /* ==== WEB LAYOUT (added for the website build) =======================
     The deck spacing scale stops at 64px, smaller than any section rhythm
     the site needs. These extend it.

     REVISED July 2026, same correction as the type scale.
     An earlier version normalised container width to 1180px and every
     section's vertical padding to 104px. Both were wrong:

     - The 1180/1200 split is NOT drift. It is per-page and internally
       consistent: Home is 1200px with 44px gutters (7 + 9 uses), Services
       is 1180px with 40px gutters (9 + 8 uses). Inner content width lands
       within 12px either way, which is why they look identical — but
       forcing Home to 1180 would have narrowed it 20px and rewrapped every
       headline against the approved screenshots.

     - Section padding is NOT one value plus eyeballing. Home runs
       170/116 (hero) - 108 - 116 - 104 - 112 - 104. Those are per-section
       choices; flattening them to 104 would have shifted vertical rhythm
       by up to 10% against the approved design.

     So both are preserved exactly. Per-section padding lives in the
     component rules, not here. The tokens below are DEFAULTS for the
     net-new pages (About, Contact), which have no design to match.       */

  --space-20: 80px;
  --space-24: 96px;
  --space-26: 104px;
  --space-32: 128px;
  --space-40: 160px;

  /* Container: Home values are the default. services.html overrides both
     on :root — see the page-scope block in services.css.                 */
  --container-max:  1200px; /* Home  (Services overrides to 1180px)  */
  --gutter:           44px; /* Home  (Services overrides to 40px)    */
  --gutter-mobile:    20px;

  --container-prose: 760px; /* single-column reading width           */
  --container-narrow:560px; /* form / diagnostic column              */

  --section-y:        104px; /* DEFAULT for net-new pages only       */
  --section-y-mobile:  64px;
  --hero-y:           160px;
  --hero-y-mobile:     80px;

  /* Fixed chrome heights — reserved so the sticky nav and progress bar
     cause no layout shift (build-spec addendum §5). */
  --nav-h:       72px;
  --nav-h-mobile:60px;
  --progress-h:   3px;
}
