/* Дизайн-токены. Меняем только здесь — всё остальное обновляется. */

:root {
  /* --- Цвета --- */
  --color-bg: #0E0E10;
  --color-bg-soft: #17171A;
  --color-bg-card: #1C1C20;
  --color-bg-card-hover: #26262B;

  --color-text: #F5F5F0;
  --color-text-muted: #A8A49C;
  --color-text-subtle: #6F6B64;

  --color-accent: #E0572A;
  --color-accent-hover: #F06838;
  --color-accent-soft: rgba(224, 87, 42, 0.15);

  --color-success: #22D3A7;
  --color-warm: #F2C94C;
  --color-cool: #60A5FA;
  --color-pink: #F472B6;
  --color-violet: #A78BFA;

  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-strong: rgba(255, 255, 255, 0.18);

  --color-overlay: rgba(14, 14, 16, 0.72);

  /* --- Типографика --- */
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: var(--font-sans);

  --fs-micro: 0.75rem;          /* 12px */
  --fs-small: 0.875rem;         /* 14px */
  --fs-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);         /* 16–18 */
  --fs-lead: clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);         /* 17–20 */
  --fs-h4: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);           /* 18–22 */
  --fs-h3: clamp(1.375rem, 1.15rem + 1vw, 1.75rem);           /* 22–28 */
  --fs-h2: clamp(1.75rem, 1.4rem + 1.8vw, 2.75rem);           /* 28–44 */
  --fs-h1: clamp(2.25rem, 1.65rem + 3vw, 4rem);               /* 36–64 */
  --fs-hero: clamp(2.5rem, 1.8rem + 3.5vw, 4.5rem);           /* 40–72 */

  --lh-tight: 1.08;
  --lh-snug: 1.25;
  --lh-normal: 1.5;
  --lh-relaxed: 1.65;

  /* --- Spacing --- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  --section-y: clamp(var(--space-2xl), 6vw, var(--space-3xl));
  --container-x: clamp(1rem, 4vw, 2rem);
  --container-max: 1280px;

  /* --- Радиусы --- */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 999px;

  /* --- Shadows --- */
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 8px 20px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.5);

  /* --- Transitions --- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 0.15s;
  --dur-base: 0.25s;
  --dur-slow: 0.4s;

  /* --- Safe area (iOS) --- */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);

  /* --- Z-index --- */
  --z-header: 100;
  --z-mobile-menu: 110;
  --z-modal: 200;
}