/* Dutch Sound Works — design tokens v1
   Eén licht canvas, zwarte "hardware"-kaarten, geel alleen als signaal. */
:root {
  /* Kleur */
  --canvas: #EFF0EF;      /* Studiomuur: koel gebroken wit, de basis van elke pagina */
  --paper: #FFFFFF;       /* Lichte kaarten en formulieren */
  --ink: #0C0C0B;         /* Tekst en primaire knoppen */
  --hardware: #151514;    /* Donkere kaarten: speler, tray, footer */
  --hardware-2: #222220;  /* Verhoogd vlak binnen hardware */
  --graphite: #6B6C69;    /* Secundaire tekst */
  --line: #D9DAD7;        /* Lijnen op canvas */
  --line-dark: #2E2E2C;   /* Lijnen op hardware */
  --signal: #ECC602;      /* Merkgeel: play, actief, sonic */

  /* Typografie */
  --font-display: "Funnel Display", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Funnel Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fs-hero: clamp(48px, 7.4vw, 124px);
  --fs-h1: clamp(40px, 5.4vw, 88px);
  --fs-h2: clamp(30px, 3.6vw, 56px);
  --fs-h3: clamp(21px, 1.7vw, 26px);
  --fs-body: 17px;
  --fs-small: 15px;
  --fs-mono: 12.5px;

  /* Vorm en ritme */
  --radius-xl: 32px;
  --radius-l: 22px;
  --radius-m: 14px;
  --radius-pill: 999px;
  --gutter: clamp(16px, 3vw, 40px);
  --max: 1440px;
  --section: clamp(168px, 20vw, 320px);

  --ease: cubic-bezier(.2, .7, .1, 1);
}
