/* ============================================================
   Career Launchpad — shared design tokens (single source of truth)
   Linked by every career tool BEFORE its own stylesheet so the
   palette, type, spacing, radii, shadows and focus ring are
   identical across the hub, Navigator, Roadmap, and sub-pages.
   Previously each tool re-declared an identical :root block.
   ============================================================ */
:root {
  /* Primary Colors - Navy */
  --color-navy-900: #0f1d2f;
  --color-navy-800: #1e3a5f;
  --color-navy-700: #2d5a8f;
  --color-navy-600: #3d7abf;

  /* Texas Gold */
  --color-gold-600: #a88620;
  --color-gold-500: #c9a227;
  --color-gold-400: #d4b84a;

  /* Cyber Point Teal */
  --color-teal-600: #3DB8B0;
  --color-teal-500: #4ECDC4;
  --color-teal-400: #6DD5CD;

  /* Neutrals */
  --color-white: #ffffff;
  --color-gray-50: #fafafa;
  --color-gray-100: #f5f5f5;
  --color-gray-200: #e5e5e5;
  --color-gray-300: #d4d4d4;
  --color-gray-400: #a3a3a3;
  --color-gray-500: #737373;
  --color-gray-600: #525252;
  --color-gray-700: #404040;
  --color-gray-800: #262626;

  /* Semantic */
  --color-success: #22c55e;
  --color-warning: #f59e0b;
  --color-error: #ef4444;
  --color-info: #3b82f6;

  /* Domain Colors */
  --domain-grc: #2d6a3d;
  --domain-architecture: #9C27B0;
  --domain-threat-vuln: #4ECDC4;
  --domain-secops: #3b82f6;
  --domain-ot: #f59e0b;

  /* Typography */
  --font-heading: 'Montserrat', sans-serif;
  --font-body: 'Open Sans', sans-serif;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* Radius */
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);

  /* Focus ring (shared a11y standard) */
  --focus-ring: 0 0 0 3px rgba(78, 205, 196, 0.55);
  --focus-outline: 2px solid var(--color-teal-500);
}

/* Consistent keyboard-focus treatment across every career tool.
   (Navigator previously had no :focus-visible styles at all.) */
*:focus-visible,
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[role="radio"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: var(--focus-outline);
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
  border-radius: var(--radius-md);
}