/* Soul Strategy Group — design tokens
   Extracted from the SSG interactive style guide. Do not hand-edit values;
   update the style guide first and re-sync. */

@font-face {
  font-family: 'Libertinus Mono';
  src: url('../assets/fonts/LibertinusMono-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- color scales ---- */
  --teal-50:#F3FCFC; --teal-100:#E2F8F8; --teal-200:#C1F1F0; --teal-300:#93E6E5; --teal-400:#61DBD9;
  --teal-500:#155C5B; --teal-600:#114A49; --teal-700:#0D3737; --teal-800:#092726; --teal-900:#051818; --teal-950:#030D0D;

  --charcoal-50:#F7F8F8; --charcoal-100:#ECEEEE; --charcoal-200:#D7DADA; --charcoal-300:#BABEBF; --charcoal-400:#9AA0A2;
  --charcoal-500:#313435; --charcoal-600:#272A2A; --charcoal-700:#1D1F20; --charcoal-800:#151616; --charcoal-900:#0D0E0E; --charcoal-950:#070707;

  --olive-50:#F8F9F6; --olive-100:#F0F1E9; --olive-200:#DEE2D0; --olive-300:#C6CCAD; --olive-400:#ABB588;
  --olive-500:#6C7549; --olive-600:#565E3A; --olive-700:#41462C; --olive-800:#2D311F; --olive-900:#1C1E13; --olive-950:#0F100A;

  --lime-50:#FAFBF3; --lime-100:#F2F7E4; --lime-200:#E4EDC4; --lime-300:#D0E09A; --lime-400:#BAD16B;
  --lime-500:#ACC84C; --lime-600:#8EA934; --lime-700:#6B7F27; --lime-800:#4B591B; --lime-900:#2E3711; --lime-950:#191E09;

  --cream:#F5F3EF;

  /* ---- semantic surfaces / text (light mode) ---- */
  --surface-page: var(--cream);
  --surface-elevated: #FFFFFF;
  --surface-sidebar: var(--charcoal-900);
  --text-primary: var(--charcoal-900);
  --text-secondary: var(--charcoal-600);
  --text-muted: var(--charcoal-400);
  --text-inverse: var(--cream);
  --text-brand: var(--teal-600);
  --border-subtle: var(--charcoal-200);
  --border-default: var(--charcoal-300);
  --interactive: var(--teal-500);
  --interactive-hover: var(--teal-600);
  --interactive-active: var(--teal-700);
  --feedback-success: var(--olive-600);
  --feedback-error:#8C3B2E;
  --feedback-warning:#8A6A1E;
  --feedback-info: var(--teal-600);

  /* ---- gradients / overlays ---- */
  --gradient-brand-primary: linear-gradient(135deg, var(--teal-700) 0%, var(--olive-500) 55%, var(--lime-500) 100%);
  --gradient-secondary: linear-gradient(120deg, var(--olive-700), var(--lime-400));
  --gradient-radial-glow: radial-gradient(circle, var(--lime-400) 0%, transparent 70%);
  --gradient-hero-dark: linear-gradient(180deg, var(--charcoal-950) 0%, var(--teal-800) 100%);
  --overlay-photo-duotone: linear-gradient(160deg, rgba(21,92,91,0.85), rgba(13,55,55,0.95));
  --overlay-hero-scrim: linear-gradient(0deg, rgba(7,7,7,0.75) 0%, rgba(7,7,7,0) 45%);
  --overlay-card-hover: rgba(172,200,76,0.14);
  --overlay-modal-scrim: rgba(7,7,7,0.6);

  /* ---- type ---- */
  --font-primary:'Spectral', serif;
  --font-secondary:'Libertinus Mono', monospace;
  --text-display-2xl:4.5rem; --text-display-xl:3.75rem; --text-display-lg:3rem; --text-display-md:2.25rem;
  --text-display-sm:1.875rem; --text-display-xs:1.5rem; --text-xl:1.25rem; --text-lg:1.125rem;
  --text-md:1rem; --text-sm:0.875rem; --text-xs:0.75rem;

  /* ---- spacing ---- */
  --space-px:1px; --space-0-5:0.125rem; --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem;
  --space-4:1rem; --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem; --space-32:8rem;

  /* ---- radius / borders ---- */
  --radius-none:0; --radius-sm:0.125rem; --radius-md:0.375rem; --radius-lg:0.5rem;
  --radius-xl:0.75rem; --radius-2xl:1rem; --radius-3xl:1.5rem; --radius-full:9999px;
  --border-thin:1px; --border-medium:2px; --border-thick:4px;

  /* ---- shadows ---- */
  --shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);
  --shadow-sm:0 1px 3px 0 rgba(0,0,0,.10), 0 1px 2px -1px rgba(0,0,0,.10);
  --shadow-md:0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.10);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.10), 0 4px 6px -4px rgba(0,0,0,.10);
  --shadow-xl:0 20px 25px -5px rgba(0,0,0,.10), 0 8px 10px -6px rgba(0,0,0,.10);
  --shadow-2xl:0 25px 50px -12px rgba(0,0,0,.25);

  /* ---- motion ---- */
  --duration-fast:100ms; --duration-normal:200ms; --duration-slow:300ms; --duration-slower:500ms;
  --easing-default:cubic-bezier(.4,0,.2,1); --easing-in:cubic-bezier(.4,0,1,1);
  --easing-out:cubic-bezier(0,0,.2,1); --easing-bounce:cubic-bezier(.34,1.56,.64,1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --surface-page: var(--charcoal-950);
    --surface-elevated: var(--charcoal-800);
    --surface-sidebar: var(--charcoal-950);
    --text-primary: var(--cream);
    --text-secondary: var(--charcoal-300);
    --text-muted: var(--charcoal-400);
    --border-subtle: var(--charcoal-700);
    --border-default: var(--charcoal-600);
  }
}