/*
 * IsleIQ design tokens.
 * Single source of truth for colour, type, spacing, layout, and motion.
 */

:root {
  --iq-teal: #0d5c63;
  --iq-teal-900: #073c42;
  --iq-teal-800: #0a4b52;
  --iq-teal-700: #0d5c63;
  --iq-teal-600: #11727a;
  --iq-teal-100: #dff3f1;
  --iq-teal-050: #edfafa;

  --iq-amber: #f4a261;
  --iq-amber-700: #c46f2e;
  --iq-amber-600: #df8742;
  --iq-amber-100: #fde8d4;
  --iq-amber-050: #fff4e9;

  --iq-mint: #2ec4b6;
  --iq-mint-700: #168f85;
  --iq-mint-600: #1aa99e;
  --iq-mint-100: #d9f7f4;
  --iq-mint-050: #ecfbf9;

  --iq-navy: #0d2137;
  --iq-navy-900: #071522;
  --iq-navy-800: #0a1a2b;
  --iq-navy-700: #0d2137;
  --iq-navy-600: #143455;

  --iq-slate: #1a2e3b;
  --iq-slate-700: #314858;
  --iq-slate-600: #4b6270;
  --iq-slate-500: #667985;
  --iq-slate-200: #d7e0e6;
  --iq-slate-100: #e6edf1;
  --iq-slate-050: #f4f7f9;
  --iq-white: #ffffff;

  --iq-ai: var(--iq-mint);
  --iq-money: var(--iq-amber);
  --iq-prompts: var(--iq-teal);

  --iq-text-primary: var(--iq-slate);
  --iq-text-secondary: var(--iq-slate-700);
  --iq-text-muted: var(--iq-slate-500);
  --iq-text-inverse: var(--iq-white);
  --iq-text-inverse-muted: rgba(255, 255, 255, 0.72);

  --iq-bg-page: var(--iq-slate-050);
  --iq-bg-surface: var(--iq-white);
  --iq-bg-soft: #eef5f6;
  --iq-bg-dark: var(--iq-navy);
  --iq-bg-deep: var(--iq-navy-900);

  --iq-border: rgba(26, 46, 59, 0.12);
  --iq-border-strong: rgba(26, 46, 59, 0.2);
  --iq-border-inverse: rgba(255, 255, 255, 0.14);
  --iq-focus: rgba(46, 196, 182, 0.44);

  --iq-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --iq-font-display: "Manrope", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --iq-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --iq-text-xs: 0.75rem;
  --iq-text-sm: 0.875rem;
  --iq-text-base: 1rem;
  --iq-text-md: 1.0625rem;
  --iq-text-lg: 1.1875rem;
  --iq-text-xl: 1.375rem;
  --iq-text-2xl: clamp(1.5rem, 1.25rem + 1vw, 2rem);
  --iq-text-3xl: clamp(1.875rem, 1.5rem + 1.5vw, 2.75rem);
  --iq-text-4xl: clamp(2.25rem, 1.75rem + 2.2vw, 3.75rem);
  --iq-text-5xl: clamp(2.75rem, 2rem + 3.4vw, 5rem);

  --iq-leading-tight: 1.08;
  --iq-leading-snug: 1.25;
  --iq-leading-normal: 1.6;
  --iq-leading-loose: 1.75;

  --iq-space-1: 0.25rem;
  --iq-space-2: 0.5rem;
  --iq-space-3: 0.75rem;
  --iq-space-4: 1rem;
  --iq-space-5: 1.25rem;
  --iq-space-6: 1.5rem;
  --iq-space-8: 2rem;
  --iq-space-10: 2.5rem;
  --iq-space-12: 3rem;
  --iq-space-16: 4rem;
  --iq-space-20: 5rem;
  --iq-space-24: 6rem;
  --iq-space-28: 7rem;

  --iq-container: 1180px;
  --iq-container-wide: 1360px;
  --iq-container-narrow: 860px;
  --iq-container-text: 720px;
  --iq-container-pad: clamp(1.25rem, 3vw, 2.5rem);

  --iq-section-sm: clamp(3rem, 7vw, 5rem);
  --iq-section: clamp(4rem, 9vw, 7rem);
  --iq-section-lg: clamp(5rem, 11vw, 9rem);

  --iq-radius-xs: 3px;
  --iq-radius-sm: 4px;
  --iq-radius: 6px;
  --iq-radius-lg: 8px;
  --iq-radius-xl: 12px;
  --iq-radius-pill: 999px;

  --iq-shadow-sm: 0 1px 2px rgba(7, 21, 34, 0.06), 0 8px 24px rgba(7, 21, 34, 0.04);
  --iq-shadow: 0 12px 32px rgba(7, 21, 34, 0.1);
  --iq-shadow-lg: 0 24px 60px rgba(7, 21, 34, 0.16);

  --iq-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --iq-duration-fast: 140ms;
  --iq-duration: 220ms;
  --iq-duration-slow: 360ms;

  --iq-z-base: 0;
  --iq-z-raised: 10;
  --iq-z-header: 200;
  --iq-z-overlay: 300;
  --iq-z-modal: 400;
}

.iq-dark,
.iq-bg-dark,
.iq-bg-deep,
.iq-hero,
.iq-section-dark,
.iq-video-stage {
  --iq-text-primary: var(--iq-white);
  --iq-text-secondary: rgba(255, 255, 255, 0.78);
  --iq-text-muted: rgba(255, 255, 255, 0.58);
  --iq-border: rgba(255, 255, 255, 0.14);
  --iq-border-strong: rgba(255, 255, 255, 0.24);
  --iq-bg-surface: rgba(255, 255, 255, 0.06);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --iq-duration-fast: 0ms;
    --iq-duration: 0ms;
    --iq-duration-slow: 0ms;
  }
}