:root {
  /* ---- Brand colors ---- */
  --color-primary: #2E7D4F;        /* leaf green */
  --color-primary-dark: #1E5C39;   /* deep leaf */
  --color-ink: #16241C;            /* forest ink (text) */
  --color-bg: #F6F5EC;             /* warm cream */
  --color-card: #FFFFFF;           /* card */
  --color-accent: #F0A93B;         /* mango */
  --color-coral: #EF6A45;          /* coral pop */
  --color-muted: #566356;          /* muted green-gray */
  --color-line: #E5E3D4;           /* hairline / borders */
  --color-sage: #E9F0E2;           /* soft green tint block */
  --color-sage-deep: #DDE9D3;

  /* ---- Typography ---- */
  --font-display: 'Bricolage Grotesque', 'Segoe UI', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ---- Radius ---- */
  --radius-sm: 10px;
  --radius: 18px;
  --radius-lg: 30px;
  --radius-pill: 999px;

  /* ---- Shadows ---- */
  --shadow-sm: 0 2px 10px rgba(22, 36, 28, 0.05);
  --shadow-md: 0 12px 34px rgba(22, 36, 28, 0.10);
  --shadow-lg: 0 28px 64px rgba(22, 36, 28, 0.16);
  --shadow-green: 0 16px 40px rgba(46, 125, 79, 0.28);

  /* ---- Layout ---- */
  --max-width: 1200px;
  --gutter: clamp(20px, 5vw, 40px);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}