/**
 * Breakpoints (mobile-first) — единый справочник Voltark SPA.
 *
 * Кастомные media-query переменные в @media ещё не везде поддерживаются,
 * поэтому в правилах — literal px + якоря-комменты: @bp-md / @bp-lg.
 * JS-layout: frontend_build/js/adaptive.js (BREAKPOINTS).
 *
 * Канон (2026-10):
 *   --bp-xs:   320px   tiny phone
 *   --bp-sm:   480px   phone
 *   --bp-md:   640px   large phone / small tablet
 *   --bp-lg:   768px   tablet
 *   --bp-xl:  1024px   laptop
 *   --bp-2xl: 1280px   large laptop
 *   --bp-3xl: 1536px   monitor
 *   --bp-4xl: 1920px   large monitor / ultrawide start
 *
 * Диапазоны:
 *   xs   320–479
 *   sm   480–639
 *   md   640–767
 *   lg   768–1023
 *   xl  1024–1279
 *   2xl 1280–1535
 *   3xl 1536–1919
 *   4xl 1920+
 *
 * Legacy aliases (не удалять — сотни @media и adaptive.js):
 *   --bp-tablet: 900px  — shell body.mobile-layout / desktop-layout gate
 *   --bp-phone / --bp-compact / … — вторичные page-якоря
 */

:root {
  /* —— Primary scale —— */
  --bp-xs: 320px;
  --bp-sm: 480px;
  --bp-md: 640px;
  --bp-lg: 768px;
  --bp-xl: 1024px;
  --bp-2xl: 1280px;
  --bp-3xl: 1536px;
  --bp-4xl: 1920px;

  /* —— Legacy aliases (map → closest primary / shell gate) —— */
  --bp-tablet: 900px;       /* shell: mobile-layout < 900; desktop-layout ≥ 900 */
  --bp-compact: 560px;
  --bp-phone: 640px;        /* = --bp-md */
  --bp-narrow: 720px;
  --bp-window: 800px;
  --bp-lib: 960px;
  --bp-hero: 980px;
  --bp-content: 1000px;
  --bp-wide: 1100px;
  --bp-market-mid: 1199px;

  /* Ultra (pre-2026 name → 4xl+) */
  --bp-ultra: 2560px;
}