/* BaseTide-merktokens, overgenomen uit de huisstijl.
   Mauve #8E6373 is het primaire accent — nadrukkelijk niet blauw. */
:root {
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'DM Mono', ui-monospace, monospace;

  --neutral-50:  #ECECEC;
  --neutral-200: #BAB7BB;
  --neutral-700: #52525A;

  --mauve-50:  #EAE4E6;
  --mauve-200: #D4C4CA;
  --mauve-600: #8E6373;
  --mauve-700: #7a5363;

  --blue-50:  #E5EFF7;
  --blue-500: #3E8AB0;
  --sage-50:  #EEF3EA;
  --sage-200: #DBE8CF;
  --sage-500: #92BC72;
  --warm-50:  #FFEBDF;
  --warm-200: #F5D0BB;
  --warm-500: #DE7544;

  --bg:         #ffffff;
  --bg-subtle:  #F7F6F7;
  --surface:    #ffffff;
  --border:     #E8E6E8;
  --text:       #2A2A30;
  --text-muted: #52525A;
  --text-inv:   #ffffff;

  --on-success: #2d5a1a;
  --on-warning: #7a3a14;
  --on-brand:   #7a5363;

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;

  --radius-sm: 3px;   /* invoervelden */
  --radius-md: 6px;   /* knoppen, badges */
  --radius-lg: 10px;  /* kaarten, panelen */

  --shadow-card: 0 4px 16px rgba(82,82,90,0.09);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-micro: 0.12s;
  --dur-short: 0.18s;
}