/* Шапка сайта: семь пунктов главного меню в одну строку.
 *
 * Тема (main.css) рассчитывала ширину под шесть пунктов: между колонками
 * шапки .container.header-container стоит grid-column-gap 5.06rem, между
 * пунктами .nav-items — 2rem. При семи пунктах средняя колонка (она 1fr)
 * перестаёт вмещать список, и текст начинает переноситься ВНУТРИ пунктов —
 * шапка становится двухэтажной.
 *
 * Правим только расстояния и только на десктопе (≥992px): ниже этой ширины
 * меню темы уезжает в выезжающую панель и располагается вертикально, где
 * переносов не бывает.
 *
 * Общий css/custom_ne.css не трогаем — правки шапки живут отдельным файлом,
 * его удаление возвращает прежний вид без следов. Селекторы намеренно на класс
 * длиннее темовских (.header ...), чтобы выигрывать у main.css независимо от
 * порядка подключения.
 */

@media screen and (min-width: 992px) {

	/* 5.06rem -> 3rem: средняя колонка получает ~64px (при 1280px) свободной
	   ширины, меню сдвигается ближе к логотипу. */
	.header .container.header-container {
		grid-column-gap: 3rem;
	}

	/* 2rem -> 1.375rem: шесть промежутков между семью пунктами. */
	.header .nav-items {
		grid-column-gap: 1.375rem;
	}

	/* Страховка: даже если места однажды снова не хватит, пункт не разорвётся
	   на две строки — список просто прижмётся к соседям. */
	.header .nav-item__link {
		white-space: nowrap;
	}
}

/* Узкий десктоп: ноутбуки и окно, растянутое на половину экрана.
   Логотип и правый блок с кнопкой «Быстрый заказ» здесь ужимаются хуже, чем
   меню: на 992px после общей правки оставалось всего 13px запаса. Поджимаем
   промежутки ещё — запас становится больше пункта меню, и случайное удлинение
   названия шапку уже не сломает. Верхняя граница 1279px: с 1280px запаса и
   так под 80px, там нижний ярус правок уже не нужен. */
@media screen and (min-width: 992px) and (max-width: 1279px) {

	.header .container.header-container {
		grid-column-gap: 1.5rem;
	}

	.header .nav-items {
		grid-column-gap: 1.125rem;
	}

	/* Соцсети + «Быстрый заказ» + бургер: на .com этот блок шире, чем на ru,
	   и на 992px именно он съедает запас у меню. */
	.header .header-contacts {
		grid-column-gap: 1rem;
	}
}
