/* REB Works design tokens. The only file with raw colour values.
   Colour meanings: --ai = AI at work · --ok = approved / delivered · --gold = REB Works, buttons, "You approve". */

@font-face { font-family: "Big Shoulders Display"; src: url("../fonts/big-shoulders-display.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/instrument-sans.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/ibm-plex-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  --gunmetal: #0b0d12;
  --gunmetal-2: #16181c;
  --gunmetal-line: #2a2c31;
  --ai: #39b6ff;
  --ok: #34d399;
  --gold: #f2c25c;
  --gold-deep: #d99a2b;
  --gold-ink: #1a1408;
  --light: #eef1f4;
  --paper: #fbfcfd;
  --steel: #3f6f98;
  --steel-line: #d5dde5;

  --text-on-dark: #e9edf2;
  --muted-on-dark: #a3adba;
  --text-on-light: #1d2733;
  --muted-on-light: #4b5866;

  --danger: #b42318;

  --font-display: "Big Shoulders Display", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --step--1: 0.875rem;
  --step-0: 1.0625rem;
  --step-1: 1.25rem;
  --step-2: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --step-3: clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --step-4: clamp(2.75rem, 1.6rem + 4.6vw, 5.25rem);

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;

  --radius: 10px;
  --radius-sm: 6px;
  --measure: 62ch;
  --page: 1180px;
  --gutter: max(16px, env(safe-area-inset-left, 0px));
}
