/* DeepDimex — Design tokens (light theme) */

:root {
  --dd-brand-gradient: linear-gradient(
    135deg,
    #182b9b 0%,
    #6d28d9 35%,
    #c026d3 60%,
    #ff6b21 85%,
    #ffb11b 100%
  );
  --dd-brand-blue: #182b9b;
  --dd-brand-purple: #6d28d9;
  --dd-brand-magenta: #c026d3;
  --dd-brand-orange: #ff6b21;
  --dd-brand-yellow: #ffb11b;
  --dd-brand-solid: #6d28d9;

  --dd-color-page: #000000;
  --dd-color-ink: #ffffff;
  --dd-color-dark: #000000;
  --dd-color-surface: #000000;
  --dd-color-raised: #0a0a0a;
  --dd-color-hairline: rgba(255, 255, 255, 0.12);
  --dd-color-light-surface: #000000;
  --dd-color-pale-lime: #111111;
  --dd-color-card-border: rgba(255, 255, 255, 0.14);
  --dd-color-dark-surface: #0a0a0a;
  --dd-color-muted: rgba(255, 255, 255, 0.7);
  --dd-color-signal: #ffb11b;
  --dd-color-light: #ffffff;

  --icon-bg: #111111;
  --accent: #6d28d9;
  --border: rgba(255, 255, 255, 0.14);
  --muted: rgba(255, 255, 255, 0.7);
  --ink: #ffffff;
  --dot: #6d28d9;

  --dd-border-dark: rgba(255, 255, 255, 0.12);
  --dd-border-light: rgba(255, 255, 255, 0.1);
  --dd-border-brand: rgba(109, 40, 217, 0.35);

  --dd-text-on-dark: #ffffff;
  --dd-text-on-light: rgba(255, 255, 255, 0.7);
  --dd-text-body: rgba(255, 255, 255, 0.7);
  --dd-text-muted-on-dark: rgba(255, 255, 255, 0.7);
  --dd-text-muted-on-light: rgba(255, 255, 255, 0.7);

  --dd-max-width: 1320px;
  --dd-page-padding: clamp(20px, 4vw, 64px);
  --dd-header-height: 72px;
  --dd-button-height: 3rem;

  --dd-space-xs: 0.5rem;
  --dd-space-sm: 0.75rem;
  --dd-space-md: 1rem;
  --dd-space-lg: 1.5rem;
  --dd-space-xl: 2rem;
  --dd-space-2xl: 3rem;
  --dd-space-3xl: 4.5rem;
  --dd-space-section: 60px;

  --dd-font-sans: "Poppins", sans-serif;

  --dd-h1: clamp(3.5rem, 3.1rem + 1vw, 4rem);
  --dd-h2: clamp(2.25rem, 2.1rem + 0.4vw, 2.5rem);
  --dd-h3: clamp(1.125rem, 1.05rem + 0.2vw, 1.25rem);
  --dd-h4: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem);

  --dd-display-xl: var(--dd-h1);
  --dd-display-lg: var(--dd-h2);

  --dd-body-lg: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);
  --dd-body: 1rem;
  --dd-label: 0.8125rem;
  --dd-eyebrow: 0.8125rem;
  --dd-button-label: 0.9375rem;

  --dd-leading-h1: 1.1;
  --dd-leading-h2: 1.15;
  --dd-leading-h3: 1.25;
  --dd-leading-h4: 1.2;
  --dd-leading-display: var(--dd-leading-h1);
  --dd-leading-tight: 1.15;
  --dd-leading-body: 1.6;

  --dd-weight-regular: 400;
  --dd-weight-medium: 500;
  --dd-weight-semibold: 600;

  --dd-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dd-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dd-duration-fast: 180ms;
  --dd-duration: 320ms;
  --dd-duration-slow: 700ms;

  --dd-radius-sm: 2px;
  --dd-hairline: 1px;

  --dd-z-header: 100;
  --dd-z-nav: 110;
}

@media (max-width: 599px) {
  :root {
    --dd-space-section: 30px;
  }
}