/* ==========================================================================
   PRISM — Design Tokens
   Light theme is the default surface; [data-theme="dark"] overrides below.
   Breakpoints used throughout: 480 / 640 / 768 / 1024 / 1280 / 1440
   ========================================================================== */

:root {
  /* ---- Brand gradient (AI Solutions Dept) ---- */
  --brand-indigo: #324FD7;
  --brand-violet: #324FD7;
  --brand-aqua: #C0F0AA;
  --brand-pink: #FF5C66;
  --brand-accent: #324FD7;
  --brand-gradient: linear-gradient(135deg, #324FD7 0%, #FF5C66 100%);
  --brand-gradient-soft: linear-gradient(135deg, rgba(50,79,215,.12) 0%, rgba(255,92,102,.12) 100%);

  /* ---- Surface & ink (light default) ---- */
  --bg: #F0F3F4;
  --bg-alt: #FFFFFF;
  --bg-raised: #FFFFFF;
  --ink-900: #000000;
  --ink-700: #000000;
  --ink-500: #111111;
  --ink-300: #333333;
  --border: rgba(0, 0, 0, 0.08);
  --border-strong: rgba(0, 0, 0, 0.14);

  /* ---- Glass material ---- */
  --glass-bg: rgba(255, 255, 255, 0.55);
  --glass-bg-strong: rgba(255, 255, 255, 0.72);
  --glass-bg-solid: rgba(255, 255, 255, 0.95);
  --glass-border: rgba(255, 255, 255, 0.65);
  --glass-blur: 20px;
  --glass-shadow: 0 1px 1px rgba(255, 255, 255, 0.7) inset,
                  0 18px 40px -12px rgba(79, 70, 229, 0.16),
                  0 2px 10px rgba(14, 14, 20, 0.05);
  --glass-shadow-sm: 0 1px 1px rgba(255, 255, 255, 0.6) inset,
                     0 8px 24px -8px rgba(79, 70, 229, 0.14);

  /* ---- Elevation (non-glass) ---- */
  --shadow-sm: 0 1px 2px rgba(14, 14, 20, 0.06), 0 1px 1px rgba(14,14,20,.04);
  --shadow-md: 0 8px 24px -8px rgba(14, 14, 20, 0.12);
  --shadow-lg: 0 24px 48px -16px rgba(14, 14, 20, 0.18);

  /* ---- Typography ---- */
  --font-display: "Manrope", sans-serif;
  --font-body: "Manrope", sans-serif;

  --fs-h1: clamp(2.75rem, 1.7rem + 4.2vw, 4.75rem);
  --fs-h2: clamp(2rem, 1.5rem + 2.2vw, 3.1rem);
  --fs-h3: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
  --fs-h4: clamp(1.125rem, 1.05rem + 0.3vw, 1.375rem);
  --fs-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.8125rem;

  --lh-tight: 1.08;
  --lh-snug: 1.3;
  --lh-body: 1.65;

  --ls-tight: -0.03em;
  --ls-snug: -0.015em;
  --ls-wide: 0.08em;

  /* ---- Spacing scale (rem) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --space-section: clamp(3.25rem, 2.5rem + 3vw, 5.5rem);

  /* ---- Radius ---- */
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-full: 999px;

  /* ---- Motion ---- */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 150ms;
  --dur-base: 280ms;
  --dur-slow: 500ms;
  --dur-slower: 900ms;

  /* ---- Layout ---- */
  --container-w: 1240px;
  --container-pad: clamp(1.25rem, 3vw, 2.5rem);
  --header-h: 84px;

  /* ---- Z-index scale ---- */
  --z-base: 1;
  --z-raised: 10;
  --z-nav: 100;
  --z-overlay: 500;
  --z-toast: 1000;

  color-scheme: light;
}

/* ---------------------------------------------------------------------- */
/* Dark theme overrides                                                    */
/* ---------------------------------------------------------------------- */
[data-theme="dark"] {
  --brand-accent: #C0F0AA;
  --bg: #090E26;
  --bg-alt: #0D1538;
  --bg-raised: #121C4A;
  --ink-900: #FFFFFF;
  --ink-700: #FFFFFF;
  --ink-500: #FFFFFF;
  --ink-300: #E2E8F0;
  --border: rgba(255, 255, 255, 0.09);
  --border-strong: rgba(255, 255, 255, 0.16);

  --glass-bg: rgba(255, 255, 255, 0.055);
  --glass-bg-strong: rgba(255, 255, 255, 0.09);
  --glass-bg-solid: rgba(9, 14, 38, 0.94);
  --glass-border: rgba(255, 255, 255, 0.14);
  --glass-shadow: 0 1px 1px rgba(255, 255, 255, 0.08) inset,
                  0 20px 48px -16px rgba(0, 0, 0, 0.6),
                  0 0 60px -20px rgba(50, 79, 215, 0.25);
  --glass-shadow-sm: 0 1px 1px rgba(255, 255, 255, 0.06) inset,
                     0 10px 28px -10px rgba(0, 0, 0, 0.55);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 8px 24px -8px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 24px 48px -16px rgba(0, 0, 0, 0.6);

  --brand-indigo: #324FD7;
  --brand-violet: #324FD7;
  --brand-aqua: #C0F0AA;
  --brand-pink: #FF5C66;

  color-scheme: dark;
}
