/* Design tokens — verified against Xendat Logo 2025 (spec §42, §80). */
:root {
  /* Color — ink (verified from logo text colour) */
  --color-ink-950: #0d1b2e;
  --color-ink-800: #233047;

  /* Color — navy (verified from logo bars and banner) */
  --color-navy-800: #1a3d5a;
  --color-navy-700: #1d5278;

  /* Color — teal (primary interactive/accent) */
  --color-teal-600: #17778a;

  /* Color — sky (lighter bar tone from logo) */
  --color-sky-400: #6ba0be;

  /* Color — mist (backgrounds) */
  --color-mist-100: #eef4f6;
  --color-mist-50:  #f7fafb;

  /* Color — base */
  --color-white: #ffffff;

  /* Color — gold (use sparingly for maturity/progression emphasis — spec §42) */
  --color-gold-500: #c99a3d;

  /* Color — semantic */
  --color-success: #246b52;
  --color-error:   #a82f2f;
  --color-focus:   #005fcc;

  /* Typography — spec §43 */
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-size-base: 1rem;         /* 16px minimum */
  --line-height-body: 1.6;
  --line-height-heading: 1.2;

  /* Type scale (fluid, spec §43) */
  --text-h1: clamp(2.7rem, 5vw + 1rem, 5rem);
  --text-h2: clamp(2rem, 3vw + 0.5rem, 3.2rem);
  --text-h3: clamp(1.3rem, 1.5vw + 0.5rem, 1.75rem);
  --text-body-lg: clamp(1.125rem, 1vw + 0.5rem, 1.25rem);
  --text-body:    clamp(1rem, 0.5vw + 0.75rem, 1.125rem);
  --text-sm: 0.875rem;
  --text-xs: 0.75rem;

  /* Spacing */
  --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;

  /* Layout */
  --content-max:   1280px;
  --content-prose: 760px;
  --content-wide:  1440px;

  /* Border */
  --radius-sm:  0.25rem;
  --radius-md:  0.5rem;
  --radius-lg:  0.75rem;
  --radius-xl:  1rem;
  --radius-pill: 100vmax;

  /* Shadow */
  --shadow-sm: 0 1px 3px 0 rgb(16 37 47 / 0.08), 0 1px 2px -1px rgb(16 37 47 / 0.06);
  --shadow-md: 0 4px 6px -1px rgb(16 37 47 / 0.08), 0 2px 4px -2px rgb(16 37 47 / 0.06);
  --shadow-lg: 0 10px 15px -3px rgb(16 37 47 / 0.08), 0 4px 6px -4px rgb(16 37 47 / 0.05);

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;

  /* Z-index layers */
  --z-base:       0;
  --z-raised:    10;
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-overlay:   300;
  --z-modal:     400;
  --z-toast:     500;
}
