:root {
  /* Base palette — extracted from the live site's Elementor kit (post-2167) */
  --navy-900: #1D274E;  /* kit "primary" — headings, dark sections */
  --blue-700: #054B8D;  /* kit "accent" — buttons, links */
  --blue-500: #0093E0;  /* kit "secondary" — nav links, gradients */
  --blue-600: #0C5CB8;  /* gradient stop (service cards) */
  --sky-300:  #54C3FE;  /* kit highlight */

  --gray-900: #292929;  /* kit "text" — body text, footer bg */
  --gray-950: #111111;
  --gray-500: #787878;
  --gray-400: #A7A7A7;
  --gray-200: #D9D9D9;
  --gray-50:  #F8F8F8;

  --white: #FFFFFF;

  --green-500: #22C55E; /* utility — not in kit */
  --amber-500: #F59E0B; /* utility — not in kit */
  --red-500:   #EF4444; /* utility — not in kit */

  /* Semantic aliases */
  --color-primary: var(--blue-700);
  --color-primary-hover: #0A5CA8;
  --color-primary-press: #043A6E;
  --color-primary-tint: rgba(0, 147, 224, 0.10);

  --color-secondary: var(--blue-500);
  --color-highlight: var(--sky-300);

  --color-dark: var(--navy-900);
  --color-text: var(--gray-900);
  --color-text-muted: var(--gray-500);
  --color-text-on-dark: var(--white);
  --color-text-on-dark-muted: rgba(255,255,255,0.68);

  --color-bg: var(--white);
  --color-bg-subtle: var(--gray-50);
  --color-bg-dark: var(--gray-900); /* footer/testimonials use #292929 */

  --color-border: var(--gray-200);
  --color-border-dark: rgba(255,255,255,0.12);

  --color-success: var(--green-500);
  --color-warning: var(--amber-500);
  --color-error: var(--red-500);

  /* Gradients — service cards use exactly this */
  --gradient-brand: linear-gradient(270deg, #0093E0 0%, #0C5CB8 100%); /* @kind color */
  --gradient-dark: linear-gradient(180deg, #1D274E 0%, #111A38 100%); /* @kind color */
}
