/* ==========================================================================
   Design System — The Wellness PR
   ========================================================================== */

:root {
  /* ---- Colors (inspired palette) ---- */
  --color-primary:       #4a7c59;   /* sage green */
  --color-primary-light: #7aab88;   /* soft green */
  --color-primary-dark:  #2d5233;   /* mid green */
  --color-accent:        #c9a96e;   /* warm gold */
  --color-accent-light:  #d4bc8a;

  --color-bg:            #fafaf8;   /* warm white */
  --color-bg-alt:        #f2f0ec;   /* off-white */
  --color-surface:       #ffffff;

  --color-deep:          #1a2e1e;   /* deepest green — for text */
  --color-text:          #1a2e1e;
  --color-text-light:    #2d5233;
  --color-text-inverse:  #fafaf8;

  --color-mist:          #b8d4bf;
  --color-pale:          #e8f2eb;

  /* ---- Typography ---- */
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-hero:    clamp(2.8rem, 5vw, 4.4rem);
  --fs-h2:      clamp(2rem, 3.5vw, 3.2rem);
  --fs-h3:      clamp(1.3rem, 2vw, 1.7rem);
  --fs-body:    0.95rem;
  --fs-small:   0.78rem;

  --fw-light:   300;
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;

  --lh-heading: 1.12;
  --lh-body:    1.85;

  /* ---- Spacing ---- */
  --space-xs:   0.5rem;
  --space-sm:   1rem;
  --space-md:   1.5rem;
  --space-lg:   2.5rem;
  --space-xl:   4rem;
  --space-2xl:  6rem;

  --section-padding: var(--space-2xl) var(--space-sm);

  /* ---- Layout ---- */
  --max-width:  1140px;
  --border-radius: 0px;
  --border-radius-lg: 0px;

  /* ---- Shadows ---- */
  --shadow-sm:  0 1px 3px rgba(26,46,30,0.06);
  --shadow-md:  0 4px 12px rgba(26,46,30,0.08);
  --shadow-lg:  0 8px 30px rgba(26,46,30,0.1);

  /* ---- Transitions ---- */
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;
}