/*
 * Общие величины сайта.
 *
 * Пока здесь одно: ширина оболочки. Она стоит отдельно не для красоты —
 * до этого шапка была 1504, меню 1680, подвал 1200, и логотип прыгал
 * на 88 пикселей при открытии меню. Одна величина на три части значит,
 * что разъехаться они больше не могут.
 *
 * 1200 — не выдумка: ровно столько у контейнера кита Elementor
 * (`container_width`), то есть по этой линии выстроены все 125 страниц.
 * Пока их рисует Elementor, тема обязана держать ту же линию.
 *
 * Захочется шире на больших мониторах — это делается здесь и только
 * здесь. Например так:
 *
 *   @media (min-width: 1600px) { :root { --ss-shell: 1400px; } }
 *
 * И раздвинутся сразу шапка, меню и подвал. Но помните: контент страниц
 * останется по 1200, пока не переедет и он.
 */

:root {
	--ss-shell: 1200px;
	--ss-gutter: 20px;
}

/*
 * Брейкпойнты смены режима — 1024 и 767.
 *
 * Числа не наши: по ним перестраивается контент Elementor (проверено
 * в его сгенерированном CSS). Пока страницы рисует он, шапка, меню
 * и подвал обязаны менять режим в тех же точках — иначе страница
 * переключается в два приёма, и на планшете это видно.
 *
 * В переменную их не вынести: `@media (max-width: var(--x))` язык
 * не умеет. Поэтому числа повторены буквально в header.css, menu.css
 * и footer.css, а этот комментарий — то место, где о них договорились.
 * Переезжают страницы — меняем здесь и там, разом.
 *
 * Отдельно от них живут ступени внутри компонента: 1320 и 1100
 * в шапке, 1200 в меню. Это не смена режима, а «здесь перестало
 * помещаться», найдено замером и привязано к содержимому, а не
 * к устройству. Их с 1024 сводить не надо.
 */