/* ===========================================================
   modern.css -- современный слой оформления ww.local.
   Перенесён по образцу sh.local: переменные темы, плитки разделов
   (.sc-*) и доработки карточек списка (.cl-*).
   Подключается после css.css темы warm.
   =========================================================== */
:root {
	/* цвет */
	--ink: #0b0b0b;
	--ink-2: #26262a;
	--muted: #6b6b6b;
	--muted-2: #8a8a85;
	--line: #e6e6e2;
	--line-strong: #bdbdb4;
	--bg: #ffffff;
	--panel: #f4f4f1;
	--panel-2: #f8f8f6;
	--field: #fbfbf9;
	--brand: #2868a8;
	--brand-dark: #1f5489;
	--brand-light: #5098d0;
	--brand-soft: #e4eef9;
	/* оттенки под фирменный синий: глубокий тёмно-синий, тёплый янтарный акцент (дополнительный к синему, для акций и «Хитов») и тихие тона плиток */
	--navy: #11304f;
	--accent-warm: #e8912d;
	--accent-warm-soft: #fdf0dc;
	--tint-blue: #e4eef9;
	--tint-sand: #f5efe4;
	--tint-mint: #e5f1ee;
	--tint-mist: #eceff4;
	--success: #2e9e5b;
	--success-soft: #e5f7ec;
	--danger: #c0392b;
	--danger-soft: #fbeaea;
	--warning: #b7791f;
	--warning-soft: #fcefdc;

	/* форма */
	--r-sm: 6px;
	--r-md: 10px;
	--r-lg: 16px;
	--r-xl: 20px;
	--r-pill: 999px;
	--shadow: 0 1px 2px rgba(20, 20, 30, .06), 0 1px 1px rgba(20, 20, 30, .04);
	--shadow-card: 0 1px 2px rgba(20, 20, 30, .04), 0 10px 24px -12px rgba(20, 20, 30, .12);
	--shadow-hover: 0 1px 2px rgba(20, 20, 30, .05), 0 18px 36px -16px rgba(20, 20, 30, .22);
	--focus-ring: 0 0 0 3px rgba(40, 104, 168, .18);

	/* шрифт и шкала отступов */
	--font: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--s1: 4px;
	--s2: 8px;
	--s3: 12px;
	--s4: 16px;
	--s5: 24px;
	--s6: 32px;
	--s7: 48px;
	--s8: 64px;

	/* прежние имена переменных темы и общего css сайта -> новые значения */
	--site-accent: var(--brand);
	--site-accent-dark: var(--brand-dark);
	--site-accent-soft: var(--brand-soft);
	--site-text: var(--ink);
	--site-text-muted: var(--muted);
	--site-border: var(--line);
	--site-bg-alt: var(--panel);
	--site-font: var(--font);
	--site-success: var(--success);
	--site-danger: var(--danger);
	--sh-ink: var(--ink);
	--sh-blue: var(--brand);
	--sh-sky: var(--brand-light);
	--sh-beige: var(--panel);
	--sh-line: var(--line);
	--sh-head-font: var(--font);

	/* личный кабинет и оформление заказа */
	--cab-accent: var(--brand);
	--cab-accent-hover: var(--brand-dark);
	--cab-heading: var(--ink);
	--cab-font: var(--font);
	--cab-heading-font: var(--font);
	--cab-soft-bg: var(--panel-2);
	--cab-info-bg: var(--brand-soft);
	--cab-focus-ring: rgba(40, 104, 168, .18);
	--cab-input-bg: var(--field);
	--cab-input-border: var(--line-strong);
	--cab-input-text: var(--ink);
	--cab-card-border: var(--line);
	--cab-danger: var(--danger);
	--cab-danger-bg: var(--danger-soft);
}


/* --- цвetа бренда ww.local: тёплый красный Warm Welcome --- */
:root {
	--brand: #e73d22;
	--brand-dark: #c62f16;
	--brand-light: #f2694f;
	--brand-soft: #fdeeea;
	--sh-blue: var(--brand);
	--sh-sky: var(--brand-light);
	--navy: #222248;
	--sh-head-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
	--font-head: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	/* плитки разделов: тёплые тихие тона вместо синих/мятных sh */
	--tint-blue: #f4f6fa;
	--tint-mint: #f3f7f3;
	--tint-mist: #f5f5f7;
	--tint-sand: #faf6ee;
}

/* --- плитки разделов: крупные и компактные --- */
.sc-grid, .cl .cl-subs.row { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 12px; margin: 0 0 20px; }/* ===========================================================
   Каталог ШИХОН: карточки в списке раздела и страница товара.
   Дополняет стили модуля catalog_items (catalog_list.css, item_page.css).
   =========================================================== */

/* --- Служебные списки каталога (просмотренные, связанные, аксессуары, бренд) --- */
.cl--aux { margin: 34px 0 10px; }
.cl--aux .cl-top { margin: 0 0 14px; }
.cl--aux .cl-h2 { margin: 0; font-family: var(--sh-head-font); font-size: 24px; line-height: 1.25; font-weight: 500; color: var(--sh-ink); }
.cl--aux .cl-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.cl--aux .cl-card-price { font-size: 19px; }
.cl--aux .cl-card-title { min-height: 0; }
.cl .cl-card-request { font-size: 15px; font-weight: 500; color: var(--muted-2); }

/* --- Заголовок раздела --- */
.cl .cl-top { align-items: baseline; margin: 6px 0 18px; }
.cl .cl-h1 { font-family: var(--sh-head-font); font-size: 30px; font-weight: 500; color: var(--sh-ink); }
.cl .cl-count { font-size: 15px; color: var(--muted-2); }

/* --- Сетка и карточка --- */
.cl .cl-grid { grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 16px; }
.cl .cl-card { border: 1px solid var(--line); border-radius: 12px; box-shadow: none; }
.cl .cl-card:hover { border-color: var(--line-strong); box-shadow: 0 14px 30px -18px rgba(23, 49, 67, .35); }
.cl .cl-card-photo { padding: 14px 14px 6px; }
.cl .cl-card-body { gap: 5px; padding: 0 14px 14px; }
.cl .cl-card-pricebar { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 4px; }
.cl .cl-card-price { font-family: var(--sh-head-font); font-size: 21px; font-weight: 600; color: var(--sh-ink); }
/* Цена 0 у товара: вместо «0 руб.» -- «Цена по запросу» */
.cl .cl-card-price.cl-card-price--request { font-family: var(--sh-body-font); font-size: 15px; font-weight: 500; color: var(--muted); white-space: normal; }
.cb-buy .cb-buy__request { font-family: var(--sh-head-font); font-size: 18px; font-weight: 500; color: var(--muted); }
.cl .cl-card-tools { display: inline-flex; align-items: center; gap: 0; margin-right: -6px; }
.cl .cl-card-tools .ci-action { min-height: 0; width: 32px; height: 32px; padding: 0; justify-content: center; border: 0; border-radius: 8px; background: none; color: var(--muted-2); }
.cl .cl-card-tools .ci-action:hover { background: var(--panel); color: var(--sh-blue); }
.cl .cl-card-tools .ci-action.is-active { background: none; color: var(--sh-blue); }
.cl .cl-card-tools .ci-icon { width: 20px; height: 20px; }
.cl .cl-card-tools .ci-action__label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cl .cl-card-code { font-size: 12px; color: var(--muted-2); text-align: left; }
.cl .cl-card-code:empty { display: none; }
.cl .cl-card-title { min-height: 2.7em; margin-top: 2px; font-family: var(--sh-head-font); font-size: 14.5px; font-weight: 500; line-height: 1.35; color: var(--sh-ink); text-align: left; }
.cl .cl-card-title:hover { color: var(--sh-blue); text-decoration: none; }
.cl .cl-card-specs { font-size: 12.5px; line-height: 1.45; color: var(--muted); text-align: left; }
.cl .cl-card-rating { min-height: 0; }
.cl .cl-card-rating:empty { display: none; }
.cl .cl-card-stock { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--success); }
.cl .cl-card-stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.cl .cl-card-stock.is-out { color: var(--muted-2); }

/* кнопка «Купить» на всю ширину, без счётчика количества */
.cl .cl-card-buy { display: block; margin-top: auto; padding-top: 8px; }
.cl .cl-card-buy form, .cl .cl-card-buy table, .cl .cl-card-buy tbody, .cl .cl-card-buy tr, .cl .cl-card-buy td { display: block; width: 100%; margin: 0; padding: 0; border: 0; }
.cl .cl-card-buy .amount-box { display: none; }
.cl .cl-card-buy button.to_shopping { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 42px; margin: 0; padding: 0 14px; border: 1px solid var(--sh-blue); border-radius: 8px; background: #fff; color: var(--sh-blue); font-family: var(--sh-head-font); font-size: 14px; font-weight: 500; cursor: pointer; transition: background .15s ease, color .15s ease; }
.cl .cl-card-buy button.to_shopping:hover { background: var(--sh-blue); color: #fff; }
.cl .cl-card-buy button.to_shopping::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--sh-bag) center / contain no-repeat; mask: var(--sh-bag) center / contain no-repeat; }
:root { --sh-bag: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M5.500 8h13l1 12.500h-15z'/><path d='M9 8V6.500a3 3 0 0 1 6 0V8'/></svg>"); }

/* вид «списком» */
html[data-cl-view="list"] .cl .cl-card-body { grid-template-areas: "bar buy" "code buy" "title buy" "specs buy" "rating buy" "stock buy"; grid-template-rows: auto auto auto 1fr auto auto; }
html[data-cl-view="list"] .cl .cl-card-pricebar { grid-area: bar; justify-content: flex-start; gap: 14px; }
html[data-cl-view="list"] .cl .cl-card-code { grid-area: code; }
@media (max-width: 575.98px) {
	html[data-cl-view="list"] .cl .cl-card { grid-template-areas: "photo bar" "photo title" "photo rating" "photo stock" "buy buy"; }
	html[data-cl-view="list"] .cl .cl-card-code { display: none; }
	html[data-cl-view="list"] .cl .cl-card-pricebar { margin-top: 0; }
	.cl .cl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.cl .cl-card-photo { padding: 8px 8px 4px; }
	.cl .cl-card-body { padding: 0 10px 10px; }
	.cl .cl-card-tools { margin-right: -4px; }
	.cl .cl-card-title { font-size: 13.5px; }
	.cl .cl-card-price { font-size: 18px; }
	.cl .cl-card-tools .ci-action { width: 26px; height: 26px; }
}

/* --- Страница товара --- */
.site-item-title { margin: 6px 0 20px; font-family: var(--sh-head-font); font-size: 28px; font-weight: 500; line-height: 1.25; color: var(--sh-ink); }
.si-main { margin-bottom: 8px; }
.si-main .site-item-gallery-main { margin-bottom: 0; background: #fff; border: 1px solid var(--line); }
.si-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-bottom: 18px; font-size: 13px; color: var(--muted-2); }
.si-rating:empty { display: none; }
.si-short-title { margin-bottom: 8px; font-family: var(--sh-head-font); font-size: 15px; font-weight: 500; color: var(--sh-ink); }
.si-info .site-item-attrs { margin: 0 0 12px; font-size: 14px; line-height: 1.5; color: var(--muted); }
.si-info .site-item-attrs:empty { display: none; }
.si-info:has(> .site-item-attrs:empty) .si-short-title { display: none; }
.si-all-specs { font-size: 14px; color: var(--sh-blue); }
.si-all-specs:hover { text-decoration: underline; }
.si-buy { display: flex; flex-direction: column; gap: 14px; }
.si-service { display: flex; flex-direction: column; gap: 8px; }
.si-service .site-item-service { gap: 4px; }
.si-service .ci-action { min-height: 38px; padding: 0 12px; border: 0; background: none; font-weight: 500; color: var(--muted); }
.si-service .ci-action:hover { background: var(--panel); color: var(--sh-blue); }
.si-service .ci-action.is-active { background: none; color: var(--sh-blue); }

/* блок покупки */
.si-buy .site-item-buybox { margin: 0; padding: 18px; border: 1px solid var(--line); border-radius: 12px; box-shadow: none; }
.si-buy .site-price-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-bottom: 14px; font-size: 15px; color: var(--muted); }
.si-buy .site-price { font-family: var(--sh-head-font); font-size: 30px; font-weight: 600; line-height: 1.1; color: var(--sh-ink); }
.si-buy .site-price-old { order: 2; font-size: 15px; text-decoration: line-through; color: var(--muted-2); }
.si-buy .site-price-old:empty { display: none; }
.si-buy button.to_shopping { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 44px; border: 0; border-radius: 8px; background: var(--sh-blue); color: #fff; font-family: var(--sh-head-font); font-size: 15px; font-weight: 500; cursor: pointer; transition: background .15s ease; }
.si-buy button.to_shopping:hover { background: var(--site-accent-dark); }
.si-buy button.to_shopping::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--sh-bag) center / contain no-repeat; mask: var(--sh-bag) center / contain no-repeat; }
.si-buy .amount-cart-box, .si-buy .amount-cart-box tbody { display: block; width: 100%; }
.si-buy .amount-cart-box tr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
.si-buy .amount-cart-box td { display: block; min-width: 0; padding: 0; }
.si-buy button.to_shopping { padding: 0 10px; }

/* --- Плитки разделов --- */
.sc-grid, .cl .cl-subs.row { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin: 0 0 22px; }
.sc-grid > .sc-col, .cl-subs > .sc-col { width: auto; max-width: none; padding: 0; flex: none; margin: 0; }
.sc-tile { position: relative; display: flex; align-items: stretch; justify-content: space-between; gap: 8px; height: 100%; min-height: 150px; overflow: hidden; border-radius: 14px; background: var(--tint-blue); color: var(--sh-ink); transition: transform .18s ease, box-shadow .18s ease; }
.sc-col:nth-child(4n+2) .sc-tile { background: var(--tint-mint); }
.sc-col:nth-child(4n+3) .sc-tile { background: var(--tint-mist); }
.sc-col:nth-child(4n) .sc-tile { background: var(--tint-sand); }
.sc-tile:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -16px rgba(23, 49, 67, .45); text-decoration: none; }
.sc-text { z-index: 1; display: flex; flex: 1 1 55%; flex-direction: column; justify-content: flex-end; gap: 4px; padding: 18px 0 18px 20px; }
.sc-name { font-family: var(--sh-head-font); font-size: 17px; font-weight: 500; line-height: 1.25; }
.sc-meta { font-size: 13px; color: var(--muted); }
.sc-pic { display: flex; flex: 0 0 46%; align-items: center; justify-content: center; padding: 12px 12px 12px 0; }
.sc-pic img { display: block; max-width: 100%; max-height: 128px; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.sc-tile:hover .sc-name { color: var(--sh-blue); }

/* --- Компактные плитки подразделов на страницах разделов каталога и на странице «Каталог» --- */
.cl .cl-subs.row, .sc-grid--compact { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 10px; margin: 0 0 18px; }
.cl .cl-subs .sc-tile, .sc-grid--compact .sc-tile { align-items: center; min-height: 62px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; }
.cl .cl-subs .sc-col:nth-child(4n+2) .sc-tile,
.cl .cl-subs .sc-col:nth-child(4n+3) .sc-tile,
.cl .cl-subs .sc-col:nth-child(4n) .sc-tile,
.sc-grid--compact .sc-col:nth-child(4n+2) .sc-tile,
.sc-grid--compact .sc-col:nth-child(4n+3) .sc-tile,
.sc-grid--compact .sc-col:nth-child(4n) .sc-tile { background: #fff; }
.cl .cl-subs .sc-tile:hover, .sc-grid--compact .sc-tile:hover { transform: none; border-color: var(--sh-blue); box-shadow: 0 6px 16px -12px rgba(23, 49, 67, .4); }
.cl .cl-subs .sc-text, .sc-grid--compact .sc-text { flex: 1 1 auto; justify-content: center; gap: 2px; padding: 0; }
.cl .cl-subs .sc-name, .sc-grid--compact .sc-name { font-size: 14.5px; font-weight: 600; line-height: 1.25; }
.cl .cl-subs .sc-meta, .sc-grid--compact .sc-meta { font-size: 12px; line-height: 1.2; }
.cl .cl-subs .sc-pic, .sc-grid--compact .sc-pic { flex: 0 0 auto; padding: 0; margin-left: 10px; }
.cl .cl-subs .sc-pic img, .sc-grid--compact .sc-pic img { width: 40px; height: 40px; max-width: 40px; max-height: 40px; object-fit: contain; }
.cl .cl-subs .sc-pic:empty, .sc-grid--compact .sc-pic:empty { display: none; }
@media (max-width: 575.98px) {
	.cl .cl-subs.row, .sc-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.cl .cl-subs .sc-tile, .sc-grid--compact .sc-tile { padding: 9px 10px; }
}

/* --- Главная: плитки услуг и карточки новинок --- */
.sc-grid--3 { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.sc-pic--icon { color: var(--sh-blue); opacity: .55; }
.sc-grid--3 .sc-text { flex-basis: 66%; }
.sc-grid--3 .sc-pic { flex-basis: 34%; }
/* Тексты плиток «Услуги» на одной линии: имя и подпись занимают постоянную
   высоту (имя — две строки, подпись — три), поэтому названия и описания во всех
   плитках начинаются на одной высоте. */
.sc-grid--3 .sc-name { display: flex; align-items: flex-end; min-height: 2.5em; }
.sc-grid--3 .sc-meta { min-height: 4.5em; line-height: 1.5; }
.sh-home-grid .cl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991.98px) { .sh-home-grid .cl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .sh-home-grid .cl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* --- Главная: восемь корневых разделов компактными плитками --- */
.sc-grid--home { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991.98px) { .sc-grid--home { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .sc-grid--home { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* --- Главная: карточки новинок --- */
.sh-new { margin: 0 0 var(--s6); }
.sh-new-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sh-new-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink-2); text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease; }
.sh-new-card:hover { border-color: var(--sh-blue); box-shadow: 0 6px 16px -12px rgba(23, 49, 67, .4); }
.sh-new-pic { display: flex; flex: 0 0 64px; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 8px; background: #f5f6f8; overflow: hidden; }
.sh-new-pic img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.sh-new-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sh-new-name { font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.sh-new-meta { display: flex; align-items: baseline; gap: 8px; }
.sh-new-price { font-size: 14px; font-weight: 800; color: var(--ink); white-space: nowrap; }
.sh-new-na { font-size: 12.5px; color: var(--muted); }
@media (max-width: 991.98px) { .sh-new-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .sh-new-grid { grid-template-columns: 1fr; } .sh-new-name { font-size: 13px; } }
.cl .cl-card-price--na { font-size: 15px; font-weight: 500; color: var(--muted-2); }
.cl .cl-card-buy:empty { display: none; }
@media (max-width: 767.98px) {
	.site-item-title { margin-bottom: 14px; font-size: 22px; }
	.cl .cl-h1 { font-size: 24px; }
	.si-buy .site-price { font-size: 26px; }
}

/* --- Купить в 1 клик: тихая кнопка и окно быстрого заказа --- */
body .fo-overlay, body .fo-modal { --fo-accent: var(--sh-blue); --fo-accent-hover: var(--site-accent-soft); --fo-text: var(--sh-ink); --fo-radius: 14px; font-family: var(--site-font); }
.fo-modal h2, .fo-modal h3 { font-family: var(--sh-head-font); }
.si-buy .fast-order-open-btn { display: block; width: 100%; height: 38px; margin: 10px 0 0; padding: 0 12px; border: 0; border-radius: 8px; background: var(--panel); color: var(--sh-ink); font-family: var(--sh-head-font); font-size: 14px; font-weight: 400; cursor: pointer; transition: background .15s ease, color .15s ease; }
.si-buy .fast-order-open-btn:hover { background: var(--site-accent-soft); color: var(--sh-blue); }
.sh-content .user-item-name { text-decoration: none; }
.sh-content .user-item-name:hover { text-decoration: underline; }

/* --- Разделы и подразделы на странице «Каталог»: тег [catalog_items:sections] --- */
.cat-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; margin: 0 0 28px; }
.cat-group { display: flex; flex-direction: column; gap: 10px; padding: 18px 18px 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease; }
.cat-group:hover { border-color: var(--brand-light); box-shadow: 0 16px 30px -20px rgba(34, 34, 72, .45); transform: translateY(-2px); }
.cat-group__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; text-decoration: none; }
.cat-group__head:hover { text-decoration: none; }
.cat-group__name { font-family: var(--font-head); font-size: 18px; font-weight: 600; line-height: 1.25; color: var(--navy); }
.cat-group__head:hover .cat-group__name { color: var(--brand); }
.cat-group__count { flex: none; font-size: 12.5px; color: var(--muted-2); white-space: nowrap; }
.cat-group__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.cat-group__list li { margin: 0; padding: 0; }
.cat-group__list a { display: inline-block; padding: 5px 10px; border-radius: 8px; background: var(--tint-mist); color: var(--ink-2); font-size: 13px; line-height: 1.3; text-decoration: none; transition: background .15s ease, color .15s ease; }
.cat-group__list a:hover { background: var(--brand-soft); color: var(--brand-dark); text-decoration: none; }
@media (max-width: 575.98px) {
	.cat-groups { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.cat-group { padding: 14px; }
	.cat-group__name { font-size: 16px; }
}

/* --- Правки 2026-11-14: мобильная карточка товара и плитки подразделов --- */
@media (max-width: 991.98px) {
	/* фото → цена и покупка → характеристики, иначе цена уезжает под огромное фото */
	.si-main { display: flex; flex-wrap: wrap; }
	.si-main > .col-lg-5 { order: 1; width: 100%; max-width: 100%; padding-left: 0; padding-right: 0; }
	.si-main > .si-buy { order: 2; width: 100%; max-width: 100%; }
	.si-main > .si-info { order: 3; width: 100%; max-width: 100%; }
	.si-main .itg-stage { max-height: 58vh; }
}
/* Плитки подразделов: ровная высота, название не растекается на 3+ строки */
.cl .cl-subs .sc-tile,
.sc-grid--compact .sc-tile { min-height: 68px; }
.cl .cl-subs .sc-name,
.sc-grid--compact .sc-name { text-align: left; }
.cl .cl-subs .sc-meta,
.sc-grid--compact .sc-meta { text-align: left; }

/* --- Преимущества в карточке товара (sysblock №11, разметка .si-trust) --- */
.si-trust {
	display: flex;
	flex-direction: column;
	margin: 16px 0 0;
	border: 1px solid var(--line);
	border-radius: 12px;
	background: var(--panel);
	overflow: hidden;
}
.si-trust-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	font-size: 13.5px;
	line-height: 1.35;
	color: var(--ink);
}
.si-trust-item + .si-trust-item { border-top: 1px solid var(--line); }
.si-trust-ico { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 22px; height: 22px; color: var(--sh-blue); }
.si-trust-ico svg { display: block; width: 22px; height: 22px; }

.site-item-tabs { margin-top: 24px; padding: 0; border: 0; background: none; }
.site-item-tabs .tabs { display: block; max-width: none; min-width: 0; padding: 0; margin: 0; }
.site-item-tabs .tabs > input { display: none; }
.site-item-tabs .tabs > label { display: inline-block; margin: 0 6px -1px 0; padding: 10px 18px; border: 1px solid var(--line); border-bottom: 0; border-radius: 10px 10px 0 0; background: var(--panel); color: var(--muted); font-family: var(--sh-head-font); font-size: 14px; font-weight: 500; text-align: center; cursor: pointer; transition: background .15s ease, color .15s ease; }
.site-item-tabs .tabs > label:hover { background: #fff; color: var(--sh-blue); }
.site-item-tabs .tabs > input:checked + label { border-color: var(--line); border-top: 2px solid var(--sh-blue); background: #fff; color: var(--sh-ink); }
.site-item-tabs .tabs > section { display: none; padding: 20px; border: 1px solid var(--line); border-radius: 0 12px 12px 12px; background: #fff; line-height: 1.6; }
.site-item-tabs #tab1:checked ~ #content-tab1,
.site-item-tabs #tab2:checked ~ #content-tab2,
.site-item-tabs #tab3:checked ~ #content-tab3 { display: block; }
.site-item-tabs #content-tab2 table { width: 100%; }
.site-item-tabs #content-tab2 table tr td { padding: 6px 4px; border-bottom: 1px solid var(--line); }
@media (max-width: 575.98px) {
	.site-item-tabs .tabs > label { padding: 9px 12px; font-size: 13px; }
	.site-item-tabs .tabs > section { padding: 14px; }
}
/* Кнопка «Удалить» в отложенных — тихая ссылка */
.cl--aux .cl-card-tools .button-watchlist { min-height: 0; height: 30px; padding: 0 6px; border: 0; background: none; color: var(--muted-2); font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.cl--aux .cl-card-tools .button-watchlist:hover { color: var(--brand); }

/* Страница сравнения: карточки в стиле каталога */
.catalog-area:has(.compare-clear) .catalog-item-box { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin: 0 0 18px; }
.catalog-area:has(.compare-clear) .catalog-page-item { width: auto; max-width: none; flex: 0 0 auto; padding: 0; }
.catalog-area:has(.compare-clear) .catalog-page-item .box { height: 100%; display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.catalog-area:has(.compare-clear) .foto_item { width: 100%; max-width: 100%; height: 180px; object-fit: contain; }
.catalog-area:has(.compare-clear) .item_link { font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.35; }
.catalog-area:has(.compare-clear) .articul { margin: 0; font-size: 12px; color: var(--muted-2); }
.catalog-area:has(.compare-clear) .item-buy { margin-top: auto; display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
.catalog-area:has(.compare-clear) .item-buy > div:first-child { display: flex; align-items: baseline; gap: 4px; }
.catalog-area:has(.compare-clear) .item-price { font-size: 20px; font-weight: 700; color: var(--ink); }
.catalog-area:has(.compare-clear) .item-buy .form-cart { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 0; }
.catalog-area:has(.compare-clear) .compare-clear { text-align: center; margin: 6px 0 22px; }
.catalog-area:has(.compare-clear) .compare-clear-link { display: inline-block; padding: 10px 18px; border: 1px solid var(--line-strong); border-radius: 10px; color: var(--ink); font-size: 14px; }
.catalog-area:has(.compare-clear) .compare-clear-link:hover { border-color: var(--brand); color: var(--brand); }

/* ===========================================================
   КОРЗИНА: список товаров в стиле нового каталога (ww, 2026-11)
   =========================================================== */
#cart_form { margin: 0; }

/* шапка «Фото / Кол-во / Товар / Цена / Сумма / Удалить» */
#cart_form > .row:has(.cart_col_name) { display: grid; grid-template-columns: 84px 60px minmax(0, 1fr) 96px 118px 36px; align-items: center; gap: 14px; margin: 0 0 10px; padding: 0 16px; }
#cart_form > .row:has(.cart_col_name) > [class*="col-"] { width: auto; max-width: none; float: none; flex: none; padding: 0; }
#cart_form .cart_col_name { font-family: var(--font); font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-2); }

/* строка товара */
#cart_form > .row.item { display: grid; grid-template-columns: 84px 60px minmax(0, 1fr) 96px 118px 36px; align-items: center; gap: 14px; margin: 0 0 10px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; }
#cart_form > .row.item:hover { border-color: var(--line-strong); box-shadow: 0 8px 24px rgba(11, 11, 11, .06); }
#cart_form > .row.item > [class*="col-"] { width: auto; max-width: none; float: none; flex: none; padding: 0; text-align: left; }

/* фото */
#cart_form .cart_foto { display: flex; align-items: center; justify-content: center; width: 84px; height: 84px; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; }
#cart_form .cart_foto a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
#cart_form .cart_foto img { display: block; width: auto; max-width: 100%; height: auto; max-height: 100%; object-fit: contain; }

/* количество */
#cart_form .cart_amount { display: flex; align-items: center; }
#cart_form .cart_amount input.amount { width: 54px; height: 40px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: none; font-family: var(--font-head); font-size: 14px; font-weight: 500; color: var(--ink); text-align: center; }
#cart_form .cart_amount input.amount:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

/* название */
#cart_form .cart_item_name { padding: 0; text-align: left; }
#cart_form .cart_item_name a.item-name-cart { font-family: var(--font-head); font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--ink); text-decoration: none; }
#cart_form .cart_item_name a.item-name-cart:hover { color: var(--brand); }
#cart_form .cart_item_name p { margin: 6px 0 0; font-family: var(--font); font-size: 13px; color: var(--muted); }

/* цены */
#cart_form .cart_item_price, #cart_form .cart_item_price_full { padding: 0; text-align: right; }
#cart_form .cart_item_price span { white-space: nowrap; font-family: var(--font-head); font-size: 14px; font-weight: 500; color: var(--muted); }
#cart_form .cart_item_price_full span { white-space: nowrap; font-family: var(--font-head); font-size: 17px; font-weight: 700; color: var(--ink); }

/* удалить */
#cart_form .cart_item_del { padding: 0; text-align: right; }
#cart_form .cart_item_del input[type="checkbox"] { -webkit-appearance: none; appearance: none; display: block; width: 34px; height: 34px; margin: 0 0 0 auto; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path d='M1 1l12 12M13 1L1 13' stroke='%238a8a85' stroke-width='1.5' stroke-linecap='round'/></svg>") center no-repeat; cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
#cart_form .cart_item_del input[type="checkbox"]:hover { border-color: var(--danger); background-color: #fff5f3; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path d='M1 1l12 12M13 1L1 13' stroke='%23c0392b' stroke-width='1.5' stroke-linecap='round'/></svg>"); }

/* пустые служебные строки (под скидки/купоны) не должны занимать место */
#cart_form > .row:not(.item):not(:has(.cart_col_name)):not(:has(.cart_data_name)):not(:has(a)) { display: none; }

/* итоги */
#cart_form > .row:has(.cart_data_name) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 16px; margin: 0 0 8px; padding: 14px 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
#cart_form > .row:has(.cart_data_name) > [class*="col-"] { width: auto; max-width: none; float: none; padding: 0; }
#cart_form .cart_data_name { padding: 0; text-align: left; font-family: var(--font); font-size: 15px; font-weight: 400; color: var(--muted); }
#cart_form .cart_data_out { padding: 0; text-align: right; font-family: var(--font); font-size: 15px; color: var(--muted); }
#cart_form .cart_data_out span { font-family: var(--font-head); font-size: 22px; font-weight: 700; color: var(--ink); }

/* кнопки */
#cart_form > .row:last-of-type { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; margin: 22px 0 0; }
#cart_form > .row:last-of-type > [class*="col-"] { width: auto; max-width: none; float: none; flex: none; padding: 0; text-align: right; }
#cart_form a.cart-refresh, #cart_form a.cart-order { display: inline-flex; align-items: center; justify-content: center; width: auto; min-width: 0; height: 48px; padding: 0 26px; border-radius: 12px; font-family: var(--font-head); font-size: 15px; font-weight: 500; text-decoration: none; cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease; }
#cart_form a.cart-refresh { border: 1px solid var(--line-strong); background: #fff; color: var(--ink); }
#cart_form a.cart-order { border: 1px solid var(--brand); background: var(--brand); color: #fff; }
#cart_form a.cart-refresh:hover { border-color: var(--ink); color: var(--ink); }
#cart_form a.cart-order:hover { border-color: var(--brand-dark); background: var(--brand-dark); color: #fff; }

/* подарки/скидки: рамки в новом стиле */
#cart_form .cart-gift-block, #cart_form .cart-gift-hint, #cart_form .cart-discount-hint, #cart_form .cart-account-hint { border-radius: 14px; }

@media (max-width: 767.98px) {
	#cart_form > .row:has(.cart_col_name) { display: none; }
	/* карточка товара в один столбец: фото | название, ниже количество,
	   а сумма занимает всю ширину -- иначе длинная цена (209 304 руб.)
	   вылезала за край карточки */
	#cart_form > .row.item { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr); grid-template-areas: "photo name" "photo qty" "sum sum"; align-items: start; gap: 8px 12px; padding: 14px; }
	#cart_form .cart_foto { grid-area: photo; width: 76px; height: 76px; }
	/* padding-right повышенной специфичностью: общее правило
	   "#cart_form > .row.item > [class*=col-] { padding: 0 }" выше по весу
	   и раньше съедало отступ, из-за чего кнопка «X» ложилась на название */
	#cart_form > .row.item > .cart_item_name { grid-area: name; padding-right: 44px; }
	#cart_form .cart_item_name a.item-name-cart { font-size: 14px; }
	#cart_form .cart_amount { grid-area: qty; }
	#cart_form .cart_item_price { display: none; }
	#cart_form .cart_item_price_full { grid-area: sum; margin-top: 4px; padding-top: 10px; border-top: 1px dashed var(--line); text-align: right; }
	#cart_form .cart_item_price_full span { font-size: 17px; }
	#cart_form .cart_item_del { position: absolute; top: 10px; right: 10px; }
	#cart_form .cart_item_del input[type="checkbox"] { width: 28px; height: 28px; border-radius: 8px; }
	#cart_form > .row:has(.cart_data_name) { padding: 12px 14px; }
	#cart_form .cart_data_out span { font-size: 19px; }
	#cart_form > .row:last-of-type { justify-content: stretch; }
	#cart_form > .row:last-of-type > [class*="col-"] { flex: 1 1 100%; text-align: center; }
	#cart_form a.cart-refresh, #cart_form a.cart-order { width: 100%; }
}

/* ===========================================================
   ОФОРМЛЕНИЕ ЗАКАЗА: форма и итоги в стиле ww
   =========================================================== */
.catalog-area:has(.checkout-simple-wrap) {
	--cab-accent: var(--brand);
	--cab-accent-hover: var(--brand-dark);
	--cab-heading: var(--ink);
	--cab-heading-font: var(--font-head);
	--cab-font: var(--font);
	--cab-text: var(--muted);
	--cab-muted: var(--muted);
	--cab-card-border: var(--line);
	--cab-card-bg: #fff;
	--cab-soft-bg: var(--panel);
	--cab-info-bg: var(--brand-soft);
}
.catalog-area:has(.checkout-simple-wrap) .checkout-wrap,
.catalog-area:has(.checkout-simple-wrap) .checkout-simple-wrap { max-width: none; }
/* на оформлении заголовок один: «Заказ» из обёртки корзины скрываем,
   иначе на странице два H1 подряд */
.catalog-layer:has(.checkout-simple-wrap) > h1,
.catalog-area:has(.checkout-simple-wrap) .catalog-layer > h1 { display: none; }
/* на странице «Спасибо за заказ» H1 «Заказ» тоже лишний: у карточки
   благодарности собственный заголовок */
.catalog-layer:has(.cart-thanks) > h1,
.catalog-area:has(.cart-thanks) .catalog-layer > h1 { display: none; }
.catalog-area:has(.checkout-simple-wrap) .checkout-simple-wrap h1 { margin: 0 0 18px; font-family: var(--font-head); font-size: 30px; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }

/* карточка формы */
.catalog-area:has(.checkout-simple-wrap) .checkout-layout__main .row > [class*="col-"] { padding: 0; }
.catalog-area:has(.checkout-simple-wrap) .checkout-layout__main #module_content { margin: 0 0 18px; padding: 22px 24px 26px; border: 1px solid var(--line); border-radius: 16px; background: #fff; font-family: var(--font); font-size: 14px; color: var(--muted); text-align: left; }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_left { float: none; width: 100%; padding: 0 0 6px; }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_left label { display: block; font-family: var(--font-head); font-size: 13px; font-weight: 600; color: var(--ink); }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_left_star { color: var(--brand); }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right { float: none; width: 100%; padding: 0 0 14px; }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right small { display: none; }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right input[type="text"],
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right input[type="email"],
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right input[type="tel"],
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right select,
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right textarea { display: block; width: 100%; max-width: 100%; min-height: 46px; padding: 0 14px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: none; font-family: var(--font); font-size: 14px; color: var(--ink); }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right textarea { min-height: 110px; height: auto; padding: 12px 14px; resize: vertical; }
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right input:focus,
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right select:focus,
.catalog-area:has(.checkout-simple-wrap) .mod_contact_right textarea:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.catalog-area:has(.checkout-simple-wrap) .clear { display: none; }

/* страховка: правый столбец-пустышка не занимает половину ширины */
.catalog-area:has(.checkout-simple-wrap) .checkout-layout__main .row > [class*="col-"]:empty { display: none; }

/* блоки итогов/способов оплаты/доставки */
.catalog-area:has(.checkout-simple-wrap) .checkout-method-list,
.catalog-area:has(.checkout-simple-wrap) .checkout-summary-block { border-radius: 14px; }
.catalog-area:has(.checkout-simple-wrap) .checkout-summary-block { padding: 16px 20px; }
.catalog-area:has(.checkout-simple-wrap) .checkout-summary-block__title { font-family: var(--font-head); font-size: 16px; font-weight: 600; color: var(--ink); }
.catalog-area:has(.checkout-simple-wrap) .checkout-method-block__title { font-family: var(--font-head); font-size: 16px; font-weight: 600; color: var(--ink); }
.catalog-area:has(.checkout-simple-wrap) .checkout-policy { align-items: center; gap: 10px; margin: 18px 0; font-family: var(--font); font-size: 13px; color: var(--muted); }
.catalog-area:has(.checkout-simple-wrap) .checkout-policy input { width: 18px; height: 18px; margin: 0; accent-color: var(--brand); }
.catalog-area:has(.checkout-simple-wrap) .checkout-policy a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.catalog-area:has(.checkout-simple-wrap) .checkout-policy a:hover { color: var(--brand); }
.catalog-area:has(.checkout-simple-wrap) .checkout-submit-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 240px; height: 50px; padding: 0 26px; border: 1px solid var(--brand); border-radius: 12px; background: var(--brand); color: #fff; font-family: var(--font-head); font-size: 15px; font-weight: 500; cursor: pointer; transition: background .15s ease, border-color .15s ease; }
.catalog-area:has(.checkout-simple-wrap) .checkout-submit-btn:hover { border-color: var(--brand-dark); background: var(--brand-dark); }
.catalog-area:has(.checkout-simple-wrap) .checkout-submit-wrap { text-align: left; margin-top: 4px; }

/* сводка «Ваш заказ» справа: узкая колонка 380px, поэтому
   название товара больше не растягиваем по ширине (наследовался
   text-align: justify из типографики темы), а цену ставим под
   названием -- иначе она наезжала на текст */
.catalog-area:has(.checkout-simple-wrap) .checkout-order { text-align: left; border-color: var(--line); border-radius: 16px; background: #fff; padding: 18px 18px 6px; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__head { align-items: center; margin-bottom: 12px; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__title { font-family: var(--font-head); font-size: 17px; font-weight: 600; color: var(--ink); letter-spacing: -.01em; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__edit { font-family: var(--font); font-size: 12.5px; color: var(--brand); }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__item { display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-areas: "photo body" "photo price"; align-items: start; column-gap: 12px; row-gap: 5px; margin: 0; padding: 14px 0; border-top: 1px solid var(--line); }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__item:first-child { border-top: 0; padding-top: 0; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__photo { grid-area: photo; flex: none; width: 52px; height: 52px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__body { grid-area: body; min-width: 0; gap: 3px; text-align: left; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__name { font-family: var(--font); font-size: 13.5px; font-weight: 600; line-height: 1.4; color: var(--ink); text-align: left; overflow-wrap: anywhere; }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__meta,
.catalog-area:has(.checkout-simple-wrap) .checkout-order__child { font-family: var(--font); font-size: 12px; line-height: 1.4; color: var(--muted-2); }
.catalog-area:has(.checkout-simple-wrap) .checkout-order__price { grid-area: price; font-family: var(--font-head); font-size: 14.5px; font-weight: 700; color: var(--ink); text-align: left; white-space: nowrap; }


/* ===========================================================
   Сообщения валидации форм заказа (корзина, быстрый заказ,
   предзаказ): плашка в форме вместо window.alert()
   =========================================================== */
.ww-form-msg { margin: 0 0 14px; padding: 12px 16px; border-left: 4px solid #b23b3b; border-radius: 6px; background: #fbeae9; font-family: var(--font); font-size: 14px; line-height: 1.42; color: #b23b3b; text-align: left; }
.ww-form-bad { border-color: #b23b3b !important; background-color: #fff7f7 !important; box-shadow: 0 0 0 3px rgba(178, 59, 59, .14) !important; }
.ww-form-msg--policy { margin: 10px 0 0; }
@media (max-width: 575.98px) {
	.ww-form-msg { font-size: 13.5px; padding: 10px 13px; }
}

/* ===========================================================
   СТАТЬИ (/articles/): сетка карточек как в каталоге
   =========================================================== */
.content-layer:has(.article-box) .content > h1 { margin: 18px 0 12px; font-family: var(--font-head); font-size: 34px; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }
.content-layer:has(.article-box) .content > p { max-width: 78ch; margin: 0 0 26px; font-family: var(--font); font-size: 15px; line-height: 1.6; color: var(--muted); }
.content-layer:has(.article-box) .row.horizontal-align { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; margin: 0; }
.content-layer:has(.article-box) .row.horizontal-align > .article-box { display: flex; flex-direction: column; width: auto; max-width: none; float: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 18px; background: #fff; overflow: hidden; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.content-layer:has(.article-box) .article-box:hover { border-color: var(--line-strong); box-shadow: 0 12px 30px rgba(11, 11, 11, .08); transform: translateY(-2px); }
.content-layer:has(.article-box) .article-box > a:first-child { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 10; padding: 16px; background: #fff; overflow: hidden; }
.content-layer:has(.article-box) .article-box > a:first-child img { display: block; width: auto; max-width: 100%; height: auto; max-height: 100%; object-fit: contain; transition: transform .3s ease; }
.content-layer:has(.article-box) .article-box:hover > a:first-child img { transform: scale(1.03); }
.content-layer:has(.article-box) .article-box h2 { margin: 0; padding: 16px 18px 0; font-family: var(--font-head); font-size: 17px; font-weight: 600; line-height: 1.36; color: var(--ink); }
.content-layer:has(.article-box) .article-box h2 a { color: var(--ink); text-decoration: none; }
.content-layer:has(.article-box) .article-box h2 a:hover { color: var(--brand); }
.content-layer:has(.article-box) .article-box p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 8px 0 18px; padding: 0 18px; font-family: var(--font); font-size: 14px; line-height: 1.5; color: var(--muted); }
@media (max-width: 575.98px) {
	.content-layer:has(.article-box) .row.horizontal-align { grid-template-columns: 1fr; gap: 16px; }
	.content-layer:has(.article-box) .content > h1 { font-size: 26px; }
}
/* ===========================================================
   СТАТЬИ: страница материала — таблицы и метаданные
   =========================================================== */
.content-layer .content .article-meta { margin: 8px 0 18px; font-family: var(--font); font-size: 13px; font-weight: 500; letter-spacing: .02em; color: var(--muted-2); }
.content-layer:has(.article-box) .content table { width: 100%; margin: 18px 0 24px; border-collapse: collapse; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; font-family: var(--font); font-size: 14px; line-height: 1.45; }
.content-layer:has(.article-box) .content table th { padding: 11px 14px; border: 1px solid var(--line); background: var(--panel); font-family: var(--font-head); font-size: 13px; font-weight: 600; color: var(--ink); text-align: left; vertical-align: bottom; }
.content-layer:has(.article-box) .content table td { padding: 10px 14px; border: 1px solid var(--line); color: var(--muted); vertical-align: top; }
.content-layer:has(.article-box) .content table tr:nth-child(even) td { background: #fbfbfa; }
.content-layer:has(.article-box) .content table a { color: var(--brand); }
.content-layer .content img { max-width: 100%; height: auto; }
@media (max-width: 767.98px) {
	.content-layer:has(.article-box) .content table { display: block; overflow-x: auto; white-space: nowrap; }
}

/* ===========================================================
   БЫСТРЫЙ ПРОСМОТР В КАРТОЧКАХ КАТАЛОГА
   Кнопка .cl-card-quick приходит в разметке модуля, но в этой
   теме нет ни её стилей, ни обработчика -- она рисовалась
   серой нативной кнопкой-полоской между фото и текстом.
   =========================================================== */
.cl-card-quick { display: none !important; }

/* ===========================================================
   СТЕППЕР КОЛИЧЕСТВА В КАРТОЧКЕ ТОВАРА (?v=20261114a7)
   Разметку даёт модуль cart (cart_button.tpl): таблица
   .amount-cart-box -> .amount-box (кнопки .qty-btn, поле .amount)
   и кнопка .to_shopping. В теме warm для .cb-buy стилей не было,
   поэтому поле количества и +/- рисовались нативной вёрсткой.
   =========================================================== */
.cb-buy { display: flex; flex-direction: column; gap: 14px; }
.cb-buy__actions { margin: 2px 0 0; }
.cb-buy .form-cart { margin: 0; }
.cb-buy .amount-cart-box { display: block; width: 100%; margin: 0; border-collapse: separate; }
.cb-buy .amount-cart-box tbody { display: block; width: 100%; }
.cb-buy .amount-cart-box tr { display: flex; align-items: stretch; gap: 10px; }
.cb-buy .amount-cart-box td { display: block; min-width: 0; padding: 0; }
.cb-buy .amount-cart-box td:first-child { flex: 0 0 auto; }
.cb-buy .amount-cart-box td:last-child { flex: 1 1 auto; }

.cb-buy .amount-box {
	display: inline-flex;
	align-items: stretch;
	height: 52px;
	overflow: hidden;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-md);
	background: #fff;
}
.cb-buy .qty-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: var(--panel-2);
	color: var(--sh-ink);
	font-family: var(--sh-head-font);
	font-size: 20px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	transition: background .15s ease, color .15s ease;
}
.cb-buy .qty-btn:hover { background: var(--sh-blue); color: #fff; }
.cb-buy .qty-btn:active { background: var(--brand-dark); color: #fff; }
.cb-buy .qty-btn:focus-visible { outline: 2px solid var(--sh-blue); outline-offset: -2px; }
.cb-buy .qty-minus { border-right: 1px solid var(--line); }
.cb-buy .qty-plus { border-left: 1px solid var(--line); }
.cb-buy .amount-box input.amount {
	width: 54px;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: #fff;
	box-shadow: none;
	font-family: var(--sh-head-font);
	font-size: 15px;
	font-weight: 600;
	color: var(--sh-ink);
	text-align: center;
	-moz-appearance: textfield;
}
.cb-buy .amount-box input.amount::-webkit-outer-spin-button,
.cb-buy .amount-box input.amount::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cb-buy .amount-box input.amount:focus { outline: none; box-shadow: inset 0 0 0 2px var(--brand-soft); }

.cb-buy button.to_shopping {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	height: 52px;
	margin: 0;
	padding: 0 18px;
	border: 0;
	border-radius: var(--r-md);
	background: var(--sh-blue);
	color: #fff;
	font-family: var(--sh-head-font);
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	transition: background .15s ease, box-shadow .15s ease;
}
.cb-buy button.to_shopping:hover { background: var(--brand-dark); box-shadow: 0 8px 18px rgba(17,48,79,.16); }
.cb-buy button.to_shopping:active { box-shadow: none; }
.cb-buy button.to_shopping:focus-visible { outline: 2px solid var(--sh-blue); outline-offset: 2px; }
.cb-buy button.to_shopping::before {
	content: "";
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: var(--sh-bag) center / contain no-repeat;
	mask: var(--sh-bag) center / contain no-repeat;
}

/* ===========================================================
   ПОДВАЛ (?v=20261114a9)
   Разметка в шаблонах страниц (БД): .footer-menu-area (3 колонки
   ссылок), .footer-area (копирайт) и .info-area (дисклеймер).
   Было: светло-серая заливка и мелкий текст на 13px.
   Стало: тёмно-синий подвал в тон шапке. Только CSS.
   Селекторы с div. -- как в css.css, чтобы перебить тему.
   =========================================================== */
div.footer-menu-area {
	padding: 44px 0 30px;
	background: var(--navy) !important;
	color: rgba(255,255,255,.72);
}
div.footer-menu-layer {
	max-width: 1320px;
	margin: 0 auto;
	padding-bottom: 26px;
	border-bottom: 1px solid rgba(255,255,255,.14);
}
div.footer-menu-layer div.footer-menu {
	display: block;
	font-family: var(--sh-head-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 26px;
	color: rgba(255,255,255,.72);
}
div.footer-menu-layer div.footer-menu span {
	display: block;
	margin-bottom: 10px;
	font-family: var(--sh-head-font);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}
div.footer-menu-layer div.footer-menu a {
	display: inline;
	font-family: var(--sh-head-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 26px;
	color: rgba(255,255,255,.72);
	text-decoration: none;
	transition: color .15s ease;
}
div.footer-menu-layer div.footer-menu a:hover { color: #fff; text-decoration: underline; }
div.footer-menu-layer div.footer-menu a.t { color: #fff; font-size: 15px; font-weight: 600; text-decoration: none; }
div.footer-menu-layer div.footer-menu a.t:hover { color: #fff; }
div.footer-menu-layer div.footer-menu img {
	vertical-align: middle;
	opacity: .85;
	transition: opacity .15s ease;
}
div.footer-menu-layer div.footer-menu img:hover { opacity: 1; }

div.footer-area {
	padding: 22px 0 26px;
	background: var(--navy) !important;
}
div.footer-layer { max-width: 1320px; margin: 0 auto; }
div.footer-layer div.footer {
	font-family: var(--sh-head-font);
	font-size: 13px;
	font-weight: 400;
	line-height: 21px;
	color: rgba(255,255,255,.72);
}
div.footer-layer div.footer a {
	color: rgba(255,255,255,.82) !important;
	text-decoration: none;
}
div.footer-layer div.footer a:hover { color: #fff !important; text-decoration: underline; }

div.info-area {
	padding: 18px 0 20px;
	background: #0a1d2e !important;
}
div.info-layer { max-width: 1320px; margin: 0 auto; }
div.info-layer div.info {
	font-family: var(--sh-head-font);
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: rgba(255,255,255,.55);
}

/* ===========================================================
   ГЛАВНАЯ: БЛОК «КАТАЛОГ ОБОРУДОВАНИЯ» (?v=20261114a7)
   .content-index — заголовок и вводный текст,
   .index-catalog — плитки разделов: фото, название, описание.
   Было: фото с float слева и красные ссылки в 14px.
   =========================================================== */
.content-index { padding: 10px 0 2px; }
.content-index h2 {
	margin: 0 0 14px;
	font-family: var(--sh-head-font);
	font-size: 30px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--sh-ink);
}
.content-index h2::after {
	content: "";
	display: block;
	width: 56px;
	height: 3px;
	margin-top: 12px;
	border-radius: 2px;
	background: var(--sh-blue);
}
.content-index p {
	max-width: 1000px;
	margin: 0 0 10px;
	font-family: var(--sh-head-font);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--muted);
}

.index-catalog-layer { max-width: 1320px; padding: 28px 0 44px; }
.index-catalog-layer .row.horizontal-align { display: flex; flex-wrap: wrap; }
/* три плитки в ряд на широком экране: 9 разделов ровно заполняют сетку 3x3 */
@media (min-width: 1200px) {
	.index-catalog-layer .row.horizontal-align > .index-catalog {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}
	.index-catalog-layer .index-catalog { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; padding: 16px; }
	div.index-catalog-layer div.index-catalog img { width: 84px; height: 84px; }
}
.index-catalog-layer .index-catalog {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	align-items: start;
	gap: 18px;
	margin-bottom: 22px;
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: 14px;
	background: #fff;
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.index-catalog-layer .index-catalog:hover {
	border-color: var(--brand-light);
	box-shadow: 0 14px 30px rgba(17,48,79,.10);
	transform: translateY(-2px);
}
.index-catalog-layer .index-catalog > a {
	display: block;
	line-height: 0;
}
div.index-catalog-layer div.index-catalog img {
	float: none;
	display: block;
	width: 96px;
	height: 96px;
	padding: 0;
	border-radius: 12px;
	background: var(--panel-2);
	object-fit: cover;
}
div.index-catalog-layer div.index-catalog p {
	display: block;
	margin: 0;
	font-family: var(--sh-head-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--muted);
}
div.index-catalog-layer div.index-catalog p a {
	display: block;
	margin-bottom: 6px;
	font-family: var(--sh-head-font);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--sh-ink);
	text-decoration: none;
	transition: color .15s ease;
}
div.index-catalog-layer div.index-catalog p a:hover { color: var(--sh-blue); }

@media (max-width: 767.98px) {
	.content-index h2 { font-size: 24px; }
	.content-index p { font-size: 14px; }
	.index-catalog-layer { padding: 20px 0 30px; }
	.index-catalog-layer .index-catalog { grid-template-columns: 72px minmax(0, 1fr); gap: 14px; margin-bottom: 14px; padding: 14px; }
	div.index-catalog-layer div.index-catalog img { width: 72px; height: 72px; }
	div.index-catalog-layer div.index-catalog p a { font-size: 15px; }
	.footer-menu-area { padding: 30px 0 22px; }
	.footer-menu-layer div.footer-menu { margin-bottom: 14px; }
}