/*
 * THE CLOSER METHOD — DESIGN TOKENS (canonical)
 * Locked palette per memory: cream + teal accent + Cormorant Garamond + Montserrat.
 * Use these as the foundation. Page-specific tokens can extend but not contradict.
 * ─────────────────────────────────────────────────────
 */

:root {
  /* CREAM / NEUTRAL FAMILY */
  --cm-cream:        #FEF7F5;
  --cm-cream-deep:   #F4EFE8;
  --cm-blush:        #FDF3EF;
  --cm-paper:        #FFFFFF;
  --cm-paper-warm:   #FBF7EF;
  --cm-paper-warm-2: #FDFAF3;

  /* INK / TEXT */
  --cm-ink:           #2A2A28;
  --cm-ink-deep:      #1A1714;
  --cm-ink-soft:      #4A4A46;
  --cm-ink-muted:     #7A7A70;
  --cm-warm-gray:     #8A8279;
  --cm-stone:         #D4CEC4;
  --cm-rule:          #E8E4DC;
  --cm-divider:       #F2EDE5;

  /* TEAL ACCENT (single brand accent — Wendt-style commitment) */
  --cm-teal:          #13B38B;
  --cm-teal-hover:    #0F9A77;
  --cm-teal-soft:     #EFFCFA;
  --cm-teal-tint:     rgba(19, 179, 139, 0.08);
  --cm-teal-shadow:   rgba(19, 179, 139, 0.25);

  /* SEMANTIC (system feedback only — not for branded UI) */
  --cm-error-bg:      #FBE9E0;
  --cm-error-fg:      #A34A2C;
  --cm-success-bg:    #E6F4EE;
  --cm-success-fg:    #0F7A5A;

  /* TYPOGRAPHY */
  --cm-serif:  'Cormorant Garamond', Georgia, serif;
  --cm-sans:   'Montserrat', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

  /* RADIUS */
  --cm-radius-pill:    100px;
  --cm-radius-card:    16px;
  --cm-radius-card-lg: 18px;
  --cm-radius-tag:     10px;
  --cm-radius-tag-sm:  8px;

  /* SHADOW */
  --cm-shadow-card:        0 4px 14px rgba(0, 0, 0, 0.04);
  --cm-shadow-card-hover:  0 12px 32px rgba(19, 179, 139, 0.08);
  --cm-shadow-cta:         0 6px 18px var(--cm-teal-shadow);
  --cm-shadow-cta-hover:   0 10px 28px rgba(19, 179, 139, 0.35);

  /* MOTION */
  --cm-t-fast: 0.18s;
  --cm-t-base: 0.20s;
  --cm-t-slow: 0.40s;
  --cm-easing: cubic-bezier(0.2, 0.8, 0.3, 1);
}

/*
 * BACKWARD-COMPAT ALIASES (for pages still using sage/terracotta naming)
 * Each old name maps to the locked teal equivalent.
 * Migrate pages off these aliases over time.
 */
:root {
  --sage:        var(--cm-teal-hover);
  --sage-deep:   var(--cm-teal);
  --sage-soft:   var(--cm-teal-soft);
  --sage-whisper:var(--cm-teal-soft);
  --terracotta:  var(--cm-teal);
  --terracotta-dark: var(--cm-teal-hover);
  --terracotta-light: var(--cm-teal-soft);
  --cream:       var(--cm-cream);
  --warm-white:  var(--cm-paper);
  --charcoal:    var(--cm-ink);
}
