/* ==========================================================================
   Design Tokens — Trivergent Performance Coaching
   Extracted from LeadConnector inline styles
   ========================================================================== */

:root {
  /* Triadic Color Palette (lab color space) */
  --color-tri-1: lab(68.2 -18.9 -42.6);
  --color-tri-1-contrast: #000;
  --color-tri-2: lab(30.6 13.1 -57.9);
  --color-tri-2-contrast: #fff;
  --color-tri-3: lab(92 59.3 5.48);
  --color-tri-3-contrast: #000;
  --color-tri-4: lab(93.8 8.04 -5.43);
  --color-tri-4-contrast: #000;
  --color-tri-5: lab(85.3 4.01 6.81);
  --color-tri-5-contrast: #000;
  --color-tri-6: lab(51.3 3.54 5.92);
  --color-tri-6-contrast: #000;

  /* Semantic Color Mappings */
  --primary: var(--color-tri-1);
  --secondary: var(--color-tri-2);
  --accent: var(--color-tri-1);
  --accent-dark: var(--color-tri-2);

  /* Named Colors */
  --white: #ffffff;
  --black: #000000;
  --gray: var(--color-tri-5);
  --red: var(--color-tri-3);
  --orange: var(--color-tri-3);
  --yellow: var(--color-tri-3);
  --green: var(--color-tri-1);
  --teal: var(--color-tri-1);
  --malibu: var(--color-tri-1);
  --indigo: var(--color-tri-2);
  --purple: var(--color-tri-4);
  --pink: var(--color-tri-3);
  --transparent: transparent;
  --overlay: rgba(0, 0, 0, 0.5);

  /* Site-Specific Colors (mapped to triadic palette) */
  --color-light-gray: var(--color-tri-4);
  --color-deep-purple: var(--color-tri-2);
  --color-pink-accent: var(--color-tri-3);
  --color-navy: var(--color-tri-2);
  --color-blue: var(--color-tri-1);
  --color-slate: var(--color-tri-5);
  --color-coral: var(--color-tri-3);
  --color-ice: var(--color-tri-5);
  --color-dark-navy: var(--color-tri-2);
  --color-charcoal: var(--color-tri-2);
  --color-mid-gray: var(--color-tri-6);
  --color-off-white: var(--color-tri-4);
  --color-muted-purple: var(--color-tri-6);
  --color-sky: var(--color-tri-1);
  --color-royal: var(--color-tri-2);
  --color-ocean: var(--color-tri-2);

  /* Typography */
  --font-heading: 'Montserrat', sans-serif;
  --font-body: 'Lato', sans-serif;
  --font-open-sans: 'Open Sans', sans-serif;
  --font-roboto: 'Roboto', sans-serif;
  --font-inter-tight: 'Inter Tight', sans-serif;

  /* Font Sizes */
  --text-xs: 14px;
  --text-sm: 16px;
  --text-base: 18px;
  --text-md: 20px;
  --text-lg: 21px;
  --text-xl: 23px;
  --text-2xl: 26px;
  --text-3xl: 32px;
  --text-4xl: 36px;
  --text-5xl: 42px;
  --text-6xl: 60px;

  /* Spacing */
  --space-xs: 5px;
  --space-sm: 10px;
  --space-md: 20px;
  --space-lg: 40px;
  --space-xl: 60px;
  --space-2xl: 80px;
  --space-3xl: 140px;

  /* Layout */
  --container-max: 1170px;
  --container-padding: 20px;

  /* Borders */
  --border-accent: 2px solid var(--green);
  --border-highlight: 5px solid var(--accent);
  --border-box: 10px solid var(--accent);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;
}
