.newList ul.navbar__subnav {
	display: flex;
	flex-wrap: wrap;
	width: 750px;
	display: block;
	column-count: 3;
}
.newList.twoColumn ul.navbar__subnav {
	column-count: 2;
}
.newList ul.navbar__subnav li.navbar__sub-item  {
	width: 235px;
	break-inside: avoid;
	padding: 4px 0;
}
.newList ul.navbar__subnav li.navbar__sub-item.nextColumn {
	break-before: column;
}
.header__nav .subtitle a, .header__nav .subtitle span {
	font-weight: bold;
	padding: 10px 0;
    display: block;
}
.ya-site-form input[type="search"] {
	border: 1px solid #e7e7e7;
	width: 150px;
}
.ya-site-form input[type="submit"] {
	background: #f26d0c;
	color: #fff;
	font-size: 14px;
    padding: 0 10px;
}
.ya-site-form input[type="submit"]:hover {
	opacity: 0.7;
	cursor: pointer;
}
.searchBlock {
	flex-direction: column;
}
.city-map {
	background: center / cover url(/mnl-theme/theme/dist/assets/images/city-map-1920.jpg) no-repeat;
	padding: 60.5px 80px;
}

.city-map__content {
	background-color: #04B8CB;
	background-image: url(/mnl-theme/theme/dist/assets/images/city-map-bg.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;

	padding: 60px;
	border-radius: 10px;
	width: max-content;
	color: #fff;
	width: 630px;
	max-width: 100%;
}

.city-map__header {
	font-size: 65px;
	font-weight: 700;
	margin-bottom: 30px;
	line-height: 1;
}

.city-map__cities {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 10px;
}


.city-map__cities-col {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.city-map__btn {
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.6;
	padding: 17.5px;
	width: 100%;
	text-align: center;
	border-radius: 10px;
	background: #F58A3C;
	display: block;
	margin-top: 30px;
}


@media (max-width: 768px) {
	.city-map {
		padding: 650px 20px 20.5px;
		background: center / cover url(/mnl-theme/theme/dist/assets/images/city-map-768.jpg) no-repeat;
	}

	.city-map__content {
		width: 100%;
	}

	.city-map__header {
		font-size: 36px;
	}
}

@media (max-width: 550px) {
	.city-map {
		padding: 433px 20px 20px;
	}

	.city-map__content {
		padding: 30px;
	}
}

@media (max-width: 480px) {
	.city-map__cities {
		grid-template-columns: 1fr;
	}

	.city-map__cities-col {
		display: none;
	}

	.city-map__cities .city-map__cities-col:first-child {
		display: flex;
	}

	.city-map__cities-col .city-map__city {
		display: none;
	} 

	.city-map__cities-col .city-map__city:nth-child(1),
	.city-map__cities-col .city-map__city:nth-child(2),
	.city-map__cities-col .city-map__city:nth-child(3),
	.city-map__cities-col .city-map__city:nth-child(4),
	.city-map__cities-col .city-map__city:nth-child(5) {
		display: block;
	}
}


.button {
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.6;
	padding: 17.5px 30px;
	text-align: center;
	border-radius: 10px;
	background: #F58A3C;
	display: block;
	width: max-content;
	max-width: 100%;
}

.dm-heading--clear,
.dm-heading.dm-heading--clear {
	background-color: transparent;
	color: #000;
}

.cities-list {
	padding: 60px;
	background: #F8F8F8;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 10px;
	row-gap: 12px;
	margin-bottom: 70px;
}

.cities-list__col {
	display: flex;
	flex-direction: column;
	gap: 12px;
}


@media (max-width: 768px) {
	.cities-list {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 600px) {
	.cities-list {
		grid-template-columns: 1fr 1fr;
		padding: 20px;
	}
}


/* === ТЗ 8039489 п.3.1.1: выделение пунктов Акции/Калькулятор/Цены в верхнем меню (десктоп + скролл-хедер) === */
.header__item.top-nav-accent_orange .header__link,
.top-bar__item.top-nav-accent_orange .top-bar__link {
	color: #f58a3c;
}
.header__item.top-nav-accent_teal .header__link,
.top-bar__item.top-nav-accent_teal .top-bar__link {
	color: #04b8cb;
}
.header__item.top-nav-accent_bold .header__link,
.top-bar__item.top-nav-accent_bold .top-bar__link {
	font-weight: 700;
	color: #1a1a1a;
}
/* правка по замечанию пользователя (2026-09-01): у Акции/Калькулятора/Цены не
   было состояния наведения — общее правило .header__link:hover{color:#04b8cb}
   в main.css той же специфичности, что и наши цветовые правила, поэтому
   перебивалось порядком подключения файлов (custom.css после main.css) и
   визуально ничего не менялось при наведении. Добавляем :hover с бОльшей
   специфичностью, меняя цвет на противоположный из уже использующихся в шапке
   (оранжевый/бирюзовый), чтобы наведение было заметно. */
.header__item.top-nav-accent_orange .header__link:hover,
.top-bar__item.top-nav-accent_orange .top-bar__link:hover {
	color: #04b8cb;
}
.header__item.top-nav-accent_teal .header__link:hover,
.top-bar__item.top-nav-accent_teal .top-bar__link:hover {
	color: #f58a3c;
}
.header__item.top-nav-accent_bold .header__link:hover,
.top-bar__item.top-nav-accent_bold .top-bar__link:hover {
	color: #04b8cb;
}
.header__item-icon,
.top-bar__item-icon {
	height: 26px;
	width: auto;
	margin-left: 2px;
	vertical-align: middle;
}

/* === ТЗ 8039489 п.3.1.1 (повторная проверка): пункт "Контакты" уезжал на вторую
   строку в статичной (не scroll) шапке — общему .header__list не хватало ~16px
   при исходном gap 35px (не зависит от ширины экрана, воспроизводится и на 1920,
   и на 4К — верхнему ряду не хватает места ровно на этот зазор, т.к. .header__group
   ограничен шириной контейнера ~1760px). Sticky-шапка (.top-bar__nav_top) этим
   не страдает — её не трогаем. Уменьшаем зазор только у статичного меню. */
.header__desctop .header__list {
	gap: 10px 28px;
}

/* === ТЗ 8039489 п.3.1.1: текстовый блок у лого без иконки-пина === */
.header__location_no-icon {
	display: flex;
	align-items: center;
}
.header__location_no-icon .header__location-txt {
	font-size: 14px;
	color: #666;
}
.header__location_no-icon .header__location-txt span {
	color: #1a1a1a;
	font-weight: 700;
}


/* === ТЗ 8039489 п.3.1.2: кнопка вызова номера телефона в мобильной шапке === */
.hd-mobile__social_phone {
	display: flex !important;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	color: #000;
}
.hd-mobile__social_phone .svg {
	width: 100%;
	height: 100%;
	fill: #000;
}


/* === ТЗ 8039489 п.3.1.3: выделение пунктов Калькулятор/Акции в бургер-меню === */
.drawer__item.top-nav-accent_orange .drawer__link {
	color: #f58a3c;
}
.drawer__item.top-nav-accent_teal .drawer__link {
	color: #04b8cb;
}
.drawer__item.top-nav-accent_bold .drawer__link {
	font-weight: 700;
	color: #1a1a1a;
}


.drawer__item_icon-inline {
	justify-content: flex-start;
}
.drawer__item_icon-inline .drawer__link {
	flex-grow: 0;
}


/* === ТЗ 8039489 п.3.1.6: блок "Стоимость остекления..." в 2 карточки вместо сплошного текста === */
.tz-cost-grid {
	display: grid;
	/* первая карточка короче, вторая длиннее — замерено в макете (~39%/61%) */
	grid-template-columns: 39fr 61fr;
	gap: 20px;
	padding-top: 30px;
}
.tz-cost-grid .od-box-card {
	padding: 30px;
	border: 5px solid rgba(248, 248, 248, 1);
}
/* правка по замечаниям гугл-таблицы (2026-08-31): подзаголовки списков ("Формат
   под ключ включает:" и т.п.) — 18px по макету */
.tz-cost-grid .editor p > strong {
	font-size: 18px;
}
@media (max-width: 768px) {
	.tz-cost-grid {
		grid-template-columns: 1fr;
	}
}


/* === ТЗ 8039489 п.3.1.6: блок "Сегодня можно подобрать ПВХ-системы..." в сетку карточек === */
.tz-pvh-grid__intro {
	background-color: #eefdff;
	border-radius: 20px;
	/* правка по замечаниям пользователя (2026-08-31): та же обводка, что и у
	   соседних карточек .od-box-card в этой сетке */
	border: 5px solid rgba(248, 248, 248, 1);
	padding: 30px;
	display: flex;
	align-items: center;
}
/* правка по замечаниям гугл-таблицы (2026-08-31): блоки сетки должны быть
   одинаковой высоты (сетка сама даёт равную ширину, а высота у второго ряда
   с более коротким текстом была меньше первого) — только на десктопной сетке
   3+2, на мобильном слайдере карточки идут по одной и такое ограничение не нужно */
@media (min-width: 1201px) {
	.tz-pvh-grid__intro_desktop,
	.tz-pvh-grid .od-box-card {
		min-height: 341px;
	}
}
.tz-pvh-grid__intro p {
	font-size: 36px;
	font-weight: 700;
	line-height: 130%;
}
/* правка по замечаниям гугл-таблицы (2026-08-31): на ≤1200px (слайдер) не
   хватало отступа между интро-карточкой и рядом карточек под ней */
@media (max-width: 1200px) {
	.tz-pvh-grid__intro_mobile {
		margin-bottom: 20px;
	}
}
.tz-pvh-grid .od-box-card {
	padding: 30px;
	border: 5px solid rgba(248, 248, 248, 1);
}
.tz-pvh-grid__title {
	color: #04b8cb;
	font-weight: 700;
	font-size: 18px;
	padding-bottom: 15px;
}
/* По уточнению макета (2026-08-28): интро-карточка должна быть обычной
   ячейкой сетки 3 колонки наравне с карточками (5 ячеек = 3+2, последняя
   пустая), а не растянутым на 2 ряда блоком слева. Для этого на десктопе
   интро-карточка должна физически быть ВНУТРИ .tz-pvh-grid__cards, первым
   ребёнком перед карточками — тогда CSS Grid сам расставит все 5 элементов
   3+2 без ручных grid-column/grid-row.
   Но на мобильном/планшетном breakpoint js-smart-mobile-slider на инициализации
   полностью скрывает ОРИГИНАЛЬНЫЙ .tz-pvh-grid__cards (display:none) и
   вставляет РЯДОМ (сиблингом, а не внутрь) новый .fn-mobile-slider со
   скопированными карточками (он ищет их по классу .js-mobile-slide — у
   интро-карточки его нет, поэтому её саму слайдер не копирует). Раз
   интро-карточка была бы внутри скрытого .tz-pvh-grid__cards, на мобильном
   она пропадала бы совсем. Поэтому в разметке (orig_index.php) — ДВЕ копии
   интро-карточки: .tz-pvh-grid__intro_mobile — сиблинг ПЕРЕД .tz-pvh-grid__cards
   (видна только ≤1200px, для слайдера), .tz-pvh-grid__intro_desktop — первый
   ребёнок ВНУТРИ .tz-pvh-grid__cards (видна только ≥1201px, для сетки 3+2). */
.tz-pvh-grid__intro_desktop {
	display: none;
}
@media (min-width: 1201px) {
	.tz-pvh-grid__intro_mobile {
		display: none;
	}
	.tz-pvh-grid__intro_desktop {
		display: flex;
	}
}
.tz-pvh-grid__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
@media (max-width: 1200px) {
	.tz-pvh-grid__cards {
		display: block;
	}
}
/* Баг стороннего JS (js-smart-mobile-slider/Swiper): при свежей загрузке
   страницы сразу на мобильной/планшетной ширине (без промежуточного ресайза с
   десктопа) он иногда неверно меряет ширину слайда и выставляет инлайн-стиль
   в духе width:33554432px — карточка становится нечитаемой. У остальных
   готовых слайдеров сайта (30 лет/45 тысяч семей и т.д.) тот же баг не
   проявляется, у нашего — стабильно проявляется. Так как это стиль,
   проставленный инлайн через JS, обычная специфичность тут не поможет —
   перебиваем через !important. */
.tz-pvh-grid .fn-mobile-slider {
	width: 100% !important;
	min-width: 0;
}
.tz-pvh-grid .fn-mobile-slider .swiper,
.tz-pvh-grid .fn-mobile-slider .swiper-wrapper {
	width: 100% !important;
	max-width: 100%;
	min-width: 0;
}
.tz-pvh-grid .fn-mobile-slider .swiper-slide {
	width: 100% !important;
	max-width: 100%;
	min-width: 0;
}
@media (min-width: 1201px) {
	/* У стороннего слайдер-скрипта на десктопе почему-то не срабатывает его
	   собственный код скрытия слайдера (r.createdSliderEl.style.cssText =
	   "display:none") именно для этого блока — сетка .tz-pvh-grid__cards он
	   прячет/показывает правильно, а .fn-mobile-slider остаётся видимым и
	   на десктопе, из-за чего карточки дублировались (сетка + слайдер сразу).
	   Прячем слайдер сами на том же брейкпоинте (1200px), которым пользуется
	   сам скрипт для сетки. */
	.tz-pvh-grid .fn-mobile-slider {
		display: none !important;
	}
}


/* === ТЗ 8039489 п.3.1.7: текстовый блок "Цвет и покрытие" слева от палитры, а не отдельным блоком сверху === */
.tz-color-layout {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 30px;
	align-items: start;
}
.tz-color-layout__intro {
	background-color: #eefdff;
	border-radius: 20px;
	/* правка по замечаниям пользователя (2026-08-31): тот же цвет/толщина
	   обводки, что у .od-box-card по всему сайту */
	border: 5px solid rgba(248, 248, 248, 1);
	padding: 30px;
}
.tz-color-layout__intro .vh-pallete__title {
	padding-bottom: 20px !important;
}
.tz-color-layout .vh-pallete__group {
	grid-template-columns: repeat(4, 1fr) !important;
}
@media (max-width: 992px) {
	.tz-color-layout {
		grid-template-columns: 1fr;
	}
}


/* === ТЗ 8039489 п.3.1.7: кнопка "Рассчитать" под карточками типов дверей === */
.tz-sl-group__btn {
	margin-top: 20px;
	display: inline-block;
	width: auto;
	border: none;
	cursor: pointer;
}
.tz-door-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}


/* === ТЗ 8039489 п.3.1.8: кнопка "Заказать расчет" под карточками типов окон === */
.hs-inner__box {
	display: flex;
	flex-direction: column;
}
.hs-inner__box .tz-sl-group__btn {
	align-self: flex-start;
}


/* === ТЗ 8039489 п.3.1.8: текстовый блок "Недорогие пластиковые окна на дачу" в 3 колонки === */
.tz-3col-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 70px;
	align-items: start;
}
.tz-3col-grid__intro {
	background-color: #eefdff;
	border-radius: 20px;
	/* правка по замечаниям пользователя (2026-08-31): тот же цвет обводки, что
	   у .od-box-card по всему сайту */
	border: 5px solid rgba(248, 248, 248, 1);
	padding: 30px;
	height: 100%;
}
.tz-3col-grid .od-box-card {
	padding: 30px;
	gap: 25px;
	border: 5px solid rgba(248, 248, 248, 1);
}
.tz-wn-banner-inline {
	margin-top: auto;
	background-color: transparent !important;
	color: inherit !important;
	padding: 0 !important;
	grid-template-columns: 100px 1fr !important;
	gap: 20px !important;
	align-items: flex-start !important;
}
.tz-wn-banner-inline .wn-banner__icon {
	width: 100px;
	height: 93px;
}
.tz-wn-banner-inline .wn-banner__title {
	color: #f58a3c;
	font-size: 20px;
	padding-bottom: 8px;
}
.tz-wn-banner-inline .wn-banner__txt {
	padding-top: 0;
	color: #1a1a1a;
}
/* На мобильных (макет 375px и меньше) наш !important-override перебивал
   собственный мобильный breakpoint компонента .wn-banner (max-width:575px,
   grid-template-columns:1fr) — картинка и текст оставались в ряд вместо того,
   чтобы встать друг под другом. Возвращаем сжатие в 1 колонку на том же
   брейкпоинте, что и у самого компонента. */
@media (max-width: 575px) {
	.tz-wn-banner-inline {
		grid-template-columns: 1fr !important;
		/* правка по замечаниям гугл-таблицы (2026-08-31): по макету на 360px
		   выделенный текст и картинка должны быть слева, а не по центру —
		   перебиваем text-align:center базового .wn-banner на этой ширине */
		text-align: left !important;
	}
	.tz-wn-banner-inline .wn-banner__medal {
		margin: 0 !important;
	}
}
@media (max-width: 1280px) {
	.tz-3col-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 768px) {
	.tz-3col-grid {
		grid-template-columns: 1fr;
		/* правка по замечаниям гугл-таблицы (2026-08-31): на мобильной ширине
		   отступ между карточками в столбик был слишком большим (наследовался
		   от десктопного gap:70px между колонками) */
		gap: 30px;
	}
	/* правка по замечаниям гугл-таблицы (2026-08-31): заголовки карточек
	   на 360/768 были слишком мелкими (fluid-формула .editor h2 даёт ~22-27px);
	   уточнено пользователем — 36px на 768, 24.4px на ≤424 (см. ниже) */
	.tz-3col-grid .editor h2 {
		font-size: 36px;
	}
}
@media (max-width: 424px) {
	.tz-3col-grid .editor h2 {
		font-size: 24.4px;
	}
}


/* === ТЗ 8039489 п.3.1.8 (2-й ряд): "Особенности монтажа" / фото+"Имитация древесины" / "Как заказать стеклопакеты" === */
.tz-3col-grid__mid {
	display: flex;
	flex-direction: column;
	gap: 20px;
	height: 100%;
}
.tz-3col-grid__img {
	display: block;
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	padding-top: 66%;
}
.tz-3col-grid__img img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.tz-3col-grid__mid .od-box-card {
	flex-grow: 1;
}


/* === ТЗ 8039489 п.3.1.9: /nashi-raboty/ — раскрыть все категории работ, скролл по кнопкам === */
.tz-works-expanded_ready .fn-works__view {
	display: block !important;
	position: static !important;
	opacity: 1 !important;
	visibility: visible !important;
	height: auto !important;
	margin-bottom: 50px;
}
.tz-works-expanded_ready .fn-works__view:last-child {
	margin-bottom: 0;
}
.tz-works-expanded__title {
	padding-bottom: 20px;
	/* правка по замечаниям гугл-таблицы (2026-08-31): названия категорий — 26px по макету */
	font-size: 26px;
}
/* правка по замечанию пользователя (2026-09-01): .active теперь выглядит
   точно так же, как :hover (та же оранжевая рамка+текст, белый фон) —
   единый визуальный язык для "выделенного" состояния кнопки-якоря. */
.tz-works-expanded .tabs-control__item.active,
.tz-works-expanded .tabs-control__item:hover {
	background-color: #fff;
	border-color: #f58a3c;
	color: #f58a3c;
}

/* === ТЗ 8039489 п.3.1.9: текст в главном блоке — перенесён в отдельную область === */
.tz-heading-area {
	background-color: #fff;
	color: #000 !important;
	border-radius: 10px;
	padding: 25px 30px;
}
/* правка по замечаниям гугл-таблицы (2026-08-31): вводный текст — 16px по макету
   (используется на /nashi-raboty/, /tseny/tseny-na-okna/, /tseny/tseny-na-balkony/,
   /tseny/tseny-na-steklopaket/ — везде один и тот же переиспользуемый класс).
   Правило не применялось: асинхронно догружаемый чанк stage1-*.css задаёт
   .dm-heading__txt{font-size:22px} той же специфичности (1 класс) и оказывается
   в каскаде ПОСЛЕ custom.css, т.к. подключается через JS уже после начальной
   загрузки страницы. Перебиваем составным селектором (2 класса) + !important,
   как уже делалось раньше для похожего конфликта с этим же чанком. */
.tz-heading-area,
.tz-heading-area p {
	font-size: 16px;
}
.dm-heading__txt.tz-heading-area {
	font-size: 16px !important;
}


/* === ТЗ 8039489 п.3.1.10: /tseny/tseny-na-okna/ — раскрыть все бренды, скролл по кнопкам === */
.tz-variants-expanded_ready .fn-variants__view {
	display: block !important;
	position: static !important;
	opacity: 1 !important;
	visibility: visible !important;
	height: auto !important;
	margin-bottom: 50px;
}
.tz-variants-expanded_ready .fn-variants__view:last-child {
	margin-bottom: 0;
}
.tz-variants-expanded__title {
	padding-bottom: 20px;
	/* правка по замечаниям гугл-таблицы (2026-08-31): названия брендов — 26px по макету */
	font-size: 26px;
}
/* правка по замечанию пользователя (2026-09-01): та же логика, что и на
   /nashi-raboty/ — .active теперь выглядит точно так же, как :hover. */
.tz-variants-expanded .tabs-control__item.active,
.tz-variants-expanded .tabs-control__item:hover {
	background-color: #fff;
	border-color: #f58a3c;
	color: #f58a3c;
}
/* правка по замечаниям гугл-таблицы (2026-08-31): "пустое пространство" —
   переиспользуемый компонент fn-variants.php сам оборачивает себя в .spacer
   (padding-top:100px) и вдобавок имеет свой встроенный padding-top:110px —
   вместе это давало двойной отступ (~210px) перед "Цены на пластиковые окна".
   Убираем внешний .spacer только там, где секция обёрнута в наш
   .tz-variants-expanded (эта страница), не трогая остальные 8 страниц,
   использующих компонент как есть. */
.tz-variants-expanded > .spacer {
	padding-top: 0;
}

/* По макету 360px плашки брендов складываются в 2-3-1 (Blitz New+Constanta /
   Grazio+Delight+Intelio / Diamant на всю ширину), а не просто "по два, сколько
   влезет" — обычный flex-wrap с ростом по контенту на очень узких экранах
   (~320-340px) съезжал на 2-2-2, т.к. "Grazio+Delight+Intelio" переставали
   помещаться в одну строку. Фиксируем раскладку явно через flex-basis по
   порядковому номеру плашки, только в мобильном диапазоне. */
@media (max-width: 480px) {
	.fn-variants__controls.tabs-control .tabs-control__item {
		flex: 0 0 calc(50% - 5px);
		min-width: 0;
		padding: 10px 6px;
		/* правка по замечаниям гугл-таблицы (2026-08-31): шрифт плашек — 16px по макету */
		font-size: 16px;
	}
	.fn-variants__controls.tabs-control .tabs-control__item:nth-child(3),
	.fn-variants__controls.tabs-control .tabs-control__item:nth-child(4),
	.fn-variants__controls.tabs-control .tabs-control__item:nth-child(5) {
		flex: 0 0 calc(33.333% - 6.667px);
	}
	.fn-variants__controls.tabs-control .tabs-control__item:nth-child(6) {
		flex: 0 0 100%;
	}
}


/* === ТЗ 8039489 п.3.1.11: /tseny/tseny-na-balkony/ — текст блоков категорий в отдельной области === */
.tm-tabs__txt.tz-tabs-text-area {
	background-color: #fff;
	/* правка по замечаниям пользователя (2026-08-31): тот же цвет обводки, что
	   у .od-box-card по всему сайту */
	border: 5px solid rgba(248, 248, 248, 1);
	border-radius: 10px;
	padding: 30px 35px;
	margin-top: 25px;
	max-width: 1010px;
}


/* === ТЗ 8039489: в макете H1 всегда выровнен по верху карточки .tz-heading-area,
   а не по низу, как задаёт общий (не наш) стиль .dm-heading__group{align-items:flex-end}.
   На страницах с короткой карточкой разница была незаметна, на страницах с длинным
   текстом (например 3.1.11) сильно расходится с макетом. Правим точечно, только для
   групп с нашей карточкой, не трогая общий компонент .dm-heading на остальных страницах. */
.dm-heading__group:has(.tz-heading-area) {
	align-items: flex-start;
}


/* === ТЗ 8039489 п.3.1.12: /tseny/tseny-na-steklopaket/ — кнопка "Заказать расчет" в карточке,
   увеличенный отступ между рядами карточек === */
.sl-kinds__grid.tz-steklo-grid {
	row-gap: 70px !important;
}
.tz-steklo-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.tz-steklo-card .sl-kinds-card {
	height: auto;
	flex: 1 1 auto;
}
.tz-steklo-card__btn {
	align-self: flex-start;
	margin-top: 24px;
}


/* === ТЗ 8039489 п.3.1.13: /kalkulyator-plastikovykh-okon/ — текст описания калькулятора
   был свёрнут внутри одного пункта FAQ ("Чем может помочь калькулятор окон?") и по
   умолчанию скрыт. По макету это всегда видимый блок из 3 колонок сразу после баннера
   с акцией. Текст вынесен из FAQ в отдельную секцию на странице === */
.tz-calc-info {
	display: grid;
	grid-template-columns: 14fr 14fr 13fr;
	gap: 60px;
}
.tz-calc-info__col {
	/* правка по замечаниям гугл-таблицы (2026-08-31): закругление больше по макету */
	border-radius: 20px;
	padding: 40px;
}
.tz-calc-info__col_intro {
	background-color: #eefdff;
	/* правка по замечаниям пользователя (2026-08-31): тот же цвет/толщина
	   обводки, что у .od-box-card по всему сайту */
	border: 5px solid rgba(248, 248, 248, 1);
}
.tz-calc-info__col_card {
	background-color: #fff;
	/* правка по замечаниям пользователя (2026-08-31): тот же цвет/толщина
	   обводки, что у .od-box-card по всему сайту */
	border: 5px solid rgba(248, 248, 248, 1);
}
@media (max-width: 900px) {
	.tz-calc-info {
		grid-template-columns: 1fr;
		gap: 30px;
	}
}


/* === ТЗ 8039489 (повторная проверка, 3-я волна): на страницах WordPress (/stati/ и
   вложенные посты) обёртка темы .newwrap { padding-top: 75px } (max-width:1200px)
   дублирует отступ поверх sticky-шапки .hd-mobile — раньше это правило компенсировало
   старую ФИКСИРОВАННУЮ шапку, а сейчас шапка sticky и сама не выходит из потока,
   поэтому отступ создаёт лишний пустой промежуток перед шапкой. На страницах
   старого движка (.newwrap нет) этой проблемы никогда не было. === */
@media (max-width: 1200px) {
	.newwrap {
		padding-top: 0;
	}
}

/* === ТЗ 8039489 (повторная проверка, 3-я волна): в мобильной шапке иконки
   мессенджеров (Max/WhatsApp/Telegram) в теме скрываются только до 375px
   (main.css: @media(max-width:375px){.hd-mobile__social{display:none}}), а с 376px
   уже показываются в уменьшенном виде — но на самых массовых реальных ширинах
   телефонов (390–428px, iPhone/Pixel/Galaxy) для 4 иконок + номера телефона +
   кнопки "Меню" в строке банально не хватает места, и кнопка "Меню" уезжает
   за пределы экрана. Расширяем диапазон скрытия иконок-мессенджеров (кроме
   телефона — его показываем всегда согласно п.3.1.2) до 429px, где по замерам
   всё снова стабильно помещается. */
@media (max-width: 429px) {
	.hd-mobile__social:not(.hd-mobile__social_phone) {
		display: none !important;
	}
}

/* === ТЗ 8039489, п.3.1.1: плашка "город со стрелочкой" в шапке (десктоп —
   верхняя строка, мобилка — бургер-меню) + окно "Выберите город". Плашка
   собрана на существующих классах .header__location(-icon/-txt) — они уже
   были в теме (main.css), просто раньше использовались только с модификатором
   _no-icon без самой иконки. Тут это базовый вариант + новая стрелочка. */
.header__location.js-popup {
	background: none;
	border: none;
	padding: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
}
.header__location.js-popup:hover {
	opacity: .75;
}
.header__location-arrow {
	flex-shrink: 0;
	height: 8px;
	width: 8px;
}
/* Плашка добавила в верхнюю строку ~106-190px (зависит от длины названия
   города) — на неё не хватило места, и последний пункт меню ("Контакты")
   уезжал на вторую строку (замерено на 1920px и на maxwidth контейнера
   ~1780px: не хватало 61px). Сокращаем зазор между пунктами меню и жёстко
   ограничиваем ширину названия города в плашке (с "…" для длинных названий,
   например "Нижний Новгород"), чтобы плашка не могла раздуть строку сильнее
   всех остальных случаев. */
.header__desctop .header__list {
	gap: 10px 14px;
}
.header__location.js-popup .header__location-txt {
	max-width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/* правка по замечанию пользователя (2026-09-01): при выборе длинного названия
   города (например "Санкт-Петербург", 133px против ~55px у "Москвы") пункт
   "Контакты" всё равно уезжал на вторую строку — не хватало ~6px, т.к. при
   первом расчёте зазора не был учтён ещё и gap:35px у родителя .header__group
   между самой плашкой города, списком пунктов и правым блоком (email/телефон).
   Берём дополнительный запас (не впритык на 6px, а с большим запасом — чтобы
   хватало на любое из 9 популярных названий, вплоть до "Нижний Новгород"). */
.header__desctop .header__list {
	gap: 10px 10px;
}
.header__desctop .header__list .header__item:nth-child(3) {
	margin-right: 12px;
}
.drawer__location-row {
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}

.fn-modal__plate_width_650 {
	max-width: 650px;
}
.ml-city {
	display: flex;
	flex-direction: column;
	padding: 35px;
	background-color: #fff;
}
.ml-city__title {
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 20px;
}
.ml-city__search {
	position: relative;
	margin-bottom: 20px;
}
.ml-city__search-icon {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	height: 18px;
	color: #9a9a9a;
	pointer-events: none;
}
.ml-city__search-input {
	width: 100%;
	border: 1px solid #e5e5e5;
	border-radius: 8px;
	padding: 14px 16px 14px 44px;
	font-size: 15px;
	outline: none;
	transition: border-color .2s ease;
}
.ml-city__search-input:focus {
	border-color: #04b8cb;
}
.ml-city__popular {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin-bottom: 24px;
}
.ml-city__popular-link {
	border: none;
	border-radius: 20px;
	padding: 4px 2px;
	font-size: 17.9px;
	background: none;
	color: #04b8cb;
	text-decoration: underline;
	text-decoration-color: #04b8cb;
	cursor: pointer;
	transition: .2s ease;
}
.ml-city__popular-link:hover {
	color: #038a9c;
	text-decoration-color: #038a9c;
}
.ml-city__list-title {
	font-size: 16px;
	font-weight: 600;
	color: #8a8a8a;
	margin-bottom: 14px;
}
.ml-city__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px 16px;
	max-height: 320px;
	overflow-y: auto;
	padding-right: 8px;
}
.ml-city__link {
	text-align: left;
	background: none;
	border: none;
	padding: 2px 0;
	font-size: 15px;
	cursor: pointer;
	color: #1b2233;
	transition: .2s ease;
}
.ml-city__link:hover {
	color: #04b8cb;
}
.ml-city__link.is-hidden {
	display: none;
}
.ml-city__empty {
	display: none;
	text-align: center;
	color: #9a9a9a;
	padding: 20px 0;
}
.ml-city__empty.is-visible {
	display: block;
}
@media (max-width: 767px) {
	.ml-city {
		padding: 24px 20px;
	}
	.ml-city__list {
		grid-template-columns: repeat(2, 1fr);
		max-height: 280px;
	}
}
@media (max-width: 480px) {
	.ml-city__list {
		grid-template-columns: 1fr;
	}
}

/* === Правки по замечаниям гугл-таблицы (2026-08-31), главная === */

/* жирность выделенных пунктов меню (Акции/Калькулятор) 600-700 по макету */
.header__item.top-nav-accent_orange .header__link,
.top-bar__item.top-nav-accent_orange .top-bar__link,
.header__item.top-nav-accent_teal .header__link,
.top-bar__item.top-nav-accent_teal .top-bar__link {
	font-weight: 600;
}


/* текст "Пластиковые окна от производителя в [город]" у лого — 12px по макету */
.header__location_no-icon .header__location-txt {
	font-size: 12px;
}

/* окно "Выберите город": заголовок "Список городов" — чёрный, названия
   городов в списке — 17.9px по макету */
.ml-city__list-title {
	color: #1a1a1a;
}
.ml-city__link {
	font-size: 17.9px;
}

/* мобильная шапка: на планшетной ширине (>650px, где виден текстовый номер
   телефона hd-mobile__phone) кнопка-иконка звонка не нужна — дублирует номер */
@media (min-width: 425px) {
	.hd-mobile__social_phone {
		display: none !important;
	}
}

/* мобильная шапка (≤460px): иконка звонка чуть крупнее и вынесена из aside,
   чтобы встать по центру между "Участник проекта" и бургером (margin-left:auto
   у обоих соседей распределяет свободное место поровну) */
.hd-mobile__social_phone {
	width: 32px;
	height: 32px;
	margin-left: auto;
}

/* === Правки по замечаниям гугл-таблицы (2026-08-31), общие для нескольких
   страниц (используют один и тот же переиспользуемый компонент .od-box-card
   и общий класс .editor для списков) === */

/* закругление карточек .od-box-card больше — замерено в макете (~20px вместо
   базовых 10px), затрагивает все страницы, где встречается компонент:
   /osteklenie-balkonov-i-lodzhij/, /dveri/plastikovyye-dveri/,
   /okna-dlya-doma-i-dachi/ */
.od-box-card {
	border-radius: 20px;
}

/* точки маркированных списков крупнее и по центру ПЕРВОЙ строки текста
   по всему сайту (замечание повторяется на нескольких страницах: остекление
   балконов, окна для дома и дачи, калькулятор) — нативный ::marker нельзя
   точно центрировать и точно задать размер в px, поэтому заменяем его на
   псевдоэлемент с абсолютным позиционированием.
   Правка по уточнению пользователя: раньше точка дублировалась (наш ::before
   плюс родной list-style-type:disc из main.css .editor ul li — там он задан
   ПРЯМО на <li>, поэтому list-style:none на <ul> его не перебивал, нужно было
   переопределить именно на <li>). И центровка была по всему <li> (в т.ч. по
   высоте всего многострочного абзаца) — нужно только по первой строке: центр
   первой строки при line-height:160% = 0.8em от верха <li>. */
.editor ul {
	list-style: none;
	padding-left: 0;
}
.editor ul li {
	position: relative;
	padding-left: 24px;
	list-style-type: none;
}
.editor ul li::before {
	content: "";
	position: absolute;
	left: 5px;
	top: 0.8em;
	transform: translateY(-50%);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #f58a3c;
}