/*
 * tokens.css — gedeelde design-tokens, bron: de React-landing (assets/index-*.css :root).
 * De landing is source of truth; dit bestand mapt die waarden op de shop-variabelen.
 * Laadt NA site.css zodat deze :root-waarden winnen.
 * Landing: ink #17211d · green #1c6f5d · green-dark #12483e · amber #c98435 · paper #f8f5ee · cream #fffaf0
 */
:root {
  --bg: #f8f5ee;                 /* paper */
  --bg-soft: #eff4f1;            /* soft-green */
  --surface: rgba(255, 255, 255, 0.92);
  --surface-strong: #fffaf0;     /* cream */
  --text: #17211d;               /* ink */
  --text-soft: #5b665f;          /* muted */
  --line: rgba(23, 33, 29, 0.14);
  --line-strong: rgba(23, 33, 29, 0.24);
  --brand: #1c6f5d;              /* green */
  --brand-deep: #12483e;         /* green-dark */
  --brand-accent: #c98435;       /* amber */
  --brand-soft: #eff4f1;
  --success: #1c6f5d;
  --shadow-soft: 0 14px 38px rgba(23, 33, 29, 0.10);
  --shadow-strong: 0 20px 50px rgba(23, 33, 29, 0.12);
  --radius-xl: 22px;
  --radius-lg: 18px;
  --radius-md: 14px;
  --radius-sm: 8px;
}