/* ── Project Design Tokens ────────────────────────────────────────────
   Incentro huisstijl (Incentro Design System). Light only: the brand is
   warm peach, white and crater. Orange is for accents and large text,
   black is the primary button (white on orange is only 3.3:1).
   ──────────────────────────────────────────────────────────────────── */

:root {
  color-scheme: light;

  --color-orange:           #fe5000;
  --color-crater:           #5f1b23;
  --color-crater-500:       #712f34;
  --color-crater-400:       #905054;
  --color-peach-50:         #fff2ed;
  --color-peach-200:        #ffd8c7;
  --color-peach-300:        #ffcdb4;
  --color-sky-400:          #9acaee;

  --color-text:             #171717;
  --color-text-muted:       #655c5c;
  --color-bg:               #fff2ed;
  --color-surface:          #ffffff;
  --color-border:           #e7e2e0;
  --color-primary:          #171717;
  --color-primary-hover:    #2e2929;
  --color-primary-20:       rgba(254, 80, 0, 0.16);
  --color-secondary-20:     rgba(154, 202, 238, 0.4);
  --color-secondary:        #5f1b23;
  --color-accent:           #5f1b23;
  --color-accent-20:        rgba(154, 202, 238, 0.45);
  --color-muted-20:         rgba(101, 92, 92, 0.12);
  --color-overlay:          rgba(23, 23, 23, 0.5);
  --color-on-primary:       #ffffff;
  --color-hover:            rgba(95, 27, 35, 0.05);
  --color-active:           #fff2ed;
  --color-error:            #b42318;
  --color-error-bg:         rgba(180, 35, 24, 0.09);

  --shadow-card:            0 4px 64px 0 rgba(0, 0, 0, 0.08);
  --shadow-soft:            0 2px 24px 0 rgba(0, 0, 0, 0.04);

  --font-ui:   'Sofia Pro', Poppins, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-code: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

  --radius:      8px;
  --radius-sm:   8px;
  --radius-pill: 100px;
}