:root {
  /* Brand Colors — Monotone Sage palette
     Rose is retired per client feedback. The old --rose variables are
     kept as aliases pointing at sage tones so any remaining references
     in third-party / generated CSS still resolve to brand-correct values. */
  --sage:        #5B8A7C;
  --sage-deep:   #3F6B5E;
  --sage-soft:   #8FB0A4;
  --sage-pale:   #C8D8D1;   /* very soft sage — use for section backgrounds */
  --sage-mist:   #E4ECE8;   /* nearly-white sage tint */

  /* Rose aliases → mapped to sage so legacy CSS still renders monotone */
  --rose:        var(--sage-soft);
  --rose-deep:   var(--sage-deep);
  --rose-soft:   var(--sage-mist);

  --cream:       #F9F7F4;
  --cream-deep:  #EFEBE3;
  --bone:        #FBFAF7;
  --white:       #ffffff;
  --ink:         #2E3A36;
  --ink-soft:    #51605B;
  --ink-mute:    #7E8B86;
  --line:        #E5DED3;
  --line-soft:   #EFE9DF;
  --footer-bg:   #2E3A36;

  /* Type stack */
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;

  --w-normal:  400;
  --w-medium:  500;
  --w-semi:    600;
  --w-bold:    700;
  --w-black:   800;

  /* Type scale */
  --t-xs:   0.6875rem;  /* 11px */
  --t-sm:   0.8125rem;  /* 13px */
  --t-base: 1rem;       /* 16px */
  --t-lg:   1.125rem;   /* 18px */
  --t-xl:   1.375rem;   /* 22px */
  --t-2xl:  1.75rem;    /* 28px */
  --t-3xl:  2.25rem;    /* 36px */
  --t-4xl:  2.875rem;   /* 46px */
  --t-5xl:  3.75rem;    /* 60px */
  --t-6xl:  4.75rem;    /* 76px */

  /* Spacing (8px grid) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;
  --s-25: 100px;
  --s-30: 120px;

  /* Layout */
  --max-w:   1200px;
  --gutter:  clamp(24px, 5vw, 80px);
  --col-gap: clamp(16px, 2.5vw, 40px);

  /* Easing */
  --ease:        cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Duration */
  --d-fast:   150ms;
  --d-base:   300ms;
  --d-slow:   600ms;
  --d-slower: 900ms;

  /* Radius — soft / human */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-pill: 999px;
}