/* Design tokens for Laura Moschna — Personal Training & Yoga */

:root {
  /* Color — neutrals (scheme 1 · peach & mauve) */
  --color-bg: #F8F4F1;
  --color-surface: #FFFBFA;
  --color-ink: #2A2426;
  --color-ink-muted: #6A6165;
  --color-border: #E6DDD8;

  /* Color — brand accents */
  --color-sage: #8B7380;
  --color-sage-light: #EFE6EA;
  --color-ember: #E0A88C;
  --color-ember-light: #F9EEE6;
  --color-gold: #C4A06A;
  --color-gold-light: #F4ECDD;

  /* Color — semantic */
  --color-success: #6A7A5C;
  --color-error: #B55C5A;
  --color-footer: #2C2628;
  --color-gold-deep: #7A5F2E;

  /* Default accent (pages / sections override this to shift mood) */
  --accent: var(--color-sage);
  --accent-light: var(--color-sage-light);

  /* Typography */
  --font-heading: "Fraunces", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-xs: 0.8rem;
  --fs-sm: 0.9rem;
  --fs-base: 1rem;
  --fs-md: 1.15rem;
  --fs-lg: 1.5rem;
  --fs-xl: 2rem;
  --fs-2xl: 2.75rem;
  --fs-3xl: clamp(2.25rem, 5vw, 3.5rem);

  /* Spacing (8px base) */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;

  /* Layout */
  --container-max: 1140px;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-card: 0 10px 30px rgba(34, 38, 43, 0.06);
  --header-offset: 4.5rem;

  /* Breakpoints (referenced in comments; CSS vars aren't usable inside media queries) */
  --bp-sm: 600px;
  --bp-md: 768px;
  --bp-lg: 1024px;
}

/* Section-level accent overrides — used to shift mood between yoga (calm) and
   training (energetic) content while reusing the same components. */
.section--yoga {
  --accent: var(--color-sage);
  --accent-light: var(--color-sage-light);
}

.section--training {
  --accent: var(--color-ember);
  --accent-light: var(--color-ember-light);
}