/* ===== Широкие мониторы (2026-09-04): контент масштабируется под ширину экрана =====
   Дизайн свёрстан под 1920 (контейнер 1160px); на 2560/3440 он превращался в узкую
   полосу с пустыми полями. Решение — CSS zoom на секции ниже шапки/hero: пропорции и
   композиция блоков сохраняются 1-в-1, ничего не режется краем экрана — всё
   масштабируется вместе. Подключается на ВСЕХ публичных страницах (в т.ч. на 404,
   где нет v3.css, — поэтому файл отдельный).
   Коэффициент считает wide.js непрерывно (--site-zoom = min(2, ширина/1920));
   ступени ниже — fallback без JS.
   НЕ масштабируются: шапка .nav (fixed, 100% ширины), hero главной (100svh + JS-раскладка
   виджета дат под любой аспект), fixed-оверлеи (лайтбокс .clb, float-кнопки, кулисы).
   ⚠️ vh-единицы внутри zoom-элемента умножаются на zoom — для полноэкранных секций
   делить на var(--site-zoom) (пример: .advantages в v3.css). */
@media (min-width: 2100px) { :root { --site-zoom: 1.12; } }
@media (min-width: 2400px) { :root { --site-zoom: 1.3; } }
@media (min-width: 2800px) { :root { --site-zoom: 1.5; } }
@media (min-width: 3300px) { :root { --site-zoom: 1.72; } }
@media (min-width: 3800px) { :root { --site-zoom: 2; } }
@media (min-width: 1921px) {
  main#main > :not(.hero),
  body > :not(main#main, nav, .nav, .blog-nav, .nav-mobile, .hero, .curtain, .float-actions, .mobile-bar,
              .clb, .lp, #edit-fab, .skip-link, script, style, link, noscript, template, [hidden]) {
    zoom: var(--site-zoom, 1);
  }
}