/*
 * KMT Design Tokens
 * Single source of truth. Never hard-code these values anywhere else.
 */

:root {

  /* ------------------------------------------------------------------ */
  /* Color: Blue scale                                                    */
  /* ------------------------------------------------------------------ */
  --kmt-blue-900: #0F2A4D;
  --kmt-blue-800: #1B3B6F;  /* PRIMARY brand blue */
  --kmt-blue-700: #2E5A8C;
  --kmt-blue-100: #E8EEF6;
  --kmt-blue-50:  #F0F4FB;  /* Very light blue, icon backgrounds */

  /* ------------------------------------------------------------------ */
  /* Color: Green scale                                                   */
  /* ------------------------------------------------------------------ */
  --kmt-green-800: #235a41;  /* Dark green — hover/active state */
  --kmt-green-700: #2D6A4F;  /* ACCENT green primary — matches logo */
  --kmt-green-500: #52B788;  /* Accent green light (eyebrows on dark bg) */
  --kmt-green-100: #D4EFDF;

  /* ------------------------------------------------------------------ */
  /* Color: Neutral scale                                                 */
  /* ------------------------------------------------------------------ */
  --kmt-neutral-900: #1A1A1A;  /* Body text */
  --kmt-neutral-700: #444444;  /* Secondary text, captions */
  --kmt-neutral-600: #595959;  /* Mid-muted text */
  --kmt-neutral-500: #767676;  /* Muted text, AA on white only */
  --kmt-neutral-200: #E5E7EB;  /* Borders, dividers */
  --kmt-neutral-100: #F5F7FA;  /* Alt section background */
  --kmt-neutral-50:  #FAFBFC;  /* Subtle tinted background */
  --kmt-neutral-0:   #FFFFFF;  /* Page background, cards on dark */

  /* ------------------------------------------------------------------ */
  /* Color: Semantic                                                      */
  /* ------------------------------------------------------------------ */
  --kmt-focus: #52B788;  /* Keyboard focus ring */

  /* ------------------------------------------------------------------ */
  /* Spacing (4px base unit)                                             */
  /* ------------------------------------------------------------------ */
  --kmt-space-2xs:  4px;
  --kmt-space-xs:   8px;
  --kmt-space-sm:   12px;
  --kmt-space-md:   16px;
  --kmt-space-lg:   24px;
  --kmt-space-xl:   32px;
  --kmt-space-2xl:  48px;
  --kmt-space-3xl:  64px;
  --kmt-space-4xl:  96px;
  --kmt-space-5xl:  128px;

  /* ------------------------------------------------------------------ */
  /* Border radius                                                        */
  /* ------------------------------------------------------------------ */
  --kmt-radius-sm:   6px;
  --kmt-radius-md:   12px;
  --kmt-radius-lg:   20px;
  --kmt-radius-full: 9999px;

  /* ------------------------------------------------------------------ */
  /* Shadows                                                              */
  /* ------------------------------------------------------------------ */
  --kmt-shadow-sm: 0 1px 2px rgba(15, 42, 77, 0.06), 0 1px 3px rgba(15, 42, 77, 0.08);
  --kmt-shadow-md: 0 4px 6px rgba(15, 42, 77, 0.08), 0 2px 4px rgba(15, 42, 77, 0.06);
  --kmt-shadow-lg: 0 10px 15px rgba(15, 42, 77, 0.10), 0 4px 6px rgba(15, 42, 77, 0.05);

  /* ------------------------------------------------------------------ */
  /* Z-index scale                                                        */
  /* ------------------------------------------------------------------ */
  --kmt-z-base:     0;
  --kmt-z-sticky:   100;
  --kmt-z-dropdown: 200;
  --kmt-z-overlay:  900;
  --kmt-z-modal:    1000;

  /* ------------------------------------------------------------------ */
  /* Typography: Type scale (fluid via clamp)                            */
  /* ------------------------------------------------------------------ */
  --kmt-text-display: clamp(2.5rem, 1.8rem + 3.5vw, 4rem);   /* 40px to 64px */
  --kmt-text-h1:      clamp(2rem, 1.6rem + 2vw, 3rem);        /* 32px to 48px */
  --kmt-text-h2:      clamp(1.625rem, 1.4rem + 1.2vw, 2.25rem); /* 26px to 36px */
  --kmt-text-h3:      clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem); /* 20px to 24px */
  --kmt-text-h4:      1.125rem;    /* 18px */
  --kmt-text-lg:      1.125rem;    /* 18px */
  --kmt-text-base:    1rem;        /* 16px, never smaller */
  --kmt-text-sm:      0.9375rem;   /* 15px */
  --kmt-text-eyebrow: 0.875rem;    /* 14px, uppercased, tracked */

  /* ------------------------------------------------------------------ */
  /* Typography: Line heights                                            */
  /* ------------------------------------------------------------------ */
  --kmt-leading-tight:   1.15;
  --kmt-leading-snug:    1.25;
  --kmt-leading-normal:  1.55;
  --kmt-leading-relaxed: 1.7;

  /* ------------------------------------------------------------------ */
  /* Typography: Letter spacing                                          */
  /* ------------------------------------------------------------------ */
  --kmt-tracking-eyebrow: 0.08em;
  --kmt-tracking-wide:    0.06em;
  --kmt-tracking-tight:   -0.01em;

  /* ------------------------------------------------------------------ */
  /* Typography: Measure (max line length)                               */
  /* ------------------------------------------------------------------ */
  --kmt-measure-body: 65ch;
  --kmt-measure-blog: 70ch;

  /* ------------------------------------------------------------------ */
  /* Layout                                                               */
  /* ------------------------------------------------------------------ */
  --kmt-container-max: 1200px;
}