:root {
  --color-primary: #0066FF;
  --color-primary-light: #4D94FF;
  --color-primary-dark: #0047B3;
  --color-accent: #FF6B35;
  --color-accent-light: #FF9B7A;
  --color-bg: #0A0A0F;
  --color-bg-secondary: #14141F;
  --color-text: #FFFFFF;
  --color-text-secondary: #A0A0B0;
  --color-text-muted: #606070;
  --color-border: rgba(255,255,255,0.08);
  --color-overlay: rgba(10,10,15,0.8);
  --color-white: #ffffff;
  --color-black: #000000;

  --font-display: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  --text-hero: clamp(3rem, 10vw, 12rem);
  --text-h1: clamp(2.5rem, 6vw, 6rem);
  --text-h2: clamp(2rem, 4vw, 4rem);
  --text-h3: clamp(1.5rem, 2.5vw, 2.5rem);
  --text-h4: clamp(1.125rem, 1.5vw, 1.5rem);
  --text-body: clamp(0.875rem, 1vw, 1.125rem);
  --text-small: clamp(0.75rem, 0.875vw, 0.875rem);
  --text-micro: clamp(0.625rem, 0.75vw, 0.75rem);

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;

  --grid-desktop: repeat(12, minmax(0, 1fr));
  --grid-mobile: repeat(6, minmax(0, 1fr));
  --grid-gap: 1em;
  --grid-margin: 2vw;

  --space-xs: 0.25em;
  --space-sm: 0.5em;
  --space-md: 1em;
  --space-lg: 1.5em;
  --space-xl: 2.5em;
  --space-2xl: 5em;
  --space-3xl: 7em;

  --base-padding-x: var(--grid-margin);
  --base-padding-y: clamp(1.5rem, 3.5vh, 3.5rem);

  --radius-sm: 0.25em;
  --radius-md: 0.5em;
  --radius-lg: 0.8em;
  --radius-xl: 1em;
  --radius-full: 100em;
  --radius-circle: 50%;

  --easing-main: cubic-bezier(0.4, 0, 0.1, 1);
  --easing-aggressive: cubic-bezier(0.35, 0, 0, 1);
  --duration-fast: 0.2s;
  --duration-normal: 0.4s;
  --duration-slow: 0.6s;
  --duration-slower: 0.8s;

  --z-base: 1;
  --z-content: 10;
  --z-header: 52;
  --z-overlay: 100;
  --z-modal: 200;
  --z-cursor: 500;
  --z-preloader: 1000;
}