/* ============================================================
   Акватрейд — Design Tokens
   Цвета, типографика, отступы, радиусы, тени, брейкпоинты
   ============================================================ */

:root {
  /* ---------- Цвета ---------- */
  /* Бренд */
  --c-brand-blue: #1E2A78;        /* основной синий из логотипа */
  --c-brand-graphite: #454B54;    /* серый из логотипа */

  /* Поверхности */
  --c-bg: #FFFFFF;
  --c-bg-soft: #F4F6FA;            /* фон секций */
  --c-bg-muted: #F8F9FB;            /* фон карточек-плиток */
  --c-bg-dark: #0A1E5B;             /* топбар, футер */
  --c-bg-hero: #14245C;             /* база hero */

  /* Градиенты тёмных блоков
     В макете тёмные блоки идут СЛЕВА (темнее) → ВПРАВО (светлее) */
  --grad-hero:    linear-gradient(to right, #0A1E5B 0%, #14245C 50%, #1F3E74 100%);
  --grad-promo:   linear-gradient(to right, #0A1E5B 0%, #142565 60%, #1F3D74 100%);
  --grad-b2b:     linear-gradient(to right, #0A1E5B 0%, #142565 100%);

  /* Action / интерактив */
  --c-primary: #2C5281;            /* CTA "В корзину"/"Найти" — приглушённый средне-синий */
  --c-primary-hover: #244673;
  --c-primary-active: #1D3C66;
  --c-primary-soft: #E8EEF6;       /* лёгкая подложка для иконок и чипов */
  --c-cta-dark: #0A1E5B;           /* CTA "Каталог" — тёмно-навый */
  --c-cta-dark-hover: #122872;

  /* Текст */
  --c-text: #1A1F2E;
  --c-text-muted: #6B7280;
  --c-text-subtle: #9CA3AF;
  --c-text-on-dark: #FFFFFF;
  --c-text-on-dark-muted: rgba(255, 255, 255, 0.7);

  /* Линии и разделители */
  --c-border: #E5E7EB;
  --c-border-soft: #EFF1F4;
  --c-border-strong: #D1D5DB;
  --c-border-on-dark: rgba(255, 255, 255, 0.12);

  /* Статусы */
  --c-success: #16A34A;            /* "В наличии" */
  --c-success-soft: #DCFCE7;
  --c-warning: #F59E0B;
  --c-danger: #DC2626;

  /* Бейджи */
  --c-badge-hit-bg: #2C5281;       /* "Хит" — средне-синий (как primary) */
  --c-badge-hit-fg: #FFFFFF;
  --c-badge-new-bg: #4B7AAE;       /* "Новинка" — чуть светлее средне-синего */
  --c-badge-new-fg: #FFFFFF;
  --c-badge-hot-bg: #0A1E5B;       /* "Хит продаж" на странице товара — тёмно-навый */
  --c-badge-hot-fg: #FFFFFF;
  --c-badge-sale-bg: #DC2626;
  --c-badge-sale-fg: #FFFFFF;

  /* ---------- Типографика ---------- */
  --ff-base: 'Onest', 'Manrope', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ff-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  /* Размеры шрифта */
  --fs-xxs: 11px;
  --fs-xs:  12px;
  --fs-sm:  13px;
  --fs-base: 14px;
  --fs-md:  15px;
  --fs-lg:  16px;
  --fs-xl:  18px;
  --fs-2xl: 20px;
  --fs-3xl: 24px;
  --fs-4xl: 28px;
  --fs-5xl: 32px;
  --fs-6xl: 38px;
  --fs-7xl: 48px;

  /* Высоты строки */
  --lh-tight: 1.15;
  --lh-snug:  1.3;
  --lh-base:  1.5;
  --lh-relax: 1.65;

  /* Веса */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 800;

  /* Межбуквенное */
  --ls-tight: -0.01em;
  --ls-base:  0;
  --ls-wide:  0.04em;

  /* ---------- Отступы (шкала кратна 4) ---------- */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-7:  28px;
  --s-8:  32px;
  --s-9:  40px;
  --s-10: 48px;
  --s-12: 64px;
  --s-14: 80px;
  --s-16: 96px;

  /* ---------- Радиусы ---------- */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-2xl: 20px;
  --r-pill: 999px;

  /* ---------- Тени ---------- */
  --sh-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --sh-sm: 0 2px 4px rgba(15, 23, 42, 0.05);
  --sh-md: 0 4px 12px rgba(15, 23, 42, 0.06);
  --sh-lg: 0 10px 24px rgba(15, 23, 42, 0.08);
  --sh-xl: 0 20px 48px rgba(15, 23, 42, 0.10);
  --sh-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 2px 8px rgba(15, 23, 42, 0.04);
  --sh-card-hover: 0 4px 12px rgba(15, 23, 42, 0.06), 0 12px 24px rgba(15, 23, 42, 0.08);

  /* ---------- Слои (z-index) ---------- */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-overlay: 800;
  --z-modal: 900;
  --z-toast: 1000;

  /* ---------- Анимации ---------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 0.15s;
  --dur-base: 0.25s;
  --dur-slow: 0.4s;

  /* ---------- Контейнер и сетка ---------- */
  --container-max: 1440px;
  --container-pad: 24px;

  /* ---------- Размеры компонентов ---------- */
  --h-topbar: 36px;
  --h-header: 72px;
  --h-input: 44px;
  --h-btn: 44px;
  --h-btn-sm: 36px;
  --h-btn-lg: 52px;
}