/* =========================================================
   Ролл-Профиль — основные стили
   Мотив темы: ламель. Повторяющаяся горизонтальная полоса
   с бликом сверху и тенью снизу — как профиль рольставни.
   ========================================================= */

/* ---------- 1. Токены ---------- */
:root {
	/* Основа — воронёная сталь: холодный тёмно-синий вместо чёрного.
	   Он читается как металл, но не давит и не сливается в дыру на экране. */
	--ink: #16232e;
	--steel: #26394a;
	--steel-2: #33506a;
	--zinc: #7c91a3;
	--zinc-soft: #b2c2cf;
	--line: #d6dee4;
	--paper: #eff3f6;
	--paper-2: #e1e9ef;
	--white: #fff;
	--signal: #dfa13c; /* латунь — тёплый акцент на холодной стали */
	--signal-deep: #a26c13;
	--ok: #3c7d63;
	--danger: #b3402c;

	--display: "Fira Sans Condensed", "Arial Narrow", sans-serif;
	--body: "Golos Text", -apple-system, "Segoe UI", Roboto, sans-serif;
	--mono: "JetBrains Mono", ui-monospace, "Courier New", monospace;

	--wrap: 1280px;
	--gap: 24px;
	--r: 3px; /* почти без скругления: металл не круглится */

	--shadow-1: 0 1px 2px rgba(22, 35, 46, .08), 0 8px 24px -12px rgba(22, 35, 46, .34);
	--shadow-2: 0 2px 4px rgba(22, 35, 46, .1), 0 24px 48px -20px rgba(22, 35, 46, .5);

	--ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- 2. База ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	overflow-x: clip;
}

body {
	margin: 0;
	font-family: var(--body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--ink);
	background: var(--white);
	/* clip, а не hidden: hidden делает body прокручиваемым контейнером,
	   и position: sticky у шапки начинает считаться от него — шапку срезает
	   при прокрутке. clip подрезает так же, но контейнер не создаёт. */
	overflow-x: clip;
}

@supports not (overflow: clip) {
	html, body { overflow-x: hidden; }
	.header { position: -webkit-sticky; position: sticky; }
}

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }
a:hover { color: var(--signal-deep); }

:focus-visible {
	outline: 2px solid var(--signal);
	outline-offset: 3px;
}

h1, h2, h3, h4 {
	font-family: var(--display);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.005em;
	margin: 0 0 .5em;
	text-transform: uppercase;
}

h1 { font-size: clamp(34px, 5.4vw, 68px); }
h2 { font-size: clamp(27px, 3.6vw, 46px); }
h3 { font-size: clamp(20px, 2.1vw, 26px); }
h4 { font-size: 18px; }

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

.wrap {
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: 20px;
}

.section { padding-block: clamp(56px, 8vw, 104px); }
.section--tight { padding-block: clamp(40px, 5vw, 64px); }
.section--dark { background: var(--steel); color: var(--white); }
.section--paper { background: var(--paper); }

.lead { font-size: clamp(17px, 1.5vw, 20px); color: var(--steel-2); max-width: 62ch; }
.section--dark .lead { color: var(--zinc-soft); }

/* ---------- 3. Фирменный мотив: ламель ---------- */
.slat {
	background-image: repeating-linear-gradient(
		to bottom,
		var(--steel) 0 22px,
		rgba(210, 232, 246, .11) 22px 23px,
		rgba(0, 0, 0, .3) 23px 25px
	);
}

/* Тонкая ламельная линейка — разделитель секций */
.slat-rule {
	height: 9px;
	border: 0;
	margin: 0;
	background-image: repeating-linear-gradient(
		to bottom,
		var(--line) 0 3px,
		transparent 3px 4px
	);
}

/* Надпись-спецификация: как маркировка на профиле */
.eyebrow {
	font-family: var(--mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--signal-deep);
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
}
.eyebrow::after {
	content: "";
	flex: 1;
	height: 1px;
	background: repeating-linear-gradient(to right, var(--line) 0 4px, transparent 4px 8px);
}
.section--dark .eyebrow { color: var(--signal); }
.section--dark .eyebrow::after { background: repeating-linear-gradient(to right, rgba(255,255,255,.3) 0 4px, transparent 4px 8px); }

/* ---------- 4. Кнопки ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--display);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 15px 28px;
	border: 1px solid transparent;
	border-radius: var(--r);
	cursor: pointer;
	transition: background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
}
.btn:active { transform: translateY(1px); }

.btn--primary { background: var(--signal); color: var(--ink); }
.btn--primary:hover { background: #ecb45e; color: var(--ink); }

.btn--dark { background: var(--steel); color: var(--white); }
.btn--dark:hover { background: var(--ink); color: var(--white); }

.btn--ghost { border-color: currentColor; color: inherit; background: transparent; }
.btn--ghost:hover { background: var(--ink); border-color: var(--ink); color: var(--white); }

.btn--wide { width: 100%; }
.btn--lg { padding: 19px 36px; font-size: 18px; }

/* ---------- 5. Формы ---------- */
.field { display: block; margin-bottom: 16px; }
.field__label {
	display: block;
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zinc);
	margin-bottom: 6px;
}
input[type="text"], input[type="tel"], input[type="email"], input[type="number"],
input[type="password"], input[type="search"], input[type="url"], textarea, select {
	width: 100%;
	font-family: var(--body);
	font-size: 16px;
	color: var(--ink);
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r);
	padding: 13px 14px;
	transition: border-color .16s var(--ease), box-shadow .16s var(--ease);
}
input:focus, textarea:focus, select:focus {
	border-color: var(--steel);
	box-shadow: 0 0 0 3px rgba(227, 160, 58, .25);
	outline: none;
}
textarea { min-height: 110px; resize: vertical; }

.form__note { font-size: 12px; color: var(--zinc); line-height: 1.45; }
.form__msg { margin-top: 12px; font-size: 15px; }
.form__msg.is-ok { color: var(--ok); }
.form__msg.is-err { color: var(--danger); }

/* ---------- 6. Шапка ---------- */
.topbar {
	background: var(--ink);
	color: var(--zinc-soft);
	font-size: 13px;
}
.topbar__in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 40px;
	flex-wrap: wrap;
}
.topbar__geo { font-family: var(--mono); letter-spacing: .06em; }
.topbar__links { display: flex; gap: 20px; }
.topbar a:hover { color: var(--signal); }

.header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: var(--white);
	border-bottom: 1px solid var(--line);
}
.header__in {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 32px;
	min-height: 76px;
}
.brand { display: flex; align-items: center; gap: 12px; }
.brand__mark {
	width: 38px; height: 38px;
	border-radius: 2px;
	flex: none;
	background-image: repeating-linear-gradient(
		to bottom,
		var(--steel) 0 6px,
		rgba(210, 232, 246, .16) 6px 7px,
		rgba(0, 0, 0, .34) 7px 8px
	);
}
.brand__name {
	font-family: var(--display);
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .01em;
	line-height: 1;
}

.nav ul { display: flex; gap: 26px; list-style: none; margin: 0; padding: 0; }
.nav a {
	font-family: var(--display);
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
	padding-block: 8px;
	border-bottom: 2px solid transparent;
	display: block;
}
.nav a:hover, .nav .current-menu-item > a { border-bottom-color: var(--signal); color: var(--ink); }
.nav .sub-menu {
	display: none;
	position: absolute;
	background: var(--white);
	border: 1px solid var(--line);
	box-shadow: var(--shadow-1);
	padding: 10px 0;
	min-width: 250px;
	flex-direction: column;
	gap: 0;
	z-index: 30;
}
.nav li { position: relative; }
.nav li:hover > .sub-menu, .nav li:focus-within > .sub-menu { display: flex; }
.nav .sub-menu a { padding: 9px 20px; border: 0; font-size: 15px; text-transform: none; font-family: var(--body); }
.nav .sub-menu a:hover { background: var(--paper); }

.header__act { display: flex; align-items: center; gap: 18px; }
.header__phone {
	font-family: var(--display);
	font-size: 21px;
	font-weight: 700;
	white-space: nowrap;
	letter-spacing: .01em;
}
.header__phone small { display: block; font-family: var(--body); font-size: 11px; font-weight: 400; color: var(--zinc); letter-spacing: 0; }

.cart-link { position: relative; display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 13px; }
.cart-link__count {
	background: var(--signal); color: var(--ink);
	min-width: 20px; height: 20px; border-radius: 10px;
	display: grid; place-items: center;
	font-size: 12px; font-weight: 500; padding-inline: 6px;
}

.burger { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.burger span { display: block; width: 24px; height: 2px; background: var(--ink); margin: 5px 0; transition: .2s var(--ease); }

/* ---------- 7. Первый экран: рольставня уезжает вверх ---------- */
.hero { position: relative; background: var(--steel); color: var(--white); overflow: hidden; }
.hero__bg { position: absolute; inset: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .34; }
.hero__bg::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(105deg, rgba(22,35,46,.93) 0%, rgba(22,35,46,.7) 46%, rgba(22,35,46,.26) 100%);
}
.hero__shutter {
	position: absolute; inset: 0;
	z-index: 3;
	transform-origin: top center;
	background-image: repeating-linear-gradient(
		to bottom,
		var(--steel-2) 0 22px,
		rgba(210, 232, 246, .13) 22px 23px,
		rgba(0, 0, 0, .32) 23px 25px
	);
	animation: rp-roll-up 1.1s .15s var(--ease) forwards;
	pointer-events: none;
}
@keyframes rp-roll-up { to { transform: scaleY(0); } }

.hero__in { position: relative; z-index: 4; padding-block: clamp(64px, 10vw, 130px); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 56px; align-items: end; }
.hero h1 { color: var(--white); max-width: 15ch; }
.hero h1 em { font-style: normal; color: var(--signal); }
.hero__sub { color: var(--zinc-soft); font-size: clamp(16px, 1.5vw, 19px); max-width: 48ch; margin-bottom: 30px; }
.hero__cta { display: flex; gap: 14px; flex-wrap: wrap; }
.hero__ghost { color: var(--white); }

/* Табличка характеристик — как шильдик на коробе */
.spec-plate {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: var(--r);
	backdrop-filter: blur(4px);
}
.spec-plate__row {
	display: flex; justify-content: space-between; gap: 16px;
	padding: 14px 20px;
	border-bottom: 1px dashed rgba(255, 255, 255, .16);
	font-size: 14px;
}
.spec-plate__row:last-child { border-bottom: 0; }
.spec-plate__k { color: var(--zinc-soft); }
.spec-plate__v { font-family: var(--mono); color: var(--white); text-align: right; }

/* ---------- 8. Плитки категорий ---------- */
.tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; }
.tile {
	position: relative;
	display: block;
	min-height: 320px;
	overflow: hidden;
	background: var(--steel);
	color: var(--white);
}
.tile img {
	position: absolute; inset: 0;
	width: 100%; height: 100%; object-fit: cover;
	opacity: .55;
	transition: transform .6s var(--ease), opacity .4s var(--ease);
}
.tile:hover img { transform: scale(1.05); opacity: .38; }
.tile::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(22,35,46,.92) 12%, rgba(22,35,46,.12) 72%);
}
.tile__body { position: relative; z-index: 2; padding: 28px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; }
.tile__name { font-family: var(--display); font-size: clamp(22px, 2.4vw, 30px); font-weight: 700; text-transform: uppercase; margin: 0 0 6px; color: var(--white); }
.tile__from { font-family: var(--mono); font-size: 13px; color: var(--signal); }
.tile__go { margin-top: 14px; font-family: var(--display); font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: var(--zinc-soft); }
.tile:hover .tile__go { color: var(--signal); }

/* ---------- 9. Преимущества ---------- */
.facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.fact { background: var(--white); padding: 30px 26px; }
.fact__n { font-family: var(--display); font-size: clamp(34px, 4vw, 50px); font-weight: 700; line-height: 1; color: var(--steel); }
.fact__n span { color: var(--signal); }
.fact__t { font-size: 14px; color: var(--steel-2); margin-top: 10px; }

/* ---------- 10. Процесс — это настоящая последовательность, нумерация оправдана ---------- */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); counter-reset: step; }
.step { position: relative; padding-top: 28px; border-top: 3px solid rgba(255,255,255,.18); }
.step::before {
	counter-increment: step;
	content: counter(step, decimal-leading-zero);
	font-family: var(--mono);
	font-size: 13px;
	color: var(--signal);
	position: absolute; top: -3px; left: 0;
	border-top: 3px solid var(--signal);
	padding-top: 8px;
}
.step__t { font-family: var(--display); font-size: 20px; font-weight: 600; text-transform: uppercase; margin: 6px 0 8px; }
.step__d { font-size: 14px; color: var(--zinc-soft); }
.step__meta { font-family: var(--mono); font-size: 12px; color: var(--zinc); margin-top: 10px; }

/* ---------- 11. Блок заявки ---------- */
.lead-block { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 460px); gap: 56px; align-items: start; }
.lead-form { background: var(--white); border: 1px solid var(--line); border-radius: var(--r); padding: 30px; box-shadow: var(--shadow-1); }
.lead-form__title { font-family: var(--display); font-size: 24px; text-transform: uppercase; margin-bottom: 6px; }
.lead-form__sub { font-size: 14px; color: var(--zinc); margin-bottom: 20px; }
.checkline { display: flex; gap: 10px; align-items: flex-start; font-size: 12px; color: var(--zinc); line-height: 1.45; }
.checkline input { width: auto; margin-top: 3px; flex: none; }

/* ---------- 12. FAQ ---------- */
.faq { border-top: 1px solid var(--line); }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__q {
	width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
	font-family: var(--display); font-size: clamp(17px, 1.8vw, 21px); font-weight: 600; text-transform: uppercase;
	padding: 22px 44px 22px 0; position: relative; color: inherit;
}
.faq__q::after {
	content: "+"; position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
	font-family: var(--mono); font-size: 22px; color: var(--signal); transition: transform .2s var(--ease);
}
.faq__item.is-open .faq__q::after { content: "–"; }
.faq__a { display: none; padding: 0 60px 24px 0; color: var(--steel-2); }
.faq__item.is-open .faq__a { display: block; }

/* ---------- 13. Подвал ---------- */
.footer { background: var(--ink); color: var(--zinc-soft); font-size: 14px; }
/* Колонки равной ширины: разная ширина при разном числе колонок
   выглядела случайной, а содержимое везде короткое. */
.footer__top {
	padding-block: 56px;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 40px;
}
.footer__top--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.footer__widget-title, .footer__col-title {
	font-family: var(--display); font-size: 15px; letter-spacing: .09em; text-transform: uppercase;
	color: var(--white); margin: 0 0 16px;
}
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.footer a:hover { color: var(--signal); }
.footer__phone { font-family: var(--display); font-size: 26px; color: var(--white); display: block; margin-bottom: 4px; }
.footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding-block: 22px;
	display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap;
	font-size: 12px; color: var(--zinc);
	font-family: var(--mono);
}

/* ---------- 14. Хлебные крошки ---------- */
.crumbs { font-family: var(--mono); font-size: 12px; color: var(--zinc); padding-block: 18px; letter-spacing: .04em; }
.crumbs a:hover { color: var(--signal-deep); }
.crumbs span[aria-hidden] { padding-inline: 6px; color: var(--zinc-soft); }

/* ---------- 15. Каталог ---------- */
.shop-head { background: var(--paper); padding-block: 34px 30px; border-bottom: 1px solid var(--line); }
.shop-head h1 { margin-bottom: 10px; }
.shop-head__desc { max-width: 70ch; color: var(--steel-2); }

.shop-layout { display: grid; grid-template-columns: 282px minmax(0, 1fr); gap: 44px; padding-block: 40px 72px; align-items: start; }

.filters { position: sticky; top: 100px; }
.filter-block { border: 1px solid var(--line); border-radius: var(--r); padding: 20px; margin-bottom: 16px; }
.filter-block__title { font-family: var(--display); font-size: 15px; letter-spacing: .07em; text-transform: uppercase; margin: 0 0 14px; }
.filter-block ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 14px; }
.filter-block ul ul { padding-left: 14px; margin-top: 8px; }
.filter-block .count { color: var(--zinc); font-family: var(--mono); font-size: 12px; }

.shop-toolbar {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding-bottom: 18px; margin-bottom: 24px; border-bottom: 1px solid var(--line); flex-wrap: wrap;
}
.woocommerce-result-count { font-family: var(--mono); font-size: 13px; color: var(--zinc); margin: 0; }
.woocommerce-ordering select { width: auto; padding: 9px 12px; font-size: 14px; }

.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); list-style: none; margin: 0; padding: 0; }

/* ---------- 16. Карточка товара ---------- */
.card {
	display: flex; flex-direction: column;
	border: 1px solid var(--line); border-radius: var(--r);
	background: var(--white); overflow: hidden;
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.card:hover { border-color: var(--steel); box-shadow: var(--shadow-1); transform: translateY(-2px); }
.card__media { position: relative; aspect-ratio: 4 / 3; background: var(--paper); overflow: hidden; }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.card:hover .card__media img { transform: scale(1.04); }
.card__badges { position: absolute; top: 10px; left: 10px; display: flex; gap: 6px; flex-wrap: wrap; z-index: 2; }
.badge {
	font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
	background: var(--ink); color: var(--white); padding: 4px 8px; border-radius: 2px;
}
.badge--sale { background: var(--signal); color: var(--ink); }
.badge--stock { background: var(--ok); }

.card__body { padding: 18px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.card__cat { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--zinc); margin-bottom: 7px; }
.card__title { font-family: var(--display); font-size: 19px; font-weight: 600; text-transform: uppercase; line-height: 1.15; margin: 0 0 12px; }
.card__title a:hover { color: var(--signal-deep); }

.card__specs { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 5px; font-size: 13px; color: var(--steel-2); }
.card__specs li { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dotted var(--line); padding-bottom: 4px; }
.card__specs b { font-family: var(--mono); font-weight: 400; color: var(--ink); }

.card__foot { margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.card__price { line-height: 1.15; }
.card__price small { display: block; font-size: 11px; font-family: var(--mono); color: var(--zinc); text-transform: uppercase; letter-spacing: .06em; }
.card__price .amount, .card__price ins { font-family: var(--display); font-size: 23px; font-weight: 700; text-decoration: none; color: var(--ink); }
.card__price del { font-size: 14px; color: var(--zinc); }
.card__btn { font-size: 13px; padding: 11px 16px; }

/* ---------- 17. Карточка товара (страница) ---------- */
.product-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; padding-block: 32px 64px; align-items: start; }

.gallery { position: sticky; top: 100px; }
.gallery__main { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: var(--paper); }
.gallery__thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 8px; }
.gallery__thumbs img { border: 1px solid var(--line); border-radius: 2px; cursor: pointer; }
.gallery__thumbs img:hover { border-color: var(--signal); }
.woocommerce-product-gallery__wrapper { margin: 0; }

.pdp__cat { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--signal-deep); margin-bottom: 10px; }
.pdp__title { font-size: clamp(26px, 3.2vw, 40px); margin-bottom: 12px; }
.pdp__sku { font-family: var(--mono); font-size: 12px; color: var(--zinc); margin-bottom: 22px; }
.pdp__short { color: var(--steel-2); margin-bottom: 26px; }

/* Калькулятор — функциональная доминанта страницы */
.calc { border: 2px solid var(--steel); border-radius: var(--r); background: var(--white); }
.calc__head {
	background: var(--steel); color: var(--white);
	padding: 14px 22px;
	display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.calc__head h2 { font-size: 17px; margin: 0; letter-spacing: .05em; color: var(--white); }
.calc__unit { font-family: var(--mono); font-size: 12px; color: var(--signal); }
.calc__body { padding: 24px 22px; }

.dim-grid { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: end; margin-bottom: 8px; }
.dim-x { font-family: var(--display); font-size: 24px; color: var(--zinc); padding-bottom: 12px; }
.dim input { font-family: var(--mono); font-size: 20px; text-align: center; padding: 12px; }
.dim__hint { font-family: var(--mono); font-size: 11px; color: var(--zinc); margin-top: 5px; text-align: center; }
.dim.is-bad input { border-color: var(--danger); }

.opt-group { margin-top: 22px; }
.opt-group__title { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--zinc); margin-bottom: 9px; }
.opt-row { display: grid; gap: 8px; }
.opt {
	display: flex; align-items: center; gap: 12px;
	border: 1px solid var(--line); border-radius: var(--r);
	padding: 12px 14px; cursor: pointer; font-size: 14px;
	transition: border-color .16s var(--ease), background .16s var(--ease);
}
.opt:hover { border-color: var(--zinc); }
.opt input { width: auto; flex: none; }
.opt.is-active { border-color: var(--steel); background: var(--paper); }
.opt__name { flex: 1; }
.opt__price { font-family: var(--mono); font-size: 13px; color: var(--signal-deep); white-space: nowrap; }

.swatches { display: flex; flex-wrap: wrap; gap: 8px; }
.swatch { width: 38px; height: 38px; border-radius: 2px; border: 2px solid var(--line); cursor: pointer; position: relative; }
.swatch.is-active { border-color: var(--ink); }
.swatch span {
	position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%);
	font-family: var(--mono); font-size: 9px; color: var(--zinc); white-space: nowrap;
}

.calc__total {
	margin-top: 26px; padding-top: 20px; border-top: 2px solid var(--steel);
	display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.calc__total-label { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--zinc); }
.calc__total-sum { font-family: var(--display); font-size: clamp(30px, 4vw, 42px); font-weight: 700; line-height: 1; }
.calc__area { font-family: var(--mono); font-size: 12px; color: var(--zinc); margin-top: 6px; }
.calc__actions { display: grid; gap: 10px; margin-top: 20px; }
.calc__legal { font-size: 12px; color: var(--zinc); margin-top: 14px; line-height: 1.45; }

.trust { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 22px; }
.trust__i { background: var(--white); padding: 16px; font-size: 13px; }
.trust__i b { display: block; font-family: var(--display); font-size: 16px; text-transform: uppercase; margin-bottom: 3px; }

/* Характеристики и вкладки */
.pdp-tabs { border-top: 1px solid var(--line); padding-block: 48px 64px; }
.tabs__nav { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 30px; flex-wrap: wrap; list-style: none; padding: 0; }
.tabs__nav button {
	background: none; border: 0; border-bottom: 3px solid transparent; cursor: pointer;
	font-family: var(--display); font-size: 17px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
	padding: 12px 18px; color: var(--zinc); margin-bottom: -1px;
}
.tabs__nav button.is-active { color: var(--ink); border-bottom-color: var(--signal); }
.tabs__panel { display: none; max-width: 90ch; }
.tabs__panel.is-active { display: block; }

.spec-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.spec-table th, .spec-table td { text-align: left; padding: 13px 0; border-bottom: 1px dotted var(--line); vertical-align: top; }
.spec-table th { font-weight: 400; color: var(--zinc); width: 44%; }
.spec-table td { font-family: var(--mono); font-size: 14px; }

/* ---------- 18. Корзина / оформление ---------- */
.woocommerce-cart-form table, .shop_table { width: 100%; border-collapse: collapse; }
.shop_table th { font-family: var(--display); font-size: 14px; letter-spacing: .07em; text-transform: uppercase; text-align: left; padding: 14px 10px; border-bottom: 2px solid var(--steel); }
.shop_table td { padding: 16px 10px; border-bottom: 1px solid var(--line); }
.cart_item dl.variation, .wc-item-meta { font-family: var(--mono); font-size: 12px; color: var(--zinc); margin: 6px 0 0; }
.cart_item dl.variation dt, .wc-item-meta li strong { font-weight: 400; }

.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-left: 3px solid var(--signal); background: var(--paper); padding: 14px 18px; margin: 0 0 22px; list-style: none; font-size: 15px;
}
.woocommerce-error { border-left-color: var(--danger); }

/* ---------- 19. Пагинация ---------- */
.woocommerce-pagination ul { display: flex; gap: 6px; list-style: none; padding: 0; margin: 40px 0 0; }
.woocommerce-pagination a, .woocommerce-pagination span {
	display: grid; place-items: center; min-width: 42px; height: 42px;
	border: 1px solid var(--line); font-family: var(--mono); font-size: 14px; border-radius: var(--r);
}
.woocommerce-pagination .current { background: var(--steel); color: var(--white); border-color: var(--steel); }

/* ---------- 20. Блог и страницы ---------- */
.entry { padding-block: 40px 72px; }
.entry__body { max-width: 74ch; }
.entry__body h2 { margin-top: 1.6em; }
.entry__body ul, .entry__body ol { padding-left: 22px; }
.entry__body li { margin-bottom: 7px; }
.entry__body blockquote { border-left: 3px solid var(--signal); margin: 24px 0; padding: 4px 0 4px 20px; color: var(--steel-2); }
.entry__body table { width: 100%; border-collapse: collapse; margin: 22px 0; }
.entry__body th, .entry__body td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; }
.entry__meta { font-family: var(--mono); font-size: 12px; color: var(--zinc); margin-bottom: 20px; }

.posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); }

/* ---------- 21. Плавающий блок звонка ---------- */
.callback-fab {
	position: fixed;
	right: max(16px, env(safe-area-inset-right));
	bottom: max(16px, env(safe-area-inset-bottom));
	left: auto;
	z-index: 70;
	display: none;
	max-width: calc(100vw - 32px);
}
.callback-fab .btn {
	box-shadow: var(--shadow-2);
	max-width: 100%;
	white-space: nowrap;
}

/* ---------- 22. Модальное окно ---------- */
.modal { position: fixed; inset: 0; z-index: 100; display: none; }
.modal.is-open { display: grid; place-items: center; padding: 20px; }
.modal__veil { position: absolute; inset: 0; background: rgba(22, 35, 46, .74); }
.modal__box { position: relative; background: var(--white); width: min(480px, 100%); padding: 32px; border-radius: var(--r); box-shadow: var(--shadow-2); max-height: 90vh; overflow: auto; }
.modal__close { position: absolute; top: 10px; right: 12px; background: none; border: 0; font-size: 26px; line-height: 1; cursor: pointer; color: var(--zinc); }

/* ---------- 23. Адаптив ---------- */
@media (max-width: 1100px) {
	.footer__top { grid-template-columns: 1fr 1fr; }
	.facts, .steps { grid-template-columns: repeat(2, 1fr); }
	.products { grid-template-columns: repeat(2, 1fr); }
	.product-layout { grid-template-columns: 1fr; gap: 34px; }
	.gallery, .filters { position: static; }
	.hero__grid { grid-template-columns: 1fr; gap: 34px; }
}

@media (max-width: 900px) {
	.header__in { grid-template-columns: auto 1fr; }
	.burger { display: block; }
	.nav {
		display: none; position: absolute; top: 100%; left: 0; right: 0;
		background: var(--white); border-bottom: 1px solid var(--line); box-shadow: var(--shadow-1);
		padding: 16px 20px 24px;
	}
	.nav.is-open { display: block; }
	.nav ul { flex-direction: column; gap: 2px; }
	.nav a { padding: 11px 0; border-bottom: 1px solid var(--line); }
	.nav .sub-menu { position: static; display: flex; border: 0; box-shadow: none; padding: 0 0 0 14px; }
	.header__phone { font-size: 17px; }
	.header__phone small { display: none; }
	.shop-layout { grid-template-columns: 1fr; gap: 24px; }
	.filters { display: none; }
	.filters.is-open { display: block; }
	.lead-block { grid-template-columns: 1fr; gap: 30px; }
	.posts { grid-template-columns: repeat(2, 1fr); }
	.callback-fab { display: block; }
}

@media (max-width: 640px) {
	.tiles, .facts, .steps, .products, .posts, .trust { grid-template-columns: 1fr; }
	.topbar__links { display: none; }
	.dim-grid { grid-template-columns: 1fr; }
	.dim-x { display: none; }
	.footer__top { grid-template-columns: 1fr; gap: 28px; }
	.calc__total { flex-direction: column; align-items: stretch; }
	.trust { grid-template-columns: repeat(3, 1fr); }
	.trust__i { padding: 12px; font-size: 12px; }
}

/* ---------- 24. Уважение к настройкам пользователя ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	.hero__shutter { display: none; }
}

@media print {
	.header, .topbar, .footer, .callback-fab, .calc__actions { display: none; }
}

/* ---------- 25. Служебное ---------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 10px; left: 10px;
	width: auto; height: auto; clip: auto;
	background: var(--signal); color: var(--ink);
	padding: 12px 20px; z-index: 200;
	font-family: var(--display); text-transform: uppercase;
}
.custom-logo { max-height: 52px; width: auto; }
.woocommerce-product-gallery { position: relative; }
.woocommerce-product-gallery__image img { border: 1px solid var(--line); border-radius: var(--r); }
.flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; list-style: none; padding: 0; margin: 8px 0 0; }
.flex-control-thumbs img { border: 1px solid var(--line); cursor: pointer; }
.flex-control-thumbs .flex-active { border-color: var(--signal); }

/* ---------- 26. Цена изделия (совпадает с фидом) ---------- */
.pdp__price {
	border: 2px solid var(--steel);
	border-radius: var(--r);
	padding: 22px;
	margin-bottom: 20px;
	background: var(--paper);
}
.pdp__price-sum {
	font-family: var(--display);
	font-size: clamp(32px, 4.4vw, 46px);
	font-weight: 700;
	line-height: 1;
	margin: 6px 0 10px;
}
.pdp__price-sum del { font-size: .5em; color: var(--zinc); font-weight: 400; }
.pdp__price-sum ins { text-decoration: none; }
.pdp__price-note { font-size: 13px; color: var(--steel-2); margin-bottom: 16px; }
.pdp__price .cart { margin: 0; }

/* ---------- 27. Слайдер работ ---------- */
.works-section { padding-bottom: clamp(48px, 6vw, 80px); }

.works__head {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 24px; margin-bottom: 28px; flex-wrap: wrap;
}
.works__head h2 { margin-bottom: 0; }

.works__nav { display: flex; gap: 8px; }
.works__btn {
	width: 52px; height: 52px;
	display: grid; place-items: center;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r);
	color: var(--ink);
	cursor: pointer;
	transition: background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease);
}
.works__btn:hover { background: var(--steel); border-color: var(--steel); color: var(--white); }
.works__btn[disabled] { opacity: .35; cursor: default; }
.works__btn[disabled]:hover { background: var(--white); border-color: var(--line); color: var(--ink); }

.works { position: relative; }
.works__track {
	display: flex;
	gap: 4px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding-inline: max(20px, calc((100vw - var(--wrap)) / 2 + 20px));
	padding-bottom: 4px;
}
.works__track::-webkit-scrollbar { display: none; }
.works__track:focus-visible { outline-offset: -3px; }

.work {
	flex: 0 0 clamp(280px, 32vw, 440px);
	margin: 0;
	scroll-snap-align: start;
	position: relative;
	background: var(--steel);
	overflow: hidden;
}
.work__media {
	display: block; width: 100%; padding: 0; border: 0; cursor: zoom-in;
	background: var(--steel); aspect-ratio: 4 / 3; overflow: hidden;
}
.work__media img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .6s var(--ease), opacity .3s var(--ease);
}
.work:hover .work__media img { transform: scale(1.05); }

.work__cap {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 20px;
	color: var(--white);
	background: linear-gradient(to top, rgba(22, 35, 46, .94) 25%, rgba(22, 35, 46, 0) 100%);
	pointer-events: none;
}
.work__type {
	display: block;
	font-family: var(--display); font-size: 19px; font-weight: 600;
	text-transform: uppercase; letter-spacing: .02em;
}
.work__place { display: block; font-size: 13px; color: var(--zinc-soft); margin-top: 3px; }
.work__size { display: block; font-family: var(--mono); font-size: 12px; color: var(--signal); margin-top: 5px; }

.works__foot {
	display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
	margin-top: 28px; color: var(--steel-2); font-size: 15px;
}

/* ---------- 28. Просмотр фотографии ---------- */
.lightbox {
	position: fixed; inset: 0; z-index: 120;
	display: none; place-items: center;
	background: rgba(22, 35, 46, .93);
	padding: 24px;
}
.lightbox.is-open { display: grid; }
.lightbox img {
	max-width: min(1100px, 94vw);
	max-height: 88vh;
	width: auto; object-fit: contain;
	border-radius: var(--r);
	box-shadow: var(--shadow-2);
}
.lightbox__close {
	position: absolute; top: 16px; right: 20px;
	background: none; border: 0; color: var(--white);
	font-size: 40px; line-height: 1; cursor: pointer; padding: 8px;
}
.lightbox__close:hover { color: var(--signal); }

@media (max-width: 640px) {
	.works__track { padding-inline: 20px; }
	.work { flex-basis: 84vw; }
	.works__head { align-items: flex-start; }
	.works__foot { flex-direction: column; align-items: stretch; }
}

/* ---------- 29. Правки раскладки ---------- */

/* Липкая шапка не должна уезжать под панель администратора */
body.admin-bar .header { top: 32px; }
body.admin-bar .filters,
body.admin-bar .gallery,
body.admin-bar .works__nav { top: 132px; }
@media screen and (max-width: 782px) {
	body.admin-bar .header { top: 46px; }
}
/* Ниже 600px админ-панель WordPress перестаёт быть фиксированной и уезжает
   вместе со страницей. Если оставить смещение, под шапкой открывается щель,
   сквозь которую видно контент. */
@media screen and (max-width: 600px) {
	body.admin-bar .header { top: 0; }
}

/* Нечётное число плиток: последняя занимает всю ширину, а не половину */
.tiles > .tile:last-child:nth-child(odd) { grid-column: 1 / -1; min-height: 260px; }
.tiles > .tile:only-child { grid-column: 1 / -1; }

/* Плитка без фотографии не должна быть пустым прямоугольником */
.tile:not(:has(img))::before {
	content: "";
	position: absolute; inset: 0;
	background-image: repeating-linear-gradient(
		to bottom,
		var(--steel-2) 0 22px,
		rgba(210, 232, 246, .1) 22px 23px,
		rgba(0, 0, 0, .28) 23px 25px
	);
	opacity: .5;
}

/* ---------- 30. Слайдер в первом экране ---------- */
.hero-slider { position: relative; }

.hero-slider__frame {
	position: relative;
	aspect-ratio: 4 / 3;
	border: 1px solid rgba(210, 232, 246, .18);
	border-radius: var(--r);
	overflow: hidden;
	background: var(--steel-2);
	box-shadow: 0 24px 60px -28px rgba(0, 0, 0, .65);
}

.hero-slide {
	position: absolute; inset: 0;
	margin: 0;
	opacity: 0;
	transition: opacity .6s var(--ease);
	pointer-events: none;
}
.hero-slide.is-active { opacity: 1; pointer-events: auto; }
.hero-slide img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }

.hero-slider__cap {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 18px 20px 20px;
	background: linear-gradient(to top, rgba(22, 35, 46, .92) 20%, rgba(22, 35, 46, 0) 100%);
	pointer-events: none;
}
.hero-slider__type {
	display: block;
	font-family: var(--display); font-size: 17px; font-weight: 600;
	text-transform: uppercase; letter-spacing: .02em; color: var(--white);
}
.hero-slider__place { display: block; font-size: 13px; color: var(--zinc-soft); margin-top: 2px; }

.hero-slider__arrow {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 40px; height: 40px;
	display: grid; place-items: center;
	background: rgba(22, 35, 46, .6);
	border: 1px solid rgba(210, 232, 246, .22);
	border-radius: var(--r);
	color: var(--white);
	cursor: pointer;
	opacity: 0;
	transition: opacity .2s var(--ease), background .2s var(--ease);
}
.hero-slider__arrow--prev { left: 12px; }
.hero-slider__arrow--next { right: 12px; }
.hero-slider:hover .hero-slider__arrow,
.hero-slider__arrow:focus-visible { opacity: 1; }
.hero-slider__arrow:hover { background: var(--signal); border-color: var(--signal); color: var(--ink); }

.hero-slider__dots { display: flex; gap: 6px; justify-content: flex-end; margin-top: 12px; }
.hero-slider__dot {
	width: 26px; height: 4px;
	background: rgba(210, 232, 246, .28);
	border: 0; border-radius: 2px; padding: 0;
	cursor: pointer;
	transition: background .2s var(--ease), width .2s var(--ease);
}
.hero-slider__dot:hover { background: rgba(210, 232, 246, .5); }
.hero-slider__dot.is-active { background: var(--signal); width: 40px; }

.hero__specs {
	font-family: var(--mono);
	font-size: 12px;
	letter-spacing: .04em;
	color: var(--zinc-soft);
	margin: 22px 0 0;
}

@media (max-width: 1100px) {
	.hero-slider__arrow { opacity: 1; }
	.hero-slider__dots { justify-content: flex-start; }
}
@media (max-width: 640px) {
	.hero-slider__frame { aspect-ratio: 3 / 2; }
	.hero__specs { font-size: 11px; }
}

/* ---------- 31. Замена снятых стилей WooCommerce ---------- */

/* Защита от чужих правил ширины на карточках каталога */
ul.products li.product {
	width: auto;
	float: none;
	margin: 0;
	clear: none;
}
ul.products::before, ul.products::after { content: none; }

.filter-list { list-style: none; margin: 0; padding: 0; }

/* Кнопки магазина в оформлении темы */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
a.button, button.button, input.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--display);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 14px 26px;
	border: 1px solid transparent;
	border-radius: var(--r);
	background: var(--steel);
	color: var(--white);
	cursor: pointer;
	transition: background .18s var(--ease), color .18s var(--ease);
}
.woocommerce .button:hover, a.button:hover, button.button:hover { background: var(--ink); color: var(--white); }
.woocommerce .button.alt,
.woocommerce button[name="woocommerce_checkout_place_order"],
.checkout-button { background: var(--signal); color: var(--ink); }
.woocommerce .button.alt:hover, .checkout-button:hover { background: #ecb45e; color: var(--ink); }
.woocommerce .button:disabled, .woocommerce .button.disabled { opacity: .45; cursor: default; }

/* Корзина */
.quantity input.qty {
	width: 88px;
	text-align: center;
	font-family: var(--mono);
	padding: 10px 6px;
}
.cart-collaterals {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
	gap: 40px;
	align-items: start;
	margin-top: 36px;
}
.cart_totals, .woocommerce-shipping-calculator { font-size: 15px; }
.cart_totals h2,
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
	font-family: var(--display);
	font-size: 21px;
	text-transform: uppercase;
	letter-spacing: .03em;
	margin: 0 0 16px;
}
.coupon { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.coupon input { max-width: 220px; }

/* Оформление заказа. Блок адреса — одна колонка: доставка отключена,
   а раскладку в две колонки задаёт сетка формы ниже. */
#customer_details { display: block; margin-bottom: 28px; }
.woocommerce-checkout .form-row { margin-bottom: 14px; }
.woocommerce-checkout .form-row label,
.woocommerce-form label:not(.checkbox) {
	display: block;
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zinc);
	margin-bottom: 6px;
}
.woocommerce-checkout .form-row label.checkbox,
.woocommerce-form label.checkbox { display: inline-flex; gap: 8px; align-items: center; font-size: 14px; text-transform: none; letter-spacing: 0; }
#order_review { border: 1px solid var(--line); border-radius: var(--r); padding: 24px; }
.woocommerce-checkout-payment { margin-top: 20px; }
.woocommerce-checkout-payment ul { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 10px; }
.woocommerce-checkout-payment .payment_box { font-size: 14px; color: var(--steel-2); padding: 10px 0 0; }
.woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--zinc); margin-bottom: 16px; }

/* Личный кабинет */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; display: grid; gap: 8px; }
.woocommerce-MyAccount-navigation a { font-family: var(--display); text-transform: uppercase; font-size: 15px; }
.woocommerce-account .woocommerce { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }

/* Страницы магазина без своей обёртки */
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
.woocommerce-account .entry-content { padding-block: 20px 60px; }

@media (max-width: 900px) {
	.cart-collaterals,
	.woocommerce-account .woocommerce { grid-template-columns: 1fr; }
	.shop_table th:nth-child(n+4), .shop_table td:nth-child(n+4) { font-size: 14px; }
}

/* ---------- 32. Список категорий в сайдбаре ---------- */
.filter-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; font-size: 14px; }
.filter-list .filter-list { padding-left: 14px; margin-top: 9px; padding-top: 9px; border-top: 1px dotted var(--line); }
.filter-list a { display: block; }
.filter-list .count { font-family: var(--mono); font-size: 12px; color: var(--zinc); }
.filter-list__item.is-current > a { color: var(--signal-deep); font-weight: 500; }
.filter-list__item.is-current > a .count { color: var(--signal-deep); }

/* ---------- 33. Шапка на узких экранах ---------- */
@media (max-width: 900px) {
	/* Подпись под логотипом переносится в столбик и ломает высоту шапки */
	.brand__name { font-size: 19px; white-space: nowrap; }
	.brand { gap: 10px; }
	.brand__mark { width: 32px; height: 32px; }
	.header__in { gap: 14px; min-height: 64px; }
	.header__act { gap: 10px; }
	.header__phone { font-size: 16px; letter-spacing: -.01em; }
}

@media (max-width: 420px) {
	/* На самых узких телефон уводим в отдельную строку под логотип,
	   иначе он и бургер не помещаются рядом с названием */
	.brand__name { font-size: 16px; }
	.brand__mark { width: 28px; height: 28px; }

	/* На 320 px кнопка в углу занимает почти всю ширину и всё равно
	   рискует обрезаться — растягиваем её полосой по низу экрана. */
	.callback-fab {
		left: 12px;
		right: 12px;
		bottom: max(12px, env(safe-area-inset-bottom));
		max-width: none;
	}
	.callback-fab .btn { width: 100%; padding: 14px 16px; font-size: 15px; }
	.header__phone { font-size: 15px; }
	.cart-link__count { min-width: 18px; height: 18px; font-size: 11px; }
}

/* ---------- 34. Плавающая кнопка не должна закрывать содержимое ---------- */
@media (max-width: 900px) {
	/* Запас под плавающую кнопку даём подвалу, а не body:
	   отступ у body рисовался белой полосой под тёмным подвалом. */
	.footer__bottom { padding-bottom: 88px; }
	.callback-fab .btn { padding: 13px 20px; font-size: 15px; }
}

/* ---------- 35. Кнопка меню из знака компании ---------- */
/* Знак и так набран из ламелей — на мобильных он же служит кнопкой меню:
   четыре полосы складываются в крест при открытии. */
.mark-burger {
	display: none;
	grid-row: 1; /* при любом раскладе остаётся в одной строке с логотипом */
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	line-height: 0;
}
.mark-burger__slat {
	display: grid;
	gap: 3px;
	width: 32px;
	padding: 3px 0;
}
.mark-burger__slat > span {
	display: block;
	height: 4px;
	border-radius: 1px;
	background: var(--steel);
	box-shadow: inset 0 1px 0 rgba(210, 232, 246, .35), inset 0 -1px 0 rgba(0, 0, 0, .3);
	transition: transform .26s var(--ease), opacity .18s var(--ease), background .18s var(--ease);
	transform-origin: center;
}
.mark-burger:hover .mark-burger__slat > span { background: var(--steel-2); }

/* Открытое меню: крайние полосы в крест, средние прячутся */
.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(1) { transform: translateY(10.5px) rotate(45deg); }
.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(4) { transform: translateY(-10.5px) rotate(-45deg); }
.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(2),
.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(3) { opacity: 0; }

@media (min-width: 901px) {
	/* На десктопе кнопка не нужна: меню и так строкой */
	.mark-burger { display: none !important; }
}

@media (max-width: 900px) {
	.mark-burger { display: block; }
	/* Знак внутри логотипа убираем — его роль исполняет кнопка */
	.brand .brand__mark { display: none; }
	.header__in {
		grid-template-columns: auto 1fr auto;
		gap: 12px;
	}
	.brand { min-width: 0; }
}

@media (max-width: 420px) {
	.mark-burger__slat { width: 26px; gap: 2px; }
	.mark-burger__slat > span { height: 3px; }
	.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
	.mark-burger[aria-expanded="true"] .mark-burger__slat > span:nth-child(4) { transform: translateY(-7.5px) rotate(-45deg); }
}

/* ---------- 36. Флажки и переключатели ---------- */
/* Системный синий заменяем фирменной латунью — во всех формах,
   включая корзину, оформление заказа и виджеты WooCommerce. */
input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--signal);
	width: 18px;
	height: 18px;
	cursor: pointer;
}

.checkline {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 12px;
	color: var(--zinc);
	line-height: 1.45;
	margin: 16px 0;
}
.checkline input { flex: none; margin-top: 1px; }
.checkline label { cursor: pointer; }
.checkline a { color: var(--signal-deep); text-decoration: underline; text-underline-offset: 2px; }

/* Пока согласие не отмечено — подсказываем, почему кнопка неактивна */
.rp-form button[type="submit"]:disabled {
	opacity: .4;
	cursor: not-allowed;
}
.rp-form.needs-consent .checkline { color: var(--steel-2); }

/* Флажок согласия в оформлении заказа */
.woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 13px;
	text-transform: none;
	letter-spacing: 0;
	color: var(--steel-2);
}
.woocommerce-form__input-checkbox { flex: none; margin-top: 2px; }

/* ---------- 37. Телефон в шапке на узких экранах ---------- */
/* На 320 px текст телефона съедал место, и название компании обрезалось.
   Ниже 560 px телефон превращается в иконку — название помещается целиком. */
.header__phone-icon { display: none; }

@media (max-width: 560px) {
	.header__phone {
		display: grid;
		place-items: center;
		width: 40px;
		height: 40px;
		border: 1px solid var(--line);
		border-radius: var(--r);
		color: var(--ink);
		flex: none;
	}
	.header__phone:hover { background: var(--signal); border-color: var(--signal); }
	.header__phone-icon { display: block; }
	.header__phone-text { display: none; }
	.header__act { gap: 8px; }
	.brand__name { font-size: 18px; }
}

@media (max-width: 360px) {
	.brand__name { font-size: 16px; }
	.header__in { gap: 8px; padding-inline: 14px; }
	.header__phone { width: 36px; height: 36px; }
}

/* ---------- 38. Блок цены товара ---------- */
.pdp__price-alt { margin-top: 10px; }
.calc__price-note { font-size: 15px; color: var(--steel-2); margin-bottom: 18px; }

/* ---------- 39. Старая цена тише новой ---------- */
/* WooCommerce вкладывает <span class="amount"> внутрь <del>, поэтому старая цена
   наследовала размер новой. Целимся во вложенный элемент напрямую. */
.card__price del,
.card__price del .amount {
	font-family: var(--body);
	font-size: 13px;
	font-weight: 400;
	color: var(--zinc);
	text-decoration-thickness: 1px;
	text-decoration-color: var(--zinc-soft);
}
.card__price del { display: block; margin-bottom: 1px; }
.card__price ins { display: block; text-decoration: none; }

.pdp__price-sum del,
.pdp__price-sum del .amount {
	font-family: var(--body);
	font-size: 18px;
	font-weight: 400;
	color: var(--zinc);
	text-decoration-thickness: 1px;
	text-decoration-color: var(--zinc-soft);
	margin-right: 8px;
}

/* ---------- 40. Корзина на блоках WooCommerce ---------- */
/* Новая корзина собрана на блоках, у неё свои классы. */

/* Плашка «Экономия»: скидка уже видна по перечёркнутой цене */
.wc-block-components-sale-badge,
.wc-block-components-product-badge { display: none !important; }

/* Купоны и строка доставки */
.wc-block-components-totals-coupon,
.wc-block-components-totals-wrapper:has(.wc-block-components-totals-coupon),
.wc-block-components-totals-shipping,
.wc-block-components-totals-wrapper:has(.wc-block-components-totals-shipping) { display: none !important; }

/* Старая цена тише новой */
.wc-block-components-product-price__regular,
.wc-block-components-product-price del,
.wc-block-cart-item__prices del,
.wc-block-components-product-price del .wc-block-formatted-money-amount {
	font-size: 13px;
	font-weight: 400;
	color: var(--zinc);
	text-decoration-thickness: 1px;
	text-decoration-color: var(--zinc-soft);
}
.wc-block-components-product-price__value.is-discounted,
.wc-block-components-product-price ins {
	font-weight: 600;
	color: var(--ink);
	text-decoration: none;
}

/* Итог и кнопка оформления в оформлении темы */
.wc-block-components-totals-item__label { color: var(--steel-2); }
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	background: var(--signal) !important;
	color: var(--ink) !important;
	font-family: var(--display);
	font-size: 17px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-radius: var(--r);
	padding: 16px 24px;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover { background: #ecb45e !important; }

.wc-block-components-order-summary-item__description .wc-block-components-product-metadata { font-family: var(--mono); font-size: 12px; }

/* ---------- 41. Плашка скидки не используется ---------- */
/* Скидку показывает перечёркнутая цена — этого достаточно.
   Прячем и стандартные плашки WooCommerce, включая блочные. */
.woocommerce span.onsale,
.wc-block-grid__product-onsale,
.badge--sale { display: none !important; }

/* ---------- 42. Выравнивание заголовков корзины ---------- */
/* Правая колонка начинается чуть выше таблицы товаров: у блока «Сумма корзины»
   нет строки заголовка таблицы. Сдвигаем только её, не трогая отступы и границы. */
@media (min-width: 901px) {
	.wc-block-cart .wc-block-cart__sidebar { margin-top: 22px; }
}

/* ---------- 43. Оформление заказа на блоках ---------- */

/* Колонки: сводка заказа была сжата так, что название рвалось по буквам */
.wp-block-woocommerce-checkout,
.wc-block-checkout__form { max-width: none; }

@media (min-width: 1001px) {
	.wc-block-checkout__main { flex: 1 1 58%; max-width: 58%; }
	.wc-block-checkout__sidebar { flex: 1 1 40%; max-width: 40%; min-width: 340px; }
}

.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__header {
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}
.wc-block-components-order-summary-item__title {
	font-family: var(--body);
	font-size: 14px;
	font-weight: 500;
	text-transform: none;
	line-height: 1.35;
}
.wc-block-components-order-summary-item__total-price { white-space: nowrap; }

/* Поля, скрытые в настройках, иногда всё равно остаются в разметке */
.wc-block-checkout__shipping-option,
.wp-block-woocommerce-checkout-shipping-methods-block,
.wp-block-woocommerce-checkout-shipping-method-block,
.wp-block-woocommerce-checkout-order-note-block,
.wc-block-checkout__use-address-for-billing { display: none !important; }

/* Заголовки разделов в оформлении темы */
.wc-block-components-checkout-step__title {
	font-family: var(--display);
	font-size: 19px;
	text-transform: uppercase;
	letter-spacing: .03em;
}

/* ---------- 44. Классическое оформление заказа ---------- */
/* Способ оплаты один и выбирается сам — показывать переключатель незачем.
   Блок остаётся в разметке, иначе WooCommerce не примет заказ. */
.woocommerce-checkout #payment .wc-payment-form,
.woocommerce-checkout #payment ul.payment_methods {
	display: none;
}
.woocommerce-checkout #payment {
	background: none;
	border: 0;
	padding: 0;
}
.woocommerce-checkout #payment div.form-row.place-order { padding: 0; }

/* Форма в одну колонку: полей осталось три */
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { width: 100%; float: none; }
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper { display: grid; gap: 4px; }
.woocommerce-checkout .form-row-wide { width: 100%; }

.woocommerce-checkout .woocommerce-additional-fields { margin-top: 8px; }
.woocommerce-checkout #order_comments { min-height: 96px; }

/* Итоговая таблица заказа */
.woocommerce-checkout-review-order-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td { padding: 12px 0; border-bottom: 1px solid var(--line); text-align: left; }
.woocommerce-checkout-review-order-table tfoot .order-total td { font-family: var(--display); font-size: 22px; font-weight: 700; }
.woocommerce-checkout-review-order-table .product-total,
.woocommerce-checkout-review-order-table td:last-child { text-align: right; white-space: nowrap; }

#place_order {
	width: 100%;
	background: var(--signal);
	color: var(--ink);
	font-family: var(--display);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 17px 26px;
	border: 0;
	border-radius: var(--r);
	cursor: pointer;
}
#place_order:hover { background: #ecb45e; }

/* ---------- 45. Оформление заказа: раскладка и таблица ---------- */

/* Две колонки одной сеткой: адрес слева, комментарий справа, заказ во всю ширину.
   Так заголовки начинаются с одной высоты независимо от количества полей. */
@media (min-width: 901px) {
	form.checkout.woocommerce-checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 20px 48px;
		align-items: start;
	}
	form.checkout #customer_details { grid-column: 1; }
	form.checkout .woocommerce-additional-fields { grid-column: 2; grid-row: 1; }
	form.checkout #order_review_heading,
	form.checkout #order_review { grid-column: 1 / -1; }
}

.woocommerce-checkout #customer_details,
.woocommerce-checkout .woocommerce-additional-fields { margin: 0; }

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3,
.woocommerce-checkout #order_review_heading {
	margin: 0 0 18px;
	padding: 0;
	line-height: 1.15;
}
.woocommerce-checkout #order_review_heading { margin-top: 34px; }

/* ---- Таблица заказа ---- */
#order_review {
	border: 1px solid var(--line);
	border-radius: var(--r);
	padding: 0;
	overflow: hidden;
	background: var(--white);
}

.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	font-size: 15px;
}

.woocommerce-checkout-review-order-table thead th {
	background: var(--steel);
	color: var(--white);
	font-family: var(--display);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: 14px 22px;
	border: 0;
}
.woocommerce-checkout-review-order-table thead th:last-child { text-align: right; }

.woocommerce-checkout-review-order-table tbody td {
	padding: 16px 22px;
	border: 0;
	border-bottom: 1px dotted var(--line);
	vertical-align: top;
}
.woocommerce-checkout-review-order-table tbody tr:last-child td { border-bottom: 1px solid var(--line); }
.woocommerce-checkout-review-order-table .product-name { color: var(--ink); line-height: 1.35; }
.woocommerce-checkout-review-order-table .product-quantity {
	font-family: var(--mono);
	font-size: 13px;
	color: var(--zinc);
	white-space: nowrap;
}
.woocommerce-checkout-review-order-table .product-total { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Размер и опции изделия под названием */
.woocommerce-checkout-review-order-table .wc-item-meta {
	margin: 6px 0 0;
	padding: 0;
	list-style: none;
	font-family: var(--mono);
	font-size: 12px;
	color: var(--zinc);
	display: grid;
	gap: 2px;
}
.woocommerce-checkout-review-order-table .wc-item-meta li { display: flex; gap: 6px; }
.woocommerce-checkout-review-order-table .wc-item-meta strong { font-weight: 400; }
.woocommerce-checkout-review-order-table .wc-item-meta p { margin: 0; }

/* Итоги */
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
	padding: 14px 22px;
	border: 0;
	border-bottom: 1px dotted var(--line);
	text-align: left;
}
.woocommerce-checkout-review-order-table tfoot td { text-align: right; white-space: nowrap; }
.woocommerce-checkout-review-order-table tfoot th {
	font-family: var(--mono);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--zinc);
}
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	border-bottom: 0;
	background: var(--paper);
	padding-block: 18px;
}
.woocommerce-checkout-review-order-table tfoot .order-total th {
	font-family: var(--display);
	font-size: 15px;
	letter-spacing: .08em;
	color: var(--ink);
}
.woocommerce-checkout-review-order-table tfoot .order-total td strong {
	font-family: var(--display);
	font-size: 26px;
	font-weight: 700;
	color: var(--ink);
}

/* Согласие и кнопка под таблицей */
.woocommerce-privacy-policy-text {
	font-size: 13px;
	color: var(--zinc);
	line-height: 1.5;
	margin: 16px 0 0;
}
.woocommerce-checkout #payment div.form-row.place-order { margin-top: 18px; }

@media (max-width: 640px) {
	.woocommerce-checkout-review-order-table thead th,
	.woocommerce-checkout-review-order-table tbody td,
	.woocommerce-checkout-review-order-table tfoot th,
	.woocommerce-checkout-review-order-table tfoot td { padding-inline: 14px; }
	.woocommerce-checkout-review-order-table { font-size: 14px; }
}

/* ---------- 46. Поля оформления во всю ширину колонки ---------- */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2,
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-additional-fields {
	width: 100%;
	float: none;
	max-width: none;
}
.woocommerce-checkout #customer_details .col-2:empty { display: none; }

.woocommerce-checkout .form-row {
	width: 100%;
	max-width: none;
	padding: 0;
	margin: 0 0 16px;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select {
	width: 100%;
	font-size: 16px;
	padding: 14px 15px;
}
.woocommerce-checkout #order_comments {
	min-height: 150px;
	resize: vertical;
	line-height: 1.5;
}

/* Подпись поля не должна ломаться на три строки */
.woocommerce-checkout .form-row label {
	white-space: normal;
	margin-bottom: 7px;
}
.woocommerce-checkout .form-row .optional { text-transform: none; letter-spacing: 0; }
.woocommerce-checkout .required { color: var(--signal-deep); text-decoration: none; }

/* Заголовки колонок в одну строку, пока хватает места */
@media (min-width: 901px) {
	.woocommerce-checkout .woocommerce-billing-fields h3,
	.woocommerce-checkout .woocommerce-additional-fields h3 { white-space: nowrap; }
}

/* ---------- 47. Оформление заказа на телефоне ---------- */
@media (max-width: 600px) {
	/* Таблица в две колонки не помещается: раскладываем строки сеткой,
	   название переносится, сумма прижата вправо и не обрезается. */
	.woocommerce-checkout-review-order-table thead { display: none; }

	.woocommerce-checkout-review-order-table,
	.woocommerce-checkout-review-order-table tbody,
	.woocommerce-checkout-review-order-table tfoot { display: block; width: 100%; }

	.woocommerce-checkout-review-order-table tbody tr,
	.woocommerce-checkout-review-order-table tfoot tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 4px 12px;
		align-items: baseline;
		padding: 14px 16px;
		border-bottom: 1px dotted var(--line);
	}
	.woocommerce-checkout-review-order-table tbody td,
	.woocommerce-checkout-review-order-table tfoot th,
	.woocommerce-checkout-review-order-table tfoot td {
		display: block;
		padding: 0;
		border: 0;
	}
	.woocommerce-checkout-review-order-table .product-name { font-size: 14px; }
	.woocommerce-checkout-review-order-table .product-total,
	.woocommerce-checkout-review-order-table tfoot td { text-align: right; font-size: 14px; }

	.woocommerce-checkout-review-order-table tfoot .order-total {
		background: var(--paper);
		border-bottom: 0;
		padding-block: 16px;
	}
	.woocommerce-checkout-review-order-table tfoot .order-total td strong { font-size: 21px; }

	#order_review { overflow-x: auto; }
	.woocommerce-checkout-review-order-table .wc-item-meta { font-size: 11px; }

	/* Плавающая кнопка перекрывала «Подтвердить заказ» */
	body.woocommerce-checkout .callback-fab,
	body.woocommerce-cart .callback-fab { display: none; }
	body.woocommerce-checkout .footer__bottom,
	body.woocommerce-cart .footer__bottom { padding-bottom: 22px; }
}

/* ---------- 48. Страница «Заказ принят» ---------- */
/* Способ оплаты в сводке не показываем: вариант один и обсуждается при звонке */
.woocommerce-order-overview__payment-method { display: none; }

.woocommerce-order-overview {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 40px;
	border-block: 1px solid var(--line);
	padding-block: 18px;
}
.woocommerce-order-overview li {
	font-family: var(--mono);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--zinc);
}
.woocommerce-order-overview li strong {
	display: block;
	font-family: var(--display);
	font-size: 20px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ink);
	margin-top: 3px;
}

.woocommerce-order-details__title,
.woocommerce-column__title { margin-top: 36px; }

.woocommerce-table--order-details { width: 100%; border-collapse: collapse; }
.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
	padding: 14px 18px;
	border-bottom: 1px dotted var(--line);
	text-align: left;
}
.woocommerce-table--order-details thead th {
	background: var(--steel);
	color: var(--white);
	font-family: var(--display);
	font-size: 13px;
	letter-spacing: .1em;
	text-transform: uppercase;
	border: 0;
}
.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
	background: var(--paper);
	border-bottom: 0;
	font-family: var(--display);
	font-size: 18px;
}

/* ---------- 49. Информация о товаре одним потоком ---------- */
.pdp-info { border-top: 1px solid var(--line); padding-block: 44px 64px; }

.pdp-info__block { max-width: 92ch; }
.pdp-info__block + .pdp-info__block {
	margin-top: 40px;
	padding-top: 36px;
	border-top: 1px dotted var(--line);
}

.pdp-info__title {
	font-size: clamp(20px, 2.2vw, 26px);
	margin-bottom: 18px;
}

.pdp-info__cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
	max-width: none;
}
.pdp-info__cols h3 {
	font-size: 17px;
	margin-bottom: 8px;
	color: var(--steel);
}
.pdp-info__cols p { font-size: 15px; color: var(--steel-2); }

@media (max-width: 900px) {
	.pdp-info__cols { grid-template-columns: 1fr; gap: 22px; }
	.pdp-info__block + .pdp-info__block { margin-top: 30px; padding-top: 26px; }
}

/* ---------- 50. Блок «Доставка и монтаж» ---------- */
.info-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: var(--line);
	border: 1px solid var(--line);
	border-radius: var(--r);
	overflow: hidden;
	max-width: none;
}
.info-grid__item {
	background: var(--white);
	padding: 26px 24px 22px;
	display: flex;
	flex-direction: column;
}
.info-grid__label {
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--signal-deep);
	margin-bottom: 10px;
}
.info-grid__item h3 {
	font-family: var(--display);
	font-size: 18px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .02em;
	color: var(--ink);
	margin: 0 0 10px;
}
.info-grid__item p {
	font-size: 14px;
	line-height: 1.55;
	color: var(--steel-2);
	margin: 0 0 16px;
}
.info-grid__meta {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px dotted var(--line);
	font-family: var(--mono);
	font-size: 12px;
	color: var(--zinc);
}

@media (max-width: 900px) {
	.info-grid { grid-template-columns: 1fr; }
}

/* ---------- 51. Плавающая кнопка только вне магазина ---------- */
/* В каталоге, карточке товара, корзине и оформлении есть свои кнопки действия —
   плавающая перекрывает их и уводит с покупки на форму заявки. */
body.is-shop .callback-fab,
body.woocommerce-cart .callback-fab,
body.woocommerce-checkout .callback-fab,
body.single-product .callback-fab {
	display: none !important;
}
body.is-shop .footer__bottom,
body.woocommerce-cart .footer__bottom,
body.woocommerce-checkout .footer__bottom {
	padding-bottom: 22px;
}

/* ---------- 52. Подвал: контакты и правовые ссылки ---------- */
.footer__address {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 10px;
	line-height: 1.5;
}
.footer__icon { flex: none; margin-top: 2px; color: var(--zinc); }

.footer__messengers {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 18px;
}
.messenger {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px 9px 11px;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: var(--r);
	font-size: 14px;
	color: var(--zinc-soft);
	transition: border-color .18s var(--ease), color .18s var(--ease), background .18s var(--ease);
}
.messenger svg { flex: none; }
.messenger:hover {
	border-color: var(--signal);
	background: rgba(223, 161, 60, .1);
	color: var(--signal);
}

.footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 28px;
	padding-top: 24px;
	margin-top: 8px;
	border-top: 1px solid rgba(255, 255, 255, .12);
	font-size: 13px;
}
.footer__legal a { color: var(--zinc-soft); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, .25); }
.footer__legal a:hover { color: var(--signal); text-decoration-color: currentColor; }

.footer__bottom { border-top: 0; padding-top: 16px; }

@media (max-width: 640px) {
	.footer__messengers { gap: 8px; }
	.messenger { font-size: 13px; padding: 8px 12px; }
}

/* ---------- 53. Уведомление о cookie ---------- */
.cookie-bar {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 90;
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: 900px;
	margin-inline: auto;
	padding: 16px 20px;
	background: var(--ink);
	color: var(--zinc-soft);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--r);
	box-shadow: var(--shadow-2);
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .24s var(--ease), transform .24s var(--ease);
}
.cookie-bar.is-visible { opacity: 1; transform: none; }
.cookie-bar[hidden] { display: none; }

.cookie-bar__text { margin: 0; font-size: 13px; line-height: 1.5; }
.cookie-bar__text a { color: var(--signal); text-decoration: underline; text-underline-offset: 2px; }
.cookie-bar__btn { flex: none; padding: 12px 26px; font-size: 15px; }

@media (max-width: 640px) {
	.cookie-bar {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
		left: 10px;
		right: 10px;
		bottom: 10px;
		padding: 16px;
	}
	.cookie-bar__btn { width: 100%; }
	/* Плавающая кнопка не должна налезать на полосу */
	.callback-fab { bottom: 96px; }
}