/* The Material Concierge — kleuren, «Maison»-ronde (2026-08-27).
   Dit is de ACTUELE bron, verifieerbaar tegen de :root-blokken van
   ui_kits/marketing/voorstel-c.html en lieferanten.html. */
:root {
  /* Basis */
  --c-white: #FFFFFF;
  --c-cream: #ECE8E0;       /* PAGINA-achtergrond (marketing) */
  --c-ivory: #FBFAF5;       /* paneel / kaart op crème (app) */
  --c-paper: #FEFCF9;       /* paneel in marketing — bijna wit, naar Scott Group */
  --c-linen: #F4EDE1;       /* getinte band (galerie) */
  --c-linen-soft: #F5F2EA;  /* lichtere paneeltint, tussen linnen en ivoor */
  --c-sand: #EAE2D2;        /* diep vlak */
  --c-gold: #CEA95C;        /* primair accent: koppen, pills */
  --c-gold-deep: #A9884A;   /* accent op hover en kleine tekst */
  --c-olive: #A0916A;       /* secundair accent */
  --c-olive-deep: #575240;
  --c-brown-deep: #3A322A;  /* donkere beeldondergrond (leveranciers-productblad) */
  --c-pine: #1C4537;        /* spaarzaam! vrijwel nooit als vlak */
  --c-pine-deep: #143528;
  --c-ink: #2B2722;         /* koppen en body */
  --c-ink-soft: #5A5347;    /* secundaire tekst */
  --c-label: #938775;       /* afgeschaft: gebruik --c-taupe */
  --c-taupe: #8A7A5C;       /* lopende tekst op ivoor (naar Scott Group; hun eigen waarde #9F8D6A is te licht voor WCAG) */
  --c-light: #F4F1E9;       /* tekst op donker beeld */

  /* Haarlijnen als transparant ink, zodat ze meekleuren met het vlak eronder */
  --c-hairline-soft: rgb(43 39 34 / .08);
  --c-hairline: rgb(43 39 34 / .12);
  --c-hairline-strong: rgb(43 39 34 / .15);

  /* Semantisch */
  --surface-page: var(--c-cream);
  --surface-card: var(--c-ivory);
  --surface-paper: var(--c-paper);   /* marketing-panelen */
  --surface-tint: var(--c-linen);
  --surface-tint-soft: var(--c-linen-soft);
  --surface-deep: var(--c-sand);
  --surface-image: var(--c-brown-deep);
  --text-heading: var(--c-ink);
  --text-copy: var(--c-taupe);   /* lopende tekst in marketing-panelen */
  --text-body: var(--c-ink-soft); /* UI-tekst en app */
  --text-muted: var(--c-taupe);
  --text-display: var(--c-taupe);   /* marketingkoppen; ink blijft voor de app */
  --text-accent: var(--c-gold-deep);
  --text-on-dark: var(--c-light);
  --border-hairline: var(--c-hairline);
  --accent-primary: var(--c-gold);
  --accent-secondary: var(--c-olive);
  --focus-ring: var(--c-ink);

  /* Signaal (spaarzaam) */
  --status-ok: #34D399;     /* groene dot in de catalogus-badge */
  --status-warn: #A5854A;
  --status-error: #8C3B2E;
}