/*
Theme Name: Service Lux Дочерняя тема
Theme URI: https://goodwinpress.ru/wp-tema-wp-service-lux
Author: GoodwinPress
Author URI: https://goodwinpress.ru/
Description: Используем дочернюю тему лишь в тех случаях, когда собрались менять стили, разметку или функции темы. Просто так ее ставить не требуется.
Text Domain: service-lux
Template: service-lux
*/

/* Размещайте ваши стили под этой строкой. */

/* Вторичный текст (артикулы, наличие, подписи полей, счётчики).
   Раньше во всех местах работал запасной #888 — он даёт 3.5:1 на белом и
   3.3:1 на светло-серых плашках, ниже порога читаемости для мелкого текста.
   Это значение даёт 4.8:1 и 4.5:1 на тех же фонах. */
:root {
	--text-secondary: #6b7280;
}

.site-top-message__descr {
	display: none;
}

/* Шапка: контакты рядом с логотипом. Ряд у parent уже space-between, поэтому
   логотип стоит слева, а весь этот блок — справа; своего правила не нужно. */
.header-contacts {
	gap: 1.9rem;
	align-items: center;
}

.header-contacts__note {
	display: block;
	font-size: 0.8125rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
	color: var(--text-secondary);
	text-align: center;
}

/* Подпись под телефоном центрируется по номеру, а вторая строка адреса
   идёт по краю самого адреса. Ниже 1130px эта строка скрывается совсем,
   поэтому выравнивание нужно только на десктопе. */
.header-contacts__item--address .header-contacts__note {
	text-align: left;
}

/* «Работаем с … года» — первый блок справа от логотипа, отделён от контактов
   тонкой чертой. Черта фиксированной высоты, поэтому рисуется псевдоэлементом,
   а не рамкой пункта (та тянулась бы по высоте текста). */
.header-contacts__item--since {
	position: relative;
	padding-inline-end: 1.9rem;
	font-size: 0.9375rem;
	font-weight: var(--bold);
	line-height: 130%;
	white-space: nowrap;
}

.header-contacts__item--since::after {
	content: "";
	position: absolute;
	inset-inline-end: 0;
	top: 50%;
	width: 1px;
	height: 38px;
	background-color: var(--border-color);
	transform: translateY(-50%);
}

/* Акцент задаёт редактор: часть текста в настройке обёрнута в <span>.
   Целимся во вложенный span, а не в саму обёртку .header-contacts__text —
   она тоже span, и общий селектор красил бы всю строку. */
.header-contacts__item--since .header-contacts__text span {
	color: var(--accent);
}

.header-contacts__street {
	display: block;
	font-size: 0.9375rem;
	font-weight: var(--bold);
	line-height: 130%;
	white-space: nowrap;
}

/* Номер — плашка, подпись под ней. Ссылка оборачивает обе строки, поэтому
   плашка краснеет при наведении на любую часть блока. */
.header-contacts__item--tel .header-contacts__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	text-decoration: none;
}

.header-contacts__item--tel .header-contacts__link:hover {
	color: var(--main-color);
	text-decoration: none;
}

/* Тире по бокам подписи рисует вёрстка, а не значение поля: та же подпись
   идёт в лейбл виджета «Контакты» (inc/single-contacts.php), где тире внутри
   значения дают «Телефон - Мастерская -:». */
.header-contacts__item--tel .header-contacts__note::before {
	content: "– ";
}

.header-contacts__item--tel .header-contacts__note::after {
	content: " –";
}

.header-contacts__plate {
	display: block;
	padding: 9px 22px;
	font-size: 1.125rem;
	font-weight: var(--bold);
	line-height: 115%;
	white-space: nowrap;
	background-color: #eef0f3;
	border-radius: 6px;
	transition: background-color var(--animation), color var(--animation);
}

.header-contacts__link:hover .header-contacts__plate {
	color: var(--white);
	background-color: var(--accent);
}

/* График: дни слева, время справа, колонки выровнены по вертикали.
   tabular-nums ставит двоеточия обеих строк друг под другом. */
.header-contacts__hours {
	display: grid;
	grid-template-columns: auto auto;
	column-gap: 12px;
	row-gap: 3px;
	align-items: baseline;
	line-height: 130%;
	white-space: nowrap;
}

.header-contacts__days {
	font-size: 0.8125rem;
	font-weight: var(--semi-bold);
	color: var(--text-secondary);
}

.header-contacts__time {
	font-size: 0.9375rem;
	font-weight: var(--bold);
	font-variant-numeric: tabular-nums;
}

/* Город внутри строки адреса — вариант для узких экранов, на десктопе он
   уезжает во вторую строку (см. @media ниже). */
.header-contacts__city {
	display: none;
}

/* Телефон и почта узнаются как ссылки по самому значению, а «Мы на карте» —
   обычные слова: parent снимает подчёркивание у .header-contacts__link,
   и без него подпись неотличима от текста рядом. */
.header-contacts__item--address .header-contacts__note .header-contacts__link {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.header-contacts__sep {
	display: inline-block;
	margin-inline: 0.4rem;
	vertical-align: top;
	opacity: 0.5;
}

/* Узор платы в панели объявления (inc/header-message-pcb.php).
   Разметку панели печатает parent, поэтому рисуем псевдоэлементами самой
   полосы — копировать шаблон не нужно. Цвет, насыщенность и ширина зоны
   приезжают инлайн-переменными; правила включаются классом на <body>,
   так что при выключенной настройке в каскаде не участвует ничего. */
.mm22-message-pcb .site-top-message {
	position: relative;
	overflow: clip;
}

.mm22-message-pcb .site-top-message > .container {
	position: relative;
	z-index: 1;
}

.mm22-message-pcb .site-top-message::before,
.mm22-message-pcb .site-top-message::after {
	content: "";
	position: absolute;
	inset-block: 0;
	z-index: 0;
	width: var(--tm-pcb-width, 30%);
	pointer-events: none;
	opacity: var(--tm-pcb-alpha, 1);
	background-image: linear-gradient(to right, var(--tm-pcb-color, #a60909) 0 46%, transparent 100%);
	-webkit-mask-image: url("assets/img/pcb-strip.svg");
	mask-image: url("assets/img/pcb-strip.svg");
	-webkit-mask-size: var(--tm-pcb-tile, 320px 64px);
	mask-size: var(--tm-pcb-tile, 320px 64px);
	-webkit-mask-repeat: repeat-x;
	mask-repeat: repeat-x;
	-webkit-mask-position: 0 center;
	mask-position: 0 center;
}

.mm22-message-pcb .site-top-message::before {
	inset-inline-start: 0;
}

.mm22-message-pcb .site-top-message::after {
	inset-inline-end: 0;
	transform: scaleX(-1);
}

/* Иконки-плитки — раздел Главной (inc/home-icon-tiles.php).
   Размер плитки и число колонок приходят инлайном как CSS-переменные. */

/* Оформление раздела: заливка во всю ширину и узор платы с визитки.
   Границы полосы жёсткие — фон обрывается ровной линией, как остальные
   плашки сайта. Мягко сходит только сам рисунок к середине, иначе он
   обрывался бы вертикальной чертой посреди полосы и лез под текст. */
.home-icon-tiles {
	position: relative;
	overflow: clip;
}

.home-icon-tiles > .container {
	position: relative;
	z-index: 1;
}

.home-icon-tiles--bg {
	background-color: var(--tiles-bg);
}

/* Первому разделу Главной тема отступов не даёт (owl-правило пропускает
   первый элемент) — своей заливке поля нужны, иначе она липнет к шапке. */
.home .site-main > .home-icon-tiles--bg:first-child {
	padding-block: calc(var(--spacing) * 2);
}

.home-icon-tiles--fg .container__title {
	text-align: center;
}

.home-icon-tiles--fg .container__title,
.home-icon-tiles--fg .container__descr,
.home-icon-tiles--fg .icon-tiles__label {
	color: var(--tiles-fg);
}

/* Геометрия узора живёт в маске, цвет — в краске под ней: один файл
   рисунка обслуживает любой цвет из Customizer. Атрибуты width/height
   в самом SVG обязательны, иначе WebKit растянет тайл вместо повтора. */
.home-icon-tiles__pcb {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	z-index: 0;
	width: var(--tiles-pcb-width, 34%);
	pointer-events: none;
	user-select: none;
	opacity: var(--tiles-pcb-alpha, 1);
	background-image: linear-gradient(to right, var(--tiles-pcb-color, #a60909) 0 46%, transparent 100%);
	-webkit-mask-image: url("assets/img/pcb-tile.svg");
	mask-image: url("assets/img/pcb-tile.svg");
	-webkit-mask-size: var(--tiles-pcb-tile, 320px 320px);
	mask-size: var(--tiles-pcb-tile, 320px 320px);
	-webkit-mask-repeat: repeat;
	mask-repeat: repeat;
	-webkit-mask-position: 0 0;
	mask-position: 0 0;
}

.home-icon-tiles__pcb--right {
	inset-inline-start: auto;
	inset-inline-end: 0;
	transform: scaleX(-1);
}

/* Колонка равна плитке, а не 1fr: при 1fr колонки делят всю ширину
   контейнера, и плитки, центрируясь каждая в своей, расползаются по экрану.
   Ряд центрируется целиком через justify-content, расстояние между плитками
   задаётся настройкой раздела. ⚠️ max-content здесь не подходит: иконка —
   это <svg> без атрибутов width/height, её ширина задана процентом, а он при
   расчёте max-content не разрешается, и браузер берёт внутренний размер
   замещённого элемента (300px) — колонки раздувались до 290px. Нижняя
   граница minmax — 0, чтобы на узком экране колонки могли сжаться. */
.icon-tiles {
	display: grid;
	grid-template-columns: repeat(var(--tiles-cols, 4), minmax(0, var(--tiles-size, 96px)));
	justify-content: center;
	gap: 1.6rem var(--tiles-gap, 2.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
	justify-items: center;
}

.icon-tiles__cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.7rem;
	max-width: 100%;
	color: inherit;
	text-align: center;
	text-decoration: none;
}

a.icon-tiles__cell:hover {
	text-decoration: none;
}

.icon-tiles__tile {
	display: flex;
	align-items: center;
	justify-content: center;
	width: min(var(--tiles-size, 96px), 100%);
	aspect-ratio: 1;
	color: var(--tile-ink, #ffffff);
	background-color: var(--tile-bg, var(--accent));
	border: 2px solid var(--tile-border, transparent);
	border-radius: var(--tile-radius, 18px);
	transition: transform var(--animation), box-shadow var(--animation);
}

a.icon-tiles__cell:hover .icon-tiles__tile {
	transform: translateY(-3px);
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
}

.icon-tiles__glyph,
.icon-tiles__img {
	width: var(--tiles-icon, 52%);
	height: var(--tiles-icon, 52%);
	object-fit: contain;
}

/* Толщина линий задаётся настройкой раздела. Правило целится в сами фигуры:
   у них есть свой атрибут stroke-width, а он перебивает унаследованное
   значение — CSS-свойство сильнее presentation-атрибута. */
.icon-tiles__glyph * {
	stroke-width: var(--tiles-stroke, 1.7);
}

/* Зубцы шестерёнки заметно толще остального контура — иначе иконка
   читается как солнце. Держим пропорцию к общей настройке. */
.icon-tiles__glyph .is-bold {
	stroke-width: calc(var(--tiles-stroke, 1.7) * 1.9);
}

.icon-tiles__label {
	width: max-content;
	max-width: calc(var(--tiles-size, 96px) + 2.5rem);
	font-size: 0.95rem;
	line-height: 130%;
	font-weight: var(--semi-bold, 600);
}

/* Преимущества строкой — раздел Главной (inc/home-advantages.php).
   Размер подложки, число колонок и цвета приходят инлайном переменными.
   Заливка идёт во всю ширину экрана, содержимое держит родной .container. */

.home-advantages--bg {
	background-color: var(--adv-bg);
}

/* Фон не полосой: заливка уходит с секции на контейнер (плашка по ширине
   контента) или на сами пункты (отдельные плашки). Обоим нужны свои поля,
   иначе текст ляжет на край, и свой box-sizing: тема объявляет border-box
   только для html и псевдоэлементов, а это свойство не наследуется — без
   него внутренние поля раздули бы блок за отведённую ему ширину. */
.home-advantages--boxed,
.home-advantages--cards {
	background-color: transparent;
}

.home-advantages--boxed > .container {
	box-sizing: border-box;
	padding: calc(var(--spacing) * 0.9) var(--spacing);
	background-color: var(--adv-bg);
}

.home-advantages--cards .advantages__item {
	box-sizing: border-box;
	padding: calc(var(--spacing) * 0.6) calc(var(--spacing) * 0.7);
	background-color: var(--adv-bg);
}

/* Первому разделу Главной тема отступов не даёт (owl-правило пропускает
   первый элемент) — своей заливке поля нужны, иначе она липнет к шапке. */
.home .site-main > .home-advantages--bg:first-child {
	padding-block: calc(var(--spacing) * 2);
}

.home-advantages--fg .container__title,
.home-advantages--fg .container__descr,
.home-advantages--fg .advantages__text {
	color: var(--adv-fg);
}

.advantages {
	display: grid;
	grid-template-columns: repeat(var(--adv-cols, 3), minmax(0, 1fr));
	gap: 1.5rem var(--adv-gap, 2rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.advantages__item {
	position: relative;
	display: flex;
	min-width: 0;
}

/* Линия — отдельный слой посередине зазора, а не рамка ячейки: рамка сдвигала
   бы содержимое, а первый пункт следующего ряда вылезал бы за контейнер.
   Первому в ряду линия не нужна — его номер зависит от числа колонок,
   поэтому снимающее правило печатается инлайном (inc/home-advantages.php). */
.advantages--divided .advantages__item::before {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: calc(var(--adv-gap, 2rem) / -2);
	width: 1px;
	background-color: var(--adv-line, var(--border-color));
}

.advantages__cell {
	display: flex;
	align-items: center;
	gap: 1.1rem;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

a.advantages__cell:hover {
	text-decoration: none;
}

/* box-sizing обязателен: без него рамка добавляется к стороне, и подложка
   выходит на 4px больше настройки — размер перестаёт совпадать с полем. */
.advantages__tile {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--adv-size, 72px);
	aspect-ratio: 1;
	color: var(--adv-ink, var(--accent));
	background-color: var(--adv-tile-bg, transparent);
	border: 2px solid var(--adv-border, transparent);
	border-radius: var(--adv-radius, 50%);
	transition: transform var(--animation), box-shadow var(--animation);
}

a.advantages__cell:hover .advantages__tile {
	transform: translateY(-3px);
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
}

.advantages__glyph,
.advantages__img {
	width: var(--adv-icon, 52%);
	height: var(--adv-icon, 52%);
	object-fit: contain;
}

/* Толщина линий задаётся настройкой раздела. Правило целится в сами фигуры:
   у них есть свой атрибут stroke-width, а он перебивает унаследованное
   значение — CSS-свойство сильнее presentation-атрибута. */
.advantages__glyph * {
	stroke-width: var(--adv-stroke, 1.7);
}

.advantages__glyph .is-bold {
	stroke-width: calc(var(--adv-stroke, 1.7) * 1.9);
}

.advantages__text {
	min-width: 0;
	font-size: 1rem;
	line-height: 140%;
}

/* Постер 3 — слайдер (порт с markach-dojo.by, см. GUIDE §12.24) */

.home .site-main > .poster3:first-child {
	padding-block-end: calc(var(--spacing) * 2);
}

.poster3-slider {
	position: relative;
}

.poster3__slide {
	display: flex;
	height: auto;
}

/* Пропорция 5:3 задаёт высоту от ширины, поэтому слайд-картинка не зависит
   от количества текста. Это не жёсткая рамка: если надписи в узкой колонке
   не помещаются, блок вырастет — обрезки контента не будет. */
.poster3__wrap {
	position: relative;
	display: flex;
	flex: 1;
	aspect-ratio: 5 / 3;
	background-color: var(--main-color);
	border-radius: var(--bradius);
	overflow: clip;
}

/* Ссылка со всего слайда лежит слоем поверх фона и маски, но под контентом.
   ⚠️ Поднять кнопку над ссылкой одним z-index нельзя: у контента свой
   z-index, он создаёт слой целиком, и вложенный z-index кнопки из него не
   выходит (замер: клик по кнопке попадал на ссылку слайда). Поэтому клики
   сквозь контент пропускаются, а кнопка и ссылки в тексте их забирают. */
.poster3__link {
	position: absolute;
	inset: 0;
	z-index: 2;
}

.poster3__wrap:has(> .poster3__link) .poster3__content {
	pointer-events: none;
}

.poster3__wrap:has(> .poster3__link) .poster3__btn,
.poster3__wrap:has(> .poster3__link) .poster3__descr a {
	pointer-events: auto;
}

.poster3__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.poster3__wrap--mask::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background-color: rgb(0 0 0 / calc(var(--p3-overlay, 0.5) * 100%));
	backdrop-filter: blur(var(--p3-blur, 0px));
}

/* Контент лежит слоем поверх фона, а не в потоке: иначе длинные надписи
   растягивают слайд вниз и пропорция 5:3 перестаёт держаться (заметнее всего
   на телефоне, где места по высоте мало). Не влезающее обрезает overflow. */
.poster3__content {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--spacing);
	padding-block: 5.5rem;
	padding-inline: 4rem 2rem;
}

.poster3__title {
	display: block;
	max-width: 1080px;
	font-size: 3.15rem;
	font-weight: var(--extra-bold);
	line-height: 115%;
	color: var(--white);
}

.poster3__title > span {
	color: var(--accent);
}

.poster3__descr {
	max-width: 800px;
	font-size: 1.15rem;
	color: var(--white);
}

.poster3__btn {
	align-self: start;
	color: var(--btn-color);
	background-color: var(--btn-bg);
}

.poster3__btn:hover {
	color: var(--btn-color-hover);
	background-color: var(--btn-bg-hover);
}

.poster3__btn > .btn__icon {
	fill: var(--btn-color);
}

.poster3__btn:hover > .btn__icon {
	fill: var(--btn-color-hover);
}

.poster3-slider .splide__arrow {
	position: absolute;
	top: 50%;
	z-index: 3;
	transform: translateY(-50%);
}

.poster3-slider .splide__arrow--prev {
	left: 1rem;
}

.poster3-slider .splide__arrow--next {
	right: 1rem;
}

.poster3-slider .splide__pagination {
	position: absolute;
	inset-inline: 0;
	bottom: 1rem;
	z-index: 3;
}

.poster3-slider .splide__pagination__page {
	width: 9px;
	height: 9px;
	margin: 4px;
	background: rgb(255 255 255 / 55%);
	opacity: 1;
}

.poster3-slider .splide__pagination__page.is-active {
	background: var(--white);
	transform: scale(1.3);
}

/* WooCommerce single product — пропорции внутри port (узкая колонка темы) */

.service-single__content .service-single__wrap {
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 2rem;
}

.service-single__content .service-single__title {
	margin-block-end: 0.5rem;
	padding-inline-end: 0;
	font-size: 1.35rem;
	line-height: 130%;
}

/* Caption: чистый поток, без белой плашки с тенью */
.service-single__content .service-caption {
	gap: 1rem;
}

.service-single__content .service-caption .service-caption__descr {
	margin: 0;
	font-size: 0.95rem;
	line-height: 150%;
	color: var(--text-secondary, #555);
}

.service-single__content .service-caption .service-caption__price {
	margin: 0;
}

.service-single__content .service-caption .service-caption__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.6rem 1.2rem;
}

.service-single__content .service-caption .service-caption__stock {
	color: var(--text-secondary, #888);
	font-size: 0.95rem;
}

.service-single__content .service-caption .service-caption__stock .stock {
	margin: 0;
	padding: 0;
	background: transparent;
	border: none;
}

.service-single__content .service-caption .service-single__btn .btn__icon {
	width: 1.1rem;
	height: 1.1rem;
}

.service-single__tabs {
	margin-block-end: 50px;
}

.service-single__content .service-caption .service-single__cart.cart {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.6rem;
}

.service-single__content .service-caption .service-single__cart.cart .quantity {
	flex-shrink: 0;
	height: 44px;
	margin: 0;
}

.service-single__content .service-caption .service-single__cart.cart .quantity:not(:has(input.qty)) {
	display: none;
}

.service-single__content .service-caption .service-single__cart.cart .quantity .qty {
	height: 100%;
	min-height: 0;
	padding-block: 0;
}

.service-single__content .service-caption .service-single__cart.cart .single_add_to_cart_button {
	flex: 1 1 auto;
	height: 44px;
	margin: 0 !important;
	padding-inline: 1.2rem;
	font-size: 0.92rem;
}

.related-services__item .related-services__img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background-color: var(--grey-bg);
	border-radius: var(--bradius);
}

.related-services .splide__pagination {
	display: none;
}

/* Похожие товары — блок в стиле темы (.related-services без Splide) */
.shop-related {
	margin-block-end: 2rem;
	padding: 0;
	background-color: transparent;
	border-radius: 0;
}

.shop-related__headline {
	display: block;
	margin-block-end: 1rem;
	font-size: 1.2rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
}

.shop-related__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.shop-related__item {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	padding: 0.8rem;
	background-color: var(--white);
	border-radius: var(--bradius);
	transition: transform var(--animation), box-shadow var(--animation);
}

.shop-related__item:hover {
	transform: translateY(-2px);
	box-shadow: 5px 14px 22px -8px rgba(34, 60, 80, 0.18);
}

.shop-related__media {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: calc(var(--bradius) / 1.5);
	background-color: #fff;
}

.shop-related__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.shop-related__title {
	margin: 0;
	font-size: 15px;
	font-weight: var(--semi-bold);
	line-height: 130%;
	color: var(--main-color);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.shop-related__footer {
	margin-block-start: auto;
}

.shop-related__price {
	display: inline-block;
	padding: 7px 11px;
	font-size: var(--small);
	font-weight: var(--semi-bold);
	line-height: 1;
	color: var(--white);
	background-color: var(--accent);
	border-radius: var(--bradius);
}

.shop-related__link {
	position: absolute;
	inset: 0;
	z-index: 1;
}

.mm22-gallery {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 0.8rem;
	align-items: start;
}

.mm22-gallery__stage {
	grid-column: 2;
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: var(--bradius);
}

.mm22-gallery__slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--animation);
}

.mm22-gallery__slide.is-active {
	opacity: 1;
	pointer-events: auto;
}

.mm22-gallery__slide img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.mm22-gallery__thumbs-wrap {
	grid-column: 1;
	grid-row: 1;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.mm22-gallery__thumbs-viewport {
	overflow: hidden;
}

.mm22-gallery__thumbs-wrap.has-more .mm22-gallery__thumbs-viewport {
	max-height: calc(64px * 4 + 0.6rem * 3);
}

.mm22-gallery__thumbs {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
	transition: transform var(--animation);
}

.mm22-gallery__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 24px;
	padding: 0;
	background: var(--grey-bg);
	border: 1px solid var(--border-color);
	border-radius: calc(var(--bradius) * 0.6);
	color: var(--main-color);
	cursor: pointer;
	transition: opacity var(--animation), color var(--animation);
}

.mm22-gallery__nav svg {
	width: 14px;
	height: 14px;
}

.mm22-gallery__nav:hover:not(:disabled) {
	color: var(--accent);
}

.mm22-gallery__nav:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

.mm22-gallery__thumb {
	display: block;
	width: 100%;
	padding: 0;
	background: transparent;
	border: 1px solid var(--border-color);
	border-radius: calc(var(--bradius) * 0.6);
	cursor: pointer;
	opacity: 0.85;
	transition: opacity var(--animation), border-color var(--animation);
}

.mm22-gallery__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	border-radius: inherit;
}

.mm22-gallery__thumb:hover,
.mm22-gallery__thumb.is-active {
	opacity: 1;
	border-color: var(--accent);
}

.service-single__img > .service-single__filler {
	margin-block-end: 0;
}

.mm22-photo-note {
	display: flex;
	align-items: flex-start;
	gap: 0.4rem;
	margin-block: 0.9rem 0;
	font-size: var(--small);
	font-style: italic;
	line-height: 150%;
	color: var(--text-secondary, #6b7280);
}

.mm22-photo-note__icon {
	flex: none;
	width: 1.05em;
	height: 1.5em;
	height: 1lh;
}

/* product_meta: артикул, категория, теги — приглушённо */
.service-single__content .product_meta {
	margin-block-start: 0.5rem;
	padding-block-start: 1rem;
	border-block-start: 1px solid var(--border-color);
	font-size: 0.85rem;
	line-height: 180%;
	color: var(--text-secondary, #888);
}

.service-single__content .product_meta > span {
	display: block;
}

.service-single__content .product_meta a {
	color: var(--main-color);
	text-decoration: none;
}

.service-single__content .product_meta a:hover {
	color: var(--accent);
}

.shop-cats {
	padding: 1.2rem;
	background-color: var(--grey-bg);
	border-radius: var(--bradius);
}

/* На обычных страницах обёртка .widget получает рамку + padding от темы
   (.widget:not(.widget_media_image)) — выходит двойная рамка вокруг нашей
   плашки .shop-cats. Снимаем, чтобы виджет выглядел как на WC-страницах. */
.widget:has(> .shop-cats) {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
}

/* На обычных страницах виджет сидит в .post-content — глушим её стили списков
   (оранжевые буллеты li::before, левый отступ, увеличенный шрифт контента),
   иначе виджет выглядит иначе, чем на WC-страницах. */
.post-content .shop-cats li::before,
.post-content .shop-cats__item::before {
	display: none !important;
	content: none !important;
}

.post-content .shop-cats .shop-cats__item {
	padding-left: 0;
	margin-left: 0;
}

.post-content .shop-cats .shop-cats__list,
.post-content .shop-cats .shop-cats__sub {
	font-size: 0.95rem;
}

.shop-cats__headline {
	display: block;
	margin-block-end: 1rem;
	font-size: 1.05rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
}

.shop-cats__list,
.shop-cats__sub {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* .widget ul (parent) ставит margin-inline-start:0 !important + padding:0 —
   перебиваем повышенной специфичностью и !important на margin. */
.widget ul.shop-cats__sub,
.shop-cats__sub {
	display: none;
	margin-block-start: 0.3rem;
	margin-inline-start: 5px !important;
	padding-inline-start: 7px;
	border-inline-start: 1.5px solid var(--border-color);
}

.shop-cats__item.is-open > .shop-cats__sub {
	display: block;
}

.shop-cats__item.on-path.is-open > .shop-cats__sub {
	border-inline-start-color: color-mix(in srgb, var(--accent) 45%, transparent);
}

.shop-cats__item {
	position: relative;
}

.shop-cats__toggle {
	position: absolute;
	top: 0;
	right: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	margin: 0;
	padding: 0;
	color: var(--main-color);
	background: transparent;
	border: 0;
	border-radius: calc(var(--bradius) / 2);
	cursor: pointer;
	text-decoration: none;
	transition: background-color var(--animation);
}

.shop-cats__toggle:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

/* Подкатегории закрытых веток подгружаются по клику — на медленной сети без
   этого клик выглядит как «ничего не произошло». */
.shop-cats__item.is-loading > .shop-cats__toggle {
	opacity: 0.45;
	cursor: progress;
}

.shop-cats__chevron {
	width: 0.7rem;
	height: 0.5rem;
	transition: transform var(--animation);
}

.shop-cats__item.is-open > .shop-cats__toggle .shop-cats__chevron {
	transform: rotate(180deg);
}

.shop-cats__item:has(.shop-cats__toggle) > .shop-cats__link {
	padding-inline-end: 2.4rem;
}

.shop-cats__item + .shop-cats__item {
	margin-block-start: 0.4rem;
}

.shop-cats__link {
	display: block;
	padding: 0.35rem 0.5rem;
	color: var(--main-color);
	font-size: 0.95rem;
	line-height: 130%;
	text-decoration: none;
	border-radius: calc(var(--bradius) / 2);
	transition: color var(--animation), background-color var(--animation);
}

.shop-cats__name {
	display: inline;
}

.shop-cats__link:hover {
	color: var(--accent);
	background-color: rgba(0, 0, 0, 0.03);
}

.shop-cats__item--child .shop-cats__link {
	font-size: 0.88rem;
	font-weight: var(--thin);
}

.shop-cats__item.is-active > .shop-cats__link {
	color: var(--accent);
	font-weight: var(--semi-bold);
	background-color: rgba(0, 0, 0, 0.04);
}

.shop-cats__count {
	display: inline;
	margin-inline-start: 0.35rem;
	font-size: 0.8rem;
	font-weight: var(--thin);
	color: var(--text-secondary, #888);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

/* Архив товаров: H1 страницы каталога + сетка */
.shop-archive__title {
	margin-block: 1rem 0.5rem;
}

.service-single__header .term-description,
.service-single__header .woocommerce-archive-description {
	margin-block-start: 0.75rem;
	font-size: 0.95rem;
	line-height: 150%;
	color: var(--text-secondary, #555);
}

/* Тулбар каталога: select категорий | счётчик | select сортировки */
.shop-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin: 0 0 1.5rem;
}

.shop-toolbar .woocommerce-result-count,
.shop-toolbar .woocommerce-ordering {
	float: none !important;
	margin: 0;
}

.shop-toolbar__cell {
	display: flex;
	align-items: center;
}

.shop-toolbar__cell--cats {
	flex: 0 0 220px;
}

/* В ячейке сортировки живёт ещё и переключатель вида — ширины на двоих */
.shop-toolbar__cell--ordering {
	flex: 0 0 300px;
	justify-content: flex-end;
}

.shop-toolbar__cell--ordering .woocommerce-ordering {
	flex: 1 1 auto;
	min-width: 0;
}

/* На поиске в тулбаре только сортировка и вид — прижимаем их вправо
   (число результатов печатает строка над списком) */
.shop-toolbar--search {
	justify-content: flex-end;
}

.shop-toolbar__cell--count {
	flex: 1 1 auto;
	justify-content: center;
	font-size: 0.9rem;
	color: var(--text-secondary, #888);
}

.shop-toolbar__select,
.woocommerce-ordering select {
	width: 100%;
	padding: 0.4rem 2.2rem 0.4rem 0.8rem;
	font-size: 0.9rem;
	background-color: var(--white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23555' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.8rem center;
	background-size: 0.7rem;
	border: 1px solid var(--border-color);
	border-radius: calc(var(--bradius) / 1.5);
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

/* Сетка товаров */
.shop-grid {
	clear: both;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 1rem;
	width: 100%;
	margin: 0 0 2rem;
	padding: 0;
	list-style: none;
}

.shop-product {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	padding: 0.9rem;
	background-color: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	transition: transform var(--animation), box-shadow var(--animation), border-color var(--animation);
}

.shop-product:hover {
	transform: translateY(-2px);
	border-color: transparent;
	box-shadow: 5px 14px 22px -8px rgba(34, 60, 80, 0.18);
}

.shop-product__media {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: calc(var(--bradius) / 1.5);
	background-color: var(--grey-bg);
}

.shop-product__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.shop-product__title {
	margin: 0;
	font-size: 0.92rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
	color: var(--main-color);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.shop-product__footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.6rem;
	margin-block-start: auto;
}

.shop-product__stock {
	font-size: var(--small);
	color: var(--text-secondary, #888);
}

/*
	Сами цвета приезжают из Customizer переменными --mm22-stock-* (inline).
	Второй селектор — страница товара: WooCommerce красит наличие оливковым
	правилом в три класса (`.woocommerce … div.product .stock`), поэтому свой
	цвет задаётся четырьмя классами, иначе проигрывает по специфичности.
*/
.shop-product__stock.mm22-stock--enough,
.service-single .service-caption .service-caption__stock .stock.mm22-stock--enough {
	color: var(--mm22-stock-enough, #2e7d32);
}

.shop-product__stock.mm22-stock--low,
.service-single .service-caption .service-caption__stock .stock.mm22-stock--low {
	color: var(--mm22-stock-low, var(--accent, #db2129));
}

.shop-product__stock.mm22-stock--none,
.service-single .service-caption .service-caption__stock .stock.mm22-stock--none {
	color: var(--mm22-stock-none, #616161);
}

.shop-product__price {
	display: inline-block;
	margin-inline-start: auto;
	padding: 7px 11px;
	font-size: var(--small);
	font-weight: var(--semi-bold);
	line-height: 1;
	color: var(--white);
	background-color: var(--accent);
	border-radius: var(--bradius);
}

.shop-product__link {
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Переключатель вида каталога */
.shop-view {
	display: flex;
	flex-shrink: 0;
	gap: 4px;
	margin-inline-start: 0.6rem;
	padding: 3px;
	background-color: var(--grey-bg);
	border-radius: calc(var(--bradius) / 1.5);
}

.shop-view__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 30px;
	padding: 0;
	color: var(--text-secondary, #888);
	background-color: transparent;
	border: 0;
	border-radius: calc(var(--bradius) / 2);
	cursor: pointer;
	transition: color var(--animation), background-color var(--animation);
}

.shop-view__btn svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
}

.shop-view__btn:hover {
	color: var(--main-color);
}

.shop-view__btn.is-active {
	color: var(--accent);
	background-color: var(--white);
	box-shadow: 0 1px 3px rgba(34, 60, 80, 0.14);
}

/* Кнопки карточки — только в виде «списком» */
.shop-product__actions {
	display: none;
}

/* Селекторы с .shop-grid — перебить WC-стиль `.woocommerce a.button` (0,2,1) */
.shop-grid .shop-product__actions .shop-product__more,
.shop-grid .shop-product__actions .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 0 0.9rem;
	font-size: var(--small);
	font-weight: var(--semi-bold);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	border-radius: calc(var(--bradius) / 1.5);
	transition: background-color var(--animation), color var(--animation);
}

.shop-grid .shop-product__actions .shop-product__more {
	color: var(--main-color);
	background-color: var(--white);
	border: 1px solid var(--border-color);
}

.shop-grid .shop-product__actions .shop-product__more:hover {
	color: var(--accent);
	border-color: var(--accent);
}

.shop-grid .shop-product__actions .button {
	margin: 0;
	color: var(--btn-color, var(--white));
	background-color: var(--btn-bg, var(--accent));
	border: 1px solid transparent;
}

.shop-grid .shop-product__actions .button:hover {
	color: var(--btn-color-hover, var(--white));
	background-color: var(--btn-bg-hover, var(--accent));
}

.shop-grid .shop-product__actions .added_to_cart {
	display: none;
}

/* Вид «списком»: строка [фото][название + остаток][цена][кнопки] */
.shop-grid--list {
	grid-template-columns: 1fr;
	gap: 0.75rem;
}

.shop-grid--list .shop-product {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr) auto auto;
	grid-template-areas:
		"media title price actions"
		"media stock price actions";
	align-items: center;
	column-gap: 1rem;
	row-gap: 0.25rem;
	padding: 0.75rem 1rem;
}

.shop-grid--list .shop-product:hover {
	transform: none;
}

.shop-grid--list .shop-product__media {
	grid-area: media;
}

.shop-grid--list .shop-product__title {
	grid-area: title;
	align-self: end;
	-webkit-line-clamp: 2;
}

.shop-grid--list .shop-product__footer {
	display: contents;
}

.shop-grid--list .shop-product__stock {
	grid-area: stock;
	align-self: start;
}

/* В списке цена — просто красный текст: плашка путалась с кнопкой «В корзину» */
.shop-grid--list .shop-product__price {
	grid-area: price;
	margin-inline-start: 0;
	justify-self: end;
	padding: 0;
	font-size: 1.05rem;
	color: var(--accent);
	background-color: transparent;
	border-radius: 0;
	white-space: nowrap;
}

.shop-grid--list .shop-product__actions {
	position: relative;
	z-index: 2;
	grid-area: actions;
	display: flex;
	gap: 0.5rem;
}

/* ===========================================================
   Страница корзины — вариант 4 «Премиум-магазин»
   CSS скопирован 1:1 из docs/temp/cart-variants.html .v4-*
   с префиксом .mm22-cart-page для изоляции.
   =========================================================== */

.mm22-cart-page {
	margin-block-end: 2rem;
	transition: opacity var(--animation);
}

body.mm22-cart-loading .mm22-cart-page {
	opacity: 0.5;
	pointer-events: none;
}

.mm22-cart-page .v4-body {
	display: grid;
	grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr);
	gap: 36px;
	align-items: start;
}

.mm22-cart-page .v4-items {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.mm22-cart-page .v4-item {
	display: grid;
	grid-template-columns: 100px minmax(0, 1fr) auto;
	gap: 20px;
	padding: 22px 0;
	border-bottom: 1px solid var(--border-color);
	align-items: center;
}

.mm22-cart-page .v4-item:first-child {
	padding-top: 8px;
}

.mm22-cart-page .v4-img {
	width: 100px;
	height: 100px;
	border-radius: var(--bradius);
	overflow: hidden;
	display: block;
}

.mm22-cart-page .v4-img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mm22-cart-page .v4-info {
	min-width: 0;
}

.mm22-cart-page .v4-name {
	font-size: 15px;
	font-weight: 600;
	color: var(--main-color);
	line-height: 1.35;
	margin-bottom: 6px;
	text-decoration: none;
	display: block;
}

.mm22-cart-page .v4-name:hover {
	color: var(--accent);
}

.mm22-cart-page .v4-attr {
	font-size: 12px;
	color: var(--text-secondary, #888);
	margin-bottom: 12px;
}

.mm22-cart-page .v4-attr span + span::before {
	content: '·';
	margin: 0 8px;
}

.mm22-cart-page .v4-controls-row {
	display: flex;
	align-items: center;
	gap: 16px;
}

.mm22-cart-page .v4-qty {
	display: inline-flex;
	align-items: center;
	background: var(--grey-bg);
	border-radius: 24px;
	padding: 4px;
	margin: 0;
	border: none;
	float: none;
}

.mm22-cart-page .v4-qty.product-quantity .quantity {
	display: contents;
}

.mm22-cart-page .v4-qty-btn {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--white);
	border: none;
	font-size: 14px;
	font-weight: 700;
	color: var(--main-color);
	cursor: pointer;
	box-shadow: 0 1px 2px rgb(47 52 64 / 8%);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
}

.mm22-cart-page .v4-qty-btn:hover:not(:disabled) {
	background: var(--accent);
	color: var(--white);
}

.mm22-cart-page .v4-qty-btn:disabled {
	opacity: 0.35;
	cursor: not-allowed;
	box-shadow: none;
}

.mm22-cart-page .v4-qty--fixed {
	padding: 4px 14px;
}

.mm22-cart-page .v4-qty-value--static {
	display: inline-block;
	min-width: 24px;
	text-align: center;
	font-size: 13px;
	font-weight: 700;
	color: var(--main-color);
}

.mm22-cart-page .v4-qty input.v4-qty-value {
	box-sizing: border-box;
	min-width: 32px;
	width: 32px;
	height: 28px;
	min-height: 0;
	padding: 0;
	margin: 0;
	text-align: center;
	font-size: 13px;
	font-weight: 700;
	font-family: inherit;
	background: transparent;
	border: none;
	color: var(--main-color);
	-moz-appearance: textfield;
	appearance: textfield;
	line-height: 28px;
}

.mm22-cart-page .v4-qty input.v4-qty-value::-webkit-outer-spin-button,
.mm22-cart-page .v4-qty input.v4-qty-value::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.mm22-cart-page .v4-qty input.v4-qty-value:focus {
	outline: none;
}

.mm22-cart-page .v4-remove-link {
	background: transparent;
	border: none;
	font-size: 12px;
	color: var(--text-secondary, #888);
	cursor: pointer;
	text-decoration: underline;
	padding: 0;
}

.mm22-cart-page .v4-remove-link:hover {
	color: var(--accent);
}

.mm22-cart-page .v4-pricing {
	text-align: right;
	white-space: nowrap;
}

.mm22-cart-page .v4-subtotal {
	font-size: 18px;
	font-weight: 700;
	color: var(--main-color);
	margin-bottom: 4px;
}

.mm22-cart-page .v4-unit {
	font-size: 12px;
	color: var(--text-secondary, #888);
}

.mm22-cart-page .v4-summary {
	position: sticky;
	top: 20px;
	background: var(--footer-bg);
	color: var(--footer-color);
	border-radius: 12px;
	padding: 28px;
	height: fit-content;
}

.mm22-cart-page .v4-summary-title {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	margin-bottom: 22px;
}

.mm22-cart-page .v4-summary-row {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	margin-bottom: 14px;
	color: color-mix(in srgb, var(--footer-color) 80%, transparent);
}

.mm22-cart-page .v4-summary-row .value {
	color: var(--footer-color);
	font-weight: 600;
}

.mm22-cart-page .v4-shipping {
	background: color-mix(in srgb, var(--footer-color) 6%, transparent);
	border-radius: var(--bradius);
	padding: 12px;
	margin: 18px 0;
}

.mm22-cart-page .v4-shipping-title {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	margin-bottom: 10px;
}

.mm22-cart-page .v4-shipping ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mm22-cart-page .v4-shipping li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	padding: 6px 0;
	color: var(--footer-color);
}

.mm22-cart-page .v4-shipping input[type="radio"] {
	accent-color: var(--accent);
}

.mm22-cart-page .v4-summary-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding-top: 18px;
	margin-top: 18px;
	margin-bottom: 22px;
	border-top: 1px solid color-mix(in srgb, var(--footer-color) 12%, transparent);
}

.mm22-cart-page .v4-summary-total .label {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
}

.mm22-cart-page .v4-summary-total .value {
	font-size: 28px;
	font-weight: 700;
	color: var(--footer-color);
}

.mm22-cart-page .v4-btn-checkout,
.mm22-cart-page .wc-proceed-to-checkout a.checkout-button {
	box-sizing: border-box;
	background: var(--btn-bg);
	color: var(--btn-color);
	width: 100%;
	padding: 14px 18px;
	border-radius: var(--bradius);
	border: none;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	text-decoration: none;
	transition: opacity var(--animation), background var(--animation);
}

.mm22-cart-page .v4-btn-checkout:hover,
.mm22-cart-page .wc-proceed-to-checkout a.checkout-button:hover {
	background: var(--btn-bg-hover);
	color: var(--btn-color-hover);
}

.mm22-cart-page details.v4-coupon {
	margin-top: 14px;
}

.mm22-cart-page details.v4-coupon summary {
	display: block;
	text-align: center;
	font-size: 12px;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	text-decoration: underline;
	cursor: pointer;
	list-style: none;
}

.mm22-cart-page details.v4-coupon summary::-webkit-details-marker {
	display: none;
}

.mm22-cart-page details.v4-coupon summary:hover {
	color: var(--footer-color);
}

.mm22-cart-page .v4-coupon-form {
	display: flex;
	gap: 8px;
	margin-top: 10px;
}

.mm22-cart-page .v4-coupon-form input {
	flex: 1;
	min-width: 0;
	padding: 8px 10px;
	font-size: 13px;
	font-family: inherit;
	color: var(--footer-color);
	background: color-mix(in srgb, var(--footer-color) 8%, transparent);
	border: 1px solid color-mix(in srgb, var(--footer-color) 15%, transparent);
	border-radius: calc(var(--bradius) / 1.5);
}

.mm22-cart-page .v4-coupon-form input::placeholder {
	color: color-mix(in srgb, var(--footer-color) 50%, transparent);
}

.mm22-cart-page .v4-coupon-form button {
	padding: 8px 14px;
	font-size: 13px;
	font-family: inherit;
	color: var(--btn-color);
	background: var(--btn-bg);
	border: none;
	border-radius: calc(var(--bradius) / 1.5);
	cursor: pointer;
}

@media (max-width: 1130px) {
	.mm22-cart-page .v4-body {
		grid-template-columns: 1fr;
	}

	.mm22-cart-page .v4-summary {
		position: static;
	}
}

@media (max-width: 600px) {
	.mm22-cart-page .v4-item {
		grid-template-columns: 72px minmax(0, 1fr);
		gap: 12px;
	}

	.mm22-cart-page .v4-img {
		width: 72px;
		height: 72px;
	}

	.mm22-cart-page .v4-pricing {
		grid-column: 1 / -1;
		text-align: left;
		padding-top: 4px;
		border-top: 1px dashed var(--border-color);
	}
}

/* ===========================================================
   Страница оформления заказа — вариант 1 «Двухколоночный»
   CSS из docs/temp/checkout-variants.html .v1-* + .fld
   с префиксом .mm22-co-page.
   =========================================================== */

.mm22-co-page {
	margin-block-end: 2rem;
	transition: opacity var(--animation);
}

body.mm22-co-loading .mm22-co-page {
	opacity: 0.5;
	pointer-events: none;
}

.mm22-co-page .v1-body {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
	gap: 36px;
	align-items: start;
}

.mm22-co-page .v1-section {
	margin-bottom: 28px;
}

.mm22-co-page .v1-section-title {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--border-color);
}

/* Универсальные поля формы */
.mm22-co-page .fld {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 14px;
}

.mm22-co-page .fld label,
.mm22-co-page .form-row > label {
	font-size: 12px;
	font-weight: 600;
	color: var(--text-secondary, #888);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}

.mm22-co-page .form-row {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 14px;
	padding: 0;
}

.mm22-co-page .form-row-first,
.mm22-co-page .form-row-last {
	flex: 1;
}

.mm22-co-page .form-row .input-text,
.mm22-co-page .form-row select,
.mm22-co-page .form-row textarea,
.mm22-co-page .fld input,
.mm22-co-page .fld select,
.mm22-co-page .fld textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 0;
	padding: 11px 14px;
	margin: 0;
	font-family: inherit;
	font-size: 14px;
	background: var(--white);
	color: var(--main-color);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	transition: border-color var(--animation);
}

.mm22-co-page .form-row .input-text:focus,
.mm22-co-page .form-row select:focus,
.mm22-co-page .form-row textarea:focus,
.mm22-co-page .fld input:focus,
.mm22-co-page .fld select:focus,
.mm22-co-page .fld textarea:focus {
	outline: none;
	border-color: var(--accent);
}

.mm22-co-page .form-row .required {
	color: var(--accent);
	text-decoration: none;
}

/* Двухколоночные поля (билинг ФИ) */
.mm22-co-page .form-row-pair {
	display: flex;
	gap: 12px;
}

.mm22-co-page .form-row-pair > .form-row {
	flex: 1;
}

/* Select2 fallback под наш стиль */
.mm22-co-page .select2-container--default .select2-selection--single {
	height: auto;
	padding: 7px 10px;
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
}

.mm22-co-page .select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0;
	color: var(--main-color);
	line-height: 24px;
}

/* Варианты оплаты — карточки-radio */
.mm22-co-page ul.wc_payment_methods,
.mm22-co-page .v1-payment-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	border: none;
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method,
.mm22-co-page .v1-payment-option {
	display: block;
	padding: 12px 14px;
	background: var(--grey-bg);
	border: 1px solid transparent;
	border-radius: var(--bradius);
	cursor: pointer;
	transition: border-color var(--animation), background var(--animation);
	list-style: none;
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method:hover,
.mm22-co-page .v1-payment-option:hover {
	background: color-mix(in srgb, var(--accent) 6%, transparent);
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method.payment_method_active,
.mm22-co-page ul.wc_payment_methods .wc_payment_method:has(input:checked),
.mm22-co-page .v1-payment-option--active {
	background: color-mix(in srgb, var(--accent) 10%, transparent);
	border-color: var(--accent);
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method > input[type="radio"] {
	accent-color: var(--accent);
	margin-right: 8px;
	vertical-align: middle;
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method label {
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	color: var(--main-color);
	margin: 0;
	cursor: pointer;
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method label img {
	display: none;
}

.mm22-co-page ul.wc_payment_methods .payment_box {
	margin-top: 10px;
	padding: 10px 0 0;
	font-size: 12px;
	color: var(--text-secondary, #888);
	line-height: 1.4;
	background: transparent;
}

.mm22-co-page ul.wc_payment_methods .payment_box::before {
	display: none;
}

/* Способы оплаты внутри тёмной панели */
.mm22-co-page .woocommerce-checkout-payment {
	margin: 18px 0 0;
	padding: 0;
	background: transparent;
	border-radius: 0;
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method label {
	color: var(--main-color);
}

/* Карточка-radio переоформляем под тёмный фон */
.mm22-co-page ul.wc_payment_methods .wc_payment_method {
	background: color-mix(in srgb, var(--footer-color) 6%, transparent);
	color: var(--footer-color);
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method label {
	color: var(--footer-color);
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method:hover {
	background: color-mix(in srgb, var(--footer-color) 10%, transparent);
}

.mm22-co-page ul.wc_payment_methods .wc_payment_method:has(input:checked) {
	background: color-mix(in srgb, var(--accent) 18%, transparent);
	border-color: var(--accent);
}

.mm22-co-page ul.wc_payment_methods .payment_box {
	color: color-mix(in srgb, var(--footer-color) 70%, transparent);
}

/* Правая sticky-панель с заказом */
.mm22-co-page .v1-summary {
	position: sticky;
	top: 20px;
	background: var(--footer-bg);
	color: var(--footer-color);
	border-radius: 12px;
	padding: 24px;
	height: fit-content;
}

.mm22-co-page .v1-summary-title {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	margin-bottom: 18px;
}

.mm22-co-page .v1-summary-items {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-bottom: 16px;
	border-bottom: 1px solid color-mix(in srgb, var(--footer-color) 12%, transparent);
	margin-bottom: 16px;
}

.mm22-co-page .v1-summary-item {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	font-size: 13px;
}

.mm22-co-page .v1-summary-img {
	width: 44px;
	height: 44px;
	border-radius: 6px;
	background: color-mix(in srgb, var(--footer-color) 6%, transparent);
	overflow: hidden;
	position: relative;
}

.mm22-co-page .v1-summary-img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mm22-co-page .v1-summary-img-badge {
	position: absolute;
	top: -6px;
	right: -6px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	font-size: 11px;
	font-weight: 700;
	color: var(--white);
	background: var(--accent);
	border-radius: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.mm22-co-page .v1-summary-name {
	font-size: 12px;
	line-height: 1.35;
	color: color-mix(in srgb, var(--footer-color) 85%, transparent);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.mm22-co-page .v1-summary-price {
	font-size: 13px;
	font-weight: 600;
	color: var(--footer-color);
	white-space: nowrap;
}

.mm22-co-page .v1-summary-row {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	margin-bottom: 10px;
	color: color-mix(in srgb, var(--footer-color) 80%, transparent);
}

.mm22-co-page .v1-summary-row .value,
.mm22-co-page .v1-summary-row .amount,
.mm22-co-page .v1-summary-row .woocommerce-Price-amount {
	color: var(--footer-color);
	font-weight: 600;
}

.mm22-co-page .v1-summary-shipping {
	margin-bottom: 14px;
}

.mm22-co-page .v1-summary-shipping ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mm22-co-page .v1-summary-shipping li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--footer-color);
}

.mm22-co-page .v1-summary-shipping input[type="radio"] {
	accent-color: var(--accent);
}

.mm22-co-page .v1-summary-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding-top: 14px;
	margin-top: 4px;
	margin-bottom: 18px;
	border-top: 1px solid color-mix(in srgb, var(--footer-color) 12%, transparent);
}

.mm22-co-page .v1-summary-total .label {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
}

.mm22-co-page .v1-summary-total .value,
.mm22-co-page .v1-summary-total .amount,
.mm22-co-page .v1-summary-total .woocommerce-Price-amount {
	font-size: 24px;
	font-weight: 700;
	color: var(--footer-color);
}

.mm22-co-page .place-order {
	margin: 0;
	padding: 0;
}

.mm22-co-page #place_order,
.mm22-co-page .v1-place-order {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 14px 18px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--btn-color);
	background: var(--btn-bg);
	border: none;
	border-radius: var(--bradius);
	cursor: pointer;
	text-decoration: none;
	transition: background var(--animation), color var(--animation);
}

.mm22-co-page #place_order:hover,
.mm22-co-page .v1-place-order:hover {
	background: var(--btn-bg-hover);
	color: var(--btn-color-hover);
}

.mm22-co-page .v1-policy,
.mm22-co-page .woocommerce-terms-and-conditions-wrapper {
	font-size: 12px;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	margin-top: 14px;
	text-align: left;
	line-height: 1.4;
}

.mm22-co-page .v1-policy a,
.mm22-co-page .woocommerce-terms-and-conditions-wrapper a {
	color: var(--accent);
}

/* Чекбокс «Правила и условия» — под тёмную панель оформления */
.mm22-co-page .woocommerce-terms-and-conditions-wrapper .form-row {
	display: block;
	margin: 12px 0 0;
	padding: 0;
}

.mm22-co-page .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	font-size: 12px;
	line-height: 1.45;
	text-align: left;
	color: color-mix(in srgb, var(--footer-color) 75%, transparent);
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
}

.mm22-co-page .woocommerce-form__label-for-checkbox input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	margin: 0;
	background: color-mix(in srgb, var(--footer-color) 8%, transparent);
	border: 1.5px solid color-mix(in srgb, var(--footer-color) 35%, transparent);
	border-radius: 4px;
	cursor: pointer;
	transition: background var(--animation), border-color var(--animation);
}

.mm22-co-page .woocommerce-form__label-for-checkbox input[type="checkbox"]:hover {
	border-color: var(--accent);
}

.mm22-co-page .woocommerce-form__label-for-checkbox input[type="checkbox"]:checked {
	background: var(--accent);
	border-color: var(--accent);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.5 3.5L11 1.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 11px;
}

.mm22-co-page .woocommerce-form__label-for-checkbox input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

.mm22-co-page .woocommerce-terms-and-conditions-checkbox-text {
	flex: 1 1 auto;
}

.mm22-co-page .woocommerce-terms-and-conditions-checkbox-text a {
	color: var(--accent);
	text-decoration: underline;
}

.mm22-co-page .woocommerce-form__label-for-checkbox .required {
	color: var(--accent);
	border: 0;
}

/* WC валидация */
.mm22-co-page .woocommerce-invalid .input-text,
.mm22-co-page .woocommerce-invalid select {
	border-color: #c0392b;
}

.mm22-co-page .woocommerce-error,
.mm22-co-page .woocommerce-info {
	padding: 12px 14px;
	margin: 0 0 16px;
	font-size: 13px;
	background: var(--grey-bg);
	border-left: 3px solid var(--accent);
	border-radius: calc(var(--bradius) / 1.5);
	list-style: none;
}

@media (max-width: 1130px) {
	.mm22-co-page .v1-body {
		grid-template-columns: 1fr;
	}

	.mm22-co-page .v1-summary {
		position: static;
	}
}

@media (max-width: 600px) {
	.mm22-co-page .form-row-pair {
		flex-direction: column;
		gap: 0;
	}
}

/* Виджет цены WC */
.service-single__aside .widget_price_filter {
	margin-block-end: 1rem;
	padding: 1.2rem;
	background-color: var(--grey-bg);
	border-radius: var(--bradius);
}

.service-single__aside .widget_price_filter .widget-title,
.service-single__aside .widget_price_filter h2 {
	margin: 0 0 1rem;
	font-size: 1.05rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
}

.service-single__aside .price_slider {
	height: 4px;
	margin: 1.4rem 0.4rem 0.6rem;
	background-color: rgba(0, 0, 0, 0.08);
	border-radius: 4px;
}

.service-single__aside .price_slider .ui-slider-range {
	background-color: var(--accent);
	border-radius: 4px;
}

.service-single__aside .price_slider .ui-slider-handle {
	width: 1rem;
	height: 1rem;
	margin-top: -0.35rem;
	margin-inline-start: -0.5rem;
	background-color: var(--white);
	border: 2px solid var(--accent);
	border-radius: 50%;
	cursor: pointer;
}

.service-single__aside .price_slider_amount {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-block-start: 0.8rem;
	font-size: 0.9rem;
}

.service-single__aside .price_label {
	flex: 1 1 100%;
	margin-block-end: 0.5rem;
	color: var(--text-secondary, #555);
}

.service-single__aside .price_label .from,
.service-single__aside .price_label .to {
	font-weight: var(--semi-bold);
	color: var(--main-color);
}

.service-single__aside .price_slider_amount .button {
	padding: 0.5rem 1rem;
	font-size: 0.85rem;
	font-weight: var(--semi-bold);
	color: var(--white);
	background-color: var(--accent);
	border: 0;
	border-radius: calc(var(--bradius) / 1.5);
	cursor: pointer;
	transition: background-color var(--animation);
}

.service-single__aside .price_slider_amount .button:hover {
	background-color: var(--btn-bg-hover, var(--accent));
}

.header-contacts__item {
	align-items: center;
}

/* Полоса меню тёмная (макет «Тихие иконки»): на ней живут кнопка услуг,
   меню, поиск и пилюля с иконками. Выпадающие списки остаются светлыми —
   правила цепляются только за верхний уровень меню. */
.site-main-nav {
	background-color: #22262e;
}

.site-main-nav__wrap {
	border-top: 0;
	border-bottom: 0;
}

.site-main-nav .main-menu > .menu-item > .menu-item__link {
	color: #e7e9ee;
}

.site-main-nav .main-menu > .menu-item > .menu-item__link:hover,
.site-main-nav .main-menu > .current-menu-item > .menu-item__link,
.site-main-nav .main-menu > .current-menu-ancestor > .menu-item__link {
	color: var(--white);
}

/* Стрелка у пунктов с подменю: parent берёт её из спрайта фоновой картинкой,
   а там путь без fill — то есть чёрная. На тёмной полосе она тонет (замер
   пикселей: 32,36,43 против фона 34,38,46). Внешняя картинка цвет документа
   не наследует, поэтому ставим тот же контур своим цветом. */
.site-main-nav .main-menu > .menu-item-has-children::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c9cdd6'%3E%3Cpath d='M12 15.713L18.01 9.703l-1.413-1.415L12 12.888 7.404 8.288 5.99 9.702z'/%3E%3C/svg%3E");
}

/* Кнопка «Наши услуги» — акцентная плашка. Стрелку parent рисует
   псевдоэлементом за правым краем кнопки: на плашке она торчит наружу. */
.site-main-nav .header-terms__btn {
	height: 38px;
	padding-inline: 16px;
	font-size: 0.95rem;
	color: var(--white);
	background-color: var(--accent);
	border-radius: 6px;
	transition: background-color var(--animation);
}

/* Текст держим белым во всех состояниях наведения. Parent красит кнопку
   в `--hover-color` (тот же #db2129, что фон плашки) двумя путями: глобальным
   `a:hover` и правилом `.header-terms:has(.header-terms__list:hover) > a`
   (срабатывает, когда курсор ушёл на раскрытый список) — в обоих случаях
   надпись сливается с фоном и кнопка выглядит пустой. */
.site-main-nav .header-terms__btn:hover,
.site-main-nav .header-terms:hover > .header-terms__btn,
.site-main-nav .header-terms:has(.header-terms__list:hover) > .header-terms__btn {
	color: var(--white);
	background-color: var(--btn-bg-hover, #a60909);
	text-decoration: none;
}

.site-main-nav .header-terms__btn::after {
	display: none !important;
	content: none !important;
}

/* flex: none обязателен: у svg нет собственной ширины, и в узкой кнопке
   флекс сжимал молнию до нуля — на телефоне иконка просто пропадала. */
.site-main-nav .header-terms__btn .site-header__icon,
.site-main-nav .site-header__mob--btn .site-header__icon,
.site-main-nav .site-header__chats .site-header__icon {
	flex: none;
	fill: currentColor;
}

/* Кнопка чатов сейчас выключена в Customizer, но её цвет по умолчанию —
   тёмный текст: на этой полосе она стала бы невидимой при включении. */
.site-main-nav .site-header__mob--btn,
.site-main-nav .site-header__chats {
	color: #e7e9ee;
}

.site-main-nav .site-header__mob--btn:hover,
.site-main-nav .site-header__chats:hover {
	color: var(--white);
}

/* Иконки аккаунта и корзины в site-main-nav (рядом с кнопкой Чата) */
.site-header__nav-right {
	display: flex;
	align-items: center;
	gap: 1.2rem;
}

.site-header__nav-right .dgwt-wcas-search-wrapp {
	margin: 0;
}

.dgwt-wcas-suggestion-product .dgwt-wcas-st {
	font-size: 14px;
}

.dgwt-wcas-suggestion-product .dgwt-wcas-meta {
	flex-shrink: 0;
	width: auto;
	max-width: none;
	white-space: nowrap;
	padding-inline-start: 0.75rem;
}

.dgwt-wcas-suggestion-product .dgwt-wcas-meta .dgwt-wcas-sp,
.dgwt-wcas-suggestion-product .dgwt-wcas-meta .woocommerce-Price-amount,
.dgwt-wcas-suggestion-product .dgwt-wcas-meta bdi {
	white-space: nowrap;
}

/* Пилюля на тёмной полосе: полупрозрачная подложка, глифы светло-серые,
   под курсором белые на подсвеченной клетке. */
.site-header__shop-icons {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 3px 8px;
	background-color: rgba(255, 255, 255, 0.07);
	border-radius: 9px;
}

.site-header__account,
.site-header__cart {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	color: #c9cdd6;
	background: none;
	border: 0;
	border-radius: 7px;
	text-decoration: none;
	transition: background-color var(--animation), color var(--animation);
}

.site-header__account::after,
.site-header__cart::after {
	display: none !important;
	content: none !important;
}

.site-header__account:hover,
.site-header__cart:hover {
	color: var(--white);
	background-color: rgba(255, 255, 255, 0.14);
	text-decoration: none;
}

.site-header__account .site-header__icon,
.site-header__cart .site-header__icon {
	width: 1.6rem;
	height: 1.6rem;
	stroke: currentColor;
	fill: none;
}

/* Счётчик сидит на правом верхнем углу тележки. Глиф занимает почти всю
   кнопку (27px из 30), внутри места нет — поэтому кружок вынесен наружу:
   так он цепляет только угол иконки, а не накрывает её. */
.site-header__cart-count {
	position: absolute;
	top: -6px;
	right: -6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 1rem;
	height: 1rem;
	padding: 0 2px;
	font-size: 0.62rem;
	font-weight: var(--semi-bold);
	line-height: 1;
	color: var(--white);
	background-color: #dd3333;
	border-radius: 999px;
	transition: transform var(--animation);
}

.site-header__cart-count[data-count="0"] {
	display: none;
}

.mm22-side-cart {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 360px;
	max-width: 100%;
	z-index: 999999;
	pointer-events: none;
	visibility: hidden;
	background: #fff;
	color: #111;
	box-shadow: 0 5px 20px -5px rgba(39, 49, 67, 0.3);
}

.admin-bar .mm22-side-cart {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .mm22-side-cart {
		top: 46px;
	}
}

.mm22-side-cart.is-open {
	pointer-events: auto;
	visibility: visible;
}

.mm22-side-cart__overlay {
	display: none;
}

.mm22-side-cart__panel {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	transform: translateX(100%);
	transition: transform var(--animation);
}

.mm22-side-cart.is-open .mm22-side-cart__panel {
	transform: translateX(0);
}

.mm22-side-cart__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 25px 25px 0;
}

.mm22-side-cart__title {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1.3em;
	font-weight: var(--semi-bold);
	color: var(--accent);
}

.mm22-side-cart__title-icon {
	width: 22px;
	height: 22px;
	color: var(--accent);
}

.mm22-side-cart__close {
	width: 32px;
	height: 32px;
	padding: 0;
	font-size: 26px;
	line-height: 1;
	background: transparent;
	border: none;
	color: var(--main-color);
	cursor: pointer;
	opacity: 0.5;
	transition: opacity 0.2s;
}

.mm22-side-cart__close:hover {
	opacity: 1;
}

.mm22-side-cart__body {
	padding: 0;
	font-size: 14px;
	line-height: 1.4;
}

.mm22-side-cart .widget_shopping_cart_content {
	padding: 20px 20px 24px;
}

.mm22-side-cart .woocommerce-mini-cart__empty-message {
	margin: 0;
	padding: 1rem 0;
	text-align: center;
	color: var(--text-secondary, #888);
}

.mm22-side-cart .woocommerce-mini-cart {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mm22-side-cart .woocommerce-mini-cart-item {
	position: relative;
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 12px;
	margin: 0;
	background: var(--grey-bg);
	border-radius: var(--bradius);
	box-shadow: 0 1px 4px rgb(47 52 64 / 6%);
	list-style: none;
}

.mm22-side-cart .woocommerce-mini-cart-item a {
	text-decoration: none;
}

.mm22-side-cart .mm22-cart-item__img {
	flex-shrink: 0;
	width: 60px;
	height: 60px;
	background: var(--white);
	border-radius: 6px;
	overflow: hidden;
}

.mm22-side-cart .mm22-cart-item__img a {
	display: block;
	width: 100%;
	height: 100%;
}

.mm22-side-cart .woocommerce-mini-cart-item img,
.mm22-side-cart .woocommerce-mini-cart-item img.attachment-woocommerce_thumbnail {
	width: 60px !important;
	height: 60px !important;
	max-width: 60px;
	margin: 0 !important;
	padding: 0;
	float: none;
	border: none;
	border-radius: 0;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}

.mm22-side-cart .mm22-cart-item__info {
	flex: 1;
	min-width: 0;
}

.mm22-side-cart .woocommerce-mini-cart-item__name,
.mm22-side-cart .mm22-cart-item__name {
	display: -webkit-box !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0 20px 6px 0;
	padding: 0 !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	color: var(--main-color) !important;
	text-decoration: none !important;
	border: none !important;
}

.mm22-side-cart .woocommerce-mini-cart-item__name:hover {
	color: var(--accent) !important;
}

.mm22-side-cart .mm22-cart-item__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.mm22-side-cart .mm22-cart-item__qty {
	display: inline-block;
	padding: 2px 8px;
	font-size: 12px;
	font-weight: 500;
	color: var(--text-secondary, #888);
	background: var(--white);
	border-radius: 4px;
	white-space: nowrap;
}

.mm22-side-cart .mm22-cart-item__price {
	font-size: 14px;
	font-weight: 700;
	color: var(--accent);
	white-space: nowrap;
}

.mm22-side-cart .mm22-cart-item__price .amount,
.mm22-side-cart .mm22-cart-item__price .woocommerce-Price-currencySymbol {
	color: inherit;
	font-weight: inherit;
}

.mm22-side-cart a.remove_from_cart_button,
.mm22-side-cart a.mm22-cart-item__remove,
.woocommerce .mm22-side-cart a.remove,
.woocommerce .mm22-side-cart a.remove_from_cart_button {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 20px;
	height: 20px;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 18px !important;
	line-height: 1;
	color: var(--text-secondary, #888) !important;
	background: transparent !important;
	border: none !important;
	text-decoration: none !important;
	opacity: 0.7;
	transition: opacity var(--animation), color var(--animation);
	cursor: pointer;
}

.mm22-side-cart a.remove_from_cart_button:hover,
.mm22-side-cart a.mm22-cart-item__remove:hover,
.woocommerce .mm22-side-cart a.remove:hover,
.woocommerce .mm22-side-cart a.remove_from_cart_button:hover {
	color: var(--accent) !important;
	background: transparent !important;
	opacity: 1;
}

.mm22-side-cart .woocommerce-mini-cart__total {
	border-top: 1px solid var(--border-color);
	padding-top: 20px;
	margin-bottom: 20px;
	font-size: 1.1em;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mm22-side-cart .woocommerce-mini-cart__total .amount {
	color: var(--accent);
	font-weight: var(--semi-bold);
}

.mm22-side-cart .woocommerce-mini-cart__buttons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 0;
	padding: 0;
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	padding: 10px 12px;
	font-family: inherit;
	font-size: 13px;
	font-weight: var(--semi-bold);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	border-radius: 6px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color var(--animation), border-color var(--animation), color var(--animation);
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button + .button {
	margin-left: 0 !important;
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button.checkout {
	color: var(--btn-color);
	background-color: var(--btn-bg);
	border-color: var(--btn-bg);
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button.checkout:hover {
	color: var(--btn-color-hover);
	background-color: var(--btn-bg-hover);
	border-color: var(--btn-bg-hover);
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout) {
	color: var(--main-color);
	background-color: var(--grey-bg);
	border-color: var(--border-color);
}

.mm22-side-cart .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout):hover {
	color: var(--accent);
	border-color: var(--accent);
}

/*
=================================================
WC pages: /cart/, /checkout/, /my-account/
Чистый layout без блог-сайдбара, палитра темы для таблиц и форм.
=================================================
*/

body.woocommerce-cart.page-template-default .single-page__wrap,
body.woocommerce-checkout.page-template-default .single-page__wrap,
body.woocommerce-account.page-template-default .single-page__wrap {
	display: block;
}

body.woocommerce-cart .blog__sidebar,
body.woocommerce-checkout .blog__sidebar,
body.woocommerce-account .blog__sidebar {
	display: none;
}

body.woocommerce-cart .single-page__content,
body.woocommerce-checkout .single-page__content,
body.woocommerce-account .single-page__content {
	display: block;
	width: 100%;
	max-width: 100%;
}

/* Стандартные WC уведомления в палитре темы */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
	margin-block-end: 1.5rem;
	padding: 1rem 1.2rem;
	font-size: 0.95rem;
	line-height: 150%;
	background-color: var(--grey-bg);
	border-radius: var(--bradius);
	border-inline-start: 3px solid var(--accent);
	list-style: none;
}

.woocommerce-error {
	border-inline-start-color: #c0392b;
}

.woocommerce-message a,
.woocommerce-info a {
	font-weight: var(--semi-bold);
	color: var(--accent);
	text-decoration: none;
}

/* WC кнопки в стиле темы (синхронно с .btn) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.7rem 1.4rem;
	font-size: 0.95rem;
	font-weight: var(--semi-bold);
	color: var(--white);
	background-color: var(--accent);
	border: 0;
	border-radius: var(--bradius);
	text-decoration: none;
	transition: background-color var(--animation);
	cursor: pointer;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background-color: var(--btn-bg-hover, var(--main-color));
}

/* Поля форм */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	width: 100%;
	padding: 0.6rem 0.9rem;
	font-size: 0.95rem;
	background-color: var(--white);
	border: 1px solid var(--border-color);
	border-radius: calc(var(--bradius) / 1.5);
	transition: border-color var(--animation);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--accent);
}

.woocommerce form .form-row label {
	display: block;
	margin-block-end: 0.35rem;
	font-size: 0.8rem;
	font-weight: var(--semi-bold);
	text-transform: initial;
}

.woocommerce .required {
	color: var(--accent);
}

/* ===========================================================
   Страница личного кабинета — двухколоночный паттерн
   CSS из docs/temp/account-variants.html .acc-* с префиксом
   .mm22-acc-page. Согласован с cart/checkout v1.
   =========================================================== */

.mm22-acc-page {
	margin-block-end: 2rem;
}

/* Снимаем оранжевые буллеты темы у списков внутри WC-страниц */
.mm22-cart-page li::before,
.mm22-co-page li::before,
.mm22-acc-page li::before {
	display: none !important;
	content: none !important;
}

.mm22-cart-page ul,
.mm22-co-page ul,
.mm22-acc-page ul {
	list-style: none;
}

.post-content .mm22-cart-page ul li,
.post-content .mm22-co-page ul li,
.post-content .mm22-acc-page ul li,
.mm22-cart-page ul li,
.mm22-co-page ul li,
.mm22-acc-page ul li {
	padding-left: 0;
	margin-left: 0;
}

.mm22-acc-page .acc-body {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

/* Левая sticky-навигация */
.mm22-acc-page .acc-nav {
	position: sticky;
	top: 20px;
	background: var(--footer-bg);
	color: var(--footer-color);
	border-radius: 12px;
	padding: 24px;
}

.mm22-acc-page .acc-nav-user {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 22px;
	padding-bottom: 18px;
	border-bottom: 1px solid color-mix(in srgb, var(--footer-color) 12%, transparent);
}

.mm22-acc-page .acc-nav-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--accent);
	color: var(--white);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	font-weight: 700;
	flex-shrink: 0;
}

.mm22-acc-page .acc-nav-name {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 2px;
}

.mm22-acc-page .acc-nav-email {
	font-size: 11px;
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
	overflow-wrap: anywhere;
}

.mm22-acc-page .acc-nav ul,
.mm22-acc-page .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: transparent;
	border: none;
	border-radius: 0;
	overflow: visible;
}

.mm22-acc-page .acc-nav li,
.mm22-acc-page .woocommerce-MyAccount-navigation li {
	border: none;
	margin: 0;
}

.mm22-acc-page .acc-nav li a,
.mm22-acc-page .woocommerce-MyAccount-navigation li a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	font-size: 14px;
	color: color-mix(in srgb, var(--footer-color) 80%, transparent);
	text-decoration: none;
	border-radius: var(--bradius);
	background: transparent;
	transition: background var(--animation), color var(--animation);
}

.mm22-acc-page .acc-nav li a:hover,
.mm22-acc-page .woocommerce-MyAccount-navigation li a:hover {
	background: color-mix(in srgb, var(--footer-color) 6%, transparent);
	color: var(--footer-color);
}

.mm22-acc-page .acc-nav li.is-active a,
.mm22-acc-page .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--accent);
	color: var(--white);
}

.mm22-acc-page .acc-nav li a,
.mm22-acc-page .acc-nav li a:hover,
.mm22-acc-page .acc-nav li a:focus,
.mm22-acc-page .acc-nav li.is-active a,
.mm22-acc-page .woocommerce-MyAccount-navigation li a,
.mm22-acc-page .woocommerce-MyAccount-navigation li a:hover,
.mm22-acc-page .woocommerce-MyAccount-navigation li a:focus,
.mm22-acc-page .woocommerce-MyAccount-navigation li.is-active a {
	font-weight: 500;
}

.mm22-acc-page .acc-nav li a svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
	flex-shrink: 0;
}

.mm22-acc-page .acc-nav-counter {
	margin-left: auto;
	opacity: 0.6;
	font-size: 12px;
}

.mm22-acc-page .acc-nav li.acc-nav-logout,
.mm22-acc-page .woocommerce-MyAccount-navigation li--customer-logout {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid color-mix(in srgb, var(--footer-color) 12%, transparent);
}

.mm22-acc-page .acc-nav li.acc-nav-logout a,
.mm22-acc-page .woocommerce-MyAccount-navigation li--customer-logout a {
	color: color-mix(in srgb, var(--footer-color) 60%, transparent);
}

/* Правый контент */
.mm22-acc-page .acc-content,
.mm22-acc-page .woocommerce-MyAccount-content {
	min-width: 0;
}

.mm22-acc-page .acc-section-title {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 18px;
}

.mm22-acc-page .acc-helper,
.mm22-acc-page .woocommerce-MyAccount-content > p:first-of-type {
	font-size: 13px;
	color: var(--text-secondary, #888);
	margin-bottom: 18px;
	line-height: 1.5;
}

.mm22-acc-page .acc-helper a:not(.btn-primary):not(.btn-outline),
.mm22-acc-page .woocommerce-MyAccount-content > p a:not(.btn-primary):not(.btn-outline) {
	color: var(--accent);
	font-weight: 600;
	text-decoration: none;
}

/* Карточки адресов */
.mm22-acc-page .acc-addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 16px;
}

.mm22-acc-page .acc-address-card {
	padding: 20px;
	background: var(--grey-bg);
	border-radius: var(--bradius);
	border: 1px solid transparent;
}

.mm22-acc-page .acc-address-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
	gap: 12px;
}

.mm22-acc-page .acc-address-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--main-color);
}

.mm22-acc-page .acc-address-edit {
	font-size: 12px;
	color: var(--accent);
	text-decoration: underline;
}

.mm22-acc-page .acc-address-edit:hover {
	color: var(--btn-bg-hover);
}

.mm22-acc-page .acc-address-body {
	font-size: 13px;
	line-height: 1.5;
	color: var(--main-color);
}

.mm22-acc-page .acc-address-body address {
	font-style: normal;
}

.mm22-acc-page .acc-address-empty {
	color: var(--text-secondary, #888);
	font-style: italic;
}

/* Карточки-плитки на dashboard */
.mm22-acc-page .acc-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 14px;
}

.mm22-acc-page .acc-tile {
	display: block;
	padding: 18px;
	background: var(--grey-bg);
	border-radius: var(--bradius);
	border: 1px solid transparent;
	text-decoration: none;
	color: var(--main-color);
	transition: border-color var(--animation), transform var(--animation);
}

.mm22-acc-page .acc-tile:hover {
	border-color: var(--accent);
	transform: translateY(-2px);
}

.mm22-acc-page .acc-tile-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: var(--white);
	border-radius: 10px;
	margin-bottom: 14px;
}

.mm22-acc-page .acc-tile-icon svg {
	width: 18px;
	height: 18px;
	stroke: var(--accent);
	stroke-width: 2;
	fill: none;
}

.mm22-acc-page .acc-tile-name {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 4px;
}

.mm22-acc-page .acc-tile-meta {
	font-size: 12px;
	color: var(--text-secondary, #888);
}

/* Таблица заказов */
.mm22-acc-page table.acc-orders,
.mm22-acc-page table.woocommerce-orders-table {
	width: 100%;
	border-collapse: collapse;
}

.mm22-acc-page table.acc-orders thead th,
.mm22-acc-page table.woocommerce-orders-table thead th {
	font-size: 11px;
	font-weight: 600;
	color: var(--text-secondary, #888);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border-color);
	background: transparent;
}

.mm22-acc-page table.acc-orders tbody td,
.mm22-acc-page table.woocommerce-orders-table tbody td {
	padding: 14px 12px;
	border-bottom: 1px solid var(--border-color);
	font-size: 13px;
	vertical-align: middle;
	background: transparent;
}

.mm22-acc-page table.acc-orders tbody tr:last-child td,
.mm22-acc-page table.woocommerce-orders-table tbody tr:last-child td {
	border-bottom: none;
}

.mm22-acc-page .acc-orders-num,
.mm22-acc-page table.woocommerce-orders-table .woocommerce-orders-table__cell-order-number {
	font-weight: 600;
	color: var(--main-color);
}

.mm22-acc-page .acc-orders-status {
	display: inline-block;
	padding: 3px 9px;
	font-size: 11px;
	font-weight: 600;
	border-radius: 14px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.mm22-acc-page .acc-orders-status--processing,
.mm22-acc-page .acc-orders-status--on-hold {
	background: color-mix(in srgb, var(--accent) 18%, transparent);
	color: var(--accent);
}

.mm22-acc-page .acc-orders-status--completed {
	background: rgb(65 160 94 / 14%);
	color: #41a05e;
}

.mm22-acc-page .acc-orders-status--cancelled,
.mm22-acc-page .acc-orders-status--refunded,
.mm22-acc-page .acc-orders-status--failed,
.mm22-acc-page .acc-orders-status--pending {
	background: var(--grey-bg);
	color: var(--text-secondary, #888);
}

.mm22-acc-page .acc-orders-action,
.mm22-acc-page table.woocommerce-orders-table .button {
	font-size: 12px;
	color: var(--accent);
	background: transparent;
	border: none;
	padding: 0;
	text-decoration: underline;
	cursor: pointer;
}

.mm22-acc-page .acc-orders-action:hover {
	color: var(--accent-hover, var(--btn-bg-hover));
}

/* Формы профиля */
.mm22-acc-page .acc-form,
.mm22-acc-page .woocommerce-EditAccountForm {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.mm22-acc-page .acc-form .fld {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
}

.mm22-acc-page .acc-form .fld--full,
.mm22-acc-page .woocommerce-EditAccountForm > p.form-row-wide,
.mm22-acc-page .woocommerce-EditAccountForm > fieldset {
	grid-column: 1 / -1;
}

.mm22-acc-page .acc-form label,
.mm22-acc-page .woocommerce-EditAccountForm label {
	font-size: 12px;
	font-weight: 600;
	color: var(--text-secondary, #888);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}

.mm22-acc-page .acc-form input,
.mm22-acc-page .acc-form select,
.mm22-acc-page .woocommerce-EditAccountForm input,
.mm22-acc-page .woocommerce-EditAccountForm select {
	box-sizing: border-box;
	width: 100%;
	padding: 11px 14px;
	font-family: inherit;
	font-size: 14px;
	color: var(--main-color);
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
}

.mm22-acc-page .acc-form input:focus,
.mm22-acc-page .acc-form select:focus,
.mm22-acc-page .woocommerce-EditAccountForm input:focus,
.mm22-acc-page .woocommerce-EditAccountForm select:focus {
	outline: none;
	border-color: var(--accent);
}

.mm22-acc-page .acc-form-subtitle,
.mm22-acc-page .woocommerce-EditAccountForm legend {
	grid-column: 1 / -1;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--text-secondary, #888);
	margin: 14px 0 4px;
	padding-top: 18px;
	border-top: 1px solid var(--border-color);
	border-bottom: none;
}

.mm22-acc-page .acc-form-subtitle:first-child,
.mm22-acc-page .woocommerce-EditAccountForm > fieldset:first-of-type legend {
	margin-top: 0;
	padding-top: 0;
	border: none;
}

.mm22-acc-page .acc-form-actions,
.mm22-acc-page .woocommerce-EditAccountForm > p:last-of-type {
	grid-column: 1 / -1;
	display: flex;
	gap: 10px;
	margin: 12px 0 0;
}

.mm22-acc-page .btn-primary,
.mm22-acc-page button[type="submit"].woocommerce-Button,
.mm22-acc-page input[type="submit"].woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	color: var(--btn-color);
	background: var(--btn-bg);
	border: none;
	border-radius: var(--bradius);
	cursor: pointer;
	text-decoration: none;
	transition: background var(--animation), color var(--animation);
}

.mm22-acc-page .btn-primary:hover,
.mm22-acc-page button[type="submit"].woocommerce-Button:hover,
.mm22-acc-page input[type="submit"].woocommerce-Button:hover {
	background: var(--btn-bg-hover);
	color: var(--btn-color-hover);
}

.mm22-acc-page .btn-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 22px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	color: var(--main-color);
	background: transparent;
	border: 1.5px solid var(--border-color);
	border-radius: var(--bradius);
	cursor: pointer;
	text-decoration: none;
}

/* Login / Register (для гостей) — две колонки рядом */
.mm22-acc-login .acc-login-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
	align-items: start;
}

.mm22-acc-login .acc-login-grid--single {
	grid-template-columns: minmax(0, 480px);
}

.mm22-acc-login .acc-login-col {
	min-width: 0;
}

.mm22-acc-page .acc-login-hint {
	font-size: 12px;
	color: var(--text-secondary, #888);
	line-height: 1.5;
	margin: 0 0 14px;
}

.mm22-acc-page .acc-login-card,
.mm22-acc-page .woocommerce-form-login,
.mm22-acc-page .woocommerce-form-register {
	padding: 24px;
	background: var(--grey-bg);
	border-radius: var(--bradius);
	border: none;
}

.mm22-acc-page .acc-login-card .btn-primary {
	width: 100%;
}

.mm22-acc-page .acc-login-card .fld,
.mm22-acc-page .woocommerce-form-login .form-row,
.mm22-acc-page .woocommerce-form-register .form-row {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 14px;
	padding: 0;
}

.mm22-acc-page .acc-login-card label,
.mm22-acc-page .woocommerce-form-login label,
.mm22-acc-page .woocommerce-form-register label {
	font-size: 12px;
	font-weight: 600;
	color: var(--text-secondary, #888);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}

.mm22-acc-page .acc-login-card input,
.mm22-acc-page .woocommerce-form-login input,
.mm22-acc-page .woocommerce-form-register input {
	width: 100%;
	padding: 11px 14px;
	font-family: inherit;
	font-size: 14px;
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
}

.mm22-acc-page .acc-login-row,
.mm22-acc-page .woocommerce-form-login .form-row-remember {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 14px 0 18px;
	font-size: 12px;
}

.mm22-acc-page .acc-login-row label {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--main-color);
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.mm22-acc-page .acc-login-row label input,
.mm22-acc-page .woocommerce-form-login__rememberme input {
	width: auto;
	accent-color: var(--accent);
}

.mm22-acc-page .acc-login-row a,
.mm22-acc-page .lost_password a {
	color: var(--accent);
	text-decoration: none;
}

.mm22-acc-page .acc-login-foot {
	margin-top: 16px;
	text-align: center;
	font-size: 12px;
	color: var(--text-secondary, #888);
}

.mm22-acc-page .acc-login-foot a {
	color: var(--accent);
	font-weight: 600;
	text-decoration: none;
}

@media (max-width: 900px) {
	.mm22-acc-page .acc-body {
		grid-template-columns: 1fr;
	}

	.mm22-acc-login .acc-login-grid {
		grid-template-columns: 1fr;
	}

	.mm22-acc-page .acc-nav {
		position: static;
	}

	.mm22-acc-page .acc-form,
	.mm22-acc-page .woocommerce-EditAccountForm {
		grid-template-columns: 1fr;
	}
}

.site-header__logo {
	width: 100px;
	height: 65px;
}
.shop-product__media {
	background-color: #fff;
}

.service-single__aside .widget:not(.widget_media_image) {
	border: none;
}

/* =================================================
   Страница «Заказ принят» (thankyou / order-received)
   ================================================= */
.mm22-thankyou {
	max-width: 760px;
}

.mm22-thankyou__hero {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: 32px 24px;
	margin-block-end: 28px;
	text-align: center;
	background: var(--grey-bg);
	border-radius: 12px;
}

.mm22-thankyou__check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	color: #fff;
	background: var(--accent);
	border-radius: 50%;
}

.mm22-thankyou__check svg {
	width: 30px;
	height: 30px;
}

.mm22-thankyou__title {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--main-color);
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
}

.mm22-thankyou__title::before {
	display: none;
}

/* Сводка заказа — равная сетка карточек (без «прыжков» по высоте) */
.mm22-thankyou__overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
	border: none;
}

.mm22-thankyou__overview li {
	margin: 0;
	padding: 14px 16px;
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	list-style: none;
}

.mm22-thankyou__overview li::before {
	display: none;
	content: none;
}

.mm22-thankyou__ov-label {
	display: block;
	margin-block-end: 4px;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--text-secondary, #888);
}

.mm22-thankyou__overview li strong {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--main-color);
	word-break: break-word;
}

/* Блок деталей заказа (таблица товаров + адреса) под сводкой */
.mm22-thankyou__details .woocommerce-order-details__title,
.mm22-thankyou__details .woocommerce-column__title {
	margin: 28px 0 14px;
	font-size: 1.2rem;
	font-weight: 600;
}

.mm22-thankyou__details table.woocommerce-table--order-details,
.mm22-thankyou__details table.shop_table {
	width: 100%;
	border-collapse: collapse;
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	overflow: hidden;
}

.mm22-thankyou__details table.shop_table th,
.mm22-thankyou__details table.shop_table td {
	padding: 12px 16px;
	font-size: 0.9rem;
	text-align: left;
	border-bottom: 1px solid var(--border-color);
}

.mm22-thankyou__details table.shop_table thead th {
	background: var(--grey-bg);
	font-weight: 600;
}

.mm22-thankyou__details table.shop_table tfoot th,
.mm22-thankyou__details table.shop_table tfoot td {
	font-weight: 600;
}

.mm22-thankyou__details table.shop_table tr:last-child td,
.mm22-thankyou__details table.shop_table tfoot tr:last-child th,
.mm22-thankyou__details table.shop_table tfoot tr:last-child td {
	border-bottom: none;
}

.mm22-thankyou__details .woocommerce-customer-details {
	margin-top: 28px;
}

.mm22-thankyou__details .woocommerce-customer-details address {
	padding: 16px;
	font-style: normal;
	font-size: 0.9rem;
	line-height: 1.6;
	background: var(--grey-bg);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
}

/* Сбрасываем bold-кнопки во всех WC-страницах — оставляем regular */
.mm22-cart-page .v4-btn-checkout,
.mm22-cart-page .v4-qty-btn,
.mm22-cart-page .wc-proceed-to-checkout a.checkout-button,
.mm22-cart-page .mm22-cart__update,
.mm22-cart-page .mm22-cart__coupon-btn,
.mm22-co-page #place_order,
.mm22-co-page .v1-place-order,
.mm22-co-page .btn-primary,
.mm22-acc-page .btn-primary,
.mm22-acc-page .btn-outline,
.mm22-acc-page button[type="submit"].woocommerce-Button,
.mm22-acc-page input[type="submit"].woocommerce-Button,
.mm22-acc-page .acc-orders-action,
.mm22-acc-page .acc-address-edit {
	font-weight: 500;
}

.post-content .mm22-contact-shortcode .contacts__list li {
	list-style: none;
	padding-left: 0;
}

.post-content .mm22-contact-shortcode .contacts__list li::before {
	display: none;
	content: none;
}

/* Отступ между пунктами задаёт сам блок контактов (padding + пунктир),
   а тема добавляет свой для списков контента — снимаем, чтобы вид совпал с Главной */
.post-content .mm22-contact-shortcode .contacts__list li:not(:last-child) {
	margin-block-end: 0;
}

/* В шорткоде колонка одна: название сверху, контакт под ним.
   Родной блок Главной остаётся двухколоночным — обёртки шорткода там нет */
.mm22-contact-shortcode .contacts__item {
	grid-template-columns: 1fr;
	gap: 6px;
}

.mm22-contact-shortcode .contacts__wrap:has(.contacts__map) {
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.mm22-contact-shortcode .contacts-item__value {
	font-size: 1.0rem;
	text-align: left;
}

.mm22-contact-shortcode .contacts__map {
	min-height: 360px;
}

.mm22-contact-shortcode .contacts__map iframe {
	width: 100%;
	min-height: 360px;
	border: 0;
}

/*
   Спойлеры в контенте (details.spoiler). Использование:
     <details class="spoiler"><summary>Заголовок</summary><p>…</p></details>
   Применяется шорткодом [reviews] (виджет отзывов Яндекс.Карт).
*/
.post-content details.spoiler,
.entry-content details.spoiler,
details.spoiler {
	width: 100%;
	margin-block: 1.2rem;
	background-color: var(--white, #fff);
	border-radius: var(--bradius, 12px);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	overflow: hidden;
}

details.spoiler > summary {
	position: relative;
	display: block;
	padding: 1.4rem 1.4rem 1.4rem 5rem;
	font-size: 1.15rem;
	font-weight: var(--semi-bold, 600);
	line-height: 1.35;
	color: inherit;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

details.spoiler > summary::-webkit-details-marker {
	display: none;
}

details.spoiler > summary::before {
	content: "";
	position: absolute;
	left: 1.2rem;
	top: 50%;
	z-index: 1;
	width: var(--spacing, 2.4rem);
	height: var(--spacing, 2.4rem);
	background-color: var(--accent, #c62828);
	border-radius: 4px;
	transform: translateY(-50%);
	transition: background-color var(--animation, 0.25s ease);
	background-image: linear-gradient(#fff, #fff);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 1.1rem 2px;
}

details.spoiler > summary::after {
	content: "";
	position: absolute;
	left: 1.2rem;
	top: 50%;
	z-index: 2;
	width: var(--spacing, 2.4rem);
	height: var(--spacing, 2.4rem);
	transform: translateY(-50%);
	background-image: linear-gradient(#fff, #fff);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 2px 1.1rem;
	transition: opacity var(--animation, 0.25s ease), transform var(--animation, 0.25s ease);
	pointer-events: none;
}

details.spoiler > summary:hover::before {
	background-color: var(--btn-bg, #a21d1d);
}

details.spoiler[open] > summary {
	border-bottom: 1px dotted var(--border-color, #e2e2e2);
}

details.spoiler[open] > summary::before {
	background-color: var(--btn-bg, #a21d1d);
}

details.spoiler[open] > summary::after {
	opacity: 0;
	transform: translateY(-50%) rotate(90deg);
}

details.spoiler > *:not(summary) {
	padding-inline: var(--spacing, 2.4rem);
}

details.spoiler > *:not(summary):first-of-type {
	padding-top: 1.4rem;
}

details.spoiler > *:not(summary):last-child {
	padding-bottom: 1.4rem;
}

details.spoiler[open] > *:not(summary) {
	animation: fadeEffect 0.6s ease;
}

.services-category-list__items,
.home-services-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 1rem;
}

.service-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	padding: 0.9rem;
	background-color: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	transition: transform var(--animation), box-shadow var(--animation), border-color var(--animation);
}

.service-card:hover {
	transform: translateY(-2px);
	border-color: transparent;
	box-shadow: 5px 14px 22px -8px rgba(34, 60, 80, 0.18);
}

/* «Категории магазина» на Главной, вид «Чипсы»: плашки с одними названиями.
   Оформление в языке карточек — белый фон, рамка, радиус, акцент на наведении */
.home-shop-cats__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.home-shop-cats__chip {
	margin: 0;
	padding: 0;
	list-style: none;
}

.home-shop-cats__chip-link {
	display: inline-flex;
	align-items: center;
	padding: 0.6rem 1.1rem;
	color: var(--main-color);
	font-size: 0.95rem;
	line-height: 120%;
	text-decoration: none;
	background-color: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	transition: color var(--animation), border-color var(--animation), box-shadow var(--animation);
}

.home-shop-cats__chip-link:hover,
.home-shop-cats__chip-link:focus-visible {
	color: var(--accent);
	text-decoration: none;
	border-color: var(--accent);
	box-shadow: 3px 8px 16px -8px rgba(34, 60, 80, 0.18);
}

/* Разделы Главной «Товары N»: сетка и карточки общие с каталогом (.shop-grid).
   Кнопка нужна только на телефоне — на компьютере видны все карточки сразу,
   а номер первой скрытой карточки зависит от настройки и печатается инлайном */
.home-products__grid {
	margin-block-end: 0;
}

.home-products__more {
	display: none;
}

.service-card__media {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: calc(var(--bradius) / 1.5);
	background-color: var(--grey-bg);
}

.service-card__media img,
.service-card__filler {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.service-card__title {
	margin: 0;
	font-size: 0.92rem;
	font-weight: var(--semi-bold);
	line-height: 130%;
	color: var(--main-color);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.service-card__link {
	position: absolute;
	inset: 0;
	z-index: 1;
}

.services-archive .service-single__content:not(:has(.service-single__aside)) {
	display: block;
}

.service-single__media {
	display: flex;
	align-items: center;
	gap: 2.5rem;
}

.service-single__media .service-single__img {
	flex-shrink: 0;
	width: 300px;
	height: 300px;
}

.service-single__media .service-single__img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.service-advantages {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.service-advantages__item {
	display: flex;
	align-items: center;
	gap: 0.85rem;
}

.service-advantages__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--accent);
	color: #fff;
}

.service-advantages__icon svg {
	width: 22px;
	height: 22px;
}

.service-advantages__text {
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.3;
}
.widget ul.shop-cats__sub li:not(:last-child) {
	margin-block-end: 0;
}

/* Копирайт и логотипы подвала — в одну строку (на мобильном логотипы вниз) */
.site-footer__credits {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem 2rem;
	flex-wrap: wrap;
}

.site-footer__credits-text {
	min-width: 0;
}

.footer-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 5px;
	margin-block-start: 0;
	flex: 0 0 auto;
}

.footer-logos__item {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 0.15rem;
}

.footer-logos__caption {
	font-size: 11px;
	line-height: 1.2;
	color: var(--text-secondary, #888);
	text-align: center;
}

.footer-logos__link {
	display: inline-flex;
	transition: opacity var(--animation);
}

.footer-logos__link:hover {
	opacity: 0.75;
}

.footer-logos__img {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 31px;
	object-fit: contain;
}

.home-brands .brands-wall {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.home-brands .brands-wall__track {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	width: max-content;
	margin: 0;
	padding: 16px 0;
	list-style: none;
	animation: mm22-brands-marquee var(--mm22-brands-speed, 40s) linear infinite;
}

.home-brands .brands-wall:hover .brands-wall__track {
	animation-play-state: paused;
}

.home-brands .brands-wall__item {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

.home-brands .brands-wall__frame {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 150px;
	padding: 1rem;
	background: var(--white);
	border: 1px solid var(--border-color);
	border-radius: var(--bradius);
	box-sizing: border-box;
	transition: transform 0.3s ease;
}

.home-brands .brands-wall__img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.home-brands .brands-wall__item--center .brands-wall__frame {
	transform: scale(1.13);
}

@keyframes mm22-brands-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.home-brands .brands-wall__track {
		animation: none;
	}
}

.post-content table thead th,
.post-content table > tr:first-child th {
	font-weight: 600;
	background: var(--grey-bg);
}

.post-content table tbody tr:nth-child(even) td {
	background: rgb(246 247 250 / 45%);
}

.wholesale_price .woocommerce-Price-amount,
.dealer_price .woocommerce-Price-amount {
	color: #000;
}

.search-results__section {
	margin-block-end: 2.5rem;
}

.search-results__subtitle {
	margin-block-end: 1.2rem;
	font-size: 1.5rem;
	font-weight: var(--bold);
	line-height: 120%;
}

/* Заголовок секции и тулбар — одной строкой: название слева, сортировка и вид справа */
.search-results__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-block-end: 1.2rem;
}

.search-results__head .search-results__subtitle,
.search-results__head .shop-toolbar {
	margin-block-end: 0;
}

.search-results__head .shop-toolbar {
	flex: 0 1 auto;
}

/* Раскладка поиска: сайдбар справа. Родная тема складывает уже на ≤1130px
   (частая ширина на PC при масштабировании дисплея) — держим 2 колонки
   вплоть до планшетов (≤800px), там уже в столбик. Правила scoped на свой
   контейнер .search-results → специфичность бьёт parent `.search ...`. */
.single-page.search-results .single-page__wrap {
	display: grid;
	align-items: start;
	gap: 3rem;
	grid-template-columns: repeat(10, 1fr);
}

.single-page.search-results .single-page__content {
	grid-column: span 7;
	min-width: 0;
}

.single-page.search-results .blog__sidebar {
	grid-column: span 3;
}

.home__promo {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
}
.home__promo a {
	display: block;
}
.home__promo a img {
	border-radius: 8px;
}

/* Media */

/* Ряд контактов у самой длинной раскладки (с 2008 года + адрес + два номера
   + график) на ноутбуках упирается в логотип — ужимаем промежутки и плашки. */
@media (max-width: 1400px) {
	.header-contacts {
		gap: 1.4rem;
	}

	.header-contacts__item--since {
		padding-inline-end: 1.4rem;
	}

	.header-contacts__plate {
		padding-inline: 16px;
		font-size: 1.05rem;
	}
}

@media (max-width: 1130px) {
	.icon-tiles {
		grid-template-columns: repeat(var(--tiles-cols-tab, 3), minmax(0, var(--tiles-size, 96px)));
	}

	.advantages {
		grid-template-columns: repeat(var(--adv-cols-tab, 2), minmax(0, 1fr));
	}

	.poster3__content {
		padding-block: 3.5rem;
		padding-inline: 1.5rem;
	}

	.poster3__title {
		font-size: 2.4rem;
	}

	/* Parent на этой ширине глушит точки у всех своих каруселей — вернуть свои */
	.poster3-slider .splide__pagination {
		display: flex;
	}

	.service-single__media {
		display: block;
	}

	.service-single__media .service-single__img {
		width: auto;
		height: auto;
	}

	.service-advantages {
		display: none;
	}

	.shop-cats {
		max-width: 392px;
	}

	.site-header__nav-right,
	.site-header__shop-icons {
		justify-content: center;
	}

	/* Полоса здесь делит ширину поровну между кнопкой услуг, поиском, иконками
	   и «Меню»: промежуток внутри правой группы отдаём полю поиска. */
	.site-header__nav-right {
		gap: 0.6rem;
	}

	.site-header__wrap {
		grid-template-columns: 1fr 1fr;
	}

	.header-contacts__item--mail {
		display: none;
	}

	.header-contacts {
		display: contents;
	}

	/* Раскладка шапки: 1-я строка — логотип, «с … года» и адрес, 2-я — оба
	   телефона. Контакты раскладываются напрямую по шапке (display: contents
	   выше), а сама она из сетки parent переводится во flex с переносом:
	   три разных по ширине блока в одной строке сеткой из равных колонок
	   не описать, а телефоны переносятся сами по flex-basis 50%. */
	.site-header__wrap {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.75rem 0.6rem;
	}

	.header-contacts__item--tel {
		margin-inline-start: 0 !important;
		margin-block-start: 0 !important;
	}

	/* График и мессенджеры здесь не выводятся, иначе шапка растёт ещё на две
	   строки. Мессенджеры скрывать обязательно: у них нет своей ячейки в этой
	   сетке, и при включённой галочке пункт с `order: 0` встаёт перед
	   логотипом — тот уезжает из левого угла (замер на 1130px: x=573 вместо
	   165). Связаться на телефоне и так можно из плавающей панели контактов. */
	.header-contacts__item--schedule,
	.header-contacts__item--telegram,
	.header-contacts__item--max {
		display: none;
	}

	/* Свой отступ справа: общего промежутка строки логотипу мало — он вплотную
	   упирается в строку про год. Между годом и адресом промежуток прежний. */
	.site-header__branding {
		order: 1;
		flex: 0 0 auto;
		margin-inline-end: 0.7rem;
	}

	/* «Работаем с … года» — между логотипом и адресом, по ширине своего
	   текста: с `flex-grow` он забирал остаток строки и выталкивал адрес
	   на следующую (замер на 390px: адрес уезжал на y=114 против y=64). */
	.header-contacts__item--since {
		display: block;
		order: 2;
		flex: 0 1 auto;
		min-width: 0;
		max-width: 32%;
		padding-inline-end: 0;
		font-size: 0.85rem;
		line-height: 130%;
		white-space: normal;
		text-align: left;
	}

	/* Разделительная черта нужна только в одну строку на десктопе. */
	.header-contacts__item--since::after {
		display: none;
	}

	/* Адрес забирает остаток строки: при базисе по контенту он на 390px
	   не влезал целиком и переносился блоком, вместо того чтобы перенести
	   свой текст на вторую строку. */
	.header-contacts__item--address {
		order: 3;
		flex: 1 1 34%;
		min-width: 0;
		font-size: 0.85rem;
		line-height: 130%;
		text-align: right;
	}

	/* Здесь шапка и так сжата в две строки: город возвращается в начало адреса,
	   а вторая строка со ссылкой на карту не выводится — иначе блок растёт
	   на строку и раскладка «логотип + адрес / два телефона» разъезжается. */
	.header-contacts__city {
		display: inline;
	}

	.header-contacts__street {
		font-size: 0.85rem;
		font-weight: var(--bold);
		white-space: normal;
	}

	.header-contacts__item--address .header-contacts__note {
		display: none;
	}

	/* Номера — двумя плашками в половину ширины, подпись под каждой.
	   flex-basis 50% минус половина промежутка переносит их на свою строку. */
	.header-contacts__item--tel1 {
		order: 4;
	}

	.header-contacts__item--tel2 {
		order: 5;
	}

	.header-contacts__item--tel1,
	.header-contacts__item--tel2 {
		flex: 1 1 calc(50% - 0.3rem);
	}

	.header-contacts__item--tel,
	.header-contacts__item--tel .header-contacts__text {
		display: block;
		min-width: 0;
	}

	/* На десктопе плашка сжимается по номеру, здесь — растягивается на колонку:
	   два номера образуют ровную пару кнопок с крупной зоной нажатия. */
	.header-contacts__item--tel .header-contacts__link {
		align-items: stretch;
	}

	.header-contacts__plate {
		padding: 8px 6px;
		font-size: 0.95rem;
		text-align: center;
	}

	/* Колонка шапки уже 200px логотипа на узких экранах — даём ему ужиматься,
	   иначе строка телефонов не влезает и появляется горизонтальный скролл. */
	.site-header__logo {
		max-width: 75px;
		height: auto;
	}

}

@media (max-width: 800px) {
	.woocommerce-account .u-columns,
	.woocommerce-account .col2-set {
		grid-template-columns: 1fr;
	}

	/* Поиск: на планшетах/телефонах сайдбар уходит под контент. */
	.single-page.search-results .single-page__wrap {
		display: block;
	}

	.single-page.search-results .single-page__content,
	.single-page.search-results .blog__sidebar {
		grid-column: auto;
	}

	/* Лупа поиска, аккаунт и корзина — в одной пилюле. Порог задаёт не студийная
	   сетка, а плагин поиска: он сворачивает форму в иконку на ≤782px (свой
	   matchMedia), поэтому оформление включается на ближайшем брейкпоинте выше —
	   иначе на планшете (768) осталась бы белая кнопка с чёрным глифом посреди
	   тёмной полосы. Правила самой лупы гейтятся классом `--icon-collapsed`,
	   который плагин ставит только когда действительно свернул, — в промежутке
	   783-800px они не срабатывают.
	   Пилюля обжимает содержимое: parent на ≤1130px раздаёт flex: 1 всем
	   элементам полосы, и без сброса она заняла бы треть ширины. */
	.site-header__nav-right {
		flex: 0 0 auto;
		gap: 2px;
		padding: 3px;
		background-color: rgba(255, 255, 255, 0.07);
		border-radius: 9px;
		height: 35px;
	}

	.site-header__shop-icons {
		padding: 0;
		background-color: transparent;
		border-radius: 0;
	}

	.site-header__account,
	.site-header__cart {
		width: 40px;
		height: 40px;
	}

	/* Зона нажатия здесь 40px, а сам глиф 24px — вокруг него много воздуха,
	   и вынос счётчика за край кнопки оставил бы его висеть в стороне.
	   Сажаем на угол самой тележки. */
	.site-header__cart-count {
		top: 3px;
		right: 3px;
	}

	/* Свёрнутая лупа — того же размера, что иконки рядом. Фон кнопки и цвет
	   глифа плагин печатает инлайном с !important, поэтому меняем не правила,
	   а сами переменные. В развёрнутом виде (поиск поверх экрана, белый фон)
	   настройки плагина возвращаются как есть. */
	.site-main-nav .mvweb-ss--icon-collapsed:not(.is-expanded) {
		--mvweb-ss-submit-bg: transparent;
		--mvweb-ss-submit-icon: #c9cdd6;
	}

	.site-main-nav .mvweb-ss--icon-collapsed:not(.is-expanded) .mvweb-ss__submit {
		width: 40px;
		height: 40px;
		border-radius: 7px;
	}

	/* Место под лупу резервируем сразу, до скрипта плагина: он сворачивает
	   форму только на DOMContentLoaded, а до этого она занимает 259px, кнопка
	   услуг сжимается до 53px и её надпись встаёт колонкой букв (замер на
	   390px: текст 11×133, плюс горизонтальный скролл 430 против 390).
	   Ширина совпадает со свёрнутым состоянием, поэтому после скрипта ничего
	   не сдвигается; развёрнутый поиск поверх экрана ограничение снимает. */
	.site-header__nav-right .mvweb-ss {
		width: 40px;
		min-width: 0;
		flex: 0 0 auto;
	}

	.site-header__nav-right .mvweb-ss.is-expanded {
		width: auto;
	}

	/* Надпись кнопки не ломаем на буквы ни при каких раскладках. */
	.site-main-nav .header-terms__btn {
		white-space: nowrap;
	}
}

@media (max-width: 600px) {

	.icon-tiles {
		grid-template-columns: repeat(var(--tiles-cols-mob, 2), minmax(0, var(--tiles-size, 96px)));
		gap: 1.2rem min(var(--tiles-gap, 2.5rem), 1.4rem);
	}

	.icon-tiles__label {
		font-size: 0.85rem;
	}

	.advantages {
		grid-template-columns: repeat(var(--adv-cols-mob, 1), minmax(0, 1fr));
		gap: 1.1rem min(var(--adv-gap, 2rem), 1.4rem);
	}

	.advantages__cell {
		gap: 0.9rem;
	}

	.home-advantages--boxed > .container,
	.home-advantages--cards .advantages__item {
		padding: calc(var(--spacing) * 0.7) calc(var(--spacing) * 0.6);
	}

	/* На телефоне в полосе появляется текст объявления и занимает почти
	   всю ширину — узор уводим к самым краям, чтобы он не шёл под ним.
	   Заодно мельчим сам рисунок: в узкую полосу влезает больше трасс,
	   а линии при уменьшении выглядят тоньше. */
	.mm22-message-pcb .site-top-message {
		--tm-pcb-tile: 118px 24px;
	}

	.mm22-message-pcb .site-top-message::before,
	.mm22-message-pcb .site-top-message::after {
		width: min(var(--tm-pcb-width, 30%), 34%);
	}

	.home-icon-tiles--pcb {
		--tiles-pcb-tile: 200px 200px;
	}

	.site-top-message__descr {
		display: inline;
	}

	.home .site-main > .poster3:first-child {
		padding-block-end: var(--spacing);
	}

	/* Поля и промежутки ужаты: высота слайда фиксирована пропорцией, и текст
	   с кнопкой должны укладываться в неё, а не упираться в обрезку. */
	.poster3__content {
		gap: 0.75rem;
		padding-block: 1.1rem 1.7rem;   /* снизу больше — под точки пагинации */
		padding-inline: 1.3rem;
	}

	/* Текучий размер: на 320px заголовок ужимается и укладывается в пропорцию,
	   с 390px и шире работает прежнее значение. */
	.poster3__title {
		font-size: clamp(1.15rem, 6vw, 1.65rem);
		line-height: 120%;
	}

	.poster3__descr {
		max-width: 100%;
		font-size: 0.94rem;
		line-height: 150%;
	}

	.poster3-slider .splide__arrow {
		display: none;
	}

	.dgwt-wcas-suggestions-wrapp {
		max-width: calc(100vw - 24px);
	}

	.site-footer__credits {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.25rem;
	}

	.footer-logos {
		justify-content: flex-start;
	}

	.home-brands .brands-wall__track {
		gap: 0.75rem;
	}

	.home-brands .brands-wall__frame {
		width: 27vw;
		height: 27vw;
		padding: 0.5rem;
	}

	.home-brands .brands-wall__item--center .brands-wall__frame {
		transform: none;
	}

	.shop-grid,
	.services-category-list__items,
	.home-services-list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		max-width: none;
	}

	.home-gallery__list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}

	.home-gallery__list > * + * {
		margin-block-start: 0;
	}

	.home-gallery__list > *:nth-child(n + 9) {
		display: none;
	}

	.home-products.has-more:not(.is-expanded) .home-products__more {
		display: inline-flex;
		width: 100%;
		margin-block-start: 1.2rem;
	}

	.shop-toolbar {
		flex-wrap: nowrap;
		gap: 0.5rem;
	}

	.shop-toolbar__cell--count {
		display: none;
	}

	.shop-toolbar__cell--cats {
		flex: 1 1 auto;
		min-width: 0;
	}

	/* Сортировка на телефоне — иконка в одной группе с видами каталога, первой.
	   Селект остаётся нативным: тап по иконке открывает штатный список вариантов,
	   подпись прячем через font-size, вместо неё фоном рисуется значок сортировки. */
	.shop-toolbar__cell--ordering {
		flex: 0 0 auto;
		gap: 2px;
		padding: 2px;
		background-color: var(--grey-bg);
		border-radius: calc(var(--bradius) / 1.5);
	}

	.shop-toolbar__cell--ordering .woocommerce-ordering {
		flex: 0 0 auto;
	}

	.woocommerce-ordering select {
		width: 28px;
		height: 26px;
		padding: 0;
		font-size: 0;
		background-color: transparent;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23888' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 16V4M6 4L3.5 6.5M6 4l2.5 2.5'/%3E%3Cpath d='M14 4v12M14 16l-2.5-2.5M14 16l2.5-2.5'/%3E%3C/svg%3E");
		background-position: center;
		background-size: 17px;
		border: 0;
		border-radius: calc(var(--bradius) / 2);
	}

	.shop-view {
		margin-inline-start: 0;
		gap: 2px;
		padding: 0;
		background-color: transparent;
		border-radius: 0;
	}

	.shop-view__btn {
		width: 28px;
		height: 26px;
	}

	/* Список — всегда одна колонка (правило .shop-grid выше переводит сетку в две) */
	.shop-grid--list {
		grid-template-columns: 1fr;
	}

	/* Строка списка на телефоне: фото слева, под ним кнопки во всю ширину */
	.shop-grid--list .shop-product {
		grid-template-columns: 72px minmax(0, 1fr);
		grid-template-areas:
			"media title"
			"media footer"
			"actions actions";
		align-items: start;
		column-gap: 0.75rem;
		row-gap: 0.4rem;
	}

	.shop-grid--list .shop-product__title {
		align-self: start;
	}

	/* Наличие и цена — одной строкой: остаток слева, цена у правого края.
	   Футер снова становится флексом (в общей части у него display: contents). */
	.shop-grid--list .shop-product__footer {
		display: flex;
		grid-area: footer;
		align-items: baseline;
		margin-block-start: 0;
	}

	/* Снять align-self: start из десктопной раскладки — иначе остаток липнет
	   к верху строки и его текст стоит ниже цены (у них разная высота строки). */
	.shop-grid--list .shop-product__stock {
		align-self: auto;
	}

	.shop-grid--list .shop-product__price {
		margin-inline-start: auto;
	}

	.shop-grid--list .shop-product__actions {
		margin-block-start: 0.3rem;
	}

	.shop-grid--list .shop-product__actions .shop-product__more,
	.shop-grid--list .shop-product__actions .button {
		flex: 1 1 0;
	}

	.mm22-gallery {
		grid-template-columns: 1fr;
	}

	.mm22-gallery__stage {
		grid-column: 1;
		grid-row: 1;
		width: 60%;
		margin-inline: auto;
	}


	.mm22-gallery__thumbs-wrap {
		grid-column: 1;
		grid-row: 2;
	}

	.mm22-gallery__thumbs-wrap.has-more .mm22-gallery__thumbs-viewport {
		max-height: none;
	}

	.mm22-gallery__thumbs-viewport {
		overflow-x: auto;
	}

	.mm22-gallery__thumbs {
		flex-direction: row;
		transform: none !important;
	}

	.mm22-gallery__thumb {
		flex: 0 0 72px;
	}

	.mm22-gallery__nav {
		display: none;
	}

	.woocommerce table.shop_table thead {
		display: none;
	}

	.woocommerce table.shop_table tr {
		display: block;
		margin-block-end: 1rem;
	}

	.woocommerce table.shop_table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.6rem 1rem;
	}

	.woocommerce table.shop_table td::before {
		content: attr(data-title);
		flex-shrink: 0;
		margin-inline-end: 1rem;
		font-weight: var(--semi-bold);
		color: var(--text-secondary, #888);
	}
	.site-header__account .site-header__icon,
	.site-header__cart .site-header__icon {
		width: 1.4rem;
		height: 1.4rem;
	}
	.dgwt-wcas-ico-magnifier-handler {
		max-width: 16px !important;
	}

	.service-tabs-content .service-tabs-content__item {
		margin-block: 1.2rem;
		padding: 0;
		background-color: var(--white);
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
		border-radius: var(--bradius);
		overflow: hidden;
		border-bottom: none;
	}

	.service-tabs-content .service-tabs-content__item .tabs-content__subtitle {
		position: relative;
		display: block;
		margin: 0;
		padding: 1.2rem 4rem 1.2rem 1.2rem;
		font-size: 1.25rem;
		font-weight: var(--semi-bold);
		line-height: 1.35;
		cursor: pointer;
		user-select: none;
	}

	.service-tabs-content .service-tabs-content__item .tabs-content__subtitle::before,
	.service-tabs-content .service-tabs-content__item .tabs-content__subtitle::after {
		content: "";
		position: absolute;
		right: 1rem;
		top: 50%;
		width: var(--spacing);
		height: var(--spacing);
		background-color: var(--accent);
		border-radius: 4px;
		transform: translateY(-50%);
	}

	.service-tabs-content .service-tabs-content__item .tabs-content__subtitle::before {
		background-image: linear-gradient(#fff, #fff);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 1.1rem 2px;
	}

	.service-tabs-content .service-tabs-content__item .tabs-content__subtitle::after {
		background-color: transparent;
		background-image: linear-gradient(#fff, #fff);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 2px 1.1rem;
		transition: opacity var(--animation), transform var(--animation);
		pointer-events: none;
	}

	.service-tabs-content .service-tabs-content__item.is-open .tabs-content__subtitle::after {
		opacity: 0;
		transform: translateY(-50%) rotate(90deg);
	}

	.service-tabs-content .service-tabs-content__item.is-open .tabs-content__subtitle {
		border-bottom: 1px dotted var(--border-color);
	}

	.service-tabs-content .service-tabs-content__item .post-content,
	.service-tabs-content .service-tabs-content__item > .services-category-list__items {
		display: none;
		padding: 1.2rem;
	}

	.service-tabs-content .service-tabs-content__item.is-open .post-content,
	.service-tabs-content .service-tabs-content__item.is-open > .services-category-list__items {
		display: block;
		animation: fadeEffect 0.6s ease;
	}

	.service-tabs-content .service-tabs-content__item.is-open > .services-category-list__items {
		display: grid;
	}
	.service-single__title {
		font-size: 1.6rem;
		width: 100%;
	}
	.service-single__media .service-single__img img {
		max-width: 200px;
		max-height: 200px;
	}
	.cookies-modal {
		bottom: 100px;
	}
	.home__promo {
		grid-template-columns: 1fr;
	}
}