/* ===================================
   WEBNERIVO - CSS VARIABLES
   Дизайн-система проекта
   =================================== */

:root {
  /* ===== ЦВЕТА ===== */
  --color-bg: #131A27;
  --color-bg-secondary: #172033;
  --color-surface: #F8FAFC;
  --color-surface-light: #FFFFFF;
  --color-surface-glass: rgba(255, 255, 255, 0.08);
  --color-primary: #3B82F6;
  --color-primary-light: #60A5FA;
  --color-secondary: #6366F1;
  --color-accent-cyan: #38BDF8;
  --color-glow: rgba(59, 130, 246, 0.18);
  --color-text: #F1F5F9;
  --color-text-secondary: #A8B3C7;

  /* ===== WEBNERIVO BRAND MATERIALS ===== */
  --nerivo-ink: #0B111D;
  --nerivo-graphite: #121A28;
  --nerivo-graphite-soft: #1A2435;
  --nerivo-cold-silver: #D8E0EA;
  --nerivo-paper: #F4F1EA;
  --nerivo-paper-muted: #E7E1D6;
  --nerivo-paper-ink: #111827;
  --nerivo-signal: #7DD3FC;
  --nerivo-signal-soft: rgba(125, 211, 252, .42);
  --nerivo-signal-faint: rgba(125, 211, 252, .12);
  --nerivo-signal-line: 1px;
  --nerivo-signal-response: 220ms cubic-bezier(.22, 1, .36, 1);
  --nerivo-line: rgba(216, 224, 234, .16);
  --nerivo-line-strong: rgba(216, 224, 234, .28);
  --nerivo-shadow-paper: 0 24px 70px rgba(7, 11, 20, .22);
  --nerivo-shadow-studio: 0 26px 80px rgba(4, 8, 17, .36);
  --nerivo-light-zone-cyan: rgba(125, 211, 252, .08);
  --nerivo-light-zone-blue: rgba(96, 165, 250, .07);
  --nerivo-light-zone-silver: rgba(216, 224, 234, .055);

  /* ===== WEBNERIVO MOTION ===== */
  --motion-line-draw: 900ms cubic-bezier(.22, 1, .36, 1);
  --motion-soft-reveal: 620ms cubic-bezier(.22, 1, .36, 1);
  --motion-hover-shift: 260ms ease;

  /* ===== ГРАНИЦЫ ===== */
  --border-width: 1px;
  --border-color: rgba(255, 255, 255, 0.1);
  --color-border: rgba(255, 255, 255, 0.1);
  --color-border-light: rgba(255, 255, 255, 0.16);
  --border-style: solid;

  /* ===== ТЕНИ ===== */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.12);
  --shadow-md: 0 8px 20px rgba(0, 0, 0, 0.18);
  --shadow-lg: 0 16px 34px rgba(0, 0, 0, 0.24);
  --shadow-xl: 0 24px 50px rgba(0, 0, 0, 0.3);

  /* ===== ЗАКРУГЛЕНИЯ УГЛОВ ===== */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* ===== РАЗМЕРЫ КОНТЕЙНЕРА ===== */
  --container-max-width: 1200px;
  --container-padding: 20px;

  /* ===== ПЕРЕХОДЫ И АНИМАЦИИ ===== */
  --transition-fast: 150ms ease-in-out;
  --transition-base: 300ms ease-in-out;
  --transition-slow: 500ms ease-in-out;

  /* ===== ВЫСОТА ЗАГОЛОВКА ===== */
  --header-height: 70px;

  /* ===== SPACING (ОТСТУПЫ) ===== */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-2xl: 32px;
  --space-3xl: 48px;

  /* ===== ТИПОГРАФИЯ ===== */
  --font-family-base: 'Manrope', sans-serif;
  --font-family-mono: 'Courier New', monospace;

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 24px;
  --font-size-2xl: 32px;
  --font-size-3xl: 40px;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;

  /* ===== Z-INDEX ===== */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal: 1000;
}

/* Переменные для тёмной темы (при необходимости расширения) */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #131A27;
    --color-surface: #F8FAFC;
    --color-text: #F1F5F9;
    --color-text-secondary: #A8B3C7;
  }
}