/* ============================================================
   COS Woo Theme — каталог (archive) 1:1 с дизайном Catalog.jsx.
   Накладывает вид дизайна (.cat-*/.filters/.facet/.opt/.cat-grid)
   на РЕАЛЬНУЮ разметку нашего модуля Filter (.wpaic-filter__*).
   Данные/URL не меняем — только визуал.
   ============================================================ */

/* ---------------- ШАПКА КАТЕГОРИИ ---------------- */
.mk .cat-crumbs { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 30px 0 0; font-size: 13px; color: var(--neutral-500); }
.mk .cat-crumbs a { color: var(--neutral-500); transition: color 120ms; }
.mk .cat-crumbs a:hover { color: var(--cyan-700); }
/* Разделитель крошек — красивая вертикальная линия «|» (эталон handoff-4:
   .cat-crumbs .sep { width:1px; height:12px; background:var(--neutral-300) }). */
.mk .cat-crumbs .sep { width: 1px; height: 12px; background: var(--neutral-300); border-radius: 1px; align-self: center; flex: 0 0 auto; font-size: 0; line-height: 0; }
.mk .cat-crumbs .cur { color: var(--masla-navy); font-weight: 500; }

.mk .woocommerce-products-header,
.mk .cat-head { padding: 16px 0 14px; }
.mk .woocommerce-products-header__title,
.mk .cat-head h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 2.2vw, 34px); letter-spacing: -0.022em; color: var(--masla-navy); margin: 0; }
.mk .cat-head .intro,
.mk .woocommerce-products-header .term-description { margin-top: 12px; font-size: 14.5px; color: var(--neutral-500); line-height: 1.55; max-width: 920px; }

/* the7-core рендерит заголовок архива как .page-title + .term-description —
   стилизуем под дизайн .cat-head (пока the7 активен; после #18 — наш head). */
.mk.cwt-catalog .page-title { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 2.2vw, 34px); letter-spacing: -0.022em; color: var(--masla-navy); margin: 14px 0 2px; line-height: 1.12; }
.mk.cwt-catalog .term-description { font-size: 14.5px; color: var(--neutral-500); line-height: 1.55; max-width: 920px; margin: 8px 0 4px; }
.mk.cwt-catalog .term-description p { margin: 0 0 8px; }
.mk.cwt-catalog .term-description > :last-child { margin-bottom: 0; }

/* подкатегории-чипы — сгруппированы в один блок: лид-подпись с иконкой + чипы */
.mk .cat-subcats { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: var(--soft); border: var(--hairline); border-radius: var(--r-md); padding: 11px 15px; margin: 4px 0 22px; }
.mk .cat-subcats-lead { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--neutral-500); }
.mk .cat-subcats-lead svg { width: 15px; height: 15px; color: var(--cyan); }
.mk .cat-subcats-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mk .cat-subcat { display: inline-flex; align-items: center; gap: 8px; border: var(--hairline); border-radius: var(--r-pill); background: #fff; padding: 4px 8px 4px 16px; font-size: 14px; font-weight: 500; color: var(--masla-navy); transition: border-color 150ms, box-shadow 150ms, transform 120ms, color 150ms; text-decoration: none; }
.mk .cat-subcat:hover { border-color: transparent; box-shadow: var(--el-2); transform: translateY(-1px); color: var(--cyan-700); }
.mk .cat-subcat .n { font-size: 12px; color: var(--neutral-400); font-variant-numeric: tabular-nums; background: var(--soft); border-radius: var(--r-pill); padding: 3px 8px; }

/* «Похожие разделы» переиспользует .cat-subcat без группового бокса — оставляем как список */
.mk .cat-related__list.cat-subcats { background: none; border: 0; padding: 0; gap: 8px; }
.mk .cat-related__list .cat-subcats-lead { display: none; }

/* «Похожие разделы» — анкорная перелинковка внизу посадочной (#1251) */
.mk .cat-related { margin: 32px 0 4px; padding-top: 24px; border-top: var(--hairline); }
.mk .cat-related__h { font-size: 19px; font-weight: 700; color: var(--masla-navy); margin: 0 0 14px; }
.mk .cat-related__list { margin: 0; }
.mk .cat-related .cat-subcat--up { background: #f6f8fa; font-weight: 600; }

/* ---------------- ТУЛБАР СОРТИРОВКИ (над гридом) ---------------- */
.mk .ms-catalog .cat-toolbar { display: flex; align-items: center; gap: 14px; margin: 2px 0 16px; }
.mk .ms-catalog .cat-toolbar .spacer { flex: 1 1 auto; }
.mk .ms-catalog .cat-sort { display: inline-flex; align-items: center; gap: 9px; margin: 0; }
.mk .ms-catalog .cat-sort__lbl { font-size: 13.5px; color: var(--neutral-500); white-space: nowrap; }
.mk .ms-catalog .cat-sort__sel { position: relative; display: inline-flex; align-items: center; }
.mk .ms-catalog .cat-sort__sel select.orderby { appearance: none; -webkit-appearance: none; -moz-appearance: none; border: var(--hairline); background: #fff; border-radius: var(--r-md); height: 42px; padding: 0 40px 0 15px; font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--masla-navy); cursor: pointer; transition: border-color 150ms, box-shadow 150ms; }
.mk .ms-catalog .cat-sort__sel select.orderby:hover { border-color: var(--cyan); }
.mk .ms-catalog .cat-sort__sel select.orderby:focus { outline: none; border-color: var(--cyan); box-shadow: var(--ring); }
.mk .ms-catalog .cat-sort__sel svg { position: absolute; right: 13px; pointer-events: none; color: var(--neutral-400); }
@media (max-width: 600px) {
  .mk .ms-catalog .cat-sort { flex: 1 1 auto; gap: 8px; }
  .mk .ms-catalog .cat-sort__sel { flex: 1 1 auto; }
  .mk .ms-catalog .cat-sort__sel select.orderby { width: 100%; }
  .mk .ms-catalog .cat-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--ms-flow-3, 12px); margin-bottom: 12px; }
  .mk .ms-catalog .cat-toolbar .spacer { display: none; }
  .mk .ms-catalog .cat-toolbar .found { grid-column: 1; grid-row: 1; }
  .mk .ms-catalog .cat-toolbar .view-toggle { grid-column: 2; grid-row: 1; }
  .mk .ms-catalog .cat-toolbar .cat-sort { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
  .mk .ms-catalog .cat-sort__sel { min-width: 0; }
}

/* ---------------- ЛЕЙАУТ (сайдбар + грид) ---------------- */
.mk .wpaic-filter-layout { display: grid; grid-template-columns: 280px 1fr; gap: 28px; align-items: start; padding-bottom: 24px; }
/* Sticky-сайдбар с СОБСТВЕННЫМ внутренним скроллом: длинный список фасетов
   прокручивается при наведении сразу (эталон handoff-4 .filters), а не «залипает»
   недоступной нижней частью, пока не докрутишь страницу до конца. */
.mk .wpaic-filter-sidebar { position: sticky; top: 96px; max-height: calc(100vh - 112px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; background: transparent; border: 0; padding: 0; }
.mk .wpaic-filter-sidebar::-webkit-scrollbar { width: 0; height: 0; }
.mk .wpaic-filter-sidebar .wpaic-filter__facets { display: flex; flex-direction: column; }

/* ---------------- ФАСЕТЫ → .facet/.opt ---------------- */
.mk .wpaic-filter__section { border: 0; border-top: var(--hairline); padding: 16px 2px; margin: 0; background: transparent; }
.mk .wpaic-filter__facets > .wpaic-filter__section:first-child { border-top: 0; }
.mk .wpaic-filter__section-title { font-family: var(--font-body); font-size: 14px; font-weight: 700; color: var(--masla-navy); margin: 0 0 12px; padding: 0; letter-spacing: 0; line-height: 1.3; }
/* Длинные списки сворачиваются кнопкой «Ещё N» (navigation.js блок 8), а не скроллом. */
.mk .wpaic-filter__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.mk .wpaic-filter__item { margin: 0; padding: 0; list-style: none; }

/* чип-чекбокс → .opt с квадратом */
.mk .wpaic-filter__chip { display: flex; align-items: center; gap: 10px; padding: 7px 6px; border-radius: var(--r-sm); cursor: pointer; font-size: 14px; color: var(--masla-navy); transition: background 120ms; border: 0; background: transparent; width: 100%; box-sizing: border-box; text-align: left; }
.mk .wpaic-filter__chip:hover { background: var(--soft); }
.mk .wpaic-filter__chip::before { content: ""; width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid var(--border-strong); flex-shrink: 0; transition: background-color 120ms, border-color 120ms; background-repeat: no-repeat; background-position: center; }
.mk .wpaic-filter__chip--active::before { background-color: var(--cyan); border-color: var(--cyan); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
.mk .wpaic-filter__count { margin-left: auto; font-size: 12px; color: var(--neutral-400); font-variant-numeric: tabular-nums; }

/* текущая категория «заблокирована» как префильтр — в дизайне это крошки/заголовок, не фасет */
.mk .wpaic-filter__chip--locked,
.mk .wpaic-filter__section--prefilter { display: none !important; }

/* radio-фасеты */
.mk .wpaic-filter__radio-item { display: flex; align-items: center; gap: 10px; padding: 7px 6px; border-radius: var(--r-sm); cursor: pointer; font-size: 14px; color: var(--masla-navy); transition: background 120ms; }
.mk .wpaic-filter__radio-item:hover { background: var(--soft); }
.mk .wpaic-filter__radio-circle { width: 18px; height: 18px; border-radius: 999px; border: 1.5px solid var(--border-strong); flex-shrink: 0; transition: border 120ms; }
.mk .wpaic-filter__radio-circle.is-checked { border: 5px solid var(--cyan); }
.mk .wpaic-filter__radio-item .wpaic-filter__count { margin-left: auto; }

/* свотчи */
.mk .wpaic-swatch-item { border-radius: var(--r-sm); }
.mk .wpaic-swatch-item--active { outline: 2px solid var(--cyan); outline-offset: 1px; }

/* цена / слайдер */
.mk .wpaic-filter__price-inputs, .mk .wpaic-filter__slider-inputs { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.mk .wpaic-filter__price-min, .mk .wpaic-filter__price-max,
.mk .wpaic-filter__slider-min, .mk .wpaic-filter__slider-max { flex: 1; min-width: 0; box-sizing: border-box; border: var(--hairline); border-radius: var(--r-sm); padding: 9px 10px; font-family: var(--font-mono); font-size: 13px; color: var(--masla-navy); outline: none; background: #fff; }
.mk .wpaic-filter__price-min:focus, .mk .wpaic-filter__price-max:focus { border-color: var(--cyan); }
.mk .wpaic-filter__price-sep, .mk .wpaic-filter__slider-sep { color: var(--neutral-300); }
.mk .wpaic-filter__price-apply, .mk .wpaic-filter__slider-apply { background: var(--cyan); color: #fff; border: 0; border-radius: var(--r-sm); padding: 9px 14px; font-family: var(--font-body); font-weight: 600; font-size: 13px; cursor: pointer; transition: background 120ms; }
.mk .wpaic-filter__price-apply:hover, .mk .wpaic-filter__slider-apply:hover { background: var(--cyan-700); }

/* reset */
.mk .wpaic-filter__reset { font-size: 13px; color: var(--neutral-400); background: transparent; border: 0; cursor: pointer; transition: color 120ms; }
.mk .wpaic-filter__reset:hover { color: var(--danger); }

/* «показать ещё значений» внутри фасета */
.mk .wpaic-filter__show-more, .mk .wpaic-filter__more { font-size: 13px; font-weight: 600; color: var(--cyan-700); background: transparent; border: 0; cursor: pointer; padding: 6px 6px 2px; }

/* ---------------- ГРИД → .cat-grid (3 колонки, как в дизайне) ---------------- */
.mk.cwt-catalog .wpaic-filter__grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; min-width: 0; }
.mk .wpaic-filter__grid .pc { height: 100%; }

/* загрузчик / пагинация / активные чипы */
.mk .wpaic-filter__loader { display: flex; justify-content: center; padding: 40px 0; }
.mk .wpaic-filter__spinner { width: 32px; height: 32px; border: 3px solid var(--soft-2); border-top-color: var(--cyan); border-radius: 999px; animation: cwt-spin 0.7s linear infinite; }
@keyframes cwt-spin { to { transform: rotate(360deg); } }
.mk .wpaic-filter__pagination { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 32px 0; }
.mk .wpaic-filter__pagination .wpaic-filter__load-more,
.mk .wpaic-filter__pagination button { display: inline-flex; align-items: center; gap: 8px; background: #fff; color: var(--masla-navy); border: var(--hairline-strong); border-radius: var(--r-sm); padding: 14px 28px; font-family: var(--font-body); font-weight: 600; font-size: 15px; cursor: pointer; transition: border-color 120ms, color 120ms; }
.mk .wpaic-filter__pagination button:hover { border-color: var(--cyan); color: var(--cyan-700); }
/* «Показать ещё» с линией прогресса (дизайн v22 .cat-more) */
.mk .wpaic-filter__pagination .cat-more { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; }
.mk .wpaic-load-more-btn { display: inline-flex; align-items: center; gap: 8px; }
.mk .wpaic-load-more-btn.is-loading { opacity: 0.7; pointer-events: none; }
.mk .cat-more-bar { width: 240px; max-width: 100%; height: 4px; background: var(--soft-2); border-radius: 999px; overflow: hidden; }
.mk .cat-more-bar i { display: block; height: 100%; background: var(--cyan); border-radius: 999px; transition: width 240ms var(--ease-out); }
.mk .cat-more-lbl { font-size: 13px; color: var(--neutral-500); }
/* активные фильтры над гридом (дизайн v22 .active-chips/.achip) */
.mk .wpaic-filter__active-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.mk .wpaic-filter__active-chip, .mk .wpaic-filter__chip-active { display: inline-flex; align-items: center; gap: 7px; background: var(--cyan-50); color: var(--cyan-900); border: 0; border-radius: var(--r-pill); padding: 6px 8px 6px 13px; font-size: 13px; font-weight: 600; }
.mk .wpaic-filter__active-remove { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; padding: 0; background: transparent; border: 0; color: var(--cyan-700); font-size: 16px; line-height: 1; cursor: pointer; transition: color 120ms; }
.mk .wpaic-filter__active-remove:hover { color: var(--danger); }
.mk .wpaic-filter__active-clear { background: transparent; border: 0; cursor: pointer; font-size: 13px; color: var(--neutral-400); padding: 6px 8px; transition: color 120ms; }
.mk .wpaic-filter__active-clear:hover { color: var(--danger); }

/* SEO/help блок (рендерит тема) */
.mk .cat-help { background: var(--soft); border-radius: var(--r-lg); padding: 32px 36px; margin: 24px 0 8px; display: grid; grid-template-columns: 1fr 300px; gap: 36px; align-items: center; }
.mk .cat-help h3 { font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: -0.015em; color: var(--masla-navy); margin: 0 0 10px; }
.mk .cat-help p { font-size: 14px; color: var(--neutral-500); line-height: 1.6; margin: 0; }
.mk .cat-help .acts { display: flex; flex-direction: column; gap: 10px; }

/* help / SEO-проза / перелинковка — в колонку контента (правее сайдбара), а НЕ во всю
   ширину под сайдбаром (дизайн v22: эти блоки внутри .cat-main). Сайдбар sticky идёт
   вдоль всей колонки контента до низа. Офсет = ширина сайдбара (280) + gap (28). */
.mk .ms-catalog > .cat-help,
.mk .ms-catalog > .cat-seo-prose,
.mk .ms-catalog > .cat-related { margin-left: calc(280px + 28px); }

@media (max-width: 1100px) {
	.mk .wpaic-filter-layout { grid-template-columns: 1fr; }
	.mk .wpaic-filter-sidebar { position: static; }
	.mk.cwt-catalog .wpaic-filter__grid { grid-template-columns: repeat(2, 1fr) !important; }
	.mk .cat-help { grid-template-columns: 1fr; }
	.mk .ms-catalog > .cat-help,
	.mk .ms-catalog > .cat-seo-prose,
	.mk .ms-catalog > .cat-related { margin-left: 0; }
}
@media (max-width: 480px) {
	/* телефон — 1 товар в строку (2×.pc слишком тесно на 360–390px) */
	.mk.cwt-catalog .wpaic-filter__grid { grid-template-columns: 1fr !important; gap: 10px !important; }
}

/* ============================================================
   БЛОК masla/catalog — страница категории на посадочной (.ms-catalog)
   Тот же мост (.wpaic-filter__*), но контекст — страница, не WC-архив.
   ============================================================ */
/* Блоки каталога сами рендерят шапку (крошки + h1) — прячем дублирующий
   заголовок страницы из page.php, когда на странице есть наш блок. */
.cwt-main:has(.ms-catalog) .cwt-entry-header,
.cwt-page:has(.ms-cathub) .cwt-entry-header { display: none; }

/* Контейнер каталожных блоков. На блочной посадочной page.php отдаёт
   полноширинный .cwt-main--blocks (нужен hero/closing для fullwidth-фонов),
   но у .ms-catalog/.ms-cathub своего констрейнящего контейнера нет — без него
   крошки/H1/грид прилипают к краям вьюпорта (регрессия от полноширинного
   шаблона). Возвращаем сетку шапки .wrap (1480 / pad 40), чтобы контент встал
   ровно под навигацию. */
.mk .cwt-main--blocks .ms-catalog,
.mk .cwt-main--blocks .ms-cathub {
	max-width: 1480px;
	margin-inline: auto;
	padding-inline: 40px;
}
@media (max-width: 1024px) {
	.mk .cwt-main--blocks .ms-catalog,
	.mk .cwt-main--blocks .ms-cathub { padding-inline: 24px; }
}
@media (max-width: 480px) {
	.mk .cwt-main--blocks .ms-catalog,
	.mk .cwt-main--blocks .ms-cathub { padding-inline: 16px; }
}

.mk .cat-head .row,
.mk .hub-head .row { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.mk .cat-head .row .cnt { font-size: 15px; color: var(--neutral-500); }

/* грид блока каталога — 3 колонки как в дизайне (на странице нет body.cwt-catalog) */
.mk .ms-catalog .wpaic-filter__grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; min-width: 0; }
.mk .ms-catalog .wpaic-filter__grid .pc { height: 100%; }
.mk .ms-catalog__filter { min-width: 0; }

@media (max-width: 1100px) {
	.mk .ms-catalog .wpaic-filter__grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
	/* телефон — 1 колонка (2×.pc не влезают в 390px → горизонтальный скролл) */
	.mk .ms-catalog .wpaic-filter-grid,
	.mk .ms-catalog .wpaic-filter__grid,
	.mk .ms-cathub .pgrid { grid-template-columns: 1fr !important; gap: 10px !important; }
}
/* безопасность от переполнения контейнеров фильтра на узких экранах */
.mk .ms-catalog .wpaic-filter-grid,
.mk .ms-catalog .wpaic-filter__grid,
.mk .ms-catalog__filter { min-width: 0; max-width: 100%; }

/* ============================================================
   БЛОК masla/catalog-hub — витрина (хаб). Порт catalog-hub.css.
   ============================================================ */
.mk .ms-cathub { padding-bottom: 8px; }
.mk .ms-cathub .hub-head { padding: 22px 0 6px; }
.mk .ms-cathub .hub-head h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(28px, 2.6vw, 38px); letter-spacing: -0.024em; color: var(--masla-navy); margin: 0; line-height: 1.08; }
.mk .ms-cathub .hub-head .cnt { font-size: 15px; color: var(--neutral-500); }
.mk .ms-cathub .hub-head .cnt b { color: var(--cyan-700); font-weight: 700; }

/* крупные карточки разделов */
/* image-led карточки разделов (дизайн handoff catalog-hub.css): full-bleed
   cover-иллюстрация + пер-категорийный --cat (glow/иконка/бар/чипы/стрелка). */
.mk .ms-cathub .bigcats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; padding: 26px 0 8px; }
.mk .ms-cathub .bigcat { --cat: var(--cyan); position: relative; display: flex; flex-direction: column; background: #fff; border: var(--hairline); border-radius: 18px; overflow: hidden; transition: box-shadow 260ms var(--ease-out), transform 220ms var(--ease-out), border-color 220ms; }
.mk .ms-cathub .bigcat:hover { box-shadow: 0 9px 24px -14px rgba(19,22,29,0.22), var(--el-2); transform: translateY(-5px); border-color: var(--border-default); }

/* медиа: cover-картинка на всю площадь */
.mk .ms-cathub .bigcat-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; display: block; isolation: isolate; background: linear-gradient(168deg, #FBFCFD 0%, #EDF2F6 100%); }
.mk .ms-cathub .bigcat-media .bigcat-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 600ms var(--ease-out); }
.mk .ms-cathub .bigcat:hover .bigcat-media .bigcat-img { transform: scale(1.06); }
/* фолбэк-фото товара, когда нет иллюстрации — тоже full-bleed cover */
.mk .ms-cathub .bigcat-media .bigcat-photo { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; object-position: center; margin: 0; filter: none; transition: transform 600ms var(--ease-out); }
.mk .ms-cathub .bigcat:hover .bigcat-media .bigcat-photo { transform: scale(1.06); }
.mk .ms-cathub .bigcat-media .watermark { display: none; }

/* угловой glow цвета раздела */
.mk .ms-cathub .bigcat-glow { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(120% 95% at 82% 12%, color-mix(in oklab, var(--cat) 26%, transparent), transparent 58%); mix-blend-mode: multiply; opacity: 0.6; transition: opacity 260ms; }
.mk .ms-cathub .bigcat:hover .bigcat-glow { opacity: 0.95; }

/* блик-проход на ховере */
.mk .ms-cathub .bigcat-sheen { position: absolute; top: 0; bottom: 0; left: 0; width: 55%; z-index: 2; pointer-events: none; background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.55) 50%, transparent 100%); transform: translateX(-170%) skewX(-16deg); }
.mk .ms-cathub .bigcat:hover .bigcat-sheen { animation: cwtBigcatSheen 900ms var(--ease-out) 120ms; }

/* чип-счётчик — виден всегда */
.mk .ms-cathub .bigcat-media .hint { position: absolute; top: 13px; right: 12px; z-index: 3; font-size: 11.5px; font-weight: 700; color: var(--masla-navy); background: rgba(255,255,255,0.82); backdrop-filter: blur(6px); padding: 4px 9px; border-radius: var(--r-pill); box-shadow: 0 2px 8px rgba(19,22,29,0.08); opacity: 1; }

.mk .ms-cathub .bigcat-body { position: relative; padding: 16px 16px 18px; display: flex; flex-direction: column; flex: 1; }
.mk .ms-cathub .bigcat-bar { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--cat); transform: scaleX(0); transform-origin: left; transition: transform 320ms var(--ease-out); }
.mk .ms-cathub .bigcat:hover .bigcat-bar { transform: scaleX(1); }
.mk .ms-cathub .bigcat-head { display: flex; align-items: center; gap: 10px; }
.mk .ms-cathub .bigcat-link { min-width: 0; }
.mk .ms-cathub .bigcat-head .nm { font-family: var(--font-display); font-weight: 800; font-size: clamp(16px, 1.25vw, 19px); letter-spacing: -0.018em; color: var(--masla-navy); line-height: 1.15; }
.mk .ms-cathub .bigcat-meta { font-size: 12.5px; color: var(--neutral-500); margin-top: 5px; }
.mk .ms-cathub .bigcat-meta b { color: var(--masla-navy); font-weight: 700; }
.mk .ms-cathub .bigcat-head .go { margin-left: auto; flex-shrink: 0; width: 36px; height: 36px; border-radius: var(--r-pill); background: var(--soft); color: var(--masla-navy); display: flex; align-items: center; justify-content: center; transition: background 200ms var(--ease-out), color 200ms; }
.mk .ms-cathub .bigcat:hover .bigcat-head .go { background: var(--cat); color: #fff; }
.mk .ms-cathub .bigcat-subs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.mk .ms-cathub .bigcat-subs a, .mk .ms-cathub .bigcat-subs span { font-size: 12px; font-weight: 500; color: var(--neutral-700); background: transparent; border: 1px solid var(--border-default); border-radius: var(--r-pill); padding: 4px 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; transition: border-color 160ms, color 160ms; }
.mk .ms-cathub .bigcat-subs a:not(.more):hover, .mk .ms-cathub .bigcat-subs span:hover { border-style: dashed; border-color: var(--cat); color: var(--masla-navy); }
.mk .ms-cathub .bigcat:hover .bigcat-subs a, .mk .ms-cathub .bigcat:hover .bigcat-subs span { color: var(--masla-navy); }
.mk .ms-cathub .bigcat-subs a.more { background: transparent; border-color: transparent; color: var(--cat); font-weight: 600; padding-left: 4px; }

@keyframes cwtBigcatSheen { from { transform: translateX(-170%) skewX(-16deg); } to { transform: translateX(260%) skewX(-16deg); } }

/* второй ряд — все остальные (нишевые) разделы каталога меньшими блоками */
.mk .ms-cathub .hub-more-head { padding: 34px 0 4px; }
.mk .ms-cathub .hub-more-head h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(20px, 1.9vw, 26px); letter-spacing: -0.018em; color: var(--masla-navy); margin: 0; line-height: 1.1; }
.mk .ms-cathub .smallcats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 16px 0 8px; }
.mk .ms-cathub .smallcat { display: flex; align-items: center; gap: 12px; background: #fff; border: var(--hairline); border-radius: var(--r-md); padding: 14px 16px; transition: box-shadow 160ms var(--ease-out), transform 140ms, border-color 160ms; }
.mk .ms-cathub .smallcat:hover { box-shadow: var(--el-2); transform: translateY(-2px); border-color: transparent; }
.mk .ms-cathub .smallcat-thumb { flex-shrink: 0; width: 58px; height: 58px; border-radius: var(--r-sm); overflow: hidden; background: #E4F0F6; }
.mk .ms-cathub .smallcat-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 420ms var(--ease-out); }
.mk .ms-cathub .smallcat:hover .smallcat-thumb img { transform: scale(1.08); }
.mk .ms-cathub .smallcat-tx { min-width: 0; display: flex; flex-direction: column; }
.mk .ms-cathub .smallcat-tx .nm { font-weight: 700; font-size: 14.5px; letter-spacing: -0.01em; color: var(--masla-navy); line-height: 1.2; }
.mk .ms-cathub .smallcat-tx .ct { font-size: 12px; color: var(--neutral-500); margin-top: 2px; }
.mk .ms-cathub .smallcat-go { margin-left: auto; flex-shrink: 0; color: var(--neutral-300); transition: transform 150ms, color 150ms; }
.mk .ms-cathub .smallcat:hover .smallcat-go { color: var(--cyan); transform: translateX(2px); }
@media (max-width: 1024px) { .mk .ms-cathub .smallcats { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .mk .ms-cathub .smallcats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .mk .ms-cathub .smallcats { grid-template-columns: 1fr; } }

/* секция хаба */
.mk .ms-cathub .hub-sec { padding-top: 44px; }
.mk .ms-cathub .sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 18px; }
.mk .ms-cathub .sec-head .h-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan-700); }
.mk .ms-cathub .sec-head .t { font-family: var(--font-display); font-weight: 800; font-size: clamp(22px, 2vw, 27px); letter-spacing: -0.018em; color: var(--masla-navy); margin-top: 8px; }
.mk .ms-cathub .sec-head .s { font-size: 14px; color: var(--neutral-500); margin-top: 6px; max-width: 640px; line-height: 1.5; }
.mk .ms-cathub .sec-head .tlink { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--cyan-700); white-space: nowrap; }
.mk .ms-cathub .sec-head .tlink:hover { color: var(--cyan-900); }

/* плитки «по задаче» */
.mk .ms-cathub .hub-apps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mk .ms-cathub .app-tile { position: relative; overflow: hidden; border-radius: var(--r-md); padding: 22px; border: var(--hairline); background: #fff; min-height: 122px; display: flex; flex-direction: column; justify-content: space-between; transition: box-shadow 160ms, transform 160ms, border-color 160ms; }
.mk .ms-cathub .app-tile:hover { box-shadow: var(--el-3); transform: translateY(-2px); border-color: transparent; }
.mk .ms-cathub .app-tile .ico { width: 42px; height: 42px; border-radius: var(--r-sm); background: var(--soft); color: var(--masla-navy); display: flex; align-items: center; justify-content: center; transition: background 160ms, color 160ms; }
.mk .ms-cathub .app-tile:hover .ico { background: var(--cyan-50); color: var(--cyan-700); }
.mk .ms-cathub .app-tile .nm { font-family: var(--font-display); font-weight: 800; font-size: 17px; letter-spacing: -0.012em; color: var(--masla-navy); }
.mk .ms-cathub .app-tile .ct { font-size: 12.5px; color: var(--neutral-500); margin-top: 3px; }
.mk .ms-cathub .app-tile .go { position: absolute; top: 22px; right: 22px; color: var(--neutral-300); transition: transform 160ms, color 160ms; }
.mk .ms-cathub .app-tile:hover .go { color: var(--cyan); transform: translate(2px, -2px); }

/* «по применению» — группировка по типу техники (транспорт / оборудование) */
.mk .ms-cathub .hub-appgrp + .hub-appgrp { margin-top: 26px; }
.mk .ms-cathub .hub-appgrp-head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.mk .ms-cathub .hub-appgrp-head .t { font-family: var(--font-display); font-weight: 800; font-size: 16px; letter-spacing: -0.01em; color: var(--masla-navy); }
.mk .ms-cathub .hub-appgrp-head .tlink { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--cyan-700); white-space: nowrap; }
.mk .ms-cathub .hub-appgrp-head .tlink:hover { color: var(--cyan-900); }

/* бренды */
.mk .ms-cathub .brands { display: flex; flex-wrap: wrap; gap: 10px; }
.mk .ms-cathub .brand { display: inline-flex; align-items: center; border: var(--hairline); border-radius: var(--r-pill); background: #fff; padding: 10px 18px; font-size: 14px; font-weight: 600; color: var(--neutral-700); transition: border-color 150ms, box-shadow 150ms, color 150ms, transform 120ms; }
.mk .ms-cathub .brand:hover { border-color: transparent; box-shadow: var(--el-2); color: var(--masla-navy); transform: translateY(-1px); }

/* хиты каталога — грид .pc */
.mk .ms-cathub .pgrid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }

@media (max-width: 1300px) {
	.mk .ms-cathub .bigcats { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1100px) {
	.mk .ms-cathub .bigcats { grid-template-columns: repeat(3, 1fr); }
	.mk .ms-cathub .hub-apps { grid-template-columns: repeat(2, 1fr); }
	.mk .ms-cathub .pgrid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 760px) {
	.mk .ms-cathub .bigcats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
	.mk .ms-cathub .bigcats { grid-template-columns: 1fr; }
	/* «подбор по технике» — 2 плитки в строку на мобилке (по 1 = слишком пусто) */
	.mk .ms-cathub .hub-apps { grid-template-columns: repeat(2, 1fr); gap: 10px; }
	.mk .ms-cathub .app-tile { padding: 16px; min-height: 104px; }
	.mk .ms-cathub .app-tile .go { top: 16px; right: 16px; }
	.mk .ms-cathub .pgrid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

/* ============================================================
   v5 (хендофф rb64pwZ): фасеты-чекбоксы → бейджи-чипы (Catalog.jsx .fchip),
   сетка 4-в-ряд. Только CSS поверх разметки плагина (.wpaic-filter__*) —
   клики/тогглы по-прежнему обрабатывает product-filter.js плагина.
   ============================================================ */
.mk .wpaic-filter__list { flex-direction: row; flex-wrap: wrap; gap: 7px; max-height: none; overflow: visible; }
.mk .wpaic-filter__item { display: inline-flex; margin: 0; }
.mk .wpaic-filter__chip {
	gap: 7px; padding: 6px 7px 6px 12px; border-radius: var(--r-pill);
	border: 1.5px solid var(--border-default); background: #fff;
	font-size: 13px; font-weight: 500; line-height: 1; white-space: nowrap; width: auto;
}
.mk .wpaic-filter__chip::before { content: none !important; display: none !important; } /* убрать квадрат-чекбокс */
.mk .wpaic-filter__chip:hover { background: var(--cyan-50); border-color: var(--cyan); }
.mk .wpaic-filter__count {
	margin-left: 0; font-size: 11px; font-weight: 600; color: var(--neutral-500);
	background: var(--soft); border-radius: var(--r-pill); padding: 2px 7px; min-width: 9px; text-align: center;
}
.mk .wpaic-filter__chip--active { background: var(--cyan); border-color: var(--cyan); color: #fff; font-weight: 600; }
.mk .wpaic-filter__chip--active .wpaic-filter__count { background: rgba(255,255,255,0.24); color: #fff; }
.mk .wpaic-filter__show-more, .mk .wpaic-filter__more {
	display: inline-flex; align-items: center; gap: 6px;
	border: 1.5px dashed var(--border-strong); border-radius: var(--r-pill);
	padding: 6px 11px; color: var(--cyan-700); font-weight: 600;
}
.mk .wpaic-filter__show-more:hover, .mk .wpaic-filter__more:hover { border-style: solid; border-color: var(--cyan); background: var(--cyan-50); }

/* активные фильтры над гридом (плагин: .wpaic-filter__active-bar) */
.mk .wpaic-filter__active-bar { align-items: center; }
.mk .wpaic-filter__active-remove, .mk .wpaic-filter__chip-active { transition: color 120ms, background 120ms; }

/* сетка 4-в-ряд (сайдбар присутствует) */
.mk.cwt-catalog .wpaic-filter__grid,
.mk .ms-catalog .wpaic-filter__grid { grid-template-columns: repeat(4, 1fr) !important; }
@media (max-width: 1100px) {
	.mk.cwt-catalog .wpaic-filter__grid,
	.mk .ms-catalog .wpaic-filter__grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 600px) {
	/* телефон — 1 товар в строку (2×.pc слишком тесно на 360–390px).
	   Это действующий блок (v5, позже ранних правил), правим его. */
	.mk.cwt-catalog .wpaic-filter__grid,
	.mk .ms-catalog .wpaic-filter__grid { grid-template-columns: 1fr !important; }
}

/* ============================================================
   v5: переключатель видов листинга (.view-toggle) + 3 вида грида.
   CSS дизайна catalog.css 120-123 (toggle) 1:1. Виды реализованы на
   серверной .pc-разметке плагина через классы .ms-catalog--{view} —
   JS плагина (product-filter.js) НЕ трогаем.
   ============================================================ */
.mk .view-toggle { display: inline-flex; border: var(--hairline); border-radius: var(--r-sm); overflow: hidden; }
.mk .view-toggle .view-btn { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; color: var(--neutral-400); background: transparent; border: 0; cursor: pointer; transition: background 120ms, color 120ms; }
.mk .view-toggle .view-btn.on { background: var(--masla-ink); color: #fff; }
.mk .view-toggle .view-btn:not(.on):hover { background: var(--soft); color: var(--masla-navy); }

/* ---- ВИД: СПИСОК (.ms-catalog--list) — карточка .pc строкой (эталон v22 .lc) ---- */
.mk.ms-catalog--list .wpaic-filter__grid,
.mk .ms-catalog--list .wpaic-filter__grid { grid-template-columns: 1fr !important; gap: 12px !important; }
.mk.ms-catalog--list .wpaic-filter__grid .pc,
.mk .ms-catalog--list .wpaic-filter__grid .pc {
	display: grid; grid-template-columns: 120px minmax(0, 1fr) 240px;
	grid-template-rows: auto auto auto; gap: 4px 22px; align-items: center;
	border: var(--hairline); border-radius: var(--r-md); padding: 16px; min-width: 0;
}
.mk .ms-catalog--list .pc > *,
.mk .ms-catalog--table .pc > * { min-width: 0; max-width: 100%; }
.mk .ms-catalog--list .pc .pc-media { grid-column: 1; grid-row: 1 / -1; height: 110px; margin: 0; align-self: center; }
.mk .ms-catalog--list .pc .pc-media img { max-height: 100px; }
/* бейджи (наличие/опт-скидки) — НЕ на фото, а в правую колонку сверху (эталон .lc-badges) */
.mk .ms-catalog--list .pc > .badges { position: static; grid-column: 3; grid-row: 1; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; align-self: start; }
/* сравнить/избранное остаются поверх фото, непрозрачный вид (как .pc-media-acts-solid) */
.mk .ms-catalog--list .pc .pc-media-acts { top: 0; right: 0; }
.mk .ms-catalog--list .pc .pc-media-acts .pcm-act { background: #fff; border: var(--hairline-strong); -webkit-backdrop-filter: none; backdrop-filter: none; }
.mk .ms-catalog--list .pc .sku { grid-column: 2; grid-row: 1; margin: 0; align-self: end; }
.mk .ms-catalog--list .pc .nm { grid-column: 2; grid-row: 2; -webkit-line-clamp: 2; min-height: 0; margin: 0; align-self: start; }
.mk .ms-catalog--list .pc .meta-row { grid-column: 2; grid-row: 3; margin: 0; align-self: start; height: auto; }
.mk .ms-catalog--list .pc .price-block { grid-column: 3; grid-row: 2; align-self: center; text-align: right; margin: 0; }
.mk .ms-catalog--list .pc .price-row { justify-content: flex-end; flex-wrap: nowrap; white-space: nowrap; }
.mk .ms-catalog--list .pc .pc-acts.pc-acts-pri { grid-column: 3; grid-row: 3; align-self: end; width: 100%; }

/* ---- ВИД: ТАБЛИЦА (.ms-catalog--table) — компактные строки (эталон v22 .ptr) ---- */
.mk.ms-catalog--table .wpaic-filter__grid,
.mk .ms-catalog--table .wpaic-filter__grid {
	display: block !important; border: var(--hairline); border-radius: var(--r-md); overflow: clip; background: #fff; min-width: 0;
}
.mk .ms-catalog--table .wpaic-filter__grid .pc {
	position: relative; display: grid;
	grid-template-columns: 46px minmax(0, 1.5fr) minmax(0, 1.25fr) 116px 150px auto;
	grid-template-rows: auto auto; gap: 0 16px; align-items: center;
	padding: 9px 60px 9px 18px; border: 0; border-bottom: var(--hairline); border-radius: 0;
}
.mk .ms-catalog--table .wpaic-filter__grid .pc:last-child { border-bottom: 0; }
.mk .ms-catalog--table .wpaic-filter__grid .pc:hover { background: var(--soft); box-shadow: none; transform: none; }
.mk .ms-catalog--table .pc .pc-media { position: static; grid-column: 1; grid-row: 1 / -1; width: 44px; height: 48px; margin: 0; border: var(--hairline); border-radius: var(--r-sm); align-self: center; }
.mk .ms-catalog--table .pc .pc-media img { max-height: 40px; }
.mk .ms-catalog--table .pc .nm { grid-column: 2; grid-row: 1; -webkit-line-clamp: 1; min-height: 0; margin: 0; align-self: end; font-size: 14px; }
.mk .ms-catalog--table .pc .sku { grid-column: 2; grid-row: 2; margin: 0; align-self: start; }
.mk .ms-catalog--table .pc .meta-row { grid-column: 3; grid-row: 1 / -1; align-self: center; max-height: 46px; overflow: hidden; margin: 0; }
.mk .ms-catalog--table .pc > .badges { position: static; grid-column: 4; grid-row: 1 / -1; flex-direction: column; align-items: flex-start; gap: 4px; align-self: center; }
.mk .ms-catalog--table .pc .price-block { grid-column: 5; grid-row: 1 / -1; align-self: center; text-align: right; margin: 0; }
.mk .ms-catalog--table .pc .price-row { justify-content: flex-end; flex-wrap: nowrap; white-space: nowrap; }
.mk .ms-catalog--table .pc .price-row .price { font-size: 15px; white-space: nowrap; }
.mk .ms-catalog--table .pc .pc-acts.pc-acts-pri { grid-column: 6; grid-row: 1 / -1; align-self: center; width: auto; gap: 7px; }
.mk .ms-catalog--table .pc .pc-acts-pri .pc-cart-wide { padding: 0 11px; height: 36px; }
.mk .ms-catalog--table .pc .pc-acts-pri .pc-qview-pri, .mk .ms-catalog--table .pc .pc-acts-pri .pc-cmp2, .mk .ms-catalog--table .pc .pc-acts-pri .pc-fav2 { flex: 0 0 36px; height: 36px; }
/* сравнить/избранное — столбиком у правого края строки (в зарезервированном padding-right) */
.mk .ms-catalog--table .pc .pc-media-acts { top: 50%; right: 14px; transform: translateY(-50%); gap: 5px; }
.mk .ms-catalog--table .pc .pc-media-acts .pcm-act { width: 26px; height: 26px; background: #fff; border: var(--hairline-strong); -webkit-backdrop-filter: none; backdrop-filter: none; }

/* table head (визуальная шапка над строками) */
.mk .ms-catalog--table .ms-catalog__filter::before {
	content: "Наименование";
	display: none; /* опц.: можно включить через шапку, пока скрыто */
}

@media (max-width: 900px) {
	.mk .ms-catalog--list .wpaic-filter__grid .pc { grid-template-columns: 100px minmax(0, 1fr); }
	.mk .ms-catalog--list .pc > .badges { grid-column: 2; grid-row: 1; justify-content: flex-start; }
	.mk .ms-catalog--list .pc .sku { grid-column: 2; grid-row: 2; }
	.mk .ms-catalog--list .pc .nm { grid-column: 2; grid-row: 3; }
	.mk .ms-catalog--list .pc .meta-row { grid-column: 2; grid-row: 4; }
	.mk .ms-catalog--list .pc .price-block { grid-column: 1 / -1; grid-row: auto; text-align: left; }
	.mk .ms-catalog--list .pc .price-row { justify-content: flex-start; }
	.mk .ms-catalog--list .pc .pc-acts.pc-acts-pri { grid-column: 1 / -1; grid-row: auto; }

	.mk .ms-catalog--table .wpaic-filter__grid .pc { grid-template-columns: 48px minmax(0, 1fr); row-gap: 8px; padding-right: 18px; }
	.mk .ms-catalog--table .pc .meta-row,
	.mk .ms-catalog--table .pc > .badges,
	.mk .ms-catalog--table .pc .price-block,
	.mk .ms-catalog--table .pc .pc-acts.pc-acts-pri { grid-column: 1 / -1; grid-row: auto; text-align: left; align-self: start; }
	.mk .ms-catalog--table .pc .price-row { justify-content: flex-start; }
	.mk .ms-catalog--table .pc .pc-acts.pc-acts-pri { width: auto; justify-content: flex-start; }
	.mk .ms-catalog--table .pc .pc-media-acts { display: none; }
}

@media (max-width: 520px) {
	.mk .ms-catalog--list .wpaic-filter__grid .pc { grid-template-columns: 84px minmax(0, 1fr); gap: 6px 14px; padding: 14px; }
	.mk .ms-catalog--list .pc .pc-media { height: 92px; }
	.mk .ms-catalog--list .pc .pc-media img { max-height: 82px; }
	.mk .ms-catalog--list .pc .pc-acts.pc-acts-pri,
	.mk .ms-catalog--table .pc .pc-acts.pc-acts-pri { display: flex; flex-wrap: wrap; }
}

/* v5: «Ещё N» в фасетах фильтра (>10 позиций сворачиваются — navigation.js блок 8).
   Кнопка использует существующий стиль .wpaic-filter__more (пунктирный чип). */
.mk .wpaic-filter__item.cwt-facet-hidden { display: none !important; }
.mk .wpaic-filter__more[data-cwt-facet-more] { margin-top: 8px; display: inline-flex; align-items: center; gap: 6px; }

/* Авто-SEO-описание посадочной (#1373) — текстовый блок внизу страницы. */
.mk .cat-seo-prose { margin: 28px 0 4px; padding-top: 22px; border-top: var(--hairline); }
.mk .cat-seo-prose__h { font-size: 18px; font-weight: 700; color: var(--masla-navy); margin: 0 0 12px; }
.mk .cat-seo-prose p { font-size: 14.5px; line-height: 1.6; color: var(--neutral-600, #555e68); max-width: 920px; margin: 0 0 10px; }
.mk .cat-seo-prose p:last-child { margin-bottom: 0; }

/* ============================================================
   ГОРИЗОНТАЛЬНЫЙ ФИЛЬТР (.ms-catalog--hfilter) — handoff «умный фильтр»
   Сайдбар → выезжающая шторка «Все фильтры» (product-filter.js openMobile).
   В строке — sticky-бар с плашками-поповерами ключевых фасетов.
   ============================================================ */
/* грид на всю ширину (сайдбар-колонки нет) */
.mk .ms-catalog--hfilter .wpaic-filter-layout { grid-template-columns: 1fr; gap: 0; }
/* Горизонтальный фильтр (без сайдбара) — 5 в ряд (места больше, чем при сайдбаре). */
.mk .ms-catalog--hfilter:not(.ms-catalog--list):not(.ms-catalog--table) .wpaic-filter__grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
/* На экранах уже 1440 — 4 в ряд, чтобы карточки не теснились. */
@media (max-width: 1440px) {
	.mk .ms-catalog--hfilter:not(.ms-catalog--list):not(.ms-catalog--table) .wpaic-filter__grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
.mk .ms-catalog--hfilter > .cat-help,
.mk .ms-catalog--hfilter > .cat-seo-prose,
.mk .ms-catalog--hfilter > .cat-related { margin-left: 0 !important; }

/* строка-бар */
.mk .ms-catalog--hfilter .cat-filterbar {
	display: flex; align-items: center; gap: 10px; flex-wrap: nowrap;
	position: sticky; top: var(--cat-bar-top, 64px); z-index: 50;
	background: #fff; padding: 12px 0; margin: 0 0 14px;
	box-shadow: 0 1px 0 var(--border-default);
}
/* Плашки — в одну строку с горизонтальным скроллом (если не влезают), чтобы
   сортировка/вид (.fbar-end) оставались справа и НЕ наезжали на плашки.
   Своя дизайн-система скролла (не нативный скроллбар): скроллбар скрыт,
   края сигнализируют «есть ещё контент» soft-fade градиентом, а стрелки
   .fbar-scroll листают на ширину видимой области — появляются/пропадают
   через .more-l/.more-r (ставит JS updatePillsOverflow() в product-filter.js). */
.mk .cat-filterbar .fbar-pills-wrap { position: relative; flex: 1 1 auto; min-width: 0; }
.mk .cat-filterbar .fbar-pills-wrap::before,
.mk .cat-filterbar .fbar-pills-wrap::after {
	content: ""; position: absolute; top: 0; bottom: 0; width: 44px; z-index: 1;
	pointer-events: none; opacity: 0; transition: opacity 180ms var(--ease-out);
}
.mk .cat-filterbar .fbar-pills-wrap::before { left: 0; background: linear-gradient(90deg, #fff 28%, rgba(255,255,255,0)); }
.mk .cat-filterbar .fbar-pills-wrap::after { right: 0; background: linear-gradient(270deg, #fff 28%, rgba(255,255,255,0)); }
.mk .cat-filterbar .fbar-pills-wrap.more-l::before { opacity: 1; }
.mk .cat-filterbar .fbar-pills-wrap.more-r::after { opacity: 1; }
.mk .cat-filterbar .fbar-scroll {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
	border-radius: var(--r-pill); border: var(--hairline-strong); background: #fff; color: var(--cyan-700);
	box-shadow: var(--el-2); cursor: pointer; opacity: 0; pointer-events: none;
	transition: opacity 180ms var(--ease-out), border-color 150ms, background 150ms;
}
.mk .cat-filterbar .fbar-scroll svg { width: 15px; height: 15px; }
.mk .cat-filterbar .fbar-scroll.left { left: 0; }
.mk .cat-filterbar .fbar-scroll.right { right: 0; }
.mk .cat-filterbar .fbar-pills-wrap.more-l .fbar-scroll.left,
.mk .cat-filterbar .fbar-pills-wrap.more-r .fbar-scroll.right { opacity: 1; pointer-events: auto; }
.mk .cat-filterbar .fbar-scroll:hover { border-color: var(--cyan); background: var(--cyan-50); }
.mk .cat-filterbar .fbar-scroll:active { background: var(--cyan-100, var(--cyan-50)); }
.mk .cat-filterbar .fbar-pills { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-behavior: smooth; }
.mk .cat-filterbar .fbar-pills::-webkit-scrollbar { width: 0; height: 0; display: none; }
.mk .cat-filterbar .fbar-all { flex: 0 0 auto; }
.mk .cat-filterbar .fbar-all,
.mk .cat-filterbar .fpill {
	display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px;
	border-radius: var(--r-pill); border: var(--hairline); background: #fff; cursor: pointer;
	font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--masla-navy);
	white-space: nowrap; transition: border-color 140ms, box-shadow 140ms, background 140ms, color 140ms;
}
.mk .cat-filterbar .fbar-all { font-weight: 600; background: var(--soft); }
.mk .cat-filterbar .fbar-all:hover,
.mk .cat-filterbar .fpill:hover { border-color: transparent; box-shadow: var(--el-2); color: var(--cyan-700); }
.mk .cat-filterbar .fbar-all .cnt,
.mk .cat-filterbar .fpill .cnt {
	font-style: normal; font-size: 12px; font-weight: 700; color: #fff; background: var(--cyan);
	min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--r-pill);
	display: inline-flex; align-items: center; justify-content: center;
}
.mk .cat-filterbar .fbar-all .cnt[hidden] { display: none; }
.mk .cat-filterbar .fpill.on { border-color: var(--cyan); color: var(--cyan-700); background: var(--cyan-50); }
.mk .cat-filterbar .fpill svg { color: var(--neutral-400); transition: transform 180ms var(--ease-out), color 140ms; }
.mk .cat-filterbar .fpill-wrap.open .fpill svg { transform: rotate(180deg); color: var(--cyan); }

/* поповер плашки — position:fixed (НЕ absolute), координаты задаёт JS (positionPill).
   Причина: .fbar-pills скроллит плашки по X (overflow-x:auto), а это клипает потомков
   по ОБЕИМ осям — absolute-поповер обрезался. fixed выносит его из clip-контекста. */
.mk .cat-filterbar .fpill-wrap { position: relative; }
.mk .cat-filterbar .fpill-pop {
	position: fixed; top: 0; left: 0; right: auto; z-index: 120;
	width: max-content; min-width: 260px; max-width: 360px;
	background: #fff; border-radius: var(--r-md); border: var(--hairline);
	box-shadow: var(--el-3); padding: 14px;
}
.mk .cat-filterbar .fpill-pop[hidden] { display: none; }
.mk .cat-filterbar .fpill-pop-body { max-height: 320px; overflow-y: auto; overscroll-behavior: contain; }
.mk .cat-filterbar .fpill-pop .wpaic-filter__list { margin: 0; }

/* сайдбар → выезжающая шторка «Все фильтры» */
.mk .ms-catalog--hfilter .wpaic-filter-sidebar {
	position: fixed; top: 0; bottom: 0; left: 0; width: 360px; max-width: 88vw;
	height: 100dvh; max-height: 100dvh; margin: 0; padding: 64px 22px 24px; z-index: 160;
	background: #fff; box-shadow: var(--el-3); overflow-y: auto;
	transform: translateX(-100%); transition: transform 240ms var(--ease-out); visibility: hidden;
}
.mk .ms-catalog--flyout-right .wpaic-filter-sidebar { left: auto; right: 0; transform: translateX(100%); }
.mk .ms-catalog--hfilter .wpaic-filter-sidebar.wpaic-filter-sidebar--mobile-open { transform: translateX(0); visibility: visible; }
body.wpaic-filter-overlay-open { overflow: hidden; }

/* Бар: сортировка + переключатель вида справа, в ОДНОЙ строке с фильтром,
   без слова «Сортировка»; дублирующий .cat-toolbar прячем. */
.mk .cat-filterbar .fbar-end { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.mk .ms-catalog--hfilter > .cat-toolbar { display: none !important; }
.mk .cat-filterbar .cat-sort { margin: 0; }
.mk .cat-filterbar .cat-sort__lbl { display: none; }
.mk .cat-filterbar .cat-sort__sel select.orderby { height: 40px; border-radius: var(--r-pill); padding: 0 38px 0 16px; }
.mk .cat-filterbar .view-toggle { height: 40px; border-radius: var(--r-pill); overflow: hidden; }

/* Шторка «Все фильтры»: кликабельное затемнение (закрывает) + крестик */
.mk .wpaic-hfilter-scrim { position: fixed; inset: 0; background: rgba(19, 22, 29, 0.45); z-index: 155; opacity: 0; pointer-events: none; transition: opacity 200ms; }
.mk .wpaic-hfilter-scrim.show { opacity: 1; pointer-events: auto; }
.mk .ms-catalog--hfilter .wpaic-filter-sidebar .wpaic-hfilter-close { position: absolute; top: 14px; right: 16px; z-index: 2; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--r-pill); background: var(--soft); color: var(--neutral-500); border: 0; cursor: pointer; transition: background 140ms, color 140ms; }
.mk .ms-catalog--hfilter .wpaic-filter-sidebar .wpaic-hfilter-close:hover { background: var(--cyan-50); color: var(--cyan-700); }

@media (max-width: 1100px) {
	.mk .ms-catalog--hfilter:not(.ms-catalog--list):not(.ms-catalog--table) .wpaic-filter__grid { grid-template-columns: repeat(3, 1fr) !important; }
}
/* Ряд 3 (от 1100px) держится до планшета — на телефоне 3 карточки в ряд тесно.
   Недостающий хвост брейкпоинтов (дизайн v24): 2 в ряд, затем 1. */
@media (max-width: 680px) {
	.mk .ms-catalog--hfilter:not(.ms-catalog--list):not(.ms-catalog--table) .wpaic-filter__grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 440px) {
	.mk .ms-catalog--hfilter:not(.ms-catalog--list):not(.ms-catalog--table) .wpaic-filter__grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 600px) {
	.mk .ms-catalog--hfilter .wpaic-filter-sidebar { width: 100vw; max-width: 100vw; }
}

/* ============================================================
   SEO-ПОДВАЛ ПОСАДОЧНОЙ (handoff): редакционная статья (masla/text) +
   врезка «Коротко» (masla/glossary → .seo-facts) + FAQ (masla/faq).
   Подача — статья, не «свалка ссылок».
   ============================================================ */
.mk .ms-text .seo-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: var(--cyan-700); margin-bottom: 8px; }
.mk .ms-text h2 { font-family: var(--font-display); font-weight: 800; font-size: 25px; letter-spacing: -0.018em; color: var(--masla-navy); margin: 0 0 16px; line-height: 1.2; }
.mk .ms-text h3 { font-family: var(--font-display); font-weight: 700; font-size: 18.5px; letter-spacing: -0.01em; color: var(--masla-navy); margin: 28px 0 10px; }
.mk .ms-text p { font-size: 15px; line-height: 1.72; color: var(--neutral-700); margin: 0 0 12px; max-width: 820px; }
.mk .ms-text ul { list-style: none; margin: 4px 0 16px; padding: 0; display: flex; flex-direction: column; gap: 9px; max-width: 820px; }
.mk .ms-text ul li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.6; color: var(--neutral-700); }
.mk .ms-text ul li::before { content: ""; position: absolute; left: 2px; top: 9px; width: 7px; height: 7px; border-radius: 2px; background: var(--cyan); transform: rotate(45deg); }
.mk .ms-text ul li b, .mk .ms-text ul li strong { font-weight: 700; color: var(--masla-navy); }

/* «Коротко о разделе» (masla/glossary → .seo-facts) */
.mk .seo-facts { background: var(--soft); border-radius: var(--r-md); padding: 20px 22px; max-width: 360px; }
.mk .seo-facts__lbl { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--neutral-500); margin-bottom: 12px; }
.mk .seo-facts dl { margin: 0; display: flex; flex-direction: column; }
.mk .seo-facts__row { display: flex; flex-direction: column; gap: 2px; padding: 10px 0; border-top: var(--hairline); }
.mk .seo-facts__row:first-child { border-top: 0; padding-top: 0; }
.mk .seo-facts dt { font-size: 12px; color: var(--neutral-500); }
.mk .seo-facts dd { margin: 0; font-size: 14px; font-weight: 600; color: var(--masla-navy); line-height: 1.4; }
.mk .seo-facts__cta { display: inline-flex; align-items: center; gap: 7px; margin-top: 16px; font-size: 13.5px; font-weight: 600; color: var(--cyan-700); }
.mk .seo-facts__cta:hover { color: var(--cyan); }

/* ── SEO-подвал посадочной каталога: читаемая ЦЕНТРИРОВАННАЯ колонка ──
   Статья (masla/text) и FAQ (masla/faq) идут под листингом отдельными блоками.
   Без врезки «Коротко» статья прижималась влево с пустой дырой справа («колхоз») —
   центрируем в читаемую колонку и задаём единый редакционный ритм. */
.cwt-main:has(.ms-catalog) .ms-text { max-width: 900px; margin-left: auto; margin-right: auto; }
.cwt-main:has(.ms-catalog) .ms-text p,
.cwt-main:has(.ms-catalog) .ms-text ul { max-width: none; }
.cwt-main:has(.ms-catalog) .ms-faq { max-width: 900px; margin-left: auto; margin-right: auto; }
.cwt-main:has(.ms-catalog) .ms-section:has(.ms-text) { padding-top: 6px; }
/* Если на посадочной ЕСТЬ врезка «Коротко» (masla/glossary рядом со статьёй) —
   ставим их в 2 колонки как в дизайне .cat-seo (статья + aside). */
.cwt-main:has(.ms-catalog) .ms-section:has(.seo-facts) .ms-container { max-width: var(--container-max, 1280px); }
.cwt-main:has(.ms-catalog) .ms-section:has(.ms-text):has(.seo-facts) .ms-container { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: start; }
.cwt-main:has(.ms-catalog) .ms-section:has(.ms-text):has(.seo-facts) .ms-text { max-width: 760px; margin: 0; }

/* Empty catalog/search: a deliberate end state, not the default WP widget dump. */
.cwt-catalog-empty {
	display: grid;
	gap: var(--ms-flow-4, 16px);
	max-width: 780px;
	margin: clamp(48px, 8vw, 112px) auto;
	padding: clamp(32px, 6vw, 72px);
	border: 1px solid color-mix(in srgb, var(--ms-text, #181310) 14%, transparent);
	border-radius: var(--ms-radius-lg, 24px);
	background: color-mix(in srgb, var(--ms-surface, #fff) 88%, transparent);
	text-align: center;
}
.cwt-catalog-empty__eyebrow { color: var(--ms-accent, #7f263e); font-size: var(--ms-text-xs, 12px); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cwt-catalog-empty h2, .cwt-catalog-empty p { margin: 0; }
.cwt-catalog-empty h2 { font-family: var(--ms-font-display, serif); font-size: clamp(32px, 5vw, 64px); font-weight: 500; line-height: .98; }
.cwt-catalog-empty p { max-width: 620px; margin-inline: auto; color: var(--ms-muted, #6c655f); font-size: var(--ms-text-md, 16px); line-height: 1.6; }
.cwt-catalog-empty__actions, .cwt-catalog-empty .cwt-search-form { display: flex; justify-content: center; gap: var(--ms-flow-3, 12px); }
.cwt-catalog-empty .cwt-search-form { flex: 1 1 420px; }
.cwt-catalog-empty .cwt-search-form__field { min-width: 0; flex: 1; }

@media (max-width: 640px) {
	.cwt-catalog-empty { margin: var(--ms-flow-6, 32px) 0; padding: var(--ms-flow-6, 32px) var(--ms-flow-4, 16px); }
	.cwt-catalog-empty__actions, .cwt-catalog-empty .cwt-search-form { flex-direction: column; }
	.cwt-catalog-empty .cwt-search-form { flex-basis: auto; }
}