/* Bundle: responsive - generated from site.css */
/* ===================== RESPONSIVE: DESKTOP-NARROW (≤1366px) ===================== */

/* ===================== RESPONSIVE: DESKTOP-NARROW (≤1280px) ===================== */

/* ===================== RESPONSIVE: TABLET (≤1024px) ===================== */

           

  

/* ===================== RESPONSIVE: MOBILE (≤640px) ===================== */

/* container — for inner pages (max-width flexible) */
.container { padding: 0 56px; }
/* На телефоне 56px съедали треть экрана — контент сжимался до 278px (снимки 390px, 2026-10-19). */

/* Шапка квиза на телефоне: колонка 1fr не ужимается уже самого длинного неразрывного содержимого
   (заголовок, картинка), и страница раскладывалась на 540–570px при экране 390. */

/* Плашки под заголовком квиза шли одной строкой, вывод под таблицей сравнения — «текст + кнопка»
   в две колонки: на телефоне оба блока были шире экрана. */

/* Надпись над заголовком (.eyebrow) не переносится по всему сайту; на телефоне длинная
   («Рассчитаем стоимость и выполним работы под ключ») растягивала блок шире экрана. */

/* Главная, кнопка под лентой заявок: на десктопе ряд «кнопка + подсказка» сдвинут вправо transform'ом,
   чтобы кнопка стояла по центру; на телефоне сдвиг и запрет переноса выталкивали ряд за экран. */

/* Ряд цифр в шапке страниц услуг: на новых страницах там слова («до 24 часов», «по фото»),
   колонка 1fr не ужималась уже слова и страница становилась шире экрана. */

/* Длинное слово в заголовке квиза («комбинированную») не помещалось в 390px. */

/* ===================== ЛЕНТА «ЛИСТАТЬ ВЛЕВО-ВПРАВО» НА ТЕЛЕФОНЕ (.m-swipe) =====================
   Владелец 2026-10-19: списки фото и карточек на телефоне не должны занимать вертикаль — листаются вбок, и видна
   одна карточка плюс 5–7 % следующей (понятно, что дальше есть ещё). Ставится классом m-swipe на контейнер сетки
   (прямые дети = карточки); на компьютере ничего не меняет.
   Геометрия при ширине 390: лента выходит в поля экрана (--swipe-bleed = отступ родителя, по умолчанию 16px),
   карточка = ширина контента − --swipe-peek (20px), промежуток 12px → от следующей видно ~24px ≈ 6 %.
   Двойной класс — чтобы перебить сетки из бандлов и css/pages, которые грузятся позже. */

/* Полоса ссылок вверху подвала на телефоне: была в одну строку по центру внутри прокрутки — начало уходило за
   левый край (−178px, не докрутить), конец обрезан. Переносим ссылки в несколько строк, всё видно. 2026-10-19. */

/* Документ не сдвигается вбок ни на какой ширине (страховка от невидимых декоративных частей). Вылезающие блоки
   это прячет — проверять tools/mobile_width.mjs с ITEMS=1 (список элементов за краем) и снимками. */
html { overflow-x: clip; }

/* Шапка на узких телефонах (360–399px: iPhone SE, большинство Android): кнопка шириной 160px наезжала на логотип —
   логотип + кнопка + меню + промежутки не помещались. Кнопка — по тексту, промежутки меньше. 2026-10-19. */

