/* Gedeelde basiskleuren en algemene basisregels voor alle pagina's.
   Paginaspecifieke uitzonderingen blijven in index.css, privacy.css en 404.css. */
:root {
  /* Vlakken */
  --cream:#fcfaf7;            /* pagina-achtergrond */
  --beige:#f2ede4;            /* afwisselende secties */
  --sage:#a9b7a1;             /* sage-sectie */
  --sage-light:#d5dfce;       /* lichte groentint voor labels op donkergroen: 5,1:1 */
  --sage-tint:#eff3ec;        /* zachte groene vlakjes (cookie-icoon) */
  --surface-warm:#f7f2e9;     /* kaarten op crème */
  --surface-sage:#f1f4ee;     /* sectie visuele ondersteuning */
  --white:#fff;

  /* Terracotta */
  --terracotta:#c98d78;       /* alleen vlakken en knoppen */
  --terracotta-button:#c98d78;
  --terracotta-soft:#ead2c8;  /* hover en actieve staat */
  --terracotta-text:#925c49;  /* terracotta als TEKSTkleur: 5,2:1 op crème, 4,7:1 op beige */

  /* Groen */
  --sage-dark:#556350;        /* koppen, labels: 5,5:1 op beige */
  --sage-deep:#4e5d4b;        /* links, donkere sectie */

  /* Tekst */
  --ink:#2f342d;              /* tekst op terracotta-knoppen en op de sage-sectie */
  --text:#3f443f;
  --muted:#656b62;            /* secundaire tekst: 4,7:1 op beige */

  --line:rgba(97,112,92,.18);
  --soft-shadow:rgba(70,75,67,.10);
}

/* Gemeenschappelijke basis voor de pagina-stijlen. */
* { box-sizing: border-box; }