/* Design tokens (v3, Nov 2026). Navy and cool grey, Inter Tight for display,
   Instrument Sans for body. Every page's frame derives from here; the case
   studies keep their own world colors in case-*.css. */

@font-face {
  font-family: "Inter Tight";
  src: url("/fonts/InterTight.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Instrument Sans";
  src: url("/fonts/InstrumentSans.woff2") format("woff2");
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
}

:root {
  /* Contrast, measured: ink 16.6:1, navy 13.2:1, text 11.5:1, muted 5.8:1 and
     accent 5.2:1 on ground; muted 6.3:1 on white; on navy, white 14.5:1,
     on-navy-muted 8.3:1, on-navy-accent 7.4:1. */
  --ground: #F3F4F6;
  --face: #FFFFFF;
  --ink: #0E1522;
  --navy: #15294A;
  --text: #2B3342;
  --muted: #576070;
  --line: #DCE0E7;
  --accent: #2F5FD0;
  --on-navy: #FFFFFF;
  --on-navy-muted: #B9C4DA;
  --on-navy-accent: #9DB8FF;

  --font-display: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;

  --step--1: 0.8125rem;
  --step-0: 1rem;
  --step-1: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);
  --step-2: clamp(1.625rem, 1.4rem + 1vw, 2.125rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 7rem;

  --gutter: clamp(1rem, 0.4rem + 3vw, 3.5rem);
  --measure: 34rem;
  --page-max: 80rem;
  --radius: 1.75rem;
  --radius-sm: 0.875rem;

  --shadow-lg: 0 40px 80px -30px rgba(14, 21, 34, 0.45);
  --shadow-md: 0 20px 40px -14px rgba(14, 21, 34, 0.3);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fade: 180ms;
  --dur-enter: 600ms;
}
