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

:root {
  /* ---- Effortless AI Studio Brand Palette ---- */
  --brand-ink: #0F1923;
  --brand-primary: #4D8AC6;
  --brand-accent: #3E9494;
  --brand-soft: #DCE7F2;
  --brand-surface: #F5F7FA;

  /* Legacy variable mappings to keep all components on the closed palette */
  --brand-indigo: #4D8AC6;
  --brand-violet: #3E9494;
  --brand-aqua: #4D8AC6;
  --brand-pink: #3E9494;

  --brand-gradient: linear-gradient(135deg, #4D8AC6 0%, #3E9494 52%, #4D8AC6 100%);
  --brand-gradient-soft: linear-gradient(135deg, rgba(77, 138, 198, 0.12) 0%, rgba(62, 148, 148, 0.12) 52%, rgba(220, 231, 242, 0.18) 100%);

  /* ---- Surface & ink (light default) ---- */
  --bg: #F5F7FA;
  --bg-alt: #EBF1F7;
  --bg-raised: #FFFFFF;
  --ink-900: #0F1923;
  --ink-700: #1E2D3D;
  --ink-500: #3E5268;
  --ink-300: #8096AE;
  --border: rgba(15, 25, 35, 0.09);
  --border-strong: rgba(15, 25, 35, 0.18);

  /* ---- Glass material ---- */
  --glass-bg: rgba(245, 247, 250, 0.72);
  --glass-bg-strong: rgba(245, 247, 250, 0.9);
  --glass-bg-solid: #F5F7FA;
  --glass-border: rgba(220, 231, 242, 0.9);
  --glass-blur: 20px;
  --glass-shadow: 0 1px 1px rgba(255, 255, 255, 0.7) inset,
                  0 18px 40px -12px rgba(77, 138, 198, 0.16),
                  0 2px 10px rgba(15, 25, 35, 0.05);
  --glass-shadow-sm: 0 1px 1px rgba(255, 255, 255, 0.6) inset,
                     0 8px 24px -8px rgba(77, 138, 198, 0.14);

  /* ---- Elevation (non-glass) ---- */
  --shadow-sm: 0 1px 2px rgba(15, 25, 35, 0.06), 0 1px 1px rgba(15, 25, 35, 0.04);
  --shadow-md: 0 8px 24px -8px rgba(15, 25, 35, 0.12);
  --shadow-lg: 0 24px 48px -16px rgba(15, 25, 35, 0.18);

  /* ---- Typography (Inter site-wide) ---- */
  --font-display: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --fs-h1: 70px;
  --fs-h2: clamp(2rem, 1.5rem + 2.2vw, 3.1rem);
  --fs-h3: 20px;
  --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"] {
  --bg: #0F1923;
  --bg-alt: #162432;
  --bg-raised: #1D3042;
  --ink-900: #FFFFFF;
  --ink-700: #DCE7F2;
  --ink-500: #A2BCD6;
  --ink-300: #6885A5;
  --border: rgba(220, 231, 242, 0.1);
  --border-strong: rgba(220, 231, 242, 0.18);

  --glass-bg: rgba(22, 36, 50, 0.65);
  --glass-bg-strong: rgba(22, 36, 50, 0.85);
  --glass-bg-solid: #0F1923;
  --glass-border: rgba(220, 231, 242, 0.12);
  --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(62, 148, 148, 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: #4D8AC6;
  --brand-violet: #3E9494;
  --brand-aqua: #4D8AC6;
  --brand-pink: #3E9494;

  color-scheme: dark;
}