/* ============== RESET & BASE ============== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
  scroll-behavior:smooth;
  /* Резерв под вертикальный скроллбар — страница не «дёргается» по горизонтали
     при смене баннера/появлении скроллбара. */
  scrollbar-gutter:stable;
  /* §31: на body уже стоит overflow-x:hidden, но при visible на html скрытое
     мега-меню (display:block, 714px) распирало документ на узком десктоп-вьюпорте
     (телефон в режиме «полная версия», ~980px) — появлялся горизонтальный скролл
     и «ломало» страницу. clip гасит это, не создавая scroll-контейнер (sticky цел). */
  overflow-x:clip;
  /* Базовый размер 1rem. Вёрстка свёрстана в rem (конвенция «фигма-px ÷ 16»),
     поэтому уменьшение этой базы пропорционально ужимает ВСЕ шрифты/отступы/гэпы
     разом. Контейнер 1360 ушёл от исходных 1720 — база снижена с 16 до 14px,
     чтобы контент сел нормальными «не громадными» размерами. */
  font-size:14px;
}
body{
  font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:1rem;
  line-height:1.4;
  color:#1a1a1a;
  background:#f0f0f0;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"kern" 1;
  /* clip, а не hidden: hidden форсирует overflow-y:auto → body становится
     скролл-контейнером и ломает position:sticky у шапки. clip убирает горизонт.
     переполнение, НЕ создавая скролл-контейнер — sticky-шапка работает. */
  overflow-x:clip;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
img{max-width:100%;display:block}
ul,ol{list-style:none}

/* ============== FONT AWESOME SIZING ============== */
.location-row i,
.contact-item i{font-size:0.875rem}
.nav-btn-icon i{font-size:1.9125rem}
/* иконки Каталог/Корзина/Сравнить — на 10% меньше иконки поиска (лупа 2.125rem → 1.9125rem), как требует клиент */
.nav-ico{width:1.9125rem;height:1.9125rem;object-fit:contain;display:block}
.nav-ico-compare{width:2.025rem;height:1.9125rem}
.nav-btn .person-icon i{font-size:1.125rem}
/* карточка: сердце + сравнение = по 24px (клиент), база 14px → 1.7143rem */
/* §Мелкие 3: на вебе иконки компактнее (мышь — точное попадание).
   На мобильной ниже возвращаем 1.7143rem — там это зона тапа. */
.pc-fav i{font-size:1.4rem}
.pc-compare-ico{display:block;width:1.4rem;height:1.4rem;background-color:#cfcfcf;-webkit-mask:url(../img/icon-compare-card.png) no-repeat center/contain;mask:url(../img/icon-compare-card.png) no-repeat center/contain;transition:background-color .15s ease}
.footer-contact i{font-size:1.0625rem;width:1rem;text-align:center}
.footer-social a i{font-size:1.4375rem}
/* стрелки слайдеров = вектор weui:arrow-outlined из Figma (тонкий чёрный шеврон 9×16) */
.cat-arrow .arrow-ico,
.product-arrow .arrow-ico,
.partners-arrow .arrow-ico{width:0.5625rem;height:1.0625rem;display:block}
.arrow-ico.flip{transform:scaleX(-1)}
.benefit-icon i{font-size:4.25rem;line-height:1}
.dark-toggle i{font-size:1rem}

:root{
  /* Единый основной цвет бренда Kärcher (#FFDE00). Используется как ЗАЛИВКА
     кнопок/акцентов, всегда с тёмным текстом. Ховер — чуть темнее (--yellow-soft).
     На белом фоне жёлтый как текст/тонкая иконка не используется — там тёмный. */
  --yellow:#FFDE00;
  --yellow-soft:#F2CE00;
  --orange:#FFDE00;
  --black:#1a1a1a;
  --dark:#3e3e3e;
  --gray-bg:#f0f0f0;
  --gray-light:#f0f0f0;
  --gray-border:#d9d9d9;
  --gray-text:#747474;
  --gray-text-dark:#595858;
  --gray-muted:#8e8e8e;
  --gray-sku:#a4a2a2;
  --red:#c20000;
  --red-old:#c20000;
  --green:#1faf38;
  --star:#ffb800;
  /* Кольцо клавиатурного фокуса: тёмное на светлом фоне, жёлтое на тёмном. */
  --focus:#1a1a1a;
  /* Контейнерная вёрстка: фоны на всю ширину, контент центрирован в 1360. */
  --container-max:1360px;
  --container-pad:clamp(20px, 3vw, 50px);
  /* Full-bleed секции: фон тянется на весь вьюпорт, но контент выравнивается
     по центрированной колонке 1360 за счёт автоматического бокового паддинга. */
  --side-pad:max(var(--container-pad), calc((100vw - var(--container-max))/2 + var(--container-pad)));
}

/* §Главная [4]: адаптация под большие экраны (2K / 4K). Вся вёрстка в rem от базы
   html{font-size}, поэтому увеличение базы + контейнера пропорционально укрупняет
   ВЕСЬ сайт (шрифты, отступы, карточки), а не оставляет контент узкой полосой
   1360px посреди 4K-экрана. Шаги подобраны так, чтобы контент занимал экран, но
   не «раздувался». Ниже 1921px — прежнее поведение (ТЗ было до 1920px). */
/* ВРЕМЕННО ОТКЛЮЧЕНО по запросу клиента (2026-09-07): адаптация под 2K/4K
   (масштабирование базы шрифта + --container-max). Чтобы вернуть — снять комментарий.
@media (min-width:1921px){
  :root{ --container-max:1600px; }
  html{ font-size:16px; }
}
@media (min-width:2560px){
  :root{ --container-max:2040px; }
  html{ font-size:18.5px; }
}
@media (min-width:3400px){
  :root{ --container-max:2560px; }
  html{ font-size:22px; }
}
*/

/* ============== TOP UTILITY BAR ============== */
.topbar{
  background:#fff;
  /* воздух сверху: лого не приклеено к верхнему краю (по Figma над шапкой больше пространства) */
  padding:2.5rem var(--side-pad) 1.375rem;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:1.25rem;
  border-bottom:1px solid #ececec; /* figma: тонкая светлая линия, не жирная чёрная */
}
.topbar-left{display:flex;align-items:baseline;gap:1.75rem;font-size:0.8125rem}
.topbar-right{display:flex;align-items:flex-start;gap:1.5rem;justify-content:flex-end;font-size:0.8125rem}
.topbar-right .contact-item{white-space:nowrap;font-size:0.9375rem}
.topbar-right .contact-item + .contact-item{margin-left:1.5rem}
/* §Шапка 2: панель выбора языка */
.lang{position:relative;display:inline-flex}
.lang-select{
  display:inline-flex;align-items:center;gap:0.25rem;
  cursor:pointer;font-weight:700;font-size:0.875rem;
  background:none;border:0;padding:0;margin:0;font-family:inherit;color:inherit;
}
.lang.is-open .lang-caret{transform:rotate(180deg)}
.lang-caret{transition:transform .2s ease}
.lang-menu{
  position:absolute;top:calc(100% + .5rem);left:0;z-index:60;min-width:12.5rem;
  background:#fff;border:1px solid #ececec;border-radius:.75rem;
  box-shadow:0 12px 34px rgba(0,0,0,.14);padding:.4rem;
  display:flex;flex-direction:column;
}
.lang-menu[hidden]{display:none}
.lang-item{
  display:flex;align-items:center;gap:.6rem;width:100%;
  background:none;border:0;border-radius:.5rem;padding:.55rem .65rem;
  cursor:pointer;text-align:left;font:inherit;color:#1a1a1a;
  transition:background .12s ease;
}
.lang-item:hover:not(.is-soon){background:#f4f4f4}
.lang-item[aria-selected="true"]{background:var(--yellow)}
.lang-code{font-weight:700;font-size:.8rem;min-width:1.6rem}
.lang-name{font-size:.9rem;font-weight:400}
.lang-item.is-soon{color:#9a9a9a;cursor:default}
.lang-soon{
  margin-left:auto;font-style:normal;font-size:.68rem;font-weight:600;color:#b0b0b0;
  border:1px solid #e2e2e2;border-radius:.35rem;padding:.08rem .32rem;white-space:nowrap;
}
/* в бургер-меню панель раскрывается в потоке, как город */
.acc-lang{display:block;border-bottom:1px solid #ececec}
.acc-lang .lang-select{width:100%;font-weight:600;font-size:1rem;color:#1a1a1a}
.acc-lang .acc-city-lbl i{font-size:1.05rem}
.acc-lang.is-open .acc-arr{transform:rotate(180deg)}
.acc-lang .lang-menu{position:static;min-width:0;padding:0 0 .75rem;background:none;border:none;border-radius:0;box-shadow:none}
.ktg-dark .lang-menu{background:#232323;border-color:#3a3a3a;box-shadow:0 12px 34px rgba(0,0,0,.5)}
.ktg-dark .lang-item{color:#e8e8e8}
.ktg-dark .lang-item:hover:not(.is-soon){background:#2f2f2f}
.ktg-dark .lang-item[aria-selected="true"]{background:var(--yellow);color:#1a1a1a}
.ktg-dark .lang-item.is-soon{color:#777}
.ktg-dark .lang-soon{color:#7d7d7d;border-color:#3a3a3a}
.ktg-dark .acc-lang{border-color:#333}
.ktg-dark .acc-lang .lang-select{color:#e8e8e8}
.ktg-dark .acc-lang .lang-menu{background:none;box-shadow:none;border:none}
.lang-caret{
  font-size:0.625rem;
  color:#1a1a1a;
  margin-left:0.125rem;
}
.location{
  display:flex;flex-direction:column;
  line-height:1.2;
  position:relative;
}
.location{align-items:center}
.location-toggle{
  display:flex;flex-direction:column;align-items:center;
  background:none;border:0;padding:0;margin:0;cursor:pointer;
  font:inherit;color:inherit;text-align:center;line-height:1.2}
.location-row{display:flex;align-items:center;gap:0.375rem;font-weight:700;font-size:0.875rem}
.location-row svg{flex-shrink:0}
.city-caret{font-size:0.625rem;color:#1a1a1a;margin-left:0.125rem;transition:transform .2s ease}
.location.is-open .city-caret{transform:rotate(180deg)}
/* §Сервис 1: подпись по центру под городом, чуть ниже, ведёт на филиалы */
.location-sub{display:block;font-size:0.8125rem;color:#000;font-weight:400;margin-top:0.3rem;text-align:center;text-decoration:underline;text-decoration-skip-ink:none}
.location-sub:hover{color:#000;text-decoration:underline;text-decoration-skip-ink:none}

/* Выпадающий список городов (филиалы) */
.city-menu{
  position:absolute;top:calc(100% + 0.5rem);left:0;z-index:60;
  min-width:16rem;background:#fff;border:1px solid #ececec;border-radius:0.75rem;
  box-shadow:0 12px 34px rgba(0,0,0,.14);padding:0.4rem;
  display:flex;flex-direction:column}
.city-menu[hidden]{display:none}
.city-item{
  display:flex;flex-direction:column;gap:0.1rem;align-items:flex-start;
  background:none;border:0;border-radius:0.5rem;padding:0.55rem 0.65rem;
  cursor:pointer;text-align:left;font:inherit;color:#1a1a1a;width:100%;
  transition:background .12s ease}
.city-item:hover{background:#f4f4f4}
.city-item.is-active{background:var(--yellow)}
.city-item-name{font-weight:700;font-size:0.875rem}
.city-item-addr{font-size:0.75rem;color:var(--gray-muted);font-weight:400}
.city-item.is-active .city-item-addr{color:#5a5203}
.city-menu-all{
  margin-top:0.25rem;padding:0.6rem 0.65rem;font-size:0.8125rem;font-weight:600;
  color:#1a1a1a;text-decoration:none;border-top:1px solid #eee;
  display:flex;align-items:center;gap:0.4rem;transition:color .12s ease}
.city-menu-all i{font-size:0.7rem;transition:transform .15s ease}
.city-menu-all:hover{color:#000}
.city-menu-all:hover i{transform:translateX(3px)}
.logo-center{
  display:inline-block;
  position:relative;
  padding-bottom:0.5rem;
}
.logo-center .logo-text{
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:2.375rem;
  letter-spacing:0.0312rem;
  color:#1a1a1a;
  line-height:1;
}
.logo-center img{height:3rem;width:auto;display:block}
.logo-center.has-img{padding-bottom:0}
.logo-center::after{
  content:'';
  position:absolute;
  left:0;right:0;
  bottom:0;
  height:0.4375rem;
  background:var(--yellow);
}
.logo-center.has-img::after{display:none}
.contact-item{display:flex;align-items:center;gap:0.375rem;font-weight:400;font-size:0.8125rem}
.contact-item svg{flex-shrink:0}
.dark-toggle{
  width:1.5rem;height:1.5rem;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  cursor:pointer;
  margin-left:0;
}

/* ============== MAIN NAV BAR ============== */
.mainnav{
  background:#fff;
  padding:1.625rem var(--side-pad) 1.125rem;
  display:grid;
  /* 1fr | 50% | 1fr — центральный трек = поле поиска, равные боковые колонки центрируют его */
  grid-template-columns:1fr 50% 1fr;
  align-items:center;
  gap:3rem;
}
.mainnav-left{display:flex;align-items:center;gap:1.5rem;justify-self:start}
/* Симметрично левой группе: тот же gap, без отдельного ограничения ширины (3 иконки слева = 3 справа). */
.mainnav-right{display:flex;align-items:center;gap:1.5rem;justify-self:end;margin-right:-10px}
.nav-btn{
  display:flex;flex-direction:column;align-items:center;gap:0.25rem;
  font-size:12px;color:#000;font-weight:700;
  position:relative;
  cursor:pointer;
}
.nav-btn-icon{
  width:2.375rem;height:2.375rem;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.badge{
  position:absolute;
  /* плашка стоит снаружи иконки в правом-верхнем углу, касается уголком */
  top:-0.625rem;right:-0.75rem;
  background:var(--yellow);
  color:#1a1a1a;
  font-size:0.6875rem;
  font-weight:800;
  width:1.125rem;height:1.125rem;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.badge.empty{background:var(--yellow);color:#1a1a1a}
.nav-btn .person-icon{
  background:var(--yellow);
  width:3rem;height:3rem;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
/* «Мой Karcher»: точный силуэт из Figma (node 1443:2099), маской чтобы задавать цвет */
.nav-btn-icon .person-ico{
  display:block;
  width:1.875rem;height:2rem;
  background-color:var(--yellow);
  -webkit-mask:url(../img/icon-person.png) no-repeat center/contain;
  mask:url(../img/icon-person.png) no-repeat center/contain;
}
/* §Мелкие 5: все иконки шапки — размером как лупа поиска и строго на одной линии
   с ней; подписи выведены из потока и висят ниже (не влияют на выравнивание иконок). */
.mainnav .nav-btn-icon i{font-size:2.125rem}
.mainnav .nav-ico{width:2.125rem;height:2.125rem}
.mainnav .nav-ico-compare{width:2.25rem;height:2.125rem}
.mainnav .nav-btn-icon .person-ico{width:2rem;height:2.125rem}
/* подписи остаются в потоке (иначе узкие иконки сталкивают широкие подписи);
   весь блок сдвигаем вниз так, чтобы ИКОНКА встала на линию лупы поиска */
.mainnav .nav-btn{gap:.3rem;transform:translateY(.72rem)}
.mainnav{padding-bottom:2rem}

/* figma: компактное серое поле с центрированным «Найти», лупа — ОТДЕЛЬНО справа */
.search-wrap{
  /* заполняет центральный трек грида (44% контейнера); лупа абсолютная справа,
     чтобы НЕ сдвигать поле с центра. */
  position:relative;
  width:100%;
  max-width:600px;      /* ограничение ширины поля */
  margin:0 auto;        /* по центру трека */
  display:flex;
  align-items:center;
}
.search-input{
  width:100%;
  min-width:0;
  background:#e3e3e3;
  border:none;
  border-radius:2rem;
  padding:0.6875rem 2.6rem; /* равные боковые отступы: текст по центру не наезжает на лупу справа */
  text-align:center; /* §23: вписываемый текст в поиске по центру */
  /* «Найти» в плейсхолдере = 18.5px (клиент), база 14px → 1.3214rem */
  font-size:1.3214rem;
  font-weight:500;
  font-family:inherit;
  color:#1a1a1a;
  text-align:center;
  outline:none;
}
.search-input::placeholder{color:#777;font-weight:500}

/* ==========================================================================
   Доступность: видимый клавиатурный фокус.
   В теме в семи местах стоит outline:none — он гасил рамку и для клавиатуры.
   Убирать его нельзя (иначе рамка появится и при клике мышью), поэтому
   возвращаем кольцо через :focus-visible — оно срабатывает только при
   навигации с клавиатуры. :where() держит нулевую специфичность, чтобы
   правило не конфликтовало с существующими стилями компонентов.
   ========================================================================== */
:where(a, button, input, select, textarea, summary, [tabindex], [role="button"], [role="option"]):focus-visible{
  outline:2px solid var(--focus);
  outline-offset:2px;
  border-radius:.25rem;
}
/* Поле поиска скруглено на 2rem — кольцо фокуса повторяет его форму. */
.search-input:focus-visible{border-radius:2rem}
.search-btn{
  /* Лупа ВНУТРИ поля, у правого края — не выпирает наружу и не перекашивает правую группу. */
  position:absolute;
  right:1.5rem;
  left:auto;
  margin-left:0;
  top:50%;
  transform:translateY(-50%);
  background:transparent;
  border:none;
  padding:0;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.search-svg{width:1.4rem;height:1.4rem}
/* Пока виден крестик очистки (в поле есть текст) — прячем лупу, чтобы не мешала. */
.search-btn{transition:opacity .15s ease}
.search-wrap:has(.search-clear.is-visible) .search-btn{opacity:0;pointer-events:none}

/* ============== CATEGORY NAV ============== */
.catnav{
  background:#fff;            /* белый фон на всю ширину — без серых полос по бокам */
  padding:0.75rem var(--side-pad) 2rem;
  display:flex;justify-content:center;
}
.catnav-inner{
  width:100%;
  max-width:600px;
  margin:0 auto;
  position:relative;
  display:flex;justify-content:space-between;align-items:center;
  gap:1rem;
}
.catnav-item{
  font-size:1.0625rem;font-weight:600;
  letter-spacing:0;
  text-transform:uppercase;
  display:flex;align-items:center;gap:0.325rem;
  cursor:pointer;
  color:#000;
  transition:color .15s ease;
}
.catnav-item:hover{color:#555}
.catnav-caret{
  font-size:0.8125rem;
  color:#1a1a1a;
}

/* ============== HERO ============== */
.hero{
  position:relative;
  /* боксом в контейнере: край-в-край с контентом секций (1360 минус боковой паддинг) */
  width:calc(100% - 2 * var(--container-pad));
  max-width:calc(var(--container-max) - 2 * var(--container-pad));
  margin:1.75rem auto 0;
  height:30rem;
  overflow:hidden;
  border-radius:1.5rem;
  background:#1a1410;
  /* pan-y: вертикальную прокрутку отдаём браузеру, горизонтальный свайп —
     JS-слайдеру. Без этого мобильный браузер гасит жест как скролл. */
  touch-action:pan-y;
  /* Изоляция: что бы ни менялось внутри hero при смене слайда, это НЕ может
     повлиять на компоновку страницы (устраняет «тряску» при переключении). */
  contain:layout paint;
}
.hero-photo{
  position:absolute;inset:0;
  z-index:0;
}
.hero-photo picture{display:contents} /* обёртка <picture> для desktop/mobile-картинки — не влияет на раскладку */
.hero-photo img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center right;
}
.hero-overlay{
  position:absolute;inset:0;
  z-index:1;
  background:linear-gradient(100deg, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.5) 38%, rgba(20,12,5,0.18) 68%, rgba(40,28,18,0.05) 100%);
}
.hero-content{
  position:relative;
  z-index:2;
  max-width:100%;
  padding:6rem 3.5rem 0;
  color:#fff;
}
.hero h1,.hero .hero-h{
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  font-size:2.75rem;
  line-height:1.22;
  letter-spacing:0;
  max-width:45rem;
  margin-bottom:2rem;
  color:#fff;
  text-shadow:0 2px 24px rgba(0,0,0,0.45);
}
.hero-sub{
  max-width:40rem;
  margin:0 0 1.5rem;
  color:#f2f2f2;
  font-size:1.125rem;
  line-height:1.4;
  font-weight:500;
  text-shadow:0 2px 18px rgba(0,0,0,0.5);
}
@media(max-width:760px){.hero-sub{display:none}}
.hero-cta{
  display:inline-block;
  background:var(--yellow);
  color:#000;
  padding:0.75rem 1.625rem;
  border-radius:0.5rem;
  font-weight:600;
  font-size:1.125rem;
  letter-spacing:0;
  transition:transform .15s ease,box-shadow .15s ease;
}
.hero-cta:hover{transform:translateY(-0.125rem);box-shadow:0 0.75rem 1.75rem rgba(255,222,0,0.4)}
.hero-badge{
  position:absolute;
  top:1.75rem;right:2rem;
  background:var(--yellow);
  color:#000;
  padding:0.5rem 1rem;
  border-radius:0.5rem;
  font-weight:600;
  font-size:1rem;
  letter-spacing:0;
  z-index:3;
  box-shadow:0 8px 24px rgba(255,240,3,0.25);
}
/* пагинация вынесена ПОД баннер (вне hero), на фон страницы — по Figma */
.hero-dots{
  display:flex;justify-content:center;align-items:center;gap:0.5rem;
  height:10px;
  margin:1.5rem 0 0;
}
.hero-dots span{
  width:0.4375rem;height:0.4375rem;
  border-radius:50%;
  background:var(--gray-border);
}
.hero-dots span.active{background:#1a1a1a;width:0.5625rem;height:0.5625rem}
.hero-dots span{cursor:pointer;transition:width .15s ease,height .15s ease,background .15s ease}
/* ===== Слайдер главного баннера: кросс-фейд слайдов ===== */
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s ease;
  /* GPU-слой: кроссфейд идёт на композиторе без перерастеризации → без джиттера */
  will-change:opacity;transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hero-slide.is-active{opacity:1;visibility:visible}
.hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;
  width:2.75rem;height:2.75rem;border:none;border-radius:50%;
  background:rgba(255,255,255,0.22);color:#fff;font-size:1.75rem;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  transition:background .15s ease;
}
.hero-arrow:hover{background:rgba(255,255,255,0.42)}
.hero-arrow.left{left:1.25rem}
.hero-arrow.right{right:1.25rem}
.hero-arrow span{display:block;margin-top:-0.2rem}
/* один слайд — прячем стрелки/точки */
.hero.is-single .hero-arrow,.hero-dots.is-single{display:none}
/* §4 (десктоп): текст и кнопка баннера — внизу слева, чуть выше самого угла.
   Мобилку не трогаем — там контент сверху (padding-top в media-запросах). */
@media(min-width:901px){
  .hero-slide{display:flex;flex-direction:column;justify-content:flex-end}
  .hero-content{padding:0 3.5rem 2.75rem}
}

/* ============== SECTION WRAPPERS ============== */
.section{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad)}
.section-title{
  font-size:2rem;
  font-weight:700;
  text-align:center;
  margin-bottom:1.75rem;
  letter-spacing:-0.0312rem;
}

/* ============== CATEGORY SPLIT PILLS ============== */
.cat-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin-top:5.5625rem;
}
.cat-pill{
  /* figma Rectangle 988/1022 cornerRadius 30 (было 36). */
  border-radius:1.875rem;
  min-height:6.5rem;
  padding:0.875rem 2.25rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-weight:700;
  cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease;
}
.cat-pill:hover{transform:translateY(-0.125rem);box-shadow:0 0.625rem 1.5rem rgba(0,0,0,0.08)}
/* white-space:normal — на десктопе текст и так в одну строку (как в макете),
   а на узких ширинах переносится вместо того, чтобы вылезать за пиллу. */
.cat-pill .title{font-size:1.875rem;line-height:1.1;margin-bottom:0.25rem;letter-spacing:0;white-space:normal}
.cat-pill .sub{font-size:1rem;font-weight:500;opacity:0.8;white-space:normal}
.cat-pill.yellow{
  background:var(--yellow);
  color:#000;
}
.cat-pill.dark{
  background:var(--dark);
  color:#fff;
}
.cat-pill.dark .sub{opacity:0.7}
/* §Категории: подпись «Для дома и сада» немного серее чёрного заголовка (как в макете). */
.cat-pill.yellow .sub{color:#797979;opacity:1}
.cat-pill-txt{display:flex;flex-direction:column;align-items:center}
.cat-pill-all{display:none}
/* §Каталог [5]: активная категория — «← Назад» слева, название категории по центру. */
.cat-pill.is-cat{position:relative}
.cat-pill-back{position:absolute !important;left:1.5rem;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:.45rem;color:inherit;text-decoration:none;font-size:.95rem;font-weight:600;opacity:.85;transition:opacity .15s ease}
.cat-pill-back:hover{opacity:1}
/* Появляющаяся чёрная подчёркивающая линия (снизу -2px): скрыта, видна при наведении.
   .cat-pill-back уже position:absolute — этого достаточно как контекст для ::after. */
.cat-desc-more-t{position:relative}
.cat-desc-more-t::after,.cat-pill-back::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:#000;opacity:0;transition:opacity .15s ease;pointer-events:none}
.cat-pill-back:hover::after,.cat-desc-more-t:hover::after,.cat-desc-more:hover .cat-desc-more-t::after{opacity:1}
.ktg-dark .cat-desc-more-t::after,.ktg-dark .cat-pill-back::after{background:#fff}
.cat-pill.is-cat .cat-pill-txt{width:100%}
/* Название категории теперь в плашке — дублирующий заголовок внутри панели прячем. */
.cg-panel .cat-desc .cat-desc-h{display:none}
/* §Каталог [6][7]: «Подробнее» справа в плашке; старую кнопку внутри панели прячем. */
.cg-panel .cat-desc .cat-desc-more{display:none}
.cat-pill.is-cat .cat-desc-more-pill{position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);color:inherit;opacity:.9;margin:0;font-size:.9rem}
.cat-pill.is-cat .cat-desc-more-pill:hover{color:inherit;opacity:1}
@media(max-width:560px){.cat-pill-back span{display:none}.cat-pill-back{left:1rem}.cat-pill.is-cat .cat-desc-more-pill{right:1rem}.cat-pill.is-cat .cat-desc-more-pill .cat-desc-more-t{display:none}}

/* ============== CATEGORY ICONS ROW ============== */
.cat-icons-section{
  margin-top:2.625rem;
  margin-bottom:3rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  position:relative;
}
/* колонка-карусель: каждая родительская категория (Бытовой / Проф) листается отдельно.
   боковые «жёлоба» (padding) держат стрелки вне зоны карточек — viewport уже колонки. */
.cat-icons-col{
  position:relative;
  padding:0 2rem;
  min-width:0; /* иначе грид-ячейка распирается лентой из 20 плиток вместо 1fr */
}
.cat-icons-viewport{
  /* горизонтальная лента: свайп/колесо/перетаскивание. overflow-y:visible
     невозможно вместе с overflow-x:auto → даём вертикальный паддинг, чтобы
     тень плиток не срезалась сверху/снизу. */
  overflow-x:auto;
  overflow-y:hidden;
  min-width:0;
  padding:0.6rem 0;
  
  scrollbar-width:none;
  cursor:grab;
}
.cat-icons-viewport::-webkit-scrollbar{display:none}
.cat-icons-viewport.is-grabbing{cursor:grabbing;scroll-behavior:auto}
.cat-icons-track{
  position:relative;
  display:flex;
  gap:1.125rem;
}
.cat-icon-card{
  flex:0 0 max(7.5rem, calc((100% - 3 * 1.125rem) / 4));
  
  min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:1.5rem;
  cursor:pointer;
}
/* figma: белый квадратный тайл с иконкой; подпись вынесена ПОД тайл на серый фон, не внутри. */
.cat-icon-img{
  background:#fff;
  /* figma Rectangle 1026 cornerRadius 30 (было 22), квадрат 194×194. */
  border-radius:1.875rem;
  border:1px solid transparent;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  width:100%;
  aspect-ratio:1;
  /* без этого портретная картинка (напр. поломоечная машина) распирает плитку
     по min-content высоте и aspect-ratio:1 игнорируется → плитка не квадрат */
  min-height:0;
  overflow:hidden;
  padding:1.25rem;
  display:flex;align-items:center;justify-content:center;
  transition:box-shadow .15s ease,transform .15s ease;
}
.cat-icon-card:hover .cat-icon-img{box-shadow:0 0.25rem 0.75rem rgba(0,0,0,0.08);border-color:#7d7b7b}
.cat-icon-img svg{width:100%;height:100%}
.cat-icon-img img{max-width:100%;max-height:100%;width:auto;object-fit:contain}
/* плитки без фото — плейсхолдер «фото будет здесь» (ждём картинки категорий) */
.cat-img-ph-ico{font-size:2.75rem;color:#d3d3d3}
.ktg-dark .cat-img-ph-ico{color:#3f3f3f}
.cat-icon-name{
  font-size:0.95rem;
  overflow-wrap:break-word;
  font-weight:500;
  color:#000;
  text-align:center;
  line-height:1.25;
  /* резерв под 2 строки, чтобы карточки с однострочной и двухстрочной подписью
     были одной высоты и иконки/подписи выстраивались в ряд */
  min-height:3.125rem;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.cat-arrow{
  /* стрелки категорий видимы по обе стороны блока (как в макете) */
  display:flex;
  position:absolute;
  top:65px;
  width:1.875rem;height:1.875rem;
  align-items:center;justify-content:center;
  cursor:pointer;
  color:#1a1a1a;
  background:none;
  z-index:2;
  transition:opacity .15s ease;
}
.cat-arrow:hover{opacity:.6}
.cat-arrow.disabled{opacity:.25;cursor:default;pointer-events:none}
.cg-panel .cat-arrow{top:55px}
/* стрелки сидят в боковых жёлобах колонки (padding 2rem), не налезая на карточки */
.cat-arrow.left{left:0.0625rem}
.cat-arrow.right{right:0.0625rem}

/* ============== PRODUCT SECTIONS ============== */
/* белая полоса во всю ширину — чередуем фон: первые блоки серые, товары на белом */
.products-band{
  background:#f0f0f0;
  padding:5rem 0 4rem;
  margin-top:1.75rem;
}
.products-wrap{
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 40px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  position:relative;
}
.products-col{position:relative;min-width:0;display:flex;flex-direction:column}
/* #45: иконки «скидка/огонь» — фирменный жёлтый кружок с тёмным глифом (контраст). */
.ph-badge{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;font-weight:800;width:1.5em;height:1.5em;border-radius:50%;background:var(--yellow);color:#1a1a1a;font-size:.82em;margin-left:.15em}
.ph-sale{color:#1a1a1a}
.ph-fire{color:#1a1a1a}
.products-col h2{
  font-size:2rem;
  font-weight:700;
  text-align:center;
  margin-bottom:2rem;
  letter-spacing:0;
}
.products-grid{
  display:flex;
  gap:0.625rem;
  padding:0.75rem 1.75rem;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  
  scrollbar-width:none;
  cursor:grab;
}
.products-grid::-webkit-scrollbar{display:none}
.products-grid.is-grabbing{cursor:grabbing;scroll-behavior:auto}
.product-arrow{
  position:absolute;
  top:48%;
  transform:translateY(-50%);
  width:1.875rem;height:1.875rem;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  color:#1a1a1a;
  z-index:2;
  transition:opacity .15s ease;
}
.product-arrow:hover{opacity:.6}
.product-arrow.left{left:0}
.product-arrow.right{right:0}
/* §Товар: в «Похожие товары» у карточек есть текст под фото — стрелки чуть ниже,
   чтобы попадать по центру изображения. */
.sp-related .product-arrow{top:60%}

.product-card{
  background:#fff;
  border-radius:1.25rem;
  padding:0.625rem 0.625rem 0.625rem;
  border:1px solid transparent;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  display:flex;flex-direction:column;
  position:relative;
  min-height:0;
  min-width:0;
  /* горизонтальная лента товаров: 3 в окне, узкий экран → листаются */
  flex:0 0 max(11rem, calc((100% - 1.25rem) / 3));
  
}
.pc-image a{display:flex}
.pc-title a{color:inherit;text-decoration:none}
.pc-title a:hover{text-decoration:underline}
.pc-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:0.25rem;
  font-size:0.6875rem;
  color:#888;
}
.pc-fav{cursor:pointer;color:#cfcfcf;display:flex;align-items:center;transition:color .15s ease}
.pc-fav.active{color:var(--red)}
.pc-fav:hover{color:var(--red)}
.pc-sku{font-weight:500;color:#000;font-size:0.75rem;letter-spacing:.01em}
.pc-compare{cursor:pointer;display:flex;align-items:center}
.pc-compare:hover .pc-compare-ico{background-color:var(--yellow)}
.pc-image{
  height:auto;
  /* §Мелкие 3: 5/4 вместо квадрата — минус ~34px высоты карточки.
     object-fit:contain, поэтому фото не обрезается, только компактнее. */
  aspect-ratio:5/4;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:0.25rem;
}
.pc-image svg{width:100%;height:100%}
.pc-image img{max-width:100%;max-height:100%;width:auto;object-fit:contain;border-radius:10px}
.pc-dots{
  display:flex;justify-content:center;gap:0.3rem;
  position:absolute;left:50%;transform:translateX(-50%);
}
/* §5.1 (правка): без лишнего отступа у точек — чистые кружки, как в исходной карточке. */
.pc-dots span{
  width:0.5rem;height:0.5rem;border-radius:50%;
  background-color:var(--gray-border);
}
.pc-dots span.active{background-color:#1a1a1a}
/* §5: максимум 5 точек скользящим окном (управляет JS setActive). Крайние точки окна
   уменьшены — сигнал, что за краем есть ещё фото (как в Kaspi). До инициализации JS
   прячем всё после 5-й, чтобы не мелькали. */
.pc-dots:not([data-win]) span:nth-child(n+6){display:none}
.pc-dots span{transition:transform .15s ease}
.pc-dots span.dot-edge{transform:scale(.55)}
/* Figma: строка под фото = [-20% красный текст] · точки · [Хит пилюля] */
.pc-badges{
  display:flex;justify-content:space-between;align-items:center;
  position:relative;
  margin-bottom:0.1875rem;
  min-height:1.125rem;
}
/* Скидка — просто красный жирный текст (как в макете), без подложки/ленты */
.pc-discount{
  color:var(--red);
  font-weight:700;
  font-size:0.9375rem;
  line-height:1;
}
.pc-tag{
  font-size:0.6875rem;
  font-weight:600;
  padding:0.1875rem 0.5rem;
  border-radius:0.5rem;
  color:#fff;
  text-transform:none;
  letter-spacing:0.0125rem;
  margin-right:-5px;
}
.pc-tag.hit{background:var(--red);min-width:40px;text-align:center}
.pc-tag.new{background:var(--green)}
/* Название товара: Figma 19px/600 → 1.1875rem (16.6px) в нашем масштабе */
.pc-title{
  font-size:0.95rem;
  font-weight:600;
  margin-bottom:0.125rem;
  color:#000;
  text-align:center;
  /* 1.15 — минимум при line-clamp:1 + overflow:hidden, чтобы не срезало
     нижние выносные (у, р, д). Ниже опускать нельзя. */
  line-height:1.15;
  display:-webkit-box;
  -webkit-line-clamp:1;
  line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
/* Подзаголовок: Figma 15px/400 → 0.9375rem */
.pc-subtitle a{color:inherit;text-decoration:none}
.pc-subtitle a:hover{color:#5a5a5a;text-decoration:underline}
.pc-rating{text-decoration:none}
.pc-rating:hover .count{text-decoration:underline}
.pc-subtitle{
  font-size:0.75rem;
  color:#000;
  text-align:center;
  margin-bottom:0.125rem;
  line-height:1.2;
  font-weight:400;
}
.pc-rating{
  font-size:0.8125rem;
  color:#3e3e3e;
  font-weight:300;
  text-align:center;
  margin-bottom:0.125rem;
  display:flex;align-items:center;justify-content:center;gap:0.3125rem;
}
.pc-rating .star{color:#c9c9c9;font-size:0.8125rem}
.pc-rating .count{color:#3e3e3e;font-weight:300}
/* #48: отзывы виднее (текст темнее, но не жирнее); жёлтая звезда если есть отзывы. */
.pc-rating.has-reviews{color:#1a1a1a}
.pc-rating.has-reviews .star{color:var(--yellow-soft)}
.pc-rating.has-reviews .count{color:#1a1a1a}
/* Клиент: цена ЦЕНТРИРОВАНА по карточке. 3-колоночный грид:
   [фантом-слева] [цена по центру] [слот +/счётчик справа].
   Правый слот фикс (держит счётчик 46px → 3.5rem, «+»→счётчик без прыжка),
   левый фантом = столько же (minmax, ужимается на узких карточках). */
.pc-price-row{
  display:flex;flex-direction:column;align-items:center;
  gap:0.1rem;
  margin-top:auto;
  margin-bottom:0.75rem;
  min-height:3.875rem;
}
/* §Каталог3: старая цена — отступ вниз от отзывов + выравнивание НАД ценой
   (тот же горизонтальный сдвиг, что у .pc-price-line: margin-left + компенсация
   слота «+» справа), а не по центру карточки. Высоту карточки не меняем. */
.pc-old-slot{height:1rem;display:flex;align-items:center;justify-content:center;margin:.35rem 0 0;margin-left:20px;padding-right:55px}
.pc-price-line{display:flex;align-items:center;justify-content:center;gap:0.2rem;margin-left:20px}
@media(max-width:600px){
  .pc-price-line{margin-left:8px}
  .pc-old-slot{margin-left:8px}
}
/* Клиент: цена по центру — и по горизонтали, и по вертикали — одинаково
   для скидочных и без скидки */
.pc-price-info{min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
/* Без скидки: пустой слот сверху ≈8px (меньше строки старой цены 16.75px), чтобы
   цена стояла на ~4-5px ВЫШЕ скидочной; при появлении скидки слот исчезает и цена
   встаёт ровно на уровень скидочной (структурно центруется относительно неё) */
.pc-add-slot{
  /* Фиксированная ширина слота 55px (как у .pc-counter): «+» и счётчик занимают
     одинаковое место → при клике «+» цена НЕ уезжает влево. */
  flex:0 0 55px;
  min-width:2rem;
  display:flex;align-items:center;justify-content:center;
}
.pc-add-slot .pc-add,
.pc-add-slot .pc-counter{flex-shrink:0}
.pc-old{
  font-size:0.82rem;            /* §Каталог3: старую цену крупнее */
  color:#555;                   /* §Каталог3: темнее в светлой теме */
  text-decoration:line-through;
  font-weight:600;
  margin-bottom:0;
  line-height:1.1;
  white-space:nowrap;
}
/* Цена: Figma 20px/700 → 1.25rem (17.5px) в нашем масштабе */
.pc-price{
  font-size:1rem;
  font-weight:700;
  color:#000;
  margin-bottom:0;
  line-height:1.15;
  letter-spacing:0;
  white-space:nowrap;
}
.pc-install{
  font-size:0.6rem;
  color:var(--red);
  font-weight:500;
  line-height:1.15;
  white-space:nowrap;
}
/* кнопка «+» = иконка из Figma (free-icon-plus-button): жёлтый скруглённый
   квадрат 45×45, чёрный плюс со скруглёнными концами */
.pc-add{
  width:2rem;height:2rem;
  border:none;padding:0;
  background:#ededed;
  border-radius:0.5rem;
  display:flex;align-items:center;justify-content:center;
  font-size:1.625rem;font-weight:400;line-height:1;
  color:#000;
  flex-shrink:0;
  cursor:pointer;
  /* §12: мгновенный отклик на тач — без 300мс задержки и double-tap-zoom. */
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
  transition:background .15s ease;
}
.pc-add:hover{background:#e3e3e3}
/* §Избранное [37],[38]: Kaspi-кнопка. По умолчанию (плитка) скрыта — в плитке
   остаётся угловая иконка рассрочки. В списке избранного показывается над «+». */
.pc-kaspi-btn{display:none}
.fav-list.is-list .pc-extra-install{display:none}
.fav-list.is-list .pc-kaspi-btn{
  display:flex;align-items:center;justify-content:center;
  position:absolute;right:.8rem;bottom:3.15rem;
  width:2rem;height:2rem;border-radius:.5rem;overflow:hidden;
  background:#ff3b30;color:#fff;text-decoration:none;z-index:3;
  transition:filter .15s ease;
}
.fav-list.is-list .pc-kaspi-btn:hover{filter:brightness(.94)}
.fav-list.is-list .pc-kaspi-btn img{width:100%;height:100%;object-fit:cover;display:block}
.fav-list.is-list .pc-kaspi-btn i{font-size:1rem}
/* На ≤900px кнопка «+» крупнее (2.4rem) — Kaspi совпадает по размеру и встаёт выше. */
@media(max-width:900px){.fav-list.is-list .pc-kaspi-btn{width:2.4rem;height:2.4rem;bottom:3.55rem}}
.pc-counter{
  background:var(--yellow);
  border-radius:0.5rem;
  padding:0 0.4375rem;
  height:2rem;min-width:3.25rem;max-width:55px;
  margin:0 auto;
  display:flex;align-items:center;justify-content:center;gap:0.375rem;
  font-family:'Signika Negative',sans-serif;
  font-weight:500;
  font-size:0.8rem;
  color:#000;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
/* §12: «+/−» — крупнее зона нажатия (прозрачный padding, минус-отступ, чтобы
   счётчик визуально не менялся) и мгновенный тач-отклик — «−» перестаёт «терять» тапы. */
.pc-counter span:first-child,
.pc-counter span:last-child{cursor:pointer;font-size:0.9375rem;font-weight:500;line-height:1;user-select:none;
  touch-action:manipulation;padding:0.5rem 0.35rem;margin:-0.5rem -0.15rem}
.pc-stock{
  display:flex;align-items:center;
  gap:0.85rem;
  font-size:0.875rem;
  margin-bottom:0.375rem;
}
.pc-stock-left{display:flex;align-items:center;gap:0.25rem;color:var(--green);font-weight:500;font-size:0.75rem;white-space:nowrap}
.pc-stock-left .dot{
  width:0.625rem;height:0.625rem;border-radius:50%;
  background:#00FF37;
}
/* Предзаказ / Под заказ — не зелёным (чтобы не читалось как «в наличии»). */
.pc-stock-left.pc-stock-onbackorder,.pc-stock-left.pc-stock-outofstock{color:var(--gray-muted)}
.pc-stock-left.pc-stock-onbackorder .dot,.pc-stock-left.pc-stock-outofstock .dot{background:#c9c9c9}
.pc-stock-right{display:flex;align-items:center;gap:0.1875rem;color:#000;font-weight:400;font-size:0.75rem;white-space:nowrap}
/* иконка доставки = точный ассет Figma (free-icon-fast-delivery-1670915), маской чтобы наследовать цвет */
.pc-truck-ico{
  display:inline-block;flex-shrink:0;
  width:1.0625rem;height:0.625rem;
  background-color:currentColor;
  -webkit-mask:url(../img/icon-delivery.png) no-repeat center/contain;
  mask:url(../img/icon-delivery.png) no-repeat center/contain;
}
.pc-specs{
  font-size:0.75rem;
  font-weight:300;
  color:var(--gray-text-dark);
  text-align:center;
  padding-top:0.4375rem;
  border-top:1px solid #ededed;
  margin-top:auto;
  letter-spacing:0.0063rem;
  white-space:nowrap;
  /* Значения атрибутов бывают длинными («Большой объем бака для…») и в одну
     строку не помещаются. Обрезаем многоточием, а не даём тексту вылезать. */
  overflow:hidden;
  text-overflow:ellipsis;
  /* ФИКСИРОВАННАЯ высота строки характеристик: пустая и с текстом занимают ровно
     одинаковое место → цена/наличие стоят на одной высоте во всех карточках. */
  height:1.6rem;box-sizing:border-box;
}
/* Нет характеристик — не показываем пустую линию-разделитель, но высоту держим. */
.pc-specs:empty{border-top-color:transparent}

/* ============== BENEFITS ============== */
/* Figma: блок преимуществ — белая скруглённая карточка с тенью на сером фоне
   (Rectangle 1111: r=50px, shadow 0 0 10px rgba(0,0,0,.13)). */
/* Figma: белая полоса ВО ВСЮ ширину с мягкой тенью сверху и снизу
   (без скругления и без ужатия в карточку — клиент) */
.benefits{
  background:#fff;
  padding:3.5rem var(--container-pad);
  margin-top:0;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  position:relative;
  z-index:1;
}
.benefits-inner{
  /* контент выровнен по краям остальных секций (1360 − 2×паддинг), фон/тень — на самой полосе */
  max-width:calc(var(--container-max) - 2 * var(--container-pad));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
}
.benefit{
  display:flex;flex-direction:column;align-items:center;gap:1.125rem;
  text-align:center;
}
.benefit-icon{
  width:auto;height:5.375rem;
  display:flex;align-items:center;justify-content:center;
  color:var(--yellow);
}
.benefit-icon img{width:auto;height:4.75rem;object-fit:contain}
.benefit-title{
  font-size:1.125rem;
  font-weight:700;
  margin-bottom:0.375rem;
  letter-spacing:0;
  color:#000;
}
.benefit:nth-child(3) .benefit-title{font-size:1.125rem}
.benefit-sub{
  font-size:0.875rem;
  color:#000;
  line-height:1.45;
  font-weight:500;
}
/* последнее преимущество («Профессиональный сервис») — не длиннее 2 строк (№11) */
.benefit:last-child .benefit-sub{
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* ============== GALLERY & VIDEO ============== */
.gallery-section{
  padding:4rem 0 4.5rem;
}
.gallery-inner{
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 var(--container-pad);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
}
.gallery-block h3{
  font-size:2rem;
  font-weight:700;
  text-align:center;
  margin-bottom:1.75rem;
  letter-spacing:0;
}
.gallery-img{
  width:100%;
  aspect-ratio:842/539;
  border-radius:1.25rem;
  overflow:hidden;
  position:relative;
  background:linear-gradient(135deg,#3a3a3a,#1a1a1a);
}
.gallery-img img{width:100%;height:100%;object-fit:cover}
.gallery-img .placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  background:
    linear-gradient(135deg,#9ba3ab 0%,#5d6770 100%);
  color:#fff;
  font-size:0.875rem;
  text-align:center;
}
.video-play{
  position:absolute;
  inset:0;
  display:flex;align-items:center;justify-content:center;
}
.video-play-btn{
  width:4rem;height:4rem;
  background:rgba(255,255,255,0.95);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,0.3);
}
.video-play-btn::after{
  content:'';
  width:0;height:0;
  border-left:22px solid #1a1a1a;
  border-top:14px solid transparent;
  border-bottom:14px solid transparent;
  margin-left:0.375rem;
}
.gallery-dots{
  display:flex;justify-content:center;gap:0.8125rem;
  margin-top:1.3125rem;
}
.gallery-dots span{
  width:0.5625rem;height:0.5625rem;border-radius:50%;
  background:#d9d9d9;
}
.gallery-dots span.active{background:#000}
.gallery-dots span{cursor:pointer;transition:background .15s ease}
/* слайды галереи/видео — кросс-фейд внутри .gallery-img */
.gallery-img picture{display:contents} /* обёртка ПК/мобайл-картинки не влияет на слайдшоу */
.gallery-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.gallery-img img.is-active{opacity:1}

/* ============== PARTNERS ============== */
/* Полоса партнёров — такая же тень, как у блока преимуществ (клиент):
   белая полоса во всю ширину, мягкая тень сверху и снизу */
.partners{
  background:#fff;
  padding:1.8125rem 0 3.5rem;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  position:relative;
  z-index:1;
}
.partners-inner{
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 var(--container-pad);
  position:relative;
}
.partners h3{
  font-size:2rem;
  font-weight:700;
  text-align:center;
  margin-bottom:1.75rem;
  letter-spacing:0;
}
.partners-row{
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:2.5rem;
  padding:0;
}
/* Карусель: трек, который ездит по страницам логотипов. Стрелки сидят в боковом гаттере (вне контента), клиренс не нужен — лого занимают полную контентную ширину. */
.partners-viewport{overflow:hidden;width:100%;padding:0}
.partners-row.is-carousel{
  justify-content:flex-start;
  gap:0;
  padding:0;
  flex-wrap:nowrap;
  transition:transform .45s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.partners-row.is-carousel .partner-logo{padding:0 2.5rem;min-width:0}
.partner-logo{
  height:5.5rem;
  display:flex;align-items:center;justify-content:center;
  flex:1;
  color:#1a1a1a;
}
/* Логотипы партнёров: единый размер, БЕЗ фона-плашки (прозрачный), лого вписано. */
.partner-tile{
  width:20rem;max-width:100%;height:6rem;
  background:none;
  display:flex;align-items:center;justify-content:center;
}
.partner-tile img,.partner-tile svg{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.partners-arrow{
  position:absolute;
  top:60%;
  transform:translateY(-50%);
  width:1.875rem;height:1.875rem;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  color:#000;
}
.partners-arrow.left{left:var(--container-pad)}
.partners-arrow.right{right:var(--container-pad)}
.partners-dots{
  display:flex;justify-content:center;gap:1.0625rem;
  margin-top:1.9375rem;
}
.partners-dots span{
  width:0.5625rem;height:0.5625rem;border-radius:50%;
  background:#d9d9d9;
  cursor:pointer;
  transition:background .15s ease;
}
.partners-dots span:hover{background:#9a9a9a}
.partners-dots span.active{background:#000}

/* ============== FORM & REVIEWS ============== */
.form-section{
  padding:4rem 0 4.5rem;
}
.form-inner{
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 var(--container-pad);
  display:grid;
  grid-template-columns:868fr 594fr;
  /* клиент: увеличить отступ между «Оставьте заявку» и «Отзывы» до ~130px на 1440 */
  gap:clamp(2.5rem, 9vw, 9.3rem);
  /* форма задаёт высоту ряда, колонка отзывов дотягивается (равная высота) */
  align-items:stretch;
}
.form-col,
.reviews-col{
  display:flex;
  flex-direction:column;
}
/* форма не растягивается — берёт естественную высоту и задаёт ряд */
.form-col{align-self:start}
.form-col h3,
.reviews-col h3{
  font-size:2rem;
  font-weight:700;
  text-align:center;
  margin-bottom:1.75rem;
  letter-spacing:0;
}
.form-card{
  background:#fff;
  border-radius:1.25rem;
  padding:2.2857rem 2rem 1.75rem;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:700px;
  margin:0 auto;
}
.form-card input,
.form-card select,
.form-card textarea{
  width:100%;
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:0.625rem;
  padding:1rem 1.25rem;
  font-size:1.125rem;
  font-family:inherit;
  color:#1a1a1a;
  outline:none;
  margin-bottom:1.2857rem;
  transition:border-color .15s ease;
}
.form-card select{cursor:pointer;appearance:auto}
.form-card input:focus,
.form-card select:focus,
.form-card textarea:focus{border-color:var(--yellow)}
/* Кастомная стрелка селекта «Вид услуги» — смещена от края внутрь (§форма #7). */
.lead-select-wrap{position:relative;margin-bottom:1.2857rem}
.form-card .lead-select-wrap>select.lead-service{margin-bottom:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:2.6rem}
.lead-select-caret{position:absolute;right:18px;top:50%;transform:translateY(-50%);pointer-events:none;color:#747474;font-size:.9rem}
.ktg-dark .lead-select-caret{color:#bdbdbd}
/* Подсветка незаполненного обязательного поля формы заявки. */
.form-card .lead-invalid,
.form-card .lead-invalid:focus{border-color:#e11d2a;box-shadow:0 0 0 2px rgba(225,29,42,.16)}
/* Всплывающее уведомление по центру страницы (фирменный стиль). */
.ktg-toast{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.94);z-index:100001;background:#1a1a1a;color:#fff;padding:.95rem 1.5rem;border-left:4px solid var(--yellow);border-radius:.6rem;font-size:1.02rem;font-weight:600;line-height:1.3;box-shadow:0 14px 48px rgba(0,0,0,.28);max-width:90vw;text-align:center;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
.ktg-toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.form-card textarea{
  min-height:14.2857rem;
  resize:vertical;
  line-height:1.5;
  margin-bottom:0;
}
.form-card input::placeholder,
.form-card textarea::placeholder{color:#747474;font-weight:500}
.form-submit{
  width:100%;
  background:var(--yellow);
  color:#000;
  border-radius:0.625rem;
  padding:1rem;
  font-size:1.25rem;
  font-weight:600;
  margin-top:3.2143rem;
}
/* §42: форма заявки — только после входа. Гостю поля заблокированы, кнопка ведёт на вход. */
.form-card-locked input,.form-card-locked textarea{opacity:.55;cursor:not-allowed}
.form-login-cta{display:flex;align-items:center;justify-content:center;gap:.5rem;text-decoration:none;font-size:1.05rem;box-sizing:border-box}
.form-login-cta:hover{filter:brightness(.96)}
.form-agree{
  text-align:center;
  margin-top:1.25rem;
  font-size:0.9375rem;
  color:#747474;
  font-weight:400;
  line-height:1.5;
}
.reviews-card{
  background:#fff;
  border-radius:1.25rem;
  box-shadow:0 0 0.625rem rgba(0,0,0,0.13);
  padding:1.5rem 1.5rem;
  flex:1;
}
.review-card{
  background:transparent;
  border:none;
  border-radius:0;
  padding:1.25rem 0;
  margin:0;
}
.review-card:first-child{padding-top:0}
.review-card:last-child{padding-bottom:0}
.review-head{
  display:flex;align-items:center;gap:0.75rem;
  margin-bottom:0.875rem;
}
.review-avatar{
  width:2.5rem;height:2.5rem;
  border-radius:50%;
  background:#ececec;
  display:flex;align-items:center;justify-content:center;
  font-size:0.9375rem;
  font-weight:600;
  color:#666;
}
.review-name{font-weight:700;font-size:1.0625rem}
.review-count{font-size:0.8125rem;color:#9a9a9a}
.review-stars{
  display:flex;align-items:center;gap:0.5rem;
  margin-bottom:0.75rem;
}
.review-stars .stars{color:var(--star);letter-spacing:0.0625rem;font-size:0.9375rem}
.review-date{font-size:0.8125rem;color:#747474}
.review-text{
  font-size:0.9375rem;
  line-height:1.6;
  color:#3e3e3e;
  font-family:'Open Sans',sans-serif;
}

/* ============== FOOTER ============== */
.footer{
  background:#fff;
  padding:5rem 0 2.75rem; /* §[22]: чуть больше низ, чтобы адреса не упирались в конец */
  border-top:1px solid var(--gray-border);
}
.footer-inner{
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 var(--container-pad);
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(0,3fr) minmax(220px,1.2fr);
  gap:2.5rem;
  align-items:start;
}
.footer-logo{
  display:inline-block;
  position:relative;
  padding-bottom:0.5rem;
  margin-bottom:1.125rem;
}
.footer-logo .logo-text{
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:2.5rem;
  letter-spacing:0.0312rem;
  color:#1a1a1a;
}
.footer-logo img{height:3rem;width:auto;display:block}
.footer-logo.has-img{padding-bottom:0}
.footer-logo::after{
  content:'';
  position:absolute;
  left:0;right:0;
  bottom:0;
  height:0.3125rem;
  background:var(--yellow);
}
.footer-logo.has-img::after{display:none}
.footer-tagline{
  font-family:'Open Sans',sans-serif;
  font-size:1.0625rem;
  font-weight:600;
  margin-bottom:1.5rem; /* §Подвал 6: чуть больше воздуха до телефона */
  line-height:1.4;
  color:#000;
  max-width:20rem;
}
.footer-logo-link{display:inline-block;cursor:pointer}
/* §Подвал 5: некликабельные пункты-заглушки в навигации подвала. */
.footer-soon{color:#9a9a9a;cursor:default}
.ktg-dark .footer-soon{color:#6f6f6f}
.footer-contact{
  font-family:'Open Sans',sans-serif;
  font-size:1.0625rem;
  font-weight:400;
  color:#000;
  margin-bottom:0.5rem;
  display:flex;align-items:center;gap:0.5rem;
}
.footer-contact svg{color:#1a1a1a;flex-shrink:0}
.footer-social{
  display:flex;gap:0.75rem;
  margin-top:1.125rem;
}
.footer-social a{
  width:2rem;height:2rem;
  display:flex;align-items:center;justify-content:center;
  color:#1a1a1a;
}
.footer-nav h4{
  font-family:'Open Sans',sans-serif;
  font-size:1.25rem;
  font-weight:600;
  margin-bottom:1rem;
  letter-spacing:0;
  text-align:left;
  padding-left:0;
}
.footer-nav{text-align:center}
.footer-nav-inner{
  display:inline-block;
  text-align:center;
}
.footer-nav-cols{
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  gap:1rem 2.5rem;
}
.footer-nav-col{
  flex:0 0 9.75rem;
  text-align:left;
}
.footer-nav-col ul{
  list-style:none;
  margin:0;
  padding:0;
}
.footer-nav-col ul li{
  margin-bottom:0.625rem;
  font-size:1.0625rem;
  font-family:'Open Sans',sans-serif;
  color:#000;
  cursor:pointer;
  transition:color .15s ease;
  white-space:normal;
}
.footer-nav-col ul li:hover{color:#555}
.footer-nav-col ul li a{display:block}
.footer-addresses h4{
  font-family:'Open Sans',sans-serif;
  font-size:1.25rem;
  font-weight:400;
  margin-bottom:1rem;
  letter-spacing:0;
}
.footer-addr{
  display:flex;align-items:center;gap:0.625rem;
  margin-bottom:0.625rem;
}
.footer-addr-icons{
  display:flex;
  align-items:center;
  gap:0.375rem;
  flex-shrink:0;
}
.footer-addr-icons .addr-svc{
  display:inline-flex;align-items:center;justify-content:center;
  line-height:0;border-radius:0.5rem;
  transition:transform .15s ease,opacity .15s ease;
}
.footer-addr-icons .addr-svc:hover{transform:translateY(-2px)}
.footer-addr-icons .addr-svc img{
  width:auto;height:1.9rem;object-fit:contain;display:block;
  /* По умолчанию — обесцвеченные, при наведении проявляется фирменный цвет. */
  filter:grayscale(1);opacity:.7;transition:filter .18s ease,opacity .18s ease;
}
.footer-addr-icons .addr-svc:hover img,
.footer-addr-icons .addr-svc:focus-visible img{filter:grayscale(0);opacity:1}
.footer-addr-text strong{display:block;font-family:'Open Sans',sans-serif;font-size:1.0625rem;font-weight:600;margin-bottom:0.125rem;color:#000}
.footer-addr-text span{font-family:'Open Sans',sans-serif;font-size:1rem;color:#000;font-weight:400}
/* #61: адрес в одну строку на десктопе (чуть меньше кегль, без переноса). */
@media(min-width:901px){.footer-addr-text span{font-size:0.92rem;white-space:nowrap}}
/* «Десктоп на узком экране» (телефон в режиме полной версии, 901–1024px): 3-колоночный
   футер тесен и налезает — раскладываем в чистый стек по центру, без перекрытий. */
@media(min-width:901px) and (max-width:1024px){
  .footer-inner{grid-template-columns:1fr;gap:2rem;text-align:center}
  .footer-brand{align-items:center;text-align:center;margin:0 auto}
  .footer-nav-inner{display:block}
  .footer-nav h4,.footer-addresses h4{text-align:center}
  .footer-nav-cols{flex-direction:column;align-items:center;justify-content:center;gap:1.5rem}
  .footer-nav-col{flex:0 0 auto;text-align:center}
  .footer-addresses{display:grid;grid-template-columns:repeat(1,1fr);gap:1.4rem 1rem;justify-items:center}
  .footer-addr{flex-direction:column;align-items:center;text-align:center;gap:.4rem}
  .footer-addr-text span{white-space:normal}
}
/* #69: «Политика конфиденциальности» — подчёркнута. */
a.ktg-priv,.ktg-priv{text-decoration:none}
/* Страница документа (Политика конфиденциальности и т.п.). */
.ktg-doc-page{padding:2rem 0 3.5rem}
.ktg-doc-inner{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad)}
.ktg-doc-title{font-size:2rem;font-weight:800;color:#1a1a1a;margin:0 0 1.5rem;letter-spacing:-.01em}
.ktg-doc-body{color:#333;font-size:1rem;line-height:1.75;max-width:60rem}
.ktg-doc-body p{margin:0 0 1rem}
.ktg-doc-body strong{color:#1a1a1a}
.ktg-doc-body h2,.ktg-doc-body h3{color:#1a1a1a;font-weight:700;margin:1.6rem 0 .6rem}
.ktg-doc-body ul,.ktg-doc-body ol{margin:0 0 1rem 1.25rem}
.ktg-doc-body li{margin:.25rem 0}
.ktg-dark .ktg-doc-title{color:#f2f2f2}
/* §Подвал 1: doc-страницы (Политика/Гарантия/Оферта) — заголовок по центру,
   панель «Копировать/Скачать/Печать», центрированная колонка текста. */
.ktg-doc-title{text-align:center}
.ktg-doc-body{margin-left:auto;margin-right:auto}
.ktg-doc-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:.6rem;margin:0 0 1.9rem}
.ktg-doc-btn{display:inline-flex;align-items:center;gap:.45rem;padding:.6rem 1.1rem;border:1px solid var(--gray-border,#e0e0e0);border-radius:.6rem;background:#fff;color:#1a1a1a;font:inherit;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}
.ktg-doc-btn:hover{background:var(--yellow);border-color:var(--yellow);color:#111}
.ktg-doc-btn i{font-size:.9rem}
/* §Доки [1]: на мобилке 3 кнопки (Копировать/Скачать/Печать) — в одну строку. */
@media(max-width:560px){
  .ktg-doc-tools{flex-wrap:nowrap;gap:.4rem}
  .ktg-doc-btn{flex:1 1 0;justify-content:center;padding:.55rem .35rem;font-size:.8rem;gap:.3rem}
  .ktg-doc-btn i{font-size:.8rem}
}
.ktg-dark .ktg-doc-btn{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .ktg-doc-btn:hover{background:var(--yellow);border-color:var(--yellow);color:#111}
.ktg-doc-empty{color:#9a9a9a;font-style:italic;text-align:center}
@media print{
  .mtopbar,.topbar,.msearch-bar,.catnav,.footer,.mbottomnav,.ktg-fab,.ktg-cart-fab,.ktg-doc-tools{display:none !important}
  .ktg-doc-page{padding:0}
  .ktg-doc-body{max-width:none}
}
.ktg-dark .ktg-doc-body{color:#cfcfcf}
.ktg-dark .ktg-doc-body strong,.ktg-dark .ktg-doc-body h2,.ktg-dark .ktg-doc-body h3{color:#f2f2f2}
/* #16: всплывашка «Скопировано» при клике по почте/номеру. */
.ktg-copy-toast{position:fixed;z-index:9999;transform:translateX(-50%);background:#1a1a1a;color:#fff;font-size:.8rem;font-weight:600;padding:.35rem .6rem;border-radius:.4rem;pointer-events:none;opacity:0;transition:opacity .15s ease;white-space:nowrap}
.ktg-copy-toast.show{opacity:1}
/* §20: попап с формой заявки. */
.ktg-modal{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:1rem}
.ktg-modal[hidden]{display:none}
.ktg-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.ktg-modal-panel{position:relative;z-index:1;background:#fff;border-radius:1rem;width:100%;max-width:30rem;max-height:92vh;overflow:auto;padding:1.85rem 1.6rem 1.5rem;box-shadow:0 1.5rem 4rem rgba(0,0,0,.32)}
/* §Мой Керхер: единая модалка вход/регистрация (шаги). */
.pr-step,.auth-step{display:flex;flex-direction:column;gap:.85rem}
.auth-step{gap:1rem}
/* hidden должен скрывать шаг, несмотря на display:flex выше. */
.pr-step[hidden],.auth-step[hidden]{display:none}
.pr-hint{color:var(--gray-muted);font-size:.92rem;margin:0}
/* Красивая шапка модалки: иконка в жёлтом круге, заголовок, подпись. */
.auth-head{text-align:center;margin-bottom:1.25rem}
/* Переключатель Вход / Регистрация. */
.auth-tabs{display:flex;gap:.3rem;background:#f2f2f2;border-radius:.7rem;padding:.25rem;margin-bottom:1.25rem}
.auth-tab{flex:1;background:none;border:0;padding:.6rem;border-radius:.55rem;font-size:.92rem;font-weight:600;color:var(--gray-muted);cursor:pointer;font-family:inherit;transition:background .15s ease,color .15s ease}
.auth-tab.is-active{background:#fff;color:#1a1a1a;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.ktg-dark .auth-tabs{background:#1c1c1c}
.ktg-dark .auth-tab.is-active{background:#333;color:#f2f2f2}
.auth-ico{width:3.5rem;height:3.5rem;margin:0 auto .9rem;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;font-size:1.45rem;color:#1a1a1a}
.ktg-auth .auth-title{font-size:1.4rem;margin:0 0 .35rem;text-align:center}
.auth-sub{color:var(--gray-muted);font-size:.9rem;margin:0;text-align:center;line-height:1.5}
.auth-field{display:flex;flex-direction:column;gap:.4rem;text-align:left}
.auth-field-lbl{font-size:.85rem;font-weight:600;color:#1a1a1a}
/* Номер + «Получить код» в один ряд (регистрация). */
.auth-inline{display:flex;gap:.5rem}
.auth-inline .ct-input{flex:1;min-width:0}
.auth-getcode{flex:0 0 auto;white-space:nowrap;padding:0 1rem;border:1px solid var(--gray-border);border-radius:.8rem;background:#fff;color:#1a1a1a;font-weight:600;font-size:.88rem;cursor:pointer;font-family:inherit;transition:background .15s ease,border-color .15s ease}
.auth-getcode:hover:not(:disabled){border-color:#1a1a1a}
.auth-getcode:disabled{opacity:.6;cursor:default}
.ktg-dark .auth-getcode{background:#2a2a2a;border-color:#3a3a3a;color:#e8e8e8}
.ktg-auth .ct-input{padding:.9rem 1.05rem;font-size:1rem;border-radius:.8rem;text-align:center;letter-spacing:.02em}
.ktg-auth .auth-phone{text-align:left}
.ktg-auth .ct-form-btn{padding:.95rem;font-size:1rem;border-radius:.8rem;width:100%;margin:20px auto 5px}
.ktg-dark .auth-field-lbl{color:#e8e8e8}
.pr-err{color:var(--red);font-size:.88rem;margin:.75rem 0 0;text-align:center}
.auth-links{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;margin-top:-.25rem}
.auth-links button{background:none;border:0;color:var(--gray-muted);font-size:.85rem;cursor:pointer;padding:.2rem}
.auth-links button:hover:not(:disabled){color:#1a1a1a;text-decoration:underline}
.auth-links button:disabled{cursor:default;opacity:.7}
.ktg-phonereg-link{margin-top:1rem;text-align:center}
.ktg-phonereg-link a{color:#1a1a1a;font-weight:600;text-decoration:underline}
/* §Мой Керхер: страница входа — единый блок (открывает модалку). */
.ktg-auth-cta{max-width:30rem;margin:2rem auto;text-align:center;background:#fff;border:1px solid var(--gray-border);border-radius:1.25rem;padding:2.5rem 2rem;box-shadow:0 6px 24px rgba(0,0,0,.05)}
.ktg-auth-cta-ico{width:4rem;height:4rem;margin:0 auto 1rem;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:#1a1a1a}
.ktg-auth-cta-h{font-size:1.4rem;margin:0 0 .6rem;color:#1a1a1a}
.ktg-auth-cta-t{color:var(--gray-muted);margin:0 0 1.5rem;line-height:1.6}
.ktg-auth-cta-btn{max-width:20rem;margin:0 auto}
.ktg-dark .ktg-auth-cta{background:#232323;border-color:#333}
.ktg-dark .ktg-auth-cta-h{color:#f2f2f2}
.cm-user-guest{cursor:pointer;border-radius:.7rem;transition:background .15s ease}
.cm-user-guest:hover{background:#f2f2f2}
.ktg-dark .pr-hint{color:#bdbdbd}
.ktg-dark .cm-user-guest:hover{background:#333}
.ktg-modal-title{font-size:1.4rem;font-weight:800;margin:0 0 1.1rem;color:#1a1a1a}
.ktg-modal-close{position:absolute;top:.5rem;right:.5rem;width:2.4rem;height:2.4rem;border:0;background:none;font-size:1.9rem;line-height:1;color:#8a8a8a;cursor:pointer;border-radius:50%;transition:background .15s ease,color .15s ease}
.ktg-modal-close:hover{background:#f2f2f2;color:#1a1a1a}
.ktg-modal .form-card{background:none;box-shadow:none;padding:0;margin:0}
.ktg-dark .ktg-modal-panel{background:#232323}
.ktg-dark .ktg-modal-title{color:#f2f2f2}
/* Попап подтверждения (ktgConfirm) — замена нативного confirm(). */
.ktg-confirm .ktg-modal-panel{max-width:24rem;text-align:center;padding:1.9rem 1.6rem 1.5rem}
.ktg-confirm .ktg-modal-title{font-size:1.25rem;margin:0 0 .7rem}
.ktg-confirm-text{color:#444;font-size:1rem;line-height:1.5;margin:0 0 1.5rem}
.ktg-confirm-actions{display:flex;gap:.7rem}
.ktg-confirm-actions button{flex:1;padding:.85rem 1rem;border:0;border-radius:.7rem;font-weight:700;font-size:.95rem;cursor:pointer;transition:filter .15s ease,background .15s ease}
.ktg-confirm-cancel{background:#f0f0f0;color:#1a1a1a}
.ktg-confirm-cancel:hover{background:#e6e6e6}
.ktg-confirm-ok{background:var(--yellow);color:#111}
.ktg-confirm-ok.is-danger{background:#F14635;color:#fff}
.ktg-confirm-ok:hover{filter:brightness(.95)}
.ktg-dark .ktg-confirm-text{color:#cfcfcf}
.ktg-dark .ktg-confirm-cancel{background:#2f2f2f;color:#f2f2f2}
.ktg-dark .ktg-confirm-cancel:hover{background:#3a3a3a}
/* #7: равномерные отступы между кнопками шапки — фиксированная ширина кнопки под
   самую длинную подпись («Мой Karcher»), чтобы шаг между иконками был одинаковым
   и слева, и справа. Подпись не переносится и не раздвигает соседей. */
@media(min-width:901px){
  .catmenu-group > .nav-btn,.mainnav-right > .nav-btn{width:5.75rem;flex:0 0 5.75rem;text-align:center}
  .catmenu-group > .nav-btn > span,.mainnav-right > .nav-btn > span{white-space:nowrap}
}
/* #19: шапка закреплена при прокрутке вниз. Десктоп — основная навигация,
   мобайл — верхняя панель. */
@media(min-width:901px){
  /* z-index:50 — выше контента, но НИЖЕ выпадающих меню языка/города (z:60),
     иначе закреплённая шапка перекрывала бы их дропдауны. */
  body .mainnav{position:sticky;top:0;z-index:50;background:#fff}
  .mainnav.is-stuck{box-shadow:0 4px 16px rgba(0,0,0,.08)}
  .ktg-dark .mainnav{background:#161616}
  /* строка категорий закрепляется под основной панелью (top задаёт JS по её высоте). */
  body .catnav{position:sticky;z-index:49;padding:.75rem 0}
  .ktg-dark .catnav{background:#161616}
}
@media(max-width:900px){
  .mtopbar{position:sticky;top:0;z-index:200}
}
.footer-bottom{
  text-align:center;
  padding-top:1.25rem;
  margin-top:1.25rem;
  font-size:0.9375rem;
  font-weight:500;
  color:#000;
}

/* ============== RESPONSIVE ============== */
/* Базовое пропорциональное масштабирование задано на html через clamp() —
   шрифты, отступы, карточки и иконки ужимаются единым коэффициентом.
   Ниже только структурные перестроения сетки под класс устройства. */

/* §Мобайл 2.3: товары держим 2 колонки вплоть до мобильного брейкпоинта (900px),
   чтобы «десктоп-режим» в мобильном браузере (~980px) выглядел как обычный веб.
   Стек в 1 колонку — уже в мобильной вёрстке (см. @media max-width:900). */

/* Ноутбуки / небольшие десктопы */
@media (max-width:1240px){
  .hero-badge{right:var(--container-pad)}
  .catnav{gap:3rem}
  /* Блок категорий держим 2 колонки вплоть до мобильного брейкпоинта (900px),
     чтобы «десктоп-режим» в мобильном браузере (~980px) выглядел как обычный веб,
     а не стекался в промежуточный одноколоночный формат. */
}
/* До 1200px центральный трек (поиск) чуть уже (40%), боковые группы шире.
   Размещено ДО правил 901–1100 и ≤900 — в тех диапазонах они переопределяют. */
@media (max-width:1240px){
  .mainnav{grid-template-columns:1fr 40% 1fr}
}
/* §Десктоп-режим на телефоне (~980px): шапка не должна переполняться.
   Сетка auto|1fr|auto — группы кнопок получают ровно свою ширину, поиск — остаток. */
@media (min-width:901px) and (max-width:1100px){
  .mainnav{grid-template-columns:auto 1fr auto;gap:1.5rem}
  .mainnav-right{max-width:none}
}

/* Планшеты (портрет) и маленькие ноутбуки — стек основных колонок */
@media (max-width:900px){
  .topbar{grid-template-columns:1fr;text-align:center;gap:0.75rem}
  .topbar-left,.topbar-right{justify-content:center;flex-wrap:wrap}
  .dark-toggle{margin-left:0}
  .mainnav{grid-template-columns:1fr;gap:1.25rem;justify-items:center}
  .mainnav-left,.mainnav-right{justify-content:center;justify-self:center}
  .search-wrap{width:100%;order:3;padding-right:3rem}
  .search-input{width:100%}
  .search-btn{position:absolute;left:auto;right:0;margin-left:0}
  .catnav{padding:1.1875rem var(--side-pad) 2.5rem}
  .catnav-inner{width:100%;flex-wrap:wrap;justify-content:center;gap:1.75rem}
  .cat-split{grid-template-columns:1fr;gap:1.25rem}
  .cat-icons-section{grid-template-columns:1fr;gap:2.5rem}
  .cat-icons-col{grid-template-columns:repeat(4,1fr)}
  .products-wrap{grid-template-columns:1fr;gap:2.5rem}
  .gallery-inner{grid-template-columns:1fr;gap:2rem}
  .form-inner{grid-template-columns:1fr;gap:2.5rem}
  .benefits-inner{grid-template-columns:1fr 1fr;gap:2.5rem}
  .partners-row{flex-wrap:wrap;gap:2rem}
  .footer-inner{grid-template-columns:1fr;gap:2.5rem}
  .footer-nav h4{padding-left:0;text-align:center}
  .footer-nav-inner{display:block}
  .hero{height:auto;min-height:26rem;padding-bottom:3rem}
  .hero-content{padding-top:7rem}
}

/* Большие телефоны / маленькие планшеты */
@media (max-width:680px){
  .products-grid{grid-template-columns:1fr 1fr}
  .cat-icons-col{grid-template-columns:repeat(2,1fr)}
  .benefits-inner{grid-template-columns:1fr 1fr}
  /* бейдж не должен налезать на заголовок */
  .hero-badge{top:1.5rem;right:1.5rem;font-size:1.3rem;padding:0.6rem 1.2rem}
  .hero-content{padding-top:7.5rem}
  .hero h1,.hero .hero-h{font-size:2.6rem}
}

/* Телефоны */
@media (max-width:480px){
  .footer-nav-col ul li{white-space:normal}
  .products-grid{grid-template-columns:1fr}
  .cat-icons-col{grid-template-columns:repeat(2,1fr)}
  .benefits-inner{grid-template-columns:1fr}
  .cat-pill{padding:1rem 1.25rem}
  .cat-pill .title{white-space:normal;font-size:1.6rem}
  .cat-pill .sub{white-space:normal;font-size:0.85rem}
  .hero-badge{top:1.25rem;right:1.25rem;font-size:1.15rem;padding:0.5rem 1rem}
  .hero-content{padding-top:8.5rem}
  .hero h1,.hero .hero-h{font-size:2.3rem}
}

/* ==================================================================
   ПРАВКИ ПО ТЗ КЛИЕНТА 2026-07-06 (пакет A — визуал, оверрайды)
   Держим отдельным блоком в конце: не трогаем выверенные значения,
   легко ревьюить/откатывать. Каскад: эти правила идут последними.
   ================================================================== */
/* 1. Заголовки блоков — единый стиль, чуть меньше (2rem → 1.75rem) */
.section-title,
.products-col h2,
.gallery-block h3,
.partners h3,
.form-col h3,
.reviews-col h3{font-size:1.75rem}
/* 2. Категории — картинка в плитке крупнее, без упора в края (padding 1.25→0.75rem) */
.cat-icon-img{padding:0.75rem}
/* §4 (правка): иконка «Профессиональный сервис» была крупнее остальных — привели
   к общему размеру. Только десктоп: на мобиле высокая специфичность этого правила
   перебивала мобильные 3.1rem → 4-я иконка вылезала и «съезжала». */
@media(min-width:901px){
  .benefit:nth-child(4) .benefit-icon img{height:4.75rem}
}
/* 4. Логотип шапки чуть крупнее */
.logo-center img{height:3.25rem}
.logo-center .logo-text{font-size:2.5rem}
/* 5. Форма «Оставьте заявку» и «Отзывы» — равная ширина колонок */
.form-inner{grid-template-columns:1fr 1fr}
/* 6. Карточка товара — мягкая компактность БЕЗ уменьшения фото:
      ужимаем резерв строки цены (счётчик 46px по-прежнему влезает) */
.pc-price-row{min-height:2.35rem;margin-bottom:0.55rem}
/* 7. Цена — авто-уменьшение шрифта для сверхдлинных значений (100 млн+).
      Класс вешает JS по факту длины строки; на превью цены короткие — не сработает,
      но механизм готов для боевых данных. */
.pc-price.pc-price--xl{font-size:1.0625rem}
.pc-price.pc-price--xxl{font-size:0.9375rem}
/* 8. «Политика конфиденциальности» — подчёркнутая ссылка (URL документа — от клиента) */
.privacy-link{text-decoration:underline;color:inherit}

/* ==================================================================
   БЛОК ОТЗЫВОВ в стиле агрегатора (ReviewLab-подобный) + ссылки карт
   ТЗ 2026-07-07: сводный рейтинг + бейджи источников (Google/2ГИС/Яндекс),
   карточки с меткой площадки. Готов принять embed сервиса или синк данных.
   ================================================================== */
.reviews-widget{background:#fff;border-radius:1.25rem;box-shadow:0 0 0.625rem rgba(0,0,0,0.13);padding:1.5rem;display:flex;flex-direction:column;flex:1}
.rw-summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:1.15rem;border-bottom:1px solid #eee;margin-bottom:1.15rem;flex-wrap:wrap}
.rw-score{display:flex;flex-direction:column}
.rw-num{font-size:2.5rem;font-weight:800;line-height:1;color:#1a1a1a}
.rw-stars{color:var(--star);font-size:1rem;letter-spacing:0.1rem;margin-top:0.25rem}
.rw-based{font-size:0.8125rem;color:#8e8e8e;margin-top:0.25rem}
.rw-sources{display:flex;flex-direction:column;gap:0.4rem;align-items:flex-end}
.rw-src{font-size:0.8125rem;font-weight:600;color:#3e3e3e;display:inline-flex;align-items:center;gap:0.375rem;white-space:nowrap}
.rw-src::before{content:"";width:0.6rem;height:0.6rem;border-radius:50%;display:inline-block}
.rw-src.rw-g::before{background:#4285F4}
.rw-src.rw-d::before{background:#2FA84F}
.rw-src.rw-y::before{background:#FC3F1D}
.rw-list{display:flex;flex-direction:column;gap:1.1rem;flex:1}
.rw-card{border-bottom:1px solid #f0f0f0;padding-bottom:1.1rem}
.rw-card:last-child{border-bottom:none;padding-bottom:0}
.rw-card-head{display:flex;align-items:center;gap:0.75rem;margin-bottom:0.6rem}
.rw-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:0.2rem}
.rw-id .review-name{font-weight:700;font-size:1.0625rem;line-height:1.1}
.rw-badge{align-self:flex-start;font-size:0.6875rem;font-weight:600;color:#fff;padding:0.1rem 0.5rem;border-radius:0.375rem;line-height:1.35}
.rw-badge.rw-g{background:#4285F4}
.rw-badge.rw-d{background:#2FA84F}
.rw-badge.rw-y{background:#FC3F1D}
.rw-cardstars{color:var(--star);font-size:0.9375rem;white-space:nowrap}
.rw-card .review-text{font-size:0.9375rem;line-height:1.55;color:#3e3e3e;font-family:'Open Sans',sans-serif;margin-bottom:0.4rem}
.rw-card .review-date{font-size:0.8125rem;color:#9a9a9a}
.rw-all{display:block;text-align:center;margin-top:1.15rem;font-weight:600;font-size:0.9375rem;color:#1a1a1a;text-decoration:underline;text-underline-offset:3px}
/* ссылки карт под адресами филиалов */
.addr-links{display:flex;flex-wrap:wrap;gap:0.35rem 0.6rem;margin-top:0.3rem}
.addr-links a{font-size:0.8125rem;color:#747474;text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}
.addr-links a:hover{color:#1a1a1a}

/* ==================================================================
   ТЗ 2026-07-08 (#507): навигация подвала по центру, кликабельные
   заголовки товаров + «Посмотреть все», лайтбокс галереи/видео.
   ================================================================== */
/* подвал: заголовок навигации по центру (клиент просил) */
.footer-nav h4{text-align:center}
/* товары: кликабельный заголовок + ссылка «Посмотреть все» */
.products-col h2 a.ptitle,.products-col h2 a.products-title-link{color:inherit;text-decoration:none;transition:color .15s ease}
.products-col h2 a.ptitle:hover,.products-col h2 a.products-title-link:hover{color:#5a5a5a}
.products-viewall{order:9;display:block;text-align:center;margin:1.25rem 0 0;font-family:'Open Sans',sans-serif;font-weight:600;font-size:0.8125rem;color:#747474;text-decoration:none;transition:color .15s ease}
.products-viewall:hover{color:#1a1a1a}
/* лайтбокс галереи и видео */
.gallery-img{cursor:pointer;touch-action:pan-y}
.lightbox{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,0.9);display:none;align-items:center;justify-content:center;padding:3rem}
.lightbox.open{display:flex}
.lb-stage{max-width:90vw;max-height:90vh;display:flex;align-items:center;justify-content:center}
.lb-stage img{max-width:90vw;max-height:90vh;width:auto;height:auto;border-radius:0.5rem;object-fit:contain}
.lb-stage iframe{width:min(90vw,1200px);aspect-ratio:16/9;border:0;border-radius:0.5rem}
.lb-stage video{max-width:90vw;max-height:90vh;width:auto;height:auto;border-radius:0.5rem;background:#000}
.lb-close,.lb-prev,.lb-next{position:absolute;background:rgba(255,255,255,0.14);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .15s ease}
.lb-close{top:1.25rem;right:1.5rem;width:2.75rem;height:2.75rem;font-size:1.75rem;line-height:1}
.lb-prev,.lb-next{top:50%;transform:translateY(-50%);width:3rem;height:3rem;font-size:2rem;line-height:1}
.lb-prev{left:1.5rem}
.lb-next{right:1.5rem}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{background:rgba(255,255,255,0.3)}
.lb-prev.hidden,.lb-next.hidden{display:none}
/* Мобайл: стрелки переключения не нужны — листаем только свайпом (TikTok). */
@media(max-width:900px){.lb-prev,.lb-next{display:none}}

/* ==================================================================
   МЕГА-МЕНЮ КАТЕГОРИЙ в шапке (ТЗ блок 2.2, #511) — выпадающее дерево
   категорий + подкатегории. Демо-структура: топ-категории из Figma.
   ================================================================== */
/* мега-меню открывается строго под наведённой категорией (позиционируется от группы) */
/* §Меню(3) 7-9: группа НЕ якорит меню (position:static) — все мега-меню якорятся
   к .catnav-inner и открываются в одном месте (левый край, как у «Бытовой»),
   а не уходят вправо за экран. Панель 51rem перекрывает все триггеры → без разрыва. */
.catnav-group{position:static;display:flex}
.catnav-group > .catnav-item{padding-bottom:2rem;margin-bottom:-2rem}
.megamenu{position:absolute;top:100%;left:0;right:auto;transform:translateY(16px);
  background:#fff;border-radius:1rem;box-shadow:0 1rem 2.5rem rgba(0,0,0,0.16);
  padding:1.1rem 1.35rem;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .16s ease,transform .16s ease;z-index:60}
.catnav-group.mm-open .megamenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(10px)}
/* Все мега-меню (включая Сервис) открываются в одной точке — левый край
   .catnav-inner. Прежние хаки правого выравнивания last-child убраны. */
.mm-inner{display:grid;grid-template-columns:1fr 1fr;gap:0.05rem 1.75rem}
.megamenu.mm-service .mm-inner{grid-template-columns:1fr}
.mm-item{align-self:start}
.mm-cat{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;
  padding:0.5rem 0.5rem;font-size:0.9375rem;font-weight:500;color:#1a1a1a;text-transform:none;
  border-radius:0.45rem;transition:background .15s ease,color .15s ease}
.mm-cat:hover{background:#f6f6f6;color:#000}
.mm-caret{font-size:0.5625rem;color:#9a9a9a;transition:transform .15s ease;flex-shrink:0}
.mm-sub{display:none;padding:0.1rem 0 0.4rem 0.85rem;margin-top:-0.15rem}
.mm-item.has-sub:hover .mm-sub{display:block}
.mm-item.has-sub:hover > .mm-cat .mm-caret{transform:rotate(180deg)}
.mm-sub a{display:block;padding:0.3rem 0.5rem;font-size:0.875rem;color:#5f5f5f;text-transform:none;
  border-radius:0.35rem;transition:color .15s ease,background .15s ease}
.mm-sub a:hover{color:#000;background:#f6f6f6}

/* ==================================================================
   ДЕМО-варианты расположения иконок шапки (#518) — клиент выбирает.
   v1: действия в линию с поиском (справа). v2: действия отдельной
   строкой по центру между поиском и меню категорий.
   ================================================================== */
.mainnav.hdr-v1 .mainnav-right{gap:1.1rem}
.nav-actions{display:flex;justify-content:center;align-items:flex-start;gap:2.5rem;background:#fff;padding:0.25rem var(--side-pad) 1.25rem}
.nav-actions .nav-btn{cursor:pointer}

/* ==================================================================
   #523 — ПРАВИЛЬНЫЕ демо-варианты иконок шапки (иконки НА СВОИХ МЕСТАХ).
   hdr-a (V1): иконки размером как иконка поиска (2.125rem ≈ 30px).
   hdr-b (V2): иконки вертикально по центру блока «поиск + меню».
   ================================================================== */
.mainnav.hdr-a .nav-ico{width:2.125rem;height:2.125rem}
.mainnav.hdr-a .nav-ico-compare{width:2.25rem;height:2.125rem}
.mainnav.hdr-a .nav-btn-icon i{font-size:2.125rem}
.mainnav.hdr-a .nav-btn-icon .person-ico{width:2rem;height:2.125rem}
.mainnav.hdr-b .mainnav-left,.mainnav.hdr-b .mainnav-right{transform:translateY(1.9rem)}

/* ==================================================================
   МЕГА-МЕНЮ v2 (#528) — фикс. высота (не прыгает), 3 колонки:
   категории | подкатегории (сменяются в фикс-области) | цветной CTA.
   ================================================================== */
.megamenu.mmx{padding:0;min-width:auto;width:51rem;max-width:calc(100vw - 4rem);overflow:hidden}
/* три колонки РАВНОЙ ширины (категории | подкатегории | промо) — как просил клиент */
/* Ширина колонки категорий ФИКСИРОВАНА (17rem) в обоих режимах: при переключении
   3↔2 колонки список категорий не меняет ширину → не перетекает текст → не мигает
   скроллбар → нет «бесконечного прыжка» при переходе с категории с подкатегориями
   на категорию без них. */
.mmx-grid{display:grid;grid-template-columns:17rem 1fr 17rem;height:22rem}
/* «Сервис»: пункты длиннее и переносятся — даём блоку вырасти, чтобы не скроллилось */
.megamenu.mmx.mm-service .mmx-grid{height:auto;min-height:22rem}
.mmx-grid.mmx-grid-2{grid-template-columns:17rem 1fr}
/* #15: в режиме 2 колонок (категория без подкатегорий) прячем блок подкатегорий —
   промо встаёт сразу после списка категорий. */
.mmx-grid.mmx-grid-2 .mmx-subs{display:none}
.mmx-cats{padding:1rem 0.8rem;overflow-y:auto;scrollbar-gutter:stable;border-right:1px solid #ececec}
.mmx-cats::-webkit-scrollbar{width:6px}
.mmx-cats::-webkit-scrollbar-thumb{background:#e0e0e0;border-radius:3px}
.mmx-cat{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;padding:0.6rem 0.85rem;font-size:1.0625rem;font-weight:500;color:#1a1a1a;text-transform:none;border-radius:0.5rem;transition:background .14s ease,color .14s ease;letter-spacing:0}
.mmx-cat:hover,.mmx-cat.is-active{background:#f5f5f5;color:#000}
/* §Сервис 4: пункты-документы, пока файл не загружен — не кликабельны */
.mmx-cat.is-soon{color:#9a9a9a;cursor:default}
.mmx-cat.is-soon:hover{background:none;color:#9a9a9a}
.mmx-soon{font-style:normal;font-size:.72rem;font-weight:600;color:#b0b0b0;
  border:1px solid #e2e2e2;border-radius:.35rem;padding:.1rem .35rem;white-space:nowrap}
.ktg-dark .mmx-cat.is-soon,.ktg-dark .mmx-cat.is-soon:hover{color:#777}
.ktg-dark .mmx-soon{color:#7d7d7d;border-color:#3a3a3a}
/* #10: НЕ жирним активную категорию — иначе длинный текст (Запчасти,
   Химчистка…) от смены ширины прыгал на 2-ю строку и обратно. Активна — фон+стрелка. */
.mmx-cat.is-active{font-weight:500}
.mmx-arrow{font-size:0.625rem;color:#bcbcbc;flex-shrink:0;transition:color .14s ease}
.mmx-cat.is-active .mmx-arrow{color:#000}
.mmx-subs{position:relative;padding:1.35rem 1.1rem;background:#fafafa;border-right:1px solid #ececec;overflow-y:auto}
.mmx-subpanel{display:none}
.mmx-subpanel.is-active{display:block;animation:mmxfade .18s ease}
@keyframes mmxfade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.mmx-sub-h{display:block;font-size:0.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:#9a9a9a;margin-bottom:0.7rem}
.mmx-subpanel a{display:block;padding:0.45rem 0.65rem;font-size:1.0625rem;color:#3e3e3e;text-transform:none;border-radius:0.4rem;transition:color .14s ease,background .14s ease;letter-spacing:0}
.mmx-subpanel a:hover{color:#000;background:#fff}
/* CTA-блок справа — фото-баннер (реальные фото Karcher) + затемнение снизу для читаемости */
.mmx-promo{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:0.35rem;padding:1.4rem 1.4rem 1.55rem;color:#fff;overflow:hidden;background-size:cover;background-position:center;text-transform:none;letter-spacing:0}
.mmx-promo::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,8,0.9) 0%,rgba(8,8,8,0.55) 42%,rgba(8,8,8,0.12) 100%);z-index:0}
.mmx-promo>*{position:relative;z-index:1}
.mmx-promo-yellow{background-image:url(../img/mmx-home.webp)}
.mmx-promo-dark{background-image:url(../img/mmx-pro.webp)}
.mmx-promo-accent{background-image:url(../img/mmx-service.webp)}
.mmx-promo-ico{width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.25rem;background:var(--yellow);color:#1a1a1a;margin-bottom:auto;box-shadow:0 0.25rem 0.6rem rgba(0,0,0,0.35)}
.mmx-promo-title{font-size:1.375rem;font-weight:800;line-height:1.12;color:#fff}
.mmx-promo-text{font-size:0.9375rem;line-height:1.4;color:rgba(255,255,255,0.9)}
.mmx-promo-btn{margin-top:0.7rem;align-self:flex-start;font-size:0.9375rem;font-weight:700;padding:0.6rem 1.2rem;border-radius:0.5rem;background:var(--yellow);color:#1a1a1a;transition:transform .15s ease,box-shadow .15s ease}
.mmx-promo:hover .mmx-promo-btn{transform:translateY(-3px);box-shadow:0 0.5rem 1rem rgba(0,0,0,0.4)}

/* #541 — дефолт-панель подкатегорий: у категории без подкат показываем её имя + «Смотреть все» (не оставляем чужие подкат) */
.mmx-sub-default .mmx-sub-h{font-size:1rem;text-transform:none;color:#1a1a1a;font-weight:700;margin-bottom:0.9rem}
.mmx-subpanel a.mmx-sub-allbtn{display:none;align-items:center;gap:0.45rem;font-size:1rem;font-weight:600;color:#1a1a1a;text-transform:none;padding:0.55rem 1rem;border-radius:0.5rem;background:var(--yellow);letter-spacing:0;transition:background .15s ease}
.mmx-subpanel a.mmx-sub-allbtn i{font-size:0.75rem}
.mmx-subpanel a.mmx-sub-allbtn:hover{background:#ecdf00}

/* ============== КАТАЛОГ мега-дропдаун (макет Desktop-14): открытие по наведению ============== */
/* пока открыт дропдаун «Каталог» — приглушаем строку категорий (не выглядывает из-под панели) */
.catnav{transition:opacity .18s ease}
.catnav.cm-dim{opacity:0.15;pointer-events:none}
/* панель на 100% ширины контейнера: позиционируем относительно .mainnav, не кнопки */
.mainnav{position:relative}
.catmenu-group{position:static;display:flex;gap:1.2rem;margin-left:-25px}
/* мост от кнопки к панели, чтобы курсор не «проваливался» в зазор */
.catmenu-group > .catmenu-trigger{padding-bottom:1.75rem;margin-bottom:-1.75rem}
.catmenu{
  position:absolute;top:100%;left:var(--side-pad);right:var(--side-pad);z-index:60;
  background:#fff;border:1px solid #ececec;border-radius:1rem;
  box-shadow:0 1.1rem 3rem rgba(0,0,0,0.16);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(1.5rem);
  /* Мягкое раскрытие: анимируем ТОЛЬКО opacity и transform (как в FAQ).
     visibility переключаем дискретно — при закрытии с задержкой .26s (ждём
     затухание), при открытии мгновенно. Так уходим от бага Chrome, где
     visibility в списке transition превращает раскрытие в «щелчок». */
  transition:opacity .24s ease,transform .26s cubic-bezier(.22,.61,.36,1),visibility 0s linear .26s;
}
.catmenu-group.cm-open .catmenu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0.6rem);
  transition:opacity .24s ease,transform .26s cubic-bezier(.22,.61,.36,1),visibility 0s linear 0s;
}
/* профиль | каталог | контакты — контакты занимают остаток на всю ширину */
/* 4 равные колонки по 25% с вертикальными разделителями (как в макете) */
.catmenu-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.cm-col{padding:1.35rem 1.25rem}
.catmenu-grid > .cm-col + .cm-col{border-left:1px solid #ececec}
.cm-h-empty{visibility:hidden}
/* профиль */
.cm-user{display:flex;align-items:center;gap:0.65rem;margin-bottom:1rem}
.cm-avatar{width:2.75rem;height:2.75rem;border-radius:50%;background:#e2e2e2;color:#9a9a9a;display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}
.cm-user-name{font-size:1.1rem;font-weight:700;color:#000;letter-spacing:0}
.cm-user-sub{font-size:0.95rem;color:#1a1a1a;font-weight:500;line-height:1.3}
.cm-user-mail{font-size:0.95rem;color:#8a8a8a}
.cm-acc{display:flex;align-items:center;gap:0.65rem;padding:0.5rem;border-radius:0.5rem;color:#1a1a1a;font-size:1rem;font-weight:500;transition:background .14s ease}
.cm-acc i{width:1.35rem;text-align:center;color:#444;font-size:1rem}
.cm-acc:hover{background:#efefef;color:#000}
.cm-acc .cm-badge{margin-left:auto;background:var(--yellow);color:#1a1a1a;font-size:0.7rem;font-weight:700;min-width:1.1rem;height:1.1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0 0.2rem}
.cm-theme{display:flex;align-items:center;justify-content:space-between;margin-top:0.75rem;padding:0.4rem 0.5rem;font-size:1rem;font-weight:500;color:#1a1a1a}
.cm-theme-switch{display:inline-flex;align-items:center;gap:0.4rem;color:#8a8a8a;cursor:pointer}
.cm-theme-switch .cm-toggle{width:2rem;height:1.05rem;border-radius:1rem;background:#d3d3d3;position:relative;transition:background .15s}
.cm-theme-switch .cm-toggle::after{content:"";position:absolute;top:0.12rem;left:0.14rem;width:0.8rem;height:0.8rem;border-radius:50%;background:#fff;transition:transform .15s}
/* заголовки колонок */
.cm-h{font-size:1.05rem;font-weight:700;color:#000;margin-bottom:0.9rem}
.cm-catlink{display:flex;align-items:center;gap:0.7rem;padding:0.5rem;border-radius:0.6rem;transition:background .14s ease}
.cm-catlink:hover{background:#f5f5f5}
.cm-catlink-img{width:3rem;height:3rem;border-radius:0.5rem;background:#f2f2f2;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.cm-catlink-img img{max-width:100%;max-height:100%;object-fit:contain}
.cm-catlink-txt{display:flex;flex-direction:column;line-height:1.25}
.cm-catlink-txt b{font-size:1rem;font-weight:600;color:#000}
.cm-catlink-txt i{font-size:0.85rem;color:#8a8a8a;font-style:normal}
.cm-catlink-arr{margin-left:auto;color:#bcbcbc;font-size:0.8rem;transition:color .14s,transform .14s}
.cm-catlink:hover .cm-catlink-arr{color:#000;transform:translateX(2px)}
/* §Меню #2: выпадающие подкатегории при наведении на пункт каталога. */
.cm-catlink-wrap{position:relative}
/* Подкатегории — по столбцам (1,2,3,4 | 5,6,7), как везде: CSS-колонки заполняют
   сначала левый столбик сверху вниз, потом правый (а не построчно, как grid). */
.cm-subflyout{position:absolute;left:100%;top:-40px;width:40rem;max-width:calc(100vw - 4rem);max-height:calc(100vh - 5rem);overflow:auto;background:#fff;border:1px solid var(--gray-border);border-radius:.8rem;box-shadow:0 12px 40px rgba(0,0,0,.14);padding:.5rem;display:none;column-count:2;column-gap:.35rem;z-index:20}
.cm-catlink-wrap.has-sub:hover .cm-subflyout{display:block}
.cm-catlink-wrap.has-sub:hover .cm-catlink{background:#f2f2f2}
.cm-catlink-wrap.has-sub:hover .cm-catlink-arr{color:#000;transform:translateX(2px)}
.cm-subflyout a{display:block;break-inside:avoid;padding:.4rem .7rem;border-radius:.5rem;color:#1a1a1a;text-decoration:none;font-size:.9rem;line-height:1.25}
.cm-subflyout a:hover{background:#f2f2f2}
.cm-subflyout-all{grid-column:1 / -1;font-weight:700;display:inline-flex;align-items:center;gap:.4rem;margin-top:.25rem;border-top:1px solid #f0f0f0;padding-top:.6rem}
.cm-subflyout-all i{font-size:.78rem}
.ktg-dark .cm-subflyout{background:#232323;border-color:#333}
.ktg-dark .cm-subflyout a{color:#e8e8e8}
.ktg-dark .cm-subflyout a:hover,.ktg-dark .cm-catlink-wrap.has-sub:hover .cm-catlink{background:#333}
.ktg-dark .cm-subflyout-all{border-top-color:#333}
/* контакты */
.cm-contacts-cols{display:grid;grid-template-columns:1fr 1fr;gap:0.35rem 1.25rem}
.cm-link{display:flex;align-items:center;gap:0.6rem;padding:0.55rem 0;font-size:1rem;color:#3e3e3e;transition:color .14s}
/* §Меню(3) 5: разделитель-линия в колонке меню (как логические блоки в мобилке). */
.cm-sep{height:1px;background:#ececec;margin:0.5rem 0}
.ktg-dark .cm-sep{background:#333}
.cm-link i{width:1.2rem;text-align:center;color:#8a8a8a;font-size:0.95rem;flex-shrink:0}
.cm-link:hover{color:#000}
/* нижняя полоса */
.catmenu-bottom{display:flex;align-items:center;gap:1.5rem;padding:0.9rem 1.35rem;background:#f7f7f7;border-top:1px solid #ececec}
.cm-b-item{display:inline-flex;align-items:center;gap:0.5rem;font-size:1rem;color:#1a1a1a;font-weight:500}
.cm-b-item i{color:#444}
.cm-b-social{display:inline-flex;align-items:center;gap:0.8rem}
.cm-b-social a{color:#1a1a1a;font-size:1.1rem;transition:color .14s}
.cm-b-social a:hover{color:var(--red)}
.cm-b-logout{margin-left:auto;display:inline-flex;align-items:center;gap:0.5rem;font-size:1.05rem;font-weight:600;color:#1a1a1a}
.cm-b-logout i{color:#444}

/* ===== Партнёры: непрерывная лента (marquee) + drag/свайп ===== */
.partners-row.is-marquee{justify-content:flex-start;gap:0;flex-wrap:nowrap;will-change:transform;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.partners-row.is-marquee.is-grabbing{cursor:grabbing}
.partners-row.is-marquee .partner-logo{flex:0 0 auto;padding:0;min-width:0}
.partners-row.is-marquee .partner-logo img,.partners-row.is-marquee .partner-logo svg{pointer-events:none;-webkit-user-drag:none}

/* ==================================================================
   ТЁМНАЯ ТЕМА (.ktg-dark на <html>). Жёлтый/красный — фирменные, не трогаем.
   ================================================================== */
.ktg-dark{
  color-scheme:dark;
  --focus:#FDCD00;
  --gray-bg:#1c1c1c;
  --gray-light:#242424;
  --gray-border:#3a3a3a;
  --gray-text:#9a9a9a;
  --gray-text-dark:#b0b0b0;
  --gray-muted:#8a8a8a;
  --gray-sku:#8a8a8a;
}
.ktg-dark body{background:#121212;color:#e8e8e8}

/* — переключатель темы в дропдауне (knob) — */
.cm-theme-switch.is-dark .cm-toggle{background:var(--yellow)}
.cm-theme-switch.is-dark .cm-toggle::after{transform:translateX(0.95rem)}

/* — шапка / топбар / строка категорий — */
.ktg-dark .topbar,.ktg-dark .mainnav,.ktg-dark .catnav,.ktg-dark .nav-actions{background:#1b1b1b}
.ktg-dark .lang-select,.ktg-dark .location-row,.ktg-dark .location-row span,.ktg-dark .contact-item,
.ktg-dark .nav-btn,.ktg-dark .catnav-item,.ktg-dark .dark-toggle{color:#e8e8e8}
.ktg-dark .location-sub{color:#9a9a9a}
.ktg-dark .catnav-item:hover{color:#bbb}
.ktg-dark .catnav-caret,.ktg-dark .lang-caret,.ktg-dark .city-caret{color:#cfcfcf}
.ktg-dark .city-menu{background:#232323;border-color:#3a3a3a;box-shadow:0 12px 34px rgba(0,0,0,.5)}
.ktg-dark .city-item{color:#e8e8e8}
.ktg-dark .city-item:hover{background:#2f2f2f}
.ktg-dark .city-item.is-active{background:var(--yellow);color:#1a1a1a}
.ktg-dark .city-item-addr{color:#9a9a9a}
.ktg-dark .city-item.is-active .city-item-name,.ktg-dark .city-item.is-active .city-item-addr{color:#1a1a1a}
.ktg-dark .city-menu-all{color:#e8e8e8;border-top-color:#3a3a3a}
.ktg-dark .city-menu-all:hover{color:#fff}
.ktg-dark .search-input{background:#2a2a2a;color:#e8e8e8}
.ktg-dark .search-input::placeholder{color:#8a8a8a}
.ktg-dark .search-svg{stroke:#e8e8e8}
/* тёмная тема: чёрные растровые/SVG иконки шапки (Каталог/Корзина/Сравнить) —
   осветляем в белый силуэт, иначе сливаются с тёмным фоном */
.ktg-dark .nav-ico{filter:brightness(0) invert(1)}

/* — мега-меню категорий — */
.ktg-dark .megamenu{background:#222;border:1px solid #333}
.ktg-dark .mmx-cat{color:#dcdcdc}
.ktg-dark .mmx-cat:hover,.ktg-dark .mmx-cat.is-active{background:#2e2e2e;color:#fff}
.ktg-dark .mmx-cats{border-right-color:#333}
.ktg-dark .mmx-subs{background:#1b1b1b;border-right-color:#333}
.ktg-dark .mmx-sub-default .mmx-sub-h,.ktg-dark .mmx-sub-h{color:#e8e8e8}
.ktg-dark .mmx-subpanel a{color:#c2c2c2}
.ktg-dark .mmx-subpanel a:hover{color:#fff;background:#2a2a2a}
/* §50: кнопка «Все товары» — тёмный текст на жёлтом и в тёмной теме (не серый). */
.ktg-dark .mmx-subpanel a.mmx-sub-allbtn{color:#1a1a1a}

/* — дропдаун «Каталог» — */
.ktg-dark .catmenu{background:#222;border-color:#333}
.ktg-dark .catmenu-grid > .cm-col + .cm-col{border-left-color:#333}
.ktg-dark .cm-avatar{background:#333;color:#bbb}
.ktg-dark .cm-user-name,.ktg-dark .cm-user-sub,.ktg-dark .cm-h,.ktg-dark .cm-acc,
.ktg-dark .cm-catlink-txt b,.ktg-dark .cm-b-item,.ktg-dark .cm-b-logout,.ktg-dark .cm-theme,
.ktg-dark .cm-b-social a{color:#e8e8e8}
.ktg-dark .cm-acc i,.ktg-dark .cm-b-item i,.ktg-dark .cm-b-logout i,.ktg-dark .cm-link i{color:#9a9a9a}
.ktg-dark .cm-acc:hover,.ktg-dark .cm-catlink:hover{background:#2a2a2a}
.ktg-dark .cm-catlink-img{background:#2a2a2a}
.ktg-dark .cm-link{color:#bcbcbc}
.ktg-dark .cm-link:hover{color:#fff}
.ktg-dark .catmenu-bottom{background:#1b1b1b;border-top-color:#333}

/* — плитки категорий (Бытовой/Проф пилюли — фирменные, не трогаем) — */
/* §3: плитки категорий в тёмной теме держим БЕЛЫМИ — картинки всегда на белом фоне,
   чтобы не было эффекта «плохо вырезано» у непрозрачных/светлых PNG. */
.ktg-dark .cat-icon-img{background:#fff;border-color:#3a3a3a}
.ktg-dark .cat-icon-name{color:#e8e8e8}

/* — блоки товаров + карточки — */
.ktg-dark .products-band{background:#161616}
.ktg-dark .products-col h2,.ktg-dark .ptitle,.ktg-dark .prod-viewall{color:#f2f2f2}
.ktg-dark .product-card{background:#232323;box-shadow:0 0 0.625rem rgba(0,0,0,0.6)}
.ktg-dark .pc-sku,.ktg-dark .pc-title,.ktg-dark .pc-subtitle,.ktg-dark .pc-price{color:#f2f2f2}
.ktg-dark .pc-rating,.ktg-dark .pc-rating .star,.ktg-dark .pc-rating .count{color:#cfcfcf}
.ktg-dark .pc-old{color:#cfcfcf}
/* §4 Тёмная тема: срок доставки был чёрным по тёмному (невидим),
   а красный --red (#c20000) на #232323 не читался — осветляем. */
.ktg-dark .pc-stock-right{color:#c9c9c9}
.ktg-dark .pc-discount,.ktg-dark .pc-install,.ktg-dark .fav-install{color:#ff6b6b}
/* §13: счётчик количества в тёмной теме — тоже жёлтый, как в светлой. */
.ktg-dark .pc-counter{background:var(--yellow);color:#1a1a1a}

/* — преимущества / партнёры / галерея — */
.ktg-dark .benefits{background:#1b1b1b}
.ktg-dark .benefit-title{color:#f2f2f2}
.ktg-dark .benefit-sub{color:#a8a8a8}
.ktg-dark .partners{background:#1b1b1b}
.ktg-dark .partners h3{color:#f2f2f2}
/* Правка клиента: лого в белой плашке одного размера; при смене темы САМО лого
   не меняем — плашка белая всегда, поэтому фильтр осветления не нужен. */
.ktg-dark .partners-dots span.active{background:#fff}

/* — форма заявки + отзывы — */
.ktg-dark .form-section{background:#1b1b1b}
.ktg-dark .form-inner h2,.ktg-dark .reviews-col h2,.ktg-dark .form-title,
.ktg-dark .form-col h3,.ktg-dark .reviews-col h3{color:#f2f2f2}
/* .reviews-col/.reviews-widget тёмный фон убран по правке клиента — колонка
   прозрачная, тёмный фон только у самой карточки отзывов (.reviews-card). */
/* §Отзывы на главной (.reviews-card/.review-*): тёмная тема — коробка и текст. */
.ktg-dark .reviews-card{background:#232323;box-shadow:0 0 0.625rem rgba(0,0,0,0.5)}
.ktg-dark .review-name{color:#f2f2f2}
.ktg-dark .review-text{color:#cfcfcf}
.ktg-dark .review-count,.ktg-dark .review-date{color:#8a8a8a}
.ktg-dark .review-avatar{background:#3a3a3a;color:#d8d8d8}
.ktg-dark .form-field input,.ktg-dark .form-field textarea,.ktg-dark input[type=text],
.ktg-dark input[type=email],.ktg-dark textarea{background:#2a2a2a;color:#e8e8e8;border-color:#3a3a3a}
.ktg-dark .form-field input::placeholder,.ktg-dark textarea::placeholder{color:#8a8a8a}
/* §форма: тёмная тема для карточки заявки (.form-card / .ktg-lead) */
.ktg-dark .form-card{background:#232323;box-shadow:0 0 0.625rem rgba(0,0,0,0.45)}
.ktg-dark .form-card input,
.ktg-dark .form-card select,
.ktg-dark .form-card textarea{background:#2a2a2a;color:#e8e8e8;border-color:#3a3a3a}
.ktg-dark .form-card input::placeholder,
.ktg-dark .form-card textarea::placeholder{color:#8a8a8a}
.ktg-dark .form-card select option{background:#2a2a2a;color:#e8e8e8}
.ktg-dark .form-agree{color:#bdbdbd}

/* — подвал — */
.ktg-dark .footer,.ktg-dark footer{background:#161616}
.ktg-dark .footer a,.ktg-dark .footer span,.ktg-dark footer a,.ktg-dark footer span,
.ktg-dark .footer h4,.ktg-dark .footer-nav a,
.ktg-dark .footer-tagline,.ktg-dark .footer-addr,.ktg-dark .footer-addr-text,
.ktg-dark .footer-addr-text *,.ktg-dark .footer-nav-col ul li,.ktg-dark .footer-bottom{color:#cfcfcf}
.ktg-dark .footer a:hover,.ktg-dark .footer-nav a:hover{color:#fff}

/* — hero: уже тёмный, только точки — */
.ktg-dark .hero-dots span{background:#555}
.ktg-dark .hero-dots span.active{background:#fff}

/* — общие заголовки/секции — */
.ktg-dark .section h2,.ktg-dark h1,.ktg-dark h2,.ktg-dark h3{color:#f2f2f2}
.ktg-dark .lightbox,.ktg-dark .lb-backdrop{background:rgba(0,0,0,0.9)}

/* ===== Плавающие кнопки телефон + WhatsApp (тема, вместо плагина Chaty) ===== */
#chaty-widget-0{display:none !important}
.ktg-fab{position:fixed;right:1.5rem;bottom:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:0.75rem}
.ktg-fab-btn{
  position:relative;
  width:3.375rem;height:3.375rem;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1.55rem;line-height:1;text-decoration:none;
  box-shadow:0 0.375rem 1.125rem rgba(0,0,0,0.28);
  transition:transform .15s ease,box-shadow .15s ease;
}
.ktg-fab-btn:hover{transform:scale(1.08);box-shadow:0 0.5rem 1.4rem rgba(0,0,0,0.34)}
.ktg-fab-toggle{align-self:center;width:2.1rem;height:2.1rem;border:0;border-radius:50%;background:#1a1a1a;color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.85rem;
  box-shadow:0 .25rem .7rem rgba(0,0,0,.28);transition:transform .2s ease,background .2s ease;margin-bottom:.15rem}
.ktg-fab-toggle:hover{background:#000}
.ktg-fab.is-collapsed .ktg-fab-btn{display:none}
/* Свёрнутый тумблер выравниваем с кнопкой «наверх» (плагин: right:14px,46×46).
   Те же пиксели и размер → центры совпадают точно, независимо от базового rem. */
.ktg-fab.is-collapsed{right:14px}
.ktg-fab.is-collapsed .ktg-fab-toggle{background:var(--orange);color:#1a1a1a;width:46px;height:46px;font-size:1rem}
.ktg-fab.is-collapsed .ktg-fab-toggle i{transform:rotate(180deg)}
.ktg-fab-phone{background:var(--orange)}
.ktg-fab-wa{background:#25d366}
/* §Мобайл: Kaspi-кнопка в FAB — картинка kaspi.png (красный диск «Рассрочка
   0-0-12»); cover заполняет круг, тёмные углы срезаются круглой маской. */
.ktg-fab-kaspi{background:#F14635;overflow:hidden}
.ktg-fab-kaspi img{width:100%;height:100%;object-fit:cover;display:block}
.ktg-fab-mobile{display:none}
@media(max-width:900px){.ktg-fab-mobile{display:flex}}
/* мягкий пульс у WhatsApp и Звонка */
.ktg-fab-wa::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(37,211,102,0.55);animation:ktgFabPulse 2.2s ease-out infinite}
.ktg-fab-phone::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(253,205,0,0.6);animation:ktgFabPulseOrange 2.2s ease-out infinite}
@keyframes ktgFabPulse{to{box-shadow:0 0 0 0.9rem rgba(37,211,102,0)}}
@keyframes ktgFabPulseOrange{to{box-shadow:0 0 0 0.9rem rgba(253,205,0,0)}}
@media (prefers-reduced-motion:reduce){.ktg-fab-wa::after,.ktg-fab-phone::after{animation:none}}
/* карточка: «сравнить» — активное состояние */
.pc-compare{cursor:pointer}
.pc-compare.active .pc-compare-ico{background-color:var(--yellow)}

/* ================= СТРАНИЦА КАТАЛОГА (Desktop-11) ================= */
/* Мини-баннер второстепенных страниц: в рабочей зоне (не на весь экран),
   минималистичный — без фото, тёмная карта с жёлтым акцентом Karcher. */
.cat-hero{position:relative;max-width:var(--container-max);margin:1.5rem auto 1rem;padding:0 var(--container-pad);height:auto;background:none;overflow:visible}
.cat-hero-bg{display:none}
.cat-hero::after{display:none}
.cat-hero-inner{position:relative;z-index:1;max-width:none;margin:0;padding:1.9rem 2.4rem;min-height:6.25rem;height:auto;display:flex;flex-direction:column;justify-content:center;gap:.35rem;border-radius:1.25rem;overflow:hidden;background:linear-gradient(115deg,#181818 0%,#2a2a2a 100%)}
/* Фон-фото мини-баннера. Затемнение идёт слева направо: текст лежит на плотной
   тёмной части, снимок раскрывается справа — там, где раньше был жёлтый блик. */
.cat-hero-inner.has-photo,.lk-head.has-photo{
  background:
    linear-gradient(90deg, rgba(14,14,14,.94) 0%, rgba(14,14,14,.86) 32%, rgba(14,14,14,.55) 62%, rgba(14,14,14,.3) 100%),
    var(--hero-bg) var(--hero-pos,center)/cover no-repeat;
  /* Высота под пропорции конкретного снимка. По умолчанию 306px — высота
     каталожного исходника 1920×306, он показывается без масштабирования.
     Страница может задать свою через --hero-h, чтобы фото легло по всей
     ширине и не обрезалось по бокам. */
  min-height:var(--hero-h,306px);
}
.cat-hero-inner.has-photo::after,.lk-head.has-photo::after{display:none}
.ktg-dark .cat-hero-inner.has-photo,.ktg-dark .lk-head.has-photo{
  background:
    linear-gradient(90deg, rgba(8,8,8,.95) 0%, rgba(8,8,8,.88) 32%, rgba(8,8,8,.62) 62%, rgba(8,8,8,.38) 100%),
    var(--hero-bg) var(--hero-pos,center)/cover no-repeat;
}
@media(max-width:640px){
  /* на узком экране текста больше, чем места — затемняем равномернее */
  .cat-hero-inner.has-photo,.lk-head.has-photo{
    background:
      linear-gradient(90deg, rgba(14,14,14,.94) 0%, rgba(14,14,14,.84) 60%, rgba(14,14,14,.62) 100%),
      var(--hero-bg) var(--hero-pos,center)/cover no-repeat;
  }
  /* Отдельный кадр для телефона. Широкий десктопный снимок на узком экране
     обрезается до полоски, поэтому здесь ставится своя, более вертикальная
     версия — и высота под неё, а не 306px от десктопного исходника. */
  .cat-hero-inner.has-photo-m,.lk-head.has-photo-m{
    background:
      linear-gradient(180deg, rgba(14,14,14,.55) 0%, rgba(14,14,14,.78) 55%, rgba(14,14,14,.92) 100%),
      var(--hero-bg-m) var(--hero-pos-m,center)/cover no-repeat;
    min-height:200px;
  }
  .ktg-dark .cat-hero-inner.has-photo-m,.ktg-dark .lk-head.has-photo-m{
    background:
      linear-gradient(180deg, rgba(8,8,8,.6) 0%, rgba(8,8,8,.82) 55%, rgba(8,8,8,.94) 100%),
      var(--hero-bg-m) var(--hero-pos-m,center)/cover no-repeat;
  }
  /* текст прижимаем к низу — там затемнение плотнее */
  .cat-hero-inner.has-photo-m,.lk-head.has-photo-m{justify-content:flex-end}
}
.cat-hero-inner::before{content:"";position:absolute;left:0;top:0;bottom:0;width:.4rem;background:var(--yellow);z-index:1}
.cat-hero-inner::after{content:"";position:absolute;right:-2.5rem;top:-4rem;width:13rem;height:16rem;background:radial-gradient(circle,rgba(255,240,3,.16),transparent 68%);pointer-events:none}
.cat-hero h1{position:relative;z-index:1;color:#fff;font-size:2rem;font-weight:800;margin:0 0 0 .5rem;letter-spacing:-.01em;text-shadow:none}
.cat-hero .cat-hero-sub{position:relative;z-index:1;color:#bdbdbd;font-size:.95rem;margin-left:.5rem}
.ktg-dark .cat-hero-inner{background:linear-gradient(115deg,#101010,#202020)}

/* хлебные крошки */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.9375rem;color:var(--gray-text);margin:1.5rem 0}
.crumbs a{color:var(--gray-text);transition:color .15s ease}
.crumbs a:hover{color:#000}
.crumbs span{color:var(--gray-border)}
.crumbs .cur{color:#1a1a1a;font-weight:600}

/* панель фильтров */
.fbar{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
.fbar-row{display:grid;gap:.75rem}
.fbar-row-cats{grid-template-columns:1fr 1fr 1fr}
.fbar-row-sort{grid-template-columns:1fr 1.5fr}
.fbar-row-attrs{grid-template-columns:1fr 1fr}
.fbar-select{min-width:0}
.fbar-sort-select{width:100%;min-width:0;text-overflow:ellipsis}
.fbar-sort-select:disabled{cursor:not-allowed}
.fbar-select:has(select:disabled){opacity:.55;cursor:not-allowed;background:#f7f7f7}
.fbar-select{display:flex;align-items:center;gap:.55rem;background:#fff;border:1px solid var(--gray-border);border-radius:.625rem;
  padding:0;font-size:.9375rem;color:#1a1a1a;cursor:pointer;font-family:inherit;min-width:0;transition:border-color .15s ease}
.fbar-select:hover{border-color:#9a9a9a}
.fbar-select>i:first-child{color:var(--gray-muted);font-size:.95rem;flex-shrink:0}
.fbar-select>span{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-caret{font-size:.6875rem;color:var(--gray-muted);flex-shrink:0}
.fbar-sort>i:first-child{color:var(--star)}
.fbar-price{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--gray-border);border-radius:.625rem;padding:.4rem .85rem;min-width:0}
.fbar-price input{min-width:2.5rem}
.fbar-price>span:first-child{color:var(--gray-muted);font-size:.9375rem;white-space:nowrap}
.fbar-price input{flex:1;width:auto;min-width:0;border:none;background:#f0f0f0;border-radius:.4rem;padding:.45rem .55rem;font-family:inherit;font-size:.875rem;outline:none;color:#1a1a1a}
.fp-dash{color:var(--gray-muted)}
.fbar-search{display:flex;background:#fff;border:1px solid var(--gray-border);border-radius:50px;overflow:hidden;min-width:0}
.fbar-find{display:none}
.fbar-search input{flex:1;min-width:0;border:none;padding:.7rem 1rem;font-family:inherit;font-size:.9375rem;outline:none;background:transparent;color:#1a1a1a}
.fbar-search button{background:var(--yellow);border:none;padding:0 1.15rem;cursor:pointer;color:#1a1a1a;font-size:1rem;flex-shrink:0}

/* Бытовой / Профессиональный блоки */
.cat-feat{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2.5rem}
.cat-feat-col{display:flex;flex-direction:column;min-width:0}
.cf-tab{text-align:center;font-weight:800;font-size:1.25rem;padding:.9rem 1rem .7rem;border-radius:1rem 1rem 0 0}
.cf-tab::after{content:"";display:block;width:5.5rem;height:3px;background:var(--yellow);margin:.4rem auto 0;border-radius:2px}
.cf-tab-yellow{background:#fff;color:#1a1a1a;border:1px solid var(--gray-border);border-bottom:none}
.cf-tab-dark{background:#3e3e3e;color:#fff}
.cf-carousel{position:relative;border:1px solid var(--gray-border);border-top:none;border-radius:0 0 1rem 1rem;padding:1.1rem 2.1rem;background:#fafafa}
.cf-track{display:flex;gap:.75rem;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}
.cf-track::-webkit-scrollbar{display:none}
.cf-track .cat-card{flex:0 0 calc((100% - 1.5rem)/3);min-width:0}
.cf-arrow{position:absolute;top:50%;transform:translateY(-50%);width:1.75rem;height:1.75rem;border:none;background:transparent;
  color:#1a1a1a;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;z-index:2;transition:opacity .15s ease}
.cf-arrow:hover{opacity:.55}
.cf-arrow.left{left:.35rem}.cf-arrow.right{right:.35rem}

/* карточка каталога */
.cat-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--gray-border);border-radius:1rem;
  padding:.75rem;color:#1a1a1a;transition:box-shadow .15s ease,border-color .15s ease}
.cat-card:hover{box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1);border-color:#c9c9c9}
.cc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.4rem}
.cc-fav{color:#cfcfcf;cursor:pointer;font-size:1rem;line-height:1}
.cc-fav.active{color:var(--red)}
.cc-sku{font-size:.75rem;color:#000;font-weight:300}
.cc-cmp{color:#1a1a1a;cursor:pointer;font-size:.9rem;line-height:1}
.cc-img{height:165px;display:flex;align-items:center;justify-content:center;margin-bottom:.3rem}
.cc-img img{max-width:100%;max-height:165px;object-fit:contain}
.cc-badges{display:flex;align-items:center;justify-content:space-between;min-height:1.25rem;margin-bottom:.25rem}
.cc-disc{color:var(--red);font-weight:700;font-size:.85rem}
.cc-tag{font-size:.6875rem;font-weight:700;padding:.15rem .5rem;border-radius:.4rem;color:#fff}
.cc-tag.hit{background:var(--red)}.cc-tag.new{background:var(--green)}
.cc-old{font-size:.75rem;color:var(--gray-muted);text-decoration:line-through;text-align:center;min-height:1rem}
.cc-price{font-size:1.0625rem;font-weight:700;text-align:center;color:#000}
.cc-name{font-size:.85rem;text-align:center;color:#1a1a1a;margin-top:.1rem}
.cc-install{font-size:.72rem;color:var(--red);text-align:center;font-weight:500;margin-top:.15rem}
.cc-sub{font-size:.8rem;color:var(--gray-text);text-align:center;margin-top:.45rem}
.cc-add{display:flex;justify-content:center;margin-top:.7rem}
.cc-counter{display:inline-flex;align-items:center;background:var(--yellow);border-radius:.5rem;overflow:hidden;font-weight:700}
.cc-counter span{padding:.35rem .85rem;cursor:pointer;user-select:none;color:#1a1a1a}
.cc-counter span:nth-child(2){background:rgba(0,0,0,.07);min-width:2.4rem;text-align:center;padding-left:.4rem;padding-right:.4rem}

/* сетка товаров */
.cat-grid-h{font-size:1.625rem;font-weight:800;text-align:center;margin:1.75rem 0 1.5rem;color:#1a1a1a}
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-bottom:2.5rem}
@media(max-width:1100px){.cat-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.cat-grid{grid-template-columns:repeat(3,1fr)}.cat-feat{grid-template-columns:1fr}.fbar-row-cats{grid-template-columns:1fr 1fr 1fr}.fbar-row-sort,.fbar-row-attrs{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fbar-row-cats,.fbar-row-sort,.fbar-row-attrs{grid-template-columns:1fr}}
@media(max-width:560px){.cat-grid{grid-template-columns:repeat(2,1fr)}}

/* пагинация */
.pager{display:flex;align-items:center;justify-content:center;gap:.4rem;margin:1.5rem 0 3.5rem}
.pg{min-width:2.25rem;height:2.25rem;padding:0 .5rem;display:flex;align-items:center;justify-content:center;border-radius:.5rem;
  font-weight:600;color:#1a1a1a;cursor:pointer;font-size:.9375rem;transition:background .15s ease}
.pg:hover{background:#ececec}
.pg.active{background:var(--yellow);color:#1a1a1a}
.pg-dots{color:var(--gray-muted);padding:0 .3rem}

/* --- тёмная тема каталога --- */
.ktg-dark .cat-hero{background:none}
.ktg-dark .crumbs a{color:#9a9a9a}
.ktg-dark .crumbs .cur{color:#e8e8e8}
.ktg-dark .crumbs span{color:#4a4a4a}
.ktg-dark .fbar-select,.ktg-dark .fbar-price,.ktg-dark .fbar-search{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .fbar-select,.ktg-dark .fbar-search input,.ktg-dark .fbar-price>span:first-child{color:#e8e8e8}
.ktg-dark .fbar-price input{background:#333;color:#e8e8e8}
.ktg-dark .cf-tab-yellow{background:#232323;color:#e8e8e8;border-color:#333}
.ktg-dark .cf-carousel{background:#1b1b1b;border-color:#333}
.ktg-dark .cf-arrow{color:#e8e8e8}
.ktg-dark .cat-card{background:#232323;border-color:#333;color:#e8e8e8}
.ktg-dark .cc-sku,.ktg-dark .cc-price,.ktg-dark .cc-name,.ktg-dark .cat-grid-h{color:#f2f2f2}
.ktg-dark .cc-cmp{color:#e8e8e8}
.ktg-dark .cc-old{color:#8a8a8a}
.ktg-dark .cc-sub{color:#a8a8a8}
.ktg-dark .pg{color:#e8e8e8}
.ktg-dark .pg:hover{background:#2a2a2a}

/* ===== Каталог: описание + сетки категорий (макет 3256:2) ===== */
.cat-desc-h{font-size:1.5rem;font-weight:800;text-align:center;margin:.5rem 0 1.5rem;color:#1a1a1a}
/* scroll-margin-top = высота липкой шапки, чтобы при авто-переходе заголовок
   категории приземлялся ПОД шапкой, а не за ней (десктоп: mainnav+catnav ≈164px). */
.cat-desc,.cat-groups{scroll-margin-top:12rem}
@media(max-width:900px){.cat-desc,.cat-groups{scroll-margin-top:4.5rem}}
.cat-desc{max-width:56rem;margin:.5rem auto 2rem;text-align:left}
.cat-desc .cat-desc-h{margin-bottom:.6rem}
.cat-desc-body{color:var(--gray-text);font-size:1rem;line-height:1.6}
.cat-desc-body p{margin:0 0 .6rem}
.cat-desc-body img{max-width:100%;height:auto;border-radius:.6rem}
.ktg-dark .cat-desc-body{color:#b5b5b5}
/* §Каталог [6][7][11]: описание свёрнуто по умолчанию, раскрывается по «Подробнее». */
.cat-desc-body{display:none;margin-bottom:.6rem}
.cat-desc.is-open .cat-desc-body{display:block}
.cat-desc-more{display:inline-flex;align-items:center;gap:.4rem;background:none;border:0;cursor:pointer;color:#797979;font:inherit;font-weight:600;font-size:.92rem;padding:.2rem .3rem;margin:0 auto .3rem;transition:color .15s ease}
.cat-desc-more:hover{color:#1a1a1a}
.cat-desc-more i{transition:transform .2s ease}
.cat-desc.is-open .cat-desc-more i{transform:rotate(180deg)}
.ktg-dark .cat-desc-more{color:#9a9a9a}
.ktg-dark .cat-desc-more:hover{color:#f0f0f0}
/* §Каталог [6]: в свёрнутой (полу-)панели описание/кнопку не показываем — блоки одинаковые. */
.cg-panel.collapsed .cat-desc-body,.cg-panel.collapsed .cat-desc-more{display:none !important}
.cat-groups{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2rem}
.cat-group-col{display:flex;flex-direction:column;min-width:0}
.cg-tab{text-align:center;font-weight:800;font-size:1.375rem;padding:.95rem 1rem .7rem;border-radius:1rem 1rem 0 0}
.cg-tab::after{content:"";display:block;width:9rem;max-width:60%;height:3px;background:var(--yellow);margin:.5rem auto 0;border-radius:2px}
.cg-tab-yellow{background:#fff;color:#1a1a1a;border:1px solid var(--gray-border);border-bottom:none}
.cg-tab-dark{background:#3e3e3e;color:#fff}
/* Шапки блоков каталога — «пилюли» как на главной */
.cg-pill{min-height:5rem;padding:.75rem 2.25rem;margin-bottom:2rem}
.cg-pill .title{font-size:1.5rem;margin-bottom:.15rem}
.cg-pill .sub{font-size:.9375rem}
@media(max-width:900px){.cat-group-col .cg-pill{border-radius:1rem}}
/* §8 (правка): без серого фон-блока — категории «как на главной», меньше зона
   нажатия. На десктопе — небольшой отступ сверху под кнопку разворота. */
.cg-panel{position:relative;background:transparent;border:0;border-radius:0;padding:0}
@media(min-width:901px){.cg-panel{padding:0rem 2rem 0}}
/* §Каталог 3: кнопка «расширить блок» (веб) — раскрывает блок на всю ширину, второй скрывается */
.cg-expand{position:absolute;top:-23px;right:.1rem;z-index:2;width:2rem;height:2rem;border:1px solid var(--gray-border);background:#fff;border-radius:.5rem;color:#666;cursor:pointer;display:none;align-items:center;justify-content:center;font-size:.8rem;transition:background .15s ease,color .15s ease}
.cg-expand:hover{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
@media(min-width:901px){.cat-group-col .cg-expand{display:flex}}
.cat-groups.has-expanded{grid-template-columns:1fr}
.cat-groups.has-expanded .cat-group-col:not(.is-expanded){display:none}
/* До 8 столбцов, но плитка не мельче 7rem — при малом числе подкатегорий (напр. 3)
   в половинной колонке они не схлопываются в крошечные иконки. */
@media(min-width:901px){.cat-group-col.is-expanded .cg-grid{grid-template-columns:repeat(auto-fill,minmax(9rem,1fr))}}
/* Отступ между плитками — равномерный 1.125rem (как на главной), одинаковый в
   свёрнутом и развёрнутом виде, чтобы при «развернуть» расстояние сохранялось. */
.cg-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.125rem}
.cg-grid .cat-icon-card{flex:none;min-width:0}
/* Свёрнутый блок = горизонтальная карусель со стрелками (как на главной): 4 плитки
   в окне, листается стрелками; «развернуть» раскрывает в сетку, отступы те же 1.125rem. */
.cg-panel.collapsed{padding-left:2rem;padding-right:2rem}
.cg-panel.collapsed .cg-grid{
  display:flex;flex-wrap:nowrap;overflow-x:auto;gap:1.125rem;
  scrollbar-width:none;padding:0;
}
.cg-panel.collapsed .cg-grid::-webkit-scrollbar{display:none}
/* min 7rem — при малом числе категорий плитки не схлопываются до 1/4 (не «ломаются»). */
.cg-panel.collapsed .cg-grid .cat-icon-card{flex:0 0 max(7rem, calc((100% - 3 * 1.125rem) / 4));display:flex;min-width:130px}
/* стрелки: видимы в свёрнутом, прозрачны (opacity 0) в развёрнутом */
.cg-arrow{transition:opacity .15s ease}
.cg-panel:not(.collapsed) .cg-arrow{opacity:0;pointer-events:none}
.cg-toggle{display:block;margin:1.35rem auto 0;background:none;border:none;color:var(--gray-text);font-size:.9375rem;cursor:pointer;font-weight:600;font-family:inherit;transition:color .15s ease}
.cg-toggle:hover{color:#1a1a1a}
.cg-toggle::after{content:" ▴";font-size:.75rem}
.cg-panel.collapsed .cg-toggle::after{content:" ▾"}
/* На страницах подкатегорий (блок показывает подкатегории) кнопка «развернуть/свернуть» не нужна. */
.cat-groups.is-subs .cg-toggle{display:none}
.cat-groups.has-expanded .cg-toggle{display:none}
.cat-reco-h{font-size:1.625rem;font-weight:800;text-align:center;margin:2.25rem 0 1rem;color:#1a1a1a}
.cat-reco-note{text-align:center;color:var(--gray-text);max-width:46ch;margin:0 auto 3rem;font-size:.95rem;line-height:1.5}
/* Брейкпоинт сведён к 900px (как у шапки): 881–900 больше не гибрид (мобильная шапка + десктопный блок). */
@media(max-width:900px){.cat-groups{grid-template-columns:1fr}}
@media(max-width:560px){.cg-grid{grid-template-columns:repeat(3,1fr)}}
/* §210 (моб): убрать зазор между шапкой и мини-баннером — как у главного hero. */
@media(max-width:600px){.cat-hero{margin-top:.5rem}}
/* §65/49 (моб): свёрнутый блок каталога = 1 ряд с горизонтальной прокруткой,
   как на главной (листается вбок); разворот показывает всё сеткой 3-в-ряд. */
@media(max-width:560px){
  /* §Мобайл 5: touch-action:auto (по умолчанию) — браузер сам решает: горизонтальный
     свайп листает ленту, вертикальный уходит в прокрутку страницы. pan-x залипал. */
  .cg-panel.collapsed .cg-grid{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.6rem;
    -webkit-overflow-scrolling:touch}
  .cg-panel.collapsed .cg-grid::-webkit-scrollbar{display:none}
  .cg-panel.collapsed .cg-grid .cat-icon-card{flex:0 0 calc((100% - 1.2rem)/3.2) !important;
    display:flex !important}
}
/* §Мобайл 5: плашки групп не должны перехватывать вертикальный свайп. */
.cat-pill,.cg-pill{touch-action:pan-y}
/* тёмная тема */
.ktg-dark .cat-desc-h,.ktg-dark .cat-reco-h{color:#f2f2f2}
.ktg-dark .cg-tab-yellow{background:#232323;color:#e8e8e8;border-color:#333}
.ktg-dark .cg-panel{background:transparent;border-color:transparent}
.ktg-dark .cat-reco-note{color:#9a9a9a}
.ktg-dark .cg-toggle{color:#9a9a9a}
.ktg-dark .cg-toggle:hover{color:#e8e8e8}

/* ==================================================================
   МОБИЛЬНАЯ ВЕРСИЯ (макет 393px) — шапка-гамбургер, drawer, нижняя навигация
   ================================================================== */
/* моб. элементы скрыты на десктопе */
.mtopbar,.msearch-bar,.mdrawer,.mdrawer-scrim,.mbottomnav{display:none}

@media (max-width:900px){
  /* никакого горизонтального скролла (clip не ломает sticky, в отличие от hidden) */
  html{overflow-x:clip}
  body{overflow-x:clip;max-width:100%}
  /* прячем десктопную шапку целиком */
  .topbar,.mainnav,.catnav{display:none !important}

  /* верхняя мобильная панель: гамбургер · лого · поиск */
  .mtopbar{display:grid;grid-template-columns:2.75rem 1fr 2.75rem;align-items:center;gap:.5rem;
    padding:.55rem 1rem;background:#fff;position:sticky;top:0;z-index:200;border-bottom:1px solid #ececec}
  .mburger{display:flex;flex-direction:column;justify-content:center;gap:.35rem;width:2.75rem;height:2.75rem;
    padding:.55rem;background:none;border:0;cursor:pointer}
  .mburger span{display:block;height:2px;background:#111;border-radius:2px;transition:transform .25s,opacity .2s}
  .mburger[aria-expanded="true"] span:nth-child(1){transform:translateY(.45rem) rotate(45deg)}
  .mburger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .mburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-.45rem) rotate(-45deg)}
  .mtopbar-logo{justify-self:center;display:flex;align-items:center}
  .mtopbar-logo img{height:1.85rem;width:auto}
  .msearch-toggle{justify-self:end;width:2.75rem;height:2.75rem;background:none;border:0;font-size:1.55rem;color:#111;cursor:pointer}

  /* раскрывающаяся строка поиска */
  .msearch-bar{display:flex;align-items:center;gap:.4rem;position:sticky;top:4rem;z-index:190;background:#fff;
    padding:0 1rem;max-height:0;overflow:hidden;transition:max-height .25s ease,padding .25s ease}
  .msearch-bar.is-open{max-height:4.5rem;padding:.6rem 1rem;border-bottom:1px solid #ececec}
  .msearch-bar input{flex:1;border:1px solid #ddd;border-radius:2rem;padding:.65rem 1rem;font-size:1rem;background:var(--gray-bg);text-align:center}
  .msearch-bar button{display:none}

  /* drawer-меню */
  .mdrawer-scrim{display:block;position:fixed;inset:0;width:100%;background:rgba(0,0,0,.45);z-index:300;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility .25s}
  .mdrawer-scrim.is-open{opacity:1;visibility:visible;pointer-events:auto}
  .mdrawer{display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;width:84%;max-width:20rem;background:#fff;
    z-index:310;transform:translateX(-100%);transition:transform .28s ease;overflow-y:auto;box-shadow:0 0 2rem rgba(0,0,0,.25)}
  .mdrawer.is-open{transform:translateX(0)}
  .mdrawer-top{position:relative;display:flex;align-items:center;justify-content:flex-start;padding:1rem 1.25rem;border-bottom:1px solid #ececec}
  .mdrawer-close{position:absolute;right:1.25rem;top:50%;transform:translateY(-50%)}
  .mdrawer-logo{height:1.7rem !important}
  .mdrawer-close{background:none;border:0;font-size:1.4rem;color:#111;cursor:pointer;padding:.25rem;line-height:1}
  .mdrawer-nav{display:flex;flex-direction:column;padding:.4rem 0}
  .mdrawer-nav a{display:flex;align-items:center;gap:.85rem;padding:.8rem 1.25rem;color:#1a1a1a;text-decoration:none;font-weight:600;font-size:1rem}
  .mdrawer-nav a i{width:1.35rem;text-align:center;color:#888;font-size:1rem}
  .mdrawer-nav a .badge{margin-left:auto;background:var(--yellow);color:#111;border-radius:1rem;min-width:1.3rem;height:1.3rem;
    display:inline-flex;align-items:center;justify-content:center;font-size:.72rem;padding:0 .4rem;font-weight:700}
  .mdrawer-nav a:active{background:#f5f5f5}
  .mdrawer-sep{height:1px;background:#ececec;margin:.2rem 1.25rem}
  .mdrawer-foot{margin-top:auto;padding:1rem 1.25rem 1.5rem;display:flex;flex-direction:column;gap:.7rem}
  .mdrawer-contact{display:flex;align-items:center;gap:.65rem;color:#333;text-decoration:none;font-size:.95rem}
  .mdrawer-contact i{width:1.2rem;text-align:center;color:#888}
  .mdrawer-meta{display:flex;align-items:center;gap:1.1rem;margin-top:.5rem;color:#555;font-size:.9rem}
  .mdrawer-meta .mdrawer-theme{margin-left:auto;background:none;border:1px solid #ddd;border-radius:50%;width:2.2rem;height:2.2rem;cursor:pointer;color:#111;font-size:.95rem}
  body.mnav-lock{overflow:hidden}

  /* нижняя навигация */
  .mbottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:200;background:#fff;border-top:1px solid #ececec;
    padding:.35rem .25rem calc(.35rem + env(safe-area-inset-bottom));box-shadow:0 -.3rem 1rem rgba(0,0,0,.06)}
  .mbn-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:.2rem;text-decoration:none;color:#666;font-size:.68rem;padding:.2rem 0}
  .mbn-ico{position:relative;font-size:1.2rem;line-height:1;color:#222}
  .mbn-ico .badge{position:absolute;top:-.55rem;right:-.7rem;background:var(--yellow);color:#111;border-radius:1rem;min-width:1.05rem;height:1.05rem;
    display:flex;align-items:center;justify-content:center;font-size:.62rem;padding:0 .28rem;font-weight:700}
  .mbn-lbl{white-space:nowrap}
  /* §78: клиент — «слишком большая, сделать как раньше, но ровно». Уменьшили
     размер и убавили подъём, чтобы кнопка была аккуратной, а не громоздкой. */
  .mbn-home .mbn-ico{background:#111;color:#fff;width:2.5rem;height:2.5rem;border-radius:.85rem;display:flex;align-items:center;
    justify-content:center;margin-top:-.4rem;box-shadow:0 .25rem .7rem rgba(0,0,0,.2);font-size:1.05rem}
  .mbn-home .mbn-lbl{margin-top:-.05rem}

  body{padding-bottom:4.4rem}
  .ktg-fab{bottom:5.6rem;right:1rem}

  /* контент: сетки и секции */
  .section{padding:0 1rem}
  .products-wrap{grid-template-columns:1fr;gap:2rem;padding:0 0 0 1rem}
  /* товары: горизонтальная лента → сетка 2 колонки */
  /* товары — слайдер по 2 в окне (горизонтальный свайп) */
  .products-grid{gap:.7rem;padding:.5rem 0}
  .product-card{width:auto}
  /* слайдеры «Популярные/Со скидкой»: 2 полных карточки + край третьей (подсказка о свайпе) */
  .products-grid .product-card{flex:0 0 calc(44% - .35rem)}
  .product-arrow{display:none}
  .products-col h2{font-size:1.4rem;margin-bottom:1.1rem}
  .cat-icon-card{flex:0 0 42% !important}
  /* чередование: баннер «Бытовой» → его плитки → баннер «Проф» → его плитки */
  .cat-section{display:flex;flex-direction:column}
  .cat-section .cat-split,.cat-section .cat-icons-section{display:contents}
  .cat-section .cat-pill.yellow{order:1}
  .cat-section .cat-icons-col:nth-child(1){order:2}
  .cat-section .cat-pill.dark{order:3}
  .cat-section .cat-icons-col:nth-child(2){order:4}
  .cat-section .cat-pill{margin-bottom:.5rem}
  .cat-section .cat-icons-col{margin-bottom:1.5rem;padding:0 1.75rem}
  .benefits-inner{grid-template-columns:1fr 1fr;gap:1rem}
  .benefit{gap:.55rem}
  .benefit-icon{height:3.6rem}
  .benefit-icon img{height:3.1rem}
  /* §Преимущества 1: последняя иконка («проф. сервис») чуть крупнее остальных. */
  .benefit:nth-child(4) .benefit-icon img{height:3.45rem}
  .benefit-sub{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .partners-row{flex-wrap:wrap;justify-content:center;gap:1.5rem 2rem}
  .gallery-inner{grid-template-columns:1fr}
  .form-inner{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr;gap:2rem}

  /* hero: без стрелок, заголовок и кнопка прижаты к низу слайда (как в макете) */
  /* §Мелкие 13: баннер выше — на первом экране виден только жёлтый блок «Бытовой Karcher» внизу */
  /* svh, не dvh: dvh меняет высоту при скрытии адресной строки — баннер
     «дёргается» при возврате вверх. svh стабилен (минимальный вьюпорт). */
  .hero{height:auto;min-height:calc(100svh - 16rem);padding-bottom:2.5rem;width:100%;border-radius:0;margin-top:0}
  /* §1.2: горизонтальные ленты не «цепляют» страницу на краях */
  .products-grid,.pc-slides,.cat-icons-viewport,.cf-track,.sp-thumbs,.benefits-inner{overscroll-behavior-x:contain}
  .hero-arrow{display:none}
  .hero-content{position:absolute;left:0;right:0;bottom:1.5rem;padding:0 1.35rem}
  .hero h1,.hero .hero-h{font-size:1.75rem;line-height:1.14;word-break:break-word;margin-bottom:1rem}
  .hero-cta{font-size:1rem;padding:.8rem 1.4rem}
  .hero-badge{font-size:1rem;padding:.55rem 1.1rem;top:1.25rem;right:1.25rem}
  .hero-dots{display:flex;justify-content:center;gap:.5rem;margin:.5rem 0 2rem}
}

/* тёмная тема — мобильные элементы */
.ktg-dark .mtopbar,.ktg-dark .msearch-bar,.ktg-dark .mdrawer,.ktg-dark .mbottomnav{background:#161616;border-color:#2c2c2c}
.ktg-dark .mburger span{background:#eee}
.ktg-dark .msearch-toggle,.ktg-dark .mbn-ico,.ktg-dark .mdrawer-nav a,.ktg-dark .mdrawer-close{color:#e8e8e8}
.ktg-dark .mdrawer-top,.ktg-dark .msearch-bar.is-open{border-color:#2c2c2c}
.ktg-dark .mdrawer-sep{background:#2c2c2c}
.ktg-dark .mbn-item{color:#9a9a9a}
.ktg-dark .mbn-home .mbn-ico{background:#f5f5f5;color:#111}
.ktg-dark .msearch-bar input{background:#232323;border-color:#333;color:#e8e8e8}
.ktg-dark .mtopbar-logo img,.ktg-dark .mdrawer-logo,.ktg-dark .logo-img{content:url(../img/logo-karcher-dark.png)}

/* небольшие телефоны */
@media (max-width:560px){
  .benefits-inner{grid-template-columns:1fr}
  .cat-icon-card{flex:0 0 44% !important}
  .products-grid{grid-template-columns:1fr 1fr}
}

/* ==================================================================
   СТРАНИЦЫ ЛК: Избранное / Сравнение / Мой Керхер (mobile-first)
   ================================================================== */
.page-narrow{max-width:44rem;margin:0 auto;padding:0 1rem}
.lk-page{padding-top:1.25rem;padding-bottom:3.25rem}
/* Шапка Избранного/Сравнения = мини-баннер (тёмная карта с жёлтым акцентом) + действия */
/* §Избр./Корз./Сравн.: шапка страницы — светлая по умолчанию (без тёмного баннера),
   как обычная шапка; тёмный вариант — только в тёмной теме. */
.lk-head{position:relative;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  margin:1.25rem 0 1.5rem;padding:1.4rem 1.9rem;border-radius:1.25rem;overflow:hidden;
  background:#f6f6f6;border:1px solid #ececec}
.lk-head::before{content:"";position:absolute;left:0;top:0;bottom:0;width:.4rem;background:var(--yellow)}
.lk-head-t{position:relative;z-index:1;padding-left:.5rem}
.lk-head-t h1{font-size:1.75rem;font-weight:800;color:#1a1a1a;line-height:1.1}
.lk-head-t span{color:#747474;font-size:.95rem}
.lk-head-act{position:relative;z-index:1;display:flex;gap:1.35rem;flex-shrink:0}
.lk-act{background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:.3rem;font-size:.78rem;color:#1a1a1a;cursor:pointer;padding:0}
.lk-act i{font-size:1.2rem}
.lk-act:hover{color:#000}
/* §Избранное [4]: «Изменить»↔«Готово» не должно менять ширину кнопки —
   резервируем ширину подписи, тогда соседние кнопки не сдвигаются (меняются только текст и иконка). */
.fav-edit span{display:inline-block;min-width:4rem;text-align:center}
/* Тёмная тема — как раньше (тёмный баннер, светлый текст). */
.ktg-dark .lk-head{background:linear-gradient(115deg,#181818 0%,#2a2a2a 100%);border-color:transparent}
.ktg-dark .lk-head-t h1{color:#fff}
.ktg-dark .lk-head-t span{color:#bdbdbd}
.ktg-dark .lk-act{color:#e8e8e8}
.ktg-dark .lk-act:hover{color:#fff}
/* §Избр./Корз./Сравн. #4/#1/#12: на узких экранах шапка переносится — кнопки помещаются. */
@media(max-width:600px){
  .lk-head{flex-wrap:wrap;padding:1.1rem 1.15rem;gap:.85rem 1rem}
  .lk-head-t{padding-left:.3rem}
  .lk-head-t h1{font-size:1.4rem}
  /* §Избранное [4]: кнопки действий на мобилке — равномерно в строку(и), аккуратно. */
  .lk-head-act{gap:.85rem .5rem;flex-wrap:wrap;width:100%;justify-content:space-between}
  .lk-act{font-size:.72rem;flex:0 0 auto}
  .lk-act i{font-size:1.1rem}
}

/* Избранное — список карточек (фото слева, инфо справа) */
.fav-list{display:flex;flex-direction:column;gap:1rem}
.fav-card{display:flex;gap:1rem;background:#fff;border:1px solid #ececec;border-radius:1.1rem;padding:1rem;box-shadow:0 0 .7rem rgba(0,0,0,.07)}
.fav-img{flex:0 0 31%;max-width:31%;display:flex;align-items:center;justify-content:center}
.fav-img img{width:100%;height:auto;max-height:11rem;object-fit:contain}
.fav-info{flex:1;min-width:0;position:relative}
.fav-heart{position:absolute;top:-.15rem;right:-.15rem;background:none;border:0;color:#ff4646;font-size:1.35rem;cursor:pointer;line-height:1}
.fav-title{font-size:1rem;font-weight:700;color:#1a1a1a;margin:0 2rem .15rem 0;line-height:1.2}
.fav-sub{color:#555;font-size:.9rem;margin:0}
.fav-sku{color:#9a9a9a;font-size:.85rem;margin:.25rem 0}
.fav-rating{font-size:.85rem;color:#9a9a9a;margin:.15rem 0}
.fav-rating .stars{color:var(--star);letter-spacing:1px}
.fav-price{font-size:1.3rem;font-weight:800;color:#1a1a1a;margin:.35rem 0 .2rem}
.fav-stock{color:#22a34a;font-size:.85rem;display:flex;align-items:center;gap:.35rem}
.fav-buy{display:flex;gap:.6rem;align-items:center;margin-top:.7rem;flex-wrap:wrap}
.fav-buy .pc-counter{flex:0 0 auto}
.fav-add{flex:1;min-width:8rem;background:var(--yellow);border:0;border-radius:.7rem;padding:.75rem 1rem;font-weight:700;color:#111;cursor:pointer;font-size:.95rem}
.fav-add:hover{filter:brightness(.96)}
/* Виды: плитка / строка */
.fav-list.is-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.fav-list.is-tiles .fav-card{flex-direction:column;gap:.75rem}
.fav-list.is-tiles .fav-img{flex:none;width:100%;max-width:100%}
.fav-list.is-tiles .fav-img img{max-height:12rem}
.fav-list.is-rows{display:flex;flex-direction:column;gap:1rem}
.fav-list.is-rows .fav-card{flex-direction:row}
/* §14/15: избранное И корзина — единые карточки .product-card в сетке (как на главной). */
.fav-app .fav-list,.cart-app .cart-list{display:grid;gap:1rem}
/* §Избранное #2: единая ширина карточки — как в каталоге (auto-fill 195px на десктопе, 2 на мобиле). */
.fav-app .fav-list.is-tiles,.cart-app .cart-list.is-tiles{grid-template-columns:repeat(auto-fill,minmax(12.5rem,1fr))}
.fav-app .fav-list.is-rows,.cart-app .cart-list.is-rows{grid-template-columns:1fr}
@media(max-width:560px){
  .fav-app .fav-list.is-tiles,.cart-app .cart-list.is-tiles{grid-template-columns:1fr 1fr}
}
@media(min-width:900px){
  .fav-app .fav-list.is-rows,.cart-app .cart-list.is-rows{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:901px){
  .fav-app .fav-list.is-tiles,.cart-app .cart-list.is-tiles{grid-template-columns:repeat(auto-fill,195px);justify-content:flex-start}
}
.fav-app .fav-list .product-card,.cart-app .cart-list .product-card{flex:none;width:auto}
/* §Избр. #9 / Корз. #5: плавное исчезновение карточки при удалении. */
.fav-app .product-card,.cart-app .product-card,.fav-card{transition:opacity .25s ease,transform .25s ease}
.fav-app .product-card.is-removing,.cart-app .product-card.is-removing,.fav-card.is-removing{opacity:0;transform:scale(.92);pointer-events:none}
/* §Избранное #5: скелетон-заглушки с shimmer, пока грузится список. */
.fav-list.is-skel{pointer-events:none}
.fav-skel{border:1px solid #eee;border-radius:14px;padding:.85rem;display:flex;flex-direction:column;gap:.6rem;background:#fff}
.fav-skel-img{height:150px;border-radius:10px}
.fav-skel-line{height:12px;border-radius:6px}
.fav-skel-line.w70{width:70%}.fav-skel-line.w55{width:55%}.fav-skel-line.w40{width:40%}
.fav-skel-btn{height:34px;border-radius:9px;margin-top:.35rem}
.fav-skel-img,.fav-skel-line,.fav-skel-btn{background:linear-gradient(100deg,#eee 30%,#f6f6f6 50%,#eee 70%);background-size:200% 100%;animation:ktgShimmer 1.15s ease-in-out infinite}
@keyframes ktgShimmer{0%{background-position:180% 0}100%{background-position:-20% 0}}
@media(prefers-reduced-motion:reduce){.fav-skel-img,.fav-skel-line,.fav-skel-btn{animation:none}}
/* §Сравнить #13/#14: плавное и быстрое удаление товара из сравнения и сохранённого списка. */
.cmp-cell.is-removing,.cmp-mrow.is-removing{opacity:0;transform:scale(.92);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
.fav-list-row{transition:opacity .2s ease,transform .2s ease}
.fav-list-row.is-removing{opacity:0;transform:translateX(-10px);pointer-events:none}
/* Доп-контролы поверх угла фото — карточку и её содержимое не трогают. */
.pc-image{position:relative}
.pc-extra{position:absolute;top:.5rem;z-index:3;width:1.95rem;height:1.95rem;display:flex;
  align-items:center;justify-content:center;border:0;border-radius:.55rem;cursor:pointer;
  background:rgba(255,255,255,.92);box-shadow:0 1px 5px rgba(0,0,0,.18);color:#555;font-size:.9rem;padding:0}
.pc-extra-drag{left:.5rem;cursor:grab;touch-action:none}
.pc-extra-remove{right:.5rem;color:var(--red)}
/* Рассрочка — лого-оверлей в правом углу карточки избранного. Круглый, лого
   заполняет чип (сам логотип — красный круг), без белой подложки. */
.pc-extra-install{right:.5rem;top:2.85rem;padding:0;background:none;border-radius:50%;overflow:hidden;text-decoration:none;color:#f14635}
.pc-extra-install img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.pc-extra-install:hover{color:#d62f22;transform:scale(1.06)}
.pc-extra:hover{background:#fff}
.ktg-dark .pc-extra{background:rgba(35,35,35,.92);color:#ccc}
.ktg-dark .pc-extra:hover{background:#2c2c2c}
/* Доп-строки единой карточки: сумма позиции (корзина), «В рассрочку» (избранное) */
.pc-linetotal{font-size:.82rem;color:#555;margin-top:.35rem}
.pc-linetotal span{color:#999}
.pc-install-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;margin-top:.55rem;padding:.5rem .7rem;border:1px solid var(--gray-border);border-radius:.6rem;background:#fff;color:#1a1a1a;font-weight:600;font-size:.82rem;text-decoration:none}
.pc-install-btn:hover{border-color:var(--red);background:#fff6f6}
.pc-install-btn i{color:var(--red)}
.pc-install-kaspi{height:.9rem;width:auto;object-fit:contain}
.ktg-dark .pc-linetotal{color:#bbb}
.ktg-dark .pc-linetotal span{color:#888}
.ktg-dark .pc-install-btn{background:#232323;border-color:#3a3a3a;color:#f2f2f2}
.fav-list.is-rows .fav-img{flex:0 0 31%;max-width:31%}
/* сердечко + сравнение (стопкой справа сверху) */
.fav-actions{position:absolute;top:-.1rem;right:-.1rem;display:flex;flex-direction:column;gap:.55rem;align-items:center;z-index:1}
.fav-heart{position:static}
.fav-cmp{background:none;border:0;padding:0;cursor:pointer;width:1.35rem;height:1.35rem;display:flex;align-items:center;justify-content:center}
.fav-cmp .pc-compare-ico{width:1.35rem;height:1.35rem}
/* цена + рассрочка + Kaspi */
/* §Избранное 2: цена+рассрочка и «+» — одной строкой, по центру по высоте */
.fav-priceline{display:flex;align-items:center;gap:.75rem}
.fav-priceline .fav-buy{margin-top:0;flex:0 0 auto}
.fav-priceblock{margin:.35rem 0 .2rem}
.fav-priceblock .fav-price{margin:0}
.fav-install{color:var(--red);font-size:.78rem;display:flex;align-items:center;gap:.4rem;margin-top:.1rem}
.fav-kaspi{height:.95rem;width:auto;object-fit:contain}
.fav-buy .pc-add-slot{display:flex}
/* Кнопка «В рассрочку» — заказ товара в рассрочку прямо из избранного (Kaspi) */
.fav-install-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;margin-top:.6rem;
  padding:.6rem .9rem;border:1px solid var(--gray-border);border-radius:.7rem;background:#fff;
  color:#1a1a1a;font-weight:600;font-size:.85rem;text-decoration:none;cursor:pointer;
  transition:border-color .15s ease,background .15s ease}
.fav-install-btn:hover{border-color:var(--red);background:#fff6f6}
.fav-install-btn i{color:var(--red)}
.fav-list.is-tiles .fav-install-btn{width:100%}
.ktg-dark .fav-install-btn{background:#232323;border-color:#3a3a3a;color:#f2f2f2}
.ktg-dark .fav-install-btn:hover{border-color:#ff6b6b;background:#2a2222}
/* переключатель вида */
.fav-viewtoggle{display:flex;gap:.4rem;margin-right:.35rem;align-self:center}
.fav-view-btn{width:2.2rem;height:2.2rem;border:1px solid var(--gray-border);background:#fff;border-radius:.55rem;cursor:pointer;color:#8e8e8e;display:flex;align-items:center;justify-content:center;font-size:.85rem;transition:background .15s,color .15s}
.fav-view-btn.is-active{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
.ktg-dark .fav-view-btn{background:#232323;border-color:#3a3a3a;color:#9a9a9a}
.ktg-dark .fav-view-btn.is-active{background:var(--yellow);color:#1a1a1a}
/* §Корзина [4],[29]: тумблер «Подробнее» — компакт ↔ подробный вид карточек. */
/* Временно скрыт по просьбе клиента (2026-09-02). Вернуть — убрать строку ниже. */
.pc-detail-toggle{display:none !important}
.pc-detail-toggle{display:inline-flex;align-items:center;gap:.4rem;height:2.2rem;padding:0 .8rem;border:1px solid var(--gray-border);background:#fff;border-radius:.55rem;cursor:pointer;color:#5a5a5a;font-size:.82rem;font-weight:500;transition:background .15s,color .15s,border-color .15s;align-self:center}
.pc-detail-toggle i{font-size:.9rem}
.pc-detail-toggle.is-active{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
.ktg-dark .pc-detail-toggle{background:#232323;border-color:#3a3a3a;color:#bdbdbd}
.ktg-dark .pc-detail-toggle.is-active{background:var(--yellow);color:#1a1a1a}
/* Подробный вид: характеристики видны целиком (без обрезки в одну строку). */
.is-detailed .pc-specs{white-space:normal;height:auto;overflow:visible;text-overflow:clip;text-align:left;line-height:1.5;padding-top:.5rem}
.is-list.is-detailed .pc-specs{grid-column:1/-1}
/* Кастомная корзина */
.cart-linetotal{color:#555 !important}
/* «Сумма» в корзине переиспользует .fav-install, но красный тут не по смыслу —
   держим нейтральный серый, в тёмной теме светлее (#555 на тёмном нечитаем). */
.ktg-dark .cart-linetotal{color:#a8a8a8 !important}
.cart-qty{background:var(--yellow)}
.cart-summary{margin-top:1.5rem;background:#fff;border:1px solid var(--gray-border);border-radius:1.1rem;padding:1.25rem 1.5rem;box-shadow:0 0 .7rem rgba(0,0,0,.06)}
.cart-total-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem;font-size:1.05rem;color:#1a1a1a}
.cart-total{font-size:1.6rem;font-weight:800;color:#1a1a1a}
.cart-checkout{display:block;width:100%;text-align:center;background:var(--yellow);color:#1a1a1a;font-weight:800;font-size:1rem;font-family:inherit;padding:1rem;border:0;border-radius:.85rem;text-decoration:none;cursor:pointer;transition:background .15s ease}
.cart-checkout:hover{background:var(--yellow-soft)}
.cart-checkout-note{margin:.7rem 0 0;font-size:.82rem;line-height:1.4;color:#777;text-align:center}
.ktg-dark .cart-summary{background:#232323;border-color:#333}
.ktg-dark .cart-total-row,.ktg-dark .cart-total{color:#f2f2f2}
.ktg-dark .cart-checkout-note{color:#9a9a9a}
@media (min-width:901px){.lk-page.cart-page-x{max-width:var(--container-max)}}

/* Оформление заказа (онлайн-оплаты нет): модальная форма → письмо менеджеру */
body.ktg-noscroll{overflow:hidden}
.cart-order{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}
.cart-order[hidden]{display:none}
.cart-order-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.cart-order-dialog{position:relative;z-index:1;width:100%;max-width:34rem;max-height:92vh;overflow-y:auto;background:#fff;border-radius:1.1rem;padding:1.75rem;box-shadow:0 1.5rem 3rem rgba(0,0,0,.25);animation:ktgOrderIn .18s ease}
@keyframes ktgOrderIn{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}
.cart-order-close{position:absolute;top:.9rem;right:.9rem;width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;background:#f2f2f2;border:0;border-radius:50%;color:#555;font-size:1rem;cursor:pointer;transition:background .15s ease}
.cart-order-close:hover{background:#e6e6e6}
.cart-order-form h2,.cart-order-done h2{margin:0 0 .4rem;font-size:1.4rem;font-weight:800;color:#1a1a1a}
.cart-order-sub{margin:0 0 1.2rem;font-size:.88rem;line-height:1.5;color:#777}
.cart-order-field{display:block;margin-bottom:.9rem}
.cart-order-field>span{display:block;margin-bottom:.35rem;font-size:.85rem;font-weight:600;color:#333}
.cart-order-field>span b{color:#e11}
.cart-order-field input,.cart-order-field textarea{width:100%;padding:.7rem .85rem;font-size:.95rem;font-family:inherit;color:#1a1a1a;background:#fff;border:1px solid var(--gray-border);border-radius:.6rem;transition:border-color .15s ease}
.cart-order-field input:focus,.cart-order-field textarea:focus{outline:0;border-color:var(--yellow)}
.cart-order-field textarea{resize:vertical;min-height:3.5rem}
.cart-order-row{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.cart-order-err{margin:0 0 .9rem;padding:.6rem .8rem;font-size:.85rem;color:#a11;background:#fdecec;border-radius:.5rem}
/* §Корзина: промокод (поле + кнопка) и живой итог. */
.cart-order-promo{display:flex;gap:.5rem}
.cart-order-promo input{flex:1 1 auto;min-width:0}
.cart-order-promo-apply{flex:0 0 auto;padding:.7rem 1.1rem;font-size:.9rem;font-weight:700;font-family:inherit;color:#1a1a1a;background:#f1f1f1;border:1px solid var(--gray-border);border-radius:.6rem;cursor:pointer;transition:background .15s ease}
.cart-order-promo-apply:hover{background:#e7e7e7}
.cart-order-promo-apply:disabled{opacity:.6;cursor:default}
.cart-order-promo-res{margin:.45rem 0 0;font-size:.85rem}
.cart-order-promo-res.is-ok{color:#1a9c4a}
.cart-order-promo-res.is-err{color:#c20000}
.cart-order-totals{margin:.2rem 0 1rem;padding:.85rem 1rem;background:#fafafa;border:1px solid #eee;border-radius:.7rem}
.cot-row{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;color:#444;padding:.15rem 0}
.cot-row b{color:#1a1a1a}
.cot-disc b{color:#1a9c4a}
.cot-total-row{margin-top:.35rem;padding-top:.5rem;border-top:1px solid #e6e6e6;font-size:1.05rem}
.cot-total-row span{font-weight:700;color:#1a1a1a}
.cot-total-row b{font-size:1.15rem;font-weight:800}
.ktg-dark .cart-order-promo-apply{background:#333;color:#eee;border-color:#3a3a3a}
.ktg-dark .cart-order-totals{background:#1f1f1f;border-color:#333}
.ktg-dark .cot-row{color:#cfcfcf}.ktg-dark .cot-row b,.ktg-dark .cot-total-row span{color:#f0f0f0}
.cart-order-submit{width:100%;margin-top:.3rem;padding:1rem;font-size:1rem;font-weight:800;font-family:inherit;color:#1a1a1a;background:var(--yellow);border:0;border-radius:.85rem;cursor:pointer;transition:background .15s ease}
.cart-order-submit:hover{background:var(--yellow-soft)}
.cart-order-submit:disabled{opacity:.6;cursor:default}
.cart-order-done{text-align:center;padding:1rem 0}
.cart-order-done-ico{width:3.5rem;height:3.5rem;margin:0 auto 1rem;display:flex;align-items:center;justify-content:center;background:#e8f6ea;color:#1a9e42;border-radius:50%;font-size:1.5rem}
.cart-order-done-num{margin:.3rem 0;font-weight:700;color:#1a1a1a}
.cart-order-done p{margin:.4rem 0;color:#666;font-size:.92rem}
.cart-order-done-link{display:inline-block;margin-top:1rem;padding:.7rem 1.4rem;font-weight:700;color:#1a1a1a;background:#f2f2f2;border-radius:.7rem;text-decoration:none;transition:background .15s ease}
.cart-order-done-link:hover{background:#e6e6e6}
@media (max-width:520px){.cart-order-row{grid-template-columns:1fr}}
.ktg-dark .cart-order-dialog{background:#232323}
.ktg-dark .cart-order-form h2,.ktg-dark .cart-order-done h2,.ktg-dark .cart-order-done-num{color:#f2f2f2}
.ktg-dark .cart-order-field>span{color:#ddd}
.ktg-dark .cart-order-field input,.ktg-dark .cart-order-field textarea{background:#1c1c1c;border-color:#3a3a3a;color:#f2f2f2}
.ktg-dark .cart-order-close{background:#333;color:#ccc}
.ktg-dark .cart-order-close:hover{background:#3d3d3d}
.ktg-dark .cart-order-done-link{background:#333;color:#f2f2f2}
.ktg-dark .cart-order-err{background:#3a2020;color:#f5b5b5}

/* Сравнение — две карточки + таблица характеристик */
.cmp-cards{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1.75rem;align-items:start}
.cmp-card{flex:none;width:auto}
.cmp-h{font-size:1.35rem;font-weight:800;color:#1a1a1a;margin:0 0 1rem}
.cmp-table{background:#fff;border:1px solid #ececec;border-radius:1.1rem;padding:.35rem 1.1rem;box-shadow:0 0 .7rem rgba(0,0,0,.06)}
.cmp-row{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:.6rem;padding:.8rem 0;border-bottom:1px solid #f1f1f1;font-size:.9rem;align-items:center}
.cmp-row:last-child{border-bottom:0}
.cmp-label{color:#333}
.cmp-row span:not(.cmp-label){text-align:center;color:#333}
.cmp-thead{font-weight:700}
.cmp-thead span:not(.cmp-label){color:#1a1a1a}
.cmp-filter{display:flex;align-items:center;gap:.85rem;width:100%;background:#fff;border:1px solid #ececec;border-radius:.85rem;padding:1rem 1.1rem;margin-top:1.35rem;cursor:pointer;font-weight:600;color:#1a1a1a;font-size:.95rem;box-shadow:0 0 .7rem rgba(0,0,0,.05)}
.cmp-filter i:first-child{color:#777}
.cmp-filter i:last-child{margin-left:auto;color:#bbb}

/* ── Табличный вид сравнения (page-compare) ── */
.cmp-table-page{padding-top:1.25rem}
.cmp-scroll{overflow-x:auto;overscroll-behavior-x:contain;border-radius:1.1rem;-webkit-overflow-scrolling:touch;background:#fff}
.ktg-dark .cmp-scroll{background:#1c1c1c}
.cmp-table-full{display:flex;flex-direction:column;background:#fff;border:1px solid #ececec;border-radius:1.1rem;overflow:hidden;box-shadow:0 0 .7rem rgba(0,0,0,.06);min-width:46rem;padding:0}
.cmp-table-full .cmp-row{display:grid;grid-template-columns:12rem repeat(4,minmax(9rem,1fr));gap:0;padding:0;border-bottom:1px solid #f1f1f1;align-items:stretch;font-size:.9rem;min-width:0}
.cmp-table-full .cmp-row:last-child{border-bottom:0}
.cmp-table-full .cmp-label{display:flex;align-items:center;padding:.85rem 1.1rem;color:#555;font-weight:500;background:#fafafa;position:sticky;left:0;z-index:1}
.cmp-table-full .cmp-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.18rem;padding:.85rem 1rem;border-left:1px solid #f1f1f1;color:#1a1a1a;min-width:0}
.cmp-row-photo .cmp-cell{padding:1.1rem 1rem}
/* §Сравнить 2 (#3): название и цена в закрепляемой шапке. */
.cmp-hd-cell{gap:.35rem}
.cmp-hd-name{font-weight:600;font-size:.88rem;color:#1a1a1a;line-height:1.25;margin-top:.45rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cmp-hd-name:hover{text-decoration:underline}
.cmp-hd-price{margin-top:.15rem;line-height:1.2}
.cmp-hd-price b{display:block;font-size:1rem;color:#1a1a1a}
.cmp-hd-price i{font-size:.72rem;color:var(--gray-muted);font-style:normal}
.ktg-dark .cmp-hd-name,.ktg-dark .cmp-hd-price b{color:#f0f0f0}
/* Десктоп: колонки растягиваются на всю ширину (горизонтальной прокрутки нет),
   поэтому overflow:clip не режет контент, но и НЕ создаёт скролл-контейнер —
   значит position:sticky у ряда-шапки работает от прокрутки страницы. */
@media(min-width:992px){
  .cmp-scroll{overflow-x:clip}
  .cmp-table-full{overflow:clip}
  .cmp-table-full:not(.cmp-mobile) .cmp-row-photo{position:sticky;top:var(--cmp-sticky,72px);z-index:8;background:#fff;box-shadow:0 .35rem .7rem rgba(0,0,0,.05)}
  .cmp-table-full:not(.cmp-mobile) .cmp-row-photo .cmp-cell,
  .cmp-table-full:not(.cmp-mobile) .cmp-row-photo .cmp-label{background:#fff}
  .ktg-dark .cmp-table-full:not(.cmp-mobile) .cmp-row-photo,
  .ktg-dark .cmp-table-full:not(.cmp-mobile) .cmp-row-photo .cmp-cell,
  .ktg-dark .cmp-table-full:not(.cmp-mobile) .cmp-row-photo .cmp-label{background:#232323}
}
.cmp-prod{position:relative;display:block;width:100%;max-width:9rem;margin:0 auto}
/* #7: квадрат фото в сравнении. */
.cmp-prod img{width:100%;aspect-ratio:1;height:auto;object-fit:contain;display:block;background:#fff;border-radius:.5rem}
.cmp-remove{position:absolute;top:-.3rem;right:-.3rem;width:1.5rem;height:1.5rem;border:0;border-radius:50%;background:#f0f0f0;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.75rem;transition:background .15s,color .15s}
.cmp-remove:hover{background:var(--orange);color:#fff}
.cmp-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;width:100%;height:100%;min-height:8rem;border:2px dashed var(--gray-border);border-radius:.85rem;color:#9a9a9a;text-decoration:none;transition:border-color .15s,color .15s}
.cmp-add:hover{border-color:var(--yellow);color:#1a1a1a}
/* §Сравнить [44]: подсказка при первом входе — пульс на слоте «+» и всплывашка. */
.cmp-add.cmp-hint-pulse{border-color:var(--yellow);color:#1a1a1a;animation:cmpHintPulse 1.2s ease-in-out infinite}
@keyframes cmpHintPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,222,0,.55)}50%{box-shadow:0 0 0 12px rgba(255,222,0,0)}}
.cmp-hint-tip{position:fixed;z-index:120;background:#1a1a1a;color:#fff;padding:.6rem .85rem;border-radius:.65rem;font-size:.85rem;line-height:1.4;max-width:16rem;box-shadow:0 10px 30px rgba(0,0,0,.28);pointer-events:none}
.cmp-hint-tip i{color:var(--yellow);margin-right:.35rem}
.ktg-dark .cmp-hint-tip{background:#000;border:1px solid #333}
@media(prefers-reduced-motion:reduce){.cmp-add.cmp-hint-pulse{animation:none}}
.cmp-add-plus{font-size:2.1rem;line-height:1;font-weight:300}
.cmp-add-txt{font-size:.8rem;font-weight:600}
.cmp-cell-name{font-weight:700}
.cmp-cell-price b{font-weight:800;font-size:1.02rem}
.cmp-cell-price i{font-style:normal;font-size:.72rem;color:var(--red)}
.cmp-cell-rating .cmp-stars{color:var(--star);font-size:.82rem;letter-spacing:.05rem}
.cmp-cell-rating .cmp-rating-n{color:#747474;font-size:.78rem}
.cmp-stock{display:inline-flex;align-items:center;gap:.35rem;color:var(--green);font-weight:500}
.cmp-stock .dot{width:.55rem;height:.55rem;border-radius:50%;background:#00ff37}
.cmp-empty{color:#c4c4c4}
.ktg-dark .cmp-table-full{background:#232323;border-color:#333}
.ktg-dark .cmp-table-full .cmp-label{background:#1c1c1c;color:#bdbdbd}
.ktg-dark .cmp-table-full .cmp-cell{color:#e8e8e8;border-color:#333}
.ktg-dark .cmp-table-full .cmp-row{border-color:#333}
.ktg-dark .cmp-cell-price i{color:#ff7a7a}
.ktg-dark .cmp-remove{background:#333;color:#ccc}
/* §Сравнить 15: мобильная транспозиция — строки = товары, характеристики листаются вправо. */
/* width:max-content — строки таблицы занимают полную ширину контента, а не вьюпорта.
   Иначе containing block sticky-колонки товара = ширина экрана, и при листании вбок
   колонка «отлипает» и уезжает. Колонки фикс. 7.25rem (не 1fr) — чтобы max-content
   не раздувал их по длине значений. */
.cmp-table-full.cmp-mobile{min-width:0;display:block;overflow:visible;width:-webkit-max-content;width:max-content}
.cmp-table-full.cmp-mobile .cmp-mrow{display:grid;grid-template-columns:9rem repeat(var(--cmp-cols,1),7.25rem);border-bottom:1px solid #f1f1f1}
.cmp-table-full.cmp-mobile .cmp-mrow:last-child{border-bottom:0}
.cmp-table-full.cmp-mobile .cmp-mrow-empty,.cmp-table-full.cmp-mobile .cmp-mrow-add{display:block}
.cmp-mcell{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.2rem;padding:.7rem .55rem;border-left:1px solid #f1f1f1;color:#1a1a1a;min-width:0;font-size:.84rem}
/* §Товар [23]: длинный текст критерия (напр. комплект) НЕ расширяет колонку — переносится
   по словам, а если очень длинный — прокручивается внутри своей зоны (моб. сравнение). */
.cmp-table-full.cmp-mobile .cmp-mcell{overflow-wrap:anywhere;word-break:break-word;max-height:7rem;overflow-y:auto}
.cmp-table-full.cmp-mobile .cmp-mprod{max-height:none;overflow:visible}
.cmp-mprod,.cmp-mcorner{position:sticky;left:0;z-index:2;background:#fff;border-left:0;border-right:1px solid #ececec}
.cmp-mrow-empty .cmp-mprod,.cmp-mrow-add .cmp-mprod{position:static;border-right:0}
.cmp-mhead{background:#fafafa}
.cmp-mhead .cmp-mcorner{background:#fafafa}
.cmp-mhcell{font-weight:600;color:#555;font-size:.8rem}
.cmp-mprod .cmp-prod{max-width:5.5rem;margin:.15rem auto 0}
/* §Сравнение (мобилка): «исправить блок белый» — высоту строки задавала колонка
   товара (крупное фото), а короткие значения атрибутов висели по центру в белом.
   Делаем фото компактнее и выравниваем содержимое ячеек к верху → строки ниже,
   значения не тонут в пустоте. */
@media(max-width:900px){
  .cmp-table-full.cmp-mobile .cmp-mcell{justify-content:flex-start;padding-top:.9rem}
  .cmp-table-full.cmp-mobile .cmp-mhead .cmp-mcell{justify-content:center}
  .cmp-table-full.cmp-mobile .cmp-mprod .cmp-prod{max-width:3.75rem}
  .cmp-table-full.cmp-mobile .cmp-mprod .cmp-prod img{max-height:3.75rem;object-fit:contain}
  .cmp-table-full.cmp-mobile .cmp-mname{font-size:.8rem;line-height:1.2}
}
.cmp-mname{margin-top:.2rem;font-weight:700;font-size:.8rem;line-height:1.25;color:#1a1a1a;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ktg-dark .cmp-table-full.cmp-mobile .cmp-mrow{border-color:#333}
.ktg-dark .cmp-mcell{color:#e8e8e8;border-color:#333}
.ktg-dark .cmp-mprod,.ktg-dark .cmp-mcorner{background:#232323;border-right-color:#333}
.ktg-dark .cmp-mhead,.ktg-dark .cmp-mhead .cmp-mcorner{background:#1c1c1c}
.ktg-dark .cmp-mhcell{color:#bdbdbd}
/* §Сравнить [39]: плавающий клон шапки таблицы (моб), фикс верхней части. */
.cmp-msticky{position:fixed;z-index:40;overflow:hidden;display:none;pointer-events:none;box-shadow:0 6px 14px rgba(0,0,0,.12);border-bottom:1px solid #ececec}
.cmp-msticky .cmp-mrow{display:grid}
.ktg-dark .cmp-msticky{border-bottom-color:#333}
.ktg-dark .cmp-mname{color:#e8e8e8}
.cmp-empty-state,.fav-empty-state{text-align:center;padding:4rem 1rem 3rem;color:#747474}
.cmp-empty-ico{font-size:3rem;color:var(--gray-border);margin-bottom:1rem}
.cmp-empty-state p,.fav-empty-state p{font-size:1.1rem;margin:0 0 1.35rem;color:#555}
.cmp-empty-link{display:inline-flex;align-items:center;gap:.5rem;background:var(--yellow);color:#1a1a1a;font-weight:700;padding:.85rem 1.6rem;border-radius:.85rem;text-decoration:none;transition:background .15s ease}
.cmp-empty-link:hover{background:var(--yellow-soft)}
.ktg-dark .cmp-empty-state p,.ktg-dark .fav-empty-state p{color:#cfcfcf}

/* ===== «Мой Karcher» — кабинет: шапка профиля + меню слева + контент справа ===== */
/* Кабинет — на всю ширину контейнера (обёртка .woocommerce уже даёт
   max-width и боковые паддинги, поэтому у .ktg-lk своих нет — иначе двойной отступ). */
.ktg-lk{max-width:100%;margin:1.5rem 0 3rem;padding:0}
/* Шапка профиля (закреплена сверху) */
.ktg-lk-head{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;flex-wrap:wrap;
  background:#fff;border:1px solid #ececec;border-radius:1.1rem;padding:1.25rem 1.5rem;
  box-shadow:0 6px 22px rgba(0,0,0,.05);margin-bottom:1.5rem}
/* §Мой Керхер: шапка кабинета — фото/имя/номер по центру (кружок сверху). */
.ktg-lk-head{flex-direction:column;align-items:center;text-align:center}
.ktg-lk-user{display:flex;flex-direction:column;align-items:center;gap:.55rem;min-width:0}
.ktg-lk-meta{text-align:center}
.ktg-lk-fname{display:none}
.ktg-lk-phone{justify-content:center}
.ktg-lk-bonus{justify-content:center}
.ktg-lk-actions{justify-content:center}
/* Раздел «Новости» — заглушка ленты. */
.lk-feed-empty{text-align:center;padding:3.5rem 1.5rem;color:var(--gray-muted)}
.lk-feed-empty i{font-size:3rem;color:var(--gray-border);display:block;margin-bottom:1rem}
.lk-feed-empty h2{font-size:1.4rem;color:#1a1a1a;margin:0 0 .5rem}
.lk-feed-empty p{margin:0 auto 1.25rem;max-width:32rem;line-height:1.6}
.lk-feed-cta{display:inline-flex;padding:.7rem 1.4rem;border-radius:.7rem;background:var(--yellow);color:#1a1a1a;font-weight:700;text-decoration:none}
.lk-feed-cta:hover{background:var(--yellow-soft)}
.ktg-dark .lk-feed-empty h2{color:#f2f2f2}
.ktg-lk-photo{width:4.5rem;height:4.5rem;flex:0 0 4.5rem;border-radius:50%;overflow:hidden;background:#f0f0f0;
  display:flex;align-items:center;justify-content:center}
.ktg-lk-photo img{width:100%;height:100%;object-fit:cover}
.ktg-lk-photo-ph{color:#b0b0b0;font-size:1.9rem}
.ktg-lk-meta{min-width:0}
.ktg-lk-name{font-size:1.25rem;font-weight:800;color:#1a1a1a;line-height:1.2}
.ktg-lk-fname{font-size:.95rem;color:#666;margin-top:.1rem}
.ktg-lk-phone{display:inline-flex;align-items:center;gap:.4rem;margin-top:.35rem;color:#333;text-decoration:none;font-size:.95rem;font-weight:600}
.ktg-lk-phone i{color:var(--yellow);filter:none}
.ktg-lk-phone:hover{color:#000}
.ktg-lk-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}
.ktg-lk-edit,.ktg-lk-logout{display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.1rem;border-radius:.7rem;
  font-weight:700;font-size:.9rem;text-decoration:none;cursor:pointer;transition:filter .15s ease,background .15s ease}
.ktg-lk-edit{background:var(--yellow);color:#1a1a1a}
.ktg-lk-edit:hover{filter:brightness(.96)}
.ktg-lk-logout{background:#f2f2f2;color:#444}
.ktg-lk-logout:hover{background:#e8e8e8}
/* Тело: меню слева, контент справа */
.ktg-lk-body{display:grid;grid-template-columns:16rem 1fr;gap:1.5rem;align-items:start}
.ktg-lk-body .woocommerce-MyAccount-navigation{background:#fff;border:1px solid #ececec;border-radius:1.1rem;
  padding:.5rem;box-shadow:0 6px 22px rgba(0,0,0,.05);position:sticky;top:1rem}
.ktg-lk-body .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.ktg-lk-body .woocommerce-MyAccount-navigation li{margin:0}
.ktg-lk-body .woocommerce-MyAccount-navigation a{display:block;padding:.8rem 1rem;border-radius:.7rem;
  color:#1a1a1a;text-decoration:none;font-weight:600;font-size:.95rem;transition:background .15s ease}
.ktg-lk-body .woocommerce-MyAccount-navigation a:hover{background:#f6f6f6}
.ktg-lk-body .woocommerce-MyAccount-navigation li.is-active a,
.ktg-lk-body .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active a{background:var(--yellow);color:#1a1a1a}
.ktg-lk-body .woocommerce-MyAccount-content{background:#fff;border:1px solid #ececec;border-radius:1.1rem;
  padding:1.5rem 1.75rem;box-shadow:0 6px 22px rgba(0,0,0,.05);min-width:0}
/* #3: состояние AJAX-подмены раздела кабинета. */
.woocommerce-MyAccount-content.is-loading{opacity:.45;pointer-events:none;transition:opacity .12s ease}
.ktg-dark .ktg-lk-head,.ktg-dark .ktg-lk-body .woocommerce-MyAccount-navigation,.ktg-dark .ktg-lk-body .woocommerce-MyAccount-content{background:#232323;border-color:#333}
.ktg-dark .ktg-lk-name{color:#f2f2f2}
.ktg-dark .ktg-lk-photo{background:#2e2e2e}
.ktg-dark .ktg-lk-body .woocommerce-MyAccount-navigation a{color:#e8e8e8}
.ktg-dark .ktg-lk-body .woocommerce-MyAccount-navigation a:hover{background:#2c2c2c}
.ktg-dark .ktg-lk-logout{background:#333;color:#ddd}
/* #11: мобильный кабинет — меню разделов «таблетками» (всё видно сразу, без гориз. листания),
   ниже сразу контент. Переключение — AJAX (#3), без прыжков по странице. */
@media(max-width:820px){
  .ktg-lk-body{grid-template-columns:1fr;gap:1rem}
  .ktg-lk-body .woocommerce-MyAccount-navigation{position:static;background:none;border:none;box-shadow:none;padding:0;margin:0}
  .ktg-lk-body .woocommerce-MyAccount-navigation ul{display:flex;flex-wrap:wrap;gap:.5rem}
  .ktg-lk-body .woocommerce-MyAccount-navigation li{margin:0}
  .ktg-lk-body .woocommerce-MyAccount-navigation a{padding:.5rem .95rem;border:1px solid #d9d9d9;border-radius:999px;
    font-size:.85rem;font-weight:600;background:#fff;color:#1a1a1a}
  .ktg-lk-body .woocommerce-MyAccount-navigation li.is-active a,
  .ktg-lk-body .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active a{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
  .ktg-lk-body .woocommerce-MyAccount-content{padding:1.15rem 1.15rem}
  .ktg-lk-head{justify-content:center;text-align:center}
  .lk-over-links{grid-template-columns:1fr 1fr}
  .ktg-dark .ktg-lk-body .woocommerce-MyAccount-navigation a{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
}
/* ===== «Мои заказы» — карточки (#4/#5/#6) ===== */
.lk-orders{display:flex;flex-direction:column;gap:.75rem}
/* §Мой Керхер: заказ-аккордеон (таймлайн + товары). */
.lk-order{display:block;background:#fff;border:1px solid #d9d9d9;border-radius:.75rem;padding:0;overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease}
.lk-order:hover{border-color:#9a9a9a;box-shadow:0 4px 14px rgba(0,0,0,.06)}
.lk-order-toggle{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem 1.25rem;background:none;border:0;cursor:pointer;text-align:left;font:inherit;color:inherit;user-select:none;-webkit-user-select:none;touch-action:manipulation}
/* Дочерние тексты кнопки тоже не выделяем — иначе клик по «Заказ 223»/дате/сумме
   иногда превращается в выделение текста и не срабатывает раскрытие. */
.lk-order-toggle *{user-select:none;-webkit-user-select:none}
.lk-order-arr{color:#8e8e8e;font-size:.85rem;transition:transform .2s ease;flex-shrink:0}
.lk-order.is-open .lk-order-arr{transform:rotate(180deg)}
.lk-order-details{padding:1.1rem 1.25rem 1.25rem;border-top:1px solid #f0f0f0}
/* §Мой Керхер [9]: плейсхолдер ленивой подгрузки деталей заказа. */
.lk-order-loading{color:#999;font-size:.9rem;text-align:center;padding:.6rem 0;display:flex;align-items:center;justify-content:center;gap:.5rem}
.ktg-dark .lk-order-loading{color:#aaa}
.lk-order-cancelled{color:#c20000;font-weight:600;margin-bottom:1rem}
.lk-timeline{display:flex;margin-bottom:1.25rem}
.lk-tl-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:.45rem;position:relative;font-size:.78rem;color:#8e8e8e;text-align:center}
.lk-tl-step::before{content:"";position:absolute;top:.5rem;left:-50%;width:100%;height:2px;background:#e0e0e0;z-index:0}
.lk-tl-step:first-child::before{display:none}
.lk-tl-dot{width:1.1rem;height:1.1rem;border-radius:50%;background:#e0e0e0;position:relative;z-index:1}
.lk-tl-step.is-done{color:#1a1a1a}
.lk-tl-step.is-done .lk-tl-dot,.lk-tl-step.is-done::before{background:#1faf38}
.lk-tl-step.is-current .lk-tl-dot{box-shadow:0 0 0 4px rgba(31,175,56,.2)}
.lk-tl-lbl{max-width:6.5rem;line-height:1.2}
.lk-order-items{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.lk-order-item{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:#1a1a1a;padding:.4rem;border-radius:.6rem;transition:background .15s ease}
a.lk-order-item:hover{background:#f2f2f2}
.lk-order-item-img{width:56px;height:56px;flex:0 0 56px;border-radius:.5rem;overflow:hidden;background:#f4f4f4;display:flex;align-items:center;justify-content:center}
.lk-order-item-img img{width:100%;height:100%;object-fit:contain}
.lk-order-item-name{flex:1;min-width:0;font-size:.9rem;line-height:1.3}
.lk-order-item-qty{color:#8e8e8e;font-size:.85rem;flex-shrink:0}
.lk-order-item-sum{font-weight:700;font-size:.9rem;white-space:nowrap;flex-shrink:0}
.ktg-dark .lk-order-details{border-color:#333}
.ktg-dark .lk-order-item-img{background:#2a2a2a}
.ktg-dark a.lk-order-item:hover{background:#333}
/* §Мой Керхер [6]: кнопка «Оставить отзыв» у товара в выданном заказе. */
.lk-order-item-row{display:flex;align-items:center;gap:.6rem}
.lk-order-item-row .lk-order-item{flex:1;min-width:0}
.lk-order-review{display:inline-flex;align-items:center;gap:.4rem;flex-shrink:0;white-space:nowrap;font-size:.82rem;font-weight:600;color:#1a1a1a;text-decoration:none;border:1px solid var(--gray-border);border-radius:2rem;padding:.4rem .85rem;transition:background .15s ease,border-color .15s ease}
.lk-order-review i{color:var(--yellow)}
.lk-order-review:hover{background:#f5f5f5;border-color:#1a1a1a}
.ktg-dark .lk-order-review{border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .lk-order-review:hover{background:#333}
@media(max-width:600px){.lk-order-review span{display:none}.lk-order-review{padding:.45rem .6rem}}
.ktg-dark .lk-tl-step.is-done,.ktg-dark .lk-order-item-name{color:#e8e8e8}
.lk-order-main{min-width:0;flex:1}
.lk-order-head{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.35rem}
.lk-order-num{font-size:1rem;color:#1a1a1a}
.lk-order-num b{font-weight:700}
.lk-order-status{font-size:.75rem;font-weight:700;padding:.15rem .6rem;border-radius:999px;white-space:nowrap}
.lk-st-completed{background:#e6f6ea;color:#1faf38}
.lk-st-on-hold,.lk-st-pending{background:#fff6d1;color:#8a6d00}
.lk-st-processing{background:#e6f1fb;color:#1a5f9e}
.lk-st-shipped{background:#e8ecfb;color:#3a45c0}
.lk-st-cancelled,.lk-st-failed{background:#fdecec;color:#c20000}
.lk-st-refunded{background:#eef0f2;color:#747474}
.ktg-dark .lk-st-completed{background:#14301e;color:#7fce9b}
.ktg-dark .lk-st-on-hold,.ktg-dark .lk-st-pending{background:#33280d;color:#e6bd55}
.ktg-dark .lk-st-processing{background:#142839;color:#7fb8ea}
.ktg-dark .lk-st-shipped{background:#1b1f3d;color:#a3aaf0}
.ktg-dark .lk-st-cancelled,.ktg-dark .lk-st-failed{background:#351712;color:#ec9488}
.ktg-dark .lk-st-refunded{background:#26241a;color:#b3ada0}
.lk-order-meta{display:flex;flex-wrap:wrap;gap:.35rem 1rem;font-size:.85rem;color:#747474}
.lk-order-date{display:inline-flex;align-items:center;gap:.4rem}
.lk-order-date i{font-size:.9rem;color:#8e8e8e}
.lk-order-sum b{color:#1a1a1a}
.lk-order-actions{display:flex;gap:.5rem;flex-shrink:0}
.lk-order-btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:.6rem;
  font-size:.875rem;font-weight:600;font-family:inherit;line-height:1;border:1px solid #d9d9d9;background:#fff;color:#1a1a1a;
  text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s ease,border-color .15s ease,filter .15s ease}
.lk-order-view,.lk-order-pay{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
.lk-order-view:hover,.lk-order-pay:hover{filter:brightness(.95)}
.lk-order-cancel{color:#c20000;border-color:#eec3c3}
.lk-order-cancel:hover{background:#fdecec;border-color:#e0a3a3}
.lk-order-btn:not(.lk-order-view):not(.lk-order-pay):not(.lk-order-cancel):hover{border-color:#9a9a9a}
.lk-orders-nav{display:flex;gap:.5rem;justify-content:center;margin-top:.4rem}
.lk-empty{text-align:center;color:#747474;padding:2.5rem 1rem}
.lk-empty i{font-size:2.4rem;color:#c9c9c9;display:block;margin-bottom:.6rem}
.lk-empty p{margin:0 0 1rem}
.ktg-dark .lk-order{background:#232323;border-color:#3a3a3a}
.ktg-dark .lk-order-num,.ktg-dark .lk-order-sum b{color:#f2f2f2}
.ktg-dark .lk-order-btn{background:#2a2a2a;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .lk-order-view,.ktg-dark .lk-order-pay{background:var(--yellow);color:#1a1a1a;border-color:var(--yellow)}
/* Мобайл (#11 частично): карточка в столбик, действия на всю ширину. */
@media(max-width:560px){
  .lk-order{flex-direction:column;align-items:stretch;gap:.75rem}
  .lk-order-actions{width:100%}
  .lk-order-btn{flex:1}
}
/* ===== Обзор кабинета (Вариант A): бонусы + последние заказы + быстрые ссылки ===== */
.lk-over-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.5rem}
.lk-bonus{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;background:#fff8dc;border:1px solid #f2e2a0;border-radius:.75rem;padding:.8rem 1.1rem}
.lk-bonus-lbl{font-weight:700;color:#8a6d00;font-size:.9rem}
.lk-bonus-lbl i{color:#ffb800}
.lk-bonus-val{font-size:1.6rem;font-weight:800;color:#1a1a1a;line-height:1}
.lk-bonus-note{font-size:.8rem;color:#8e8e8e}
.lk-over-edit{display:inline-flex;align-items:center;gap:.5rem;background:var(--yellow);color:#1a1a1a;border-radius:.6rem;padding:.55rem 1.1rem;font-weight:600;font-size:.9rem;text-decoration:none}
.lk-over-edit:hover{filter:brightness(.95)}
.lk-over-h{font-size:1.05rem;font-weight:700;color:#1a1a1a;margin:1.5rem 0 .8rem}
.lk-over-all{display:inline-flex;align-items:center;gap:.4rem;margin-top:.7rem;color:#747474;font-weight:600;font-size:.9rem;text-decoration:none}
.lk-over-all:hover{color:#1a1a1a}
.lk-over-all i{font-size:.72rem}
.lk-over-empty{color:#747474}
.lk-over-links{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.lk-over-links a{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;border:1px solid #d9d9d9;border-radius:.7rem;color:#1a1a1a;text-decoration:none;font-weight:600;font-size:.9rem;transition:border-color .15s ease,background .15s ease}
.lk-over-links a:hover{border-color:#9a9a9a;background:#fafafa}
.lk-over-links i{color:#8e8e8e;width:1.2rem;text-align:center}
.ktg-dark .lk-bonus{background:#2a2617;border-color:#4a411f}
.ktg-dark .lk-bonus-val,.ktg-dark .lk-over-h{color:#f2f2f2}
.ktg-dark .lk-over-links a{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
@media(max-width:560px){.lk-over-links{grid-template-columns:1fr}}
/* #13: бонус-бейдж в шапке кабинета (в блоке с фото). */
.ktg-lk-bonus{display:inline-flex;align-items:center;gap:.4rem;margin-top:.5rem;background:#fff8dc;border:1px solid #f2e2a0;border-radius:999px;padding:.25rem .75rem;font-size:.85rem;color:#8a6d00}
.ktg-lk-bonus i{color:#ffb800}
.ktg-lk-bonus b{color:#1a1a1a;font-weight:800}
.ktg-dark .ktg-lk-bonus{background:#2a2617;border-color:#4a411f;color:#e0c877}
.ktg-dark .ktg-lk-bonus b{color:#f2f2f2}
/* #12: поле купона в обзоре. */
.lk-coupon{margin:1.1rem 0 .3rem}
.lk-coupon-row{display:flex;gap:.5rem;max-width:420px}
.lk-coupon-input{flex:1;min-width:0;border:1px solid #d9d9d9;border-radius:.6rem;padding:.55rem .9rem;font:inherit;font-size:.9rem;background:#fff;color:#1a1a1a}
.lk-coupon-input:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(253,205,0,.18)}
.lk-coupon-btn{flex:0 0 auto;background:var(--yellow);border:none;border-radius:.6rem;padding:.55rem 1.2rem;font:inherit;font-weight:600;color:#1a1a1a;cursor:pointer}
.lk-coupon-btn:hover{filter:brightness(.95)}
.lk-coupon-note{font-size:.8rem;color:#8e8e8e;margin:.5rem 0 0}
.ktg-dark .lk-coupon-input{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
/* ===== «Мои данные» — редактор профиля ===== */
.ktg-md-h{font-size:1.4rem;font-weight:800;margin:0 0 1.25rem;color:#1a1a1a}
/* #1: email «(по желанию)», галочка рассылки, удаление аккаунта. */
.ktg-md-field span em{font-style:normal;color:#8e8e8e;font-weight:400;font-size:.85em}
.ktg-md-check{display:flex;align-items:center;gap:.6rem;margin:.4rem 0 .6rem;cursor:pointer;font-size:.95rem;color:#1a1a1a}
.ktg-md-check input{width:1.1rem;height:1.1rem;accent-color:var(--yellow);flex:0 0 auto}
.ktg-md-danger{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid #ececec}
.ktg-md-del-account{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid #eec3c3;color:#c20000;
  border-radius:.6rem;padding:.6rem 1.1rem;font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.ktg-md-del-account:hover{background:#fdecec;border-color:#e0a3a3}
.ktg-md-danger-note{font-size:.82rem;color:#8e8e8e}
.ktg-dark .ktg-md-check{color:#e8e8e8}
.ktg-dark .ktg-md-danger{border-top-color:#333}
.ktg-dark .ktg-md-del-account{background:#2a2a2a;border-color:#5a2a2a}
.ktg-md-photo-row{display:flex;align-items:center;gap:1.25rem;margin-bottom:1.5rem;flex-wrap:wrap}
.ktg-md-photo{width:6rem;height:6rem;flex:0 0 6rem;border-radius:50%;overflow:hidden;background:#f0f0f0;display:flex;align-items:center;justify-content:center}
.ktg-md-photo img{width:100%;height:100%;object-fit:cover}
.ktg-md-photo-ph{color:#b0b0b0;font-size:2.4rem}
.ktg-md-photo-act{display:flex;flex-direction:column;gap:.4rem;align-items:flex-start}
.ktg-md-photo-btn,.ktg-md-photo-del{display:inline-flex;align-items:center;gap:.45rem;border:0;border-radius:.6rem;cursor:pointer;font-family:inherit;font-weight:600;font-size:.88rem;padding:.55rem .9rem}
.ktg-md-photo-btn{background:var(--yellow);color:#1a1a1a}
.ktg-md-photo-del{background:none;color:#c20000;padding:.2rem .3rem;font-size:.82rem}
.ktg-md-hint{margin:.15rem 0 0;font-size:.8rem;color:#888}
.ktg-md-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem 1.1rem;margin-bottom:1.5rem}
.ktg-md-field{display:block}
.ktg-md-field>span{display:block;margin-bottom:.35rem;font-size:.85rem;font-weight:600;color:#444}
.ktg-md-field>span b{color:#e11}
.ktg-md-field input,.ktg-md-row-fields input{width:100%;padding:.65rem .8rem;font-size:.95rem;font-family:inherit;color:#1a1a1a;background:#fff;border:1px solid var(--gray-border);border-radius:.6rem}
.ktg-md-field input:focus,.ktg-md-row-fields input:focus{outline:0;border-color:var(--yellow)}
.ktg-md-block{margin-bottom:1.5rem;padding-top:1.25rem;border-top:1px solid #f0f0f0}
.ktg-md-block-h{font-size:1.05rem;font-weight:700;color:#1a1a1a;margin-bottom:.8rem}
.ktg-md-row{display:flex;align-items:flex-start;gap:.7rem;margin-bottom:.7rem}
.ktg-md-row-fields{flex:1;display:grid;gap:.5rem;min-width:0}
.ktg-md-radio{flex:0 0 auto;margin-top:.7rem;cursor:pointer;position:relative;width:1.2rem;height:1.2rem}
.ktg-md-radio input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.ktg-md-radio span{display:block;width:1.2rem;height:1.2rem;border:2px solid #ccc;border-radius:50%;transition:border-color .15s ease}
.ktg-md-radio input:checked+span{border-color:var(--yellow);box-shadow:inset 0 0 0 .28rem var(--yellow)}
.ktg-md-del{flex:0 0 auto;margin-top:.4rem;background:none;border:0;color:#aaa;cursor:pointer;font-size:1rem;padding:.3rem}
.ktg-md-del:hover{color:#c20000}
.ktg-md-add{display:inline-flex;align-items:center;gap:.45rem;background:#f4f4f4;border:0;border-radius:.6rem;cursor:pointer;font-family:inherit;font-weight:600;font-size:.88rem;padding:.55rem .95rem;color:#333}
.ktg-md-add:hover{background:#ececec}
.ktg-md-note{margin:.6rem 0 0;font-size:.8rem;color:#999}
.ktg-md-err{margin:0 0 .8rem;padding:.55rem .8rem;font-size:.85rem;color:#a11;background:#fdecec;border-radius:.5rem}
.ktg-md-foot{display:flex;align-items:center;gap:1rem;margin-top:.5rem}
.ktg-md-save{background:var(--yellow);color:#1a1a1a;border:0;border-radius:.7rem;font-weight:800;font-size:.95rem;font-family:inherit;padding:.8rem 1.8rem;cursor:pointer}
.ktg-md-save:hover{filter:brightness(.96)}
.ktg-md-save:disabled{opacity:.6;cursor:default}
.ktg-md-saved{color:#1a9e42;font-weight:600;font-size:.9rem}
/* Кроп-модалка */
.ktg-crop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.6);padding:1rem}
.ktg-crop-box{background:#fff;border-radius:1rem;padding:1rem;max-width:34rem;width:100%}
.ktg-crop-stage{max-height:60vh}
.ktg-crop-stage img{max-width:100%;display:block}
.ktg-crop-foot{display:flex;justify-content:flex-end;gap:.7rem;margin-top:.9rem}
.ktg-crop-cancel,.ktg-crop-ok{border:0;border-radius:.6rem;cursor:pointer;font-family:inherit;font-weight:700;font-size:.9rem;padding:.65rem 1.2rem}
.ktg-crop-cancel{background:#f2f2f2;color:#444}
.ktg-crop-ok{background:var(--yellow);color:#1a1a1a}
.ktg-crop-ok:disabled{opacity:.6}
@media(max-width:560px){.ktg-md-grid{grid-template-columns:1fr}}
.ktg-dark .ktg-md-h,.ktg-dark .ktg-md-block-h{color:#f2f2f2}
.ktg-dark .ktg-md-field input,.ktg-dark .ktg-md-row-fields input{background:#1c1c1c;border-color:#3a3a3a;color:#f2f2f2}
.ktg-dark .ktg-md-add{background:#333;color:#ddd}
.ktg-dark .ktg-md-block{border-color:#333}
.ktg-dark .ktg-crop-box{background:#232323}
/* Аватар вместо иконки «Мой Karcher» в шапке (веб + мобильный нижний бар) */
.ktg-avatar-slot{display:inline-flex;align-items:center;justify-content:center;line-height:0}
.ktg-avatar-slot.has-photo{border-radius:50%;overflow:hidden;background:#f0f0f0}
.ktg-avatar-slot.has-photo img{width:100%;height:100%;object-fit:cover;display:block}
/* §Меню(3) 4: фото пользователя в кружке меню (десктоп + мобилка) заполняет аватар. */
.cm-avatar .ktg-avatar-slot.has-photo,.acc-avatar .ktg-avatar-slot.has-photo{width:100%;height:100%}
.mainnav .nav-btn-icon .ktg-avatar-slot.has-photo{width:2.125rem;height:2.125rem}
.mbn-ico .ktg-avatar-slot.has-photo{width:1.7rem;height:1.7rem}
/* §Мой Керхер [23]: лента уведомлений на главной кабинета («Уведомления»). */
.ktg-notify{margin-top:1.25rem}
.ktg-notify-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.ktg-notify-item{display:flex;gap:.85rem;align-items:flex-start;padding:.9rem 1.05rem;border:1px solid #ececec;border-radius:.9rem;background:#fff}
.ktg-notify-ico{flex:0 0 auto;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--yellow);color:#1a1a1a;display:flex;align-items:center;justify-content:center;font-size:.95rem}
.ktg-notify-body{min-width:0}
.ktg-notify-t{margin:0;font-weight:600;color:#1a1a1a;font-size:.95rem}
.ktg-notify-d{display:block;margin-top:.15rem;font-size:.82rem;color:#999}
.ktg-dark .ktg-notify-item{background:#232323;border-color:#333}
.ktg-dark .ktg-notify-t{color:#f2f2f2}
/* Разделы кабинета: отзывы, КП, счета */
.ktg-sec-h{font-size:1.35rem;font-weight:800;margin:0 0 1.1rem;color:#1a1a1a}
.ktg-sec-empty{text-align:center;padding:2.5rem 1rem;color:#777}
.ktg-sec-empty i{font-size:2.6rem;color:#d0d0d0;margin-bottom:.9rem;display:block}
.ktg-sec-empty p{margin:0 auto .6rem;max-width:34rem;line-height:1.55;font-size:.95rem}
.ktg-sec-soon{font-size:.85rem;color:#b78900;background:#fff8e1;display:inline-block;padding:.35rem .8rem;border-radius:.5rem}
.ktg-sec-link{display:inline-block;margin-top:1rem;padding:.7rem 1.4rem;font-weight:700;color:#1a1a1a;background:var(--yellow);border-radius:.7rem;text-decoration:none}
.ktg-sec-link:hover{filter:brightness(.96)}
.ktg-reviews{display:flex;flex-direction:column;gap:.9rem}
.ktg-review{border:1px solid #ececec;border-radius:.9rem;padding:1rem 1.15rem}
.ktg-review-top{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem;flex-wrap:wrap}
.ktg-review-prod{font-weight:700;color:#1a1a1a;text-decoration:none}
.ktg-review-prod:hover{color:#000;text-decoration:underline}
.ktg-review-date{font-size:.82rem;color:#999;flex:0 0 auto}
.ktg-review-stars{color:var(--star);letter-spacing:.1rem;font-size:.95rem;margin:.35rem 0}
.ktg-review-text{color:#444;line-height:1.5;font-size:.92rem}
.ktg-dark .ktg-sec-h,.ktg-dark .ktg-review-prod{color:#f2f2f2}
.ktg-dark .ktg-review{border-color:#333}
.ktg-dark .ktg-review-text{color:#cfcfcf}
.ktg-dark .ktg-sec-soon{background:#33270a;color:#e8c874}

/* §Корзина [5]: «Мои КП/счета» — превью А4 (6-в-ряд), открыть/удалить/переместить. */
.ktg-docs-loading{color:#999;padding:1.5rem 0}
.ktg-docs-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.ktg-doc-card{border:1px solid #ececec;border-radius:.8rem;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:opacity .25s ease,transform .25s ease}
.ktg-doc-card.is-removing{opacity:0;transform:scale(.92);pointer-events:none}
.ktg-doc-preview{position:relative;width:100%;aspect-ratio:210/297;overflow:hidden;background:#fff;border-bottom:1px solid #ececec}
.ktg-doc-preview iframe{position:absolute;top:0;left:0;width:794px;height:1123px;border:0;transform-origin:top left;pointer-events:none;background:#fff}
.ktg-doc-open{position:absolute;inset:0;background:transparent;border:0;cursor:pointer}
.ktg-doc-open:hover{background:rgba(255,222,0,.12)}
.ktg-doc-drag{position:absolute;top:.35rem;right:.35rem;width:1.7rem;height:1.7rem;border:0;border-radius:.4rem;background:rgba(255,255,255,.9);color:#8a8a8a;cursor:grab;display:flex;align-items:center;justify-content:center;font-size:.8rem;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.ktg-doc-drag:active{cursor:grabbing}
.ktg-doc-meta{padding:.5rem .6rem .2rem;display:flex;flex-direction:column;gap:.1rem;min-width:0}
.ktg-doc-meta b{font-size:.8rem;color:#1a1a1a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ktg-doc-meta span{font-size:.72rem;color:#999}
.ktg-doc-act{display:flex;gap:.4rem;padding:.5rem .6rem .6rem;margin-top:auto}
.ktg-doc-openbtn{flex:1;border:0;background:var(--yellow);color:#1a1a1a;font-weight:600;font-size:.76rem;border-radius:.5rem;padding:.45rem .3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.3rem}
.ktg-doc-openbtn:hover{filter:brightness(.96)}
.ktg-doc-del{flex:0 0 auto;width:2rem;border:1px solid var(--gray-border);background:#fff;color:#c0392b;border-radius:.5rem;cursor:pointer;font-size:.8rem}
.ktg-doc-del:hover{background:#fdecea;border-color:#f3c1bb}
.ktg-doc-card.is-dragging{opacity:.25}
.ktg-drag-clone{box-shadow:0 10px 30px rgba(0,0,0,.2);border-radius:.8rem;opacity:.97}
@media(max-width:1400px){.ktg-docs-grid{grid-template-columns:repeat(5,1fr)}}
@media(max-width:1200px){.ktg-docs-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.ktg-docs-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.ktg-docs-grid{grid-template-columns:repeat(2,1fr);gap:.7rem}}
.ktg-dark .ktg-doc-card{background:#232323;border-color:#333}
.ktg-dark .ktg-doc-preview,.ktg-dark .ktg-doc-preview iframe{background:#fff}
.ktg-dark .ktg-doc-meta b{color:#f2f2f2}
.ktg-dark .ktg-doc-del{background:#2a2a2a;border-color:#444}

/* Мой Керхер — личный кабинет */
.acc-page{padding-top:1.25rem;padding-bottom:2.5rem}
.acc-user{display:flex;align-items:center;gap:1rem;padding:.25rem 0 1.25rem}
.acc-avatar{width:3.3rem;height:3.3rem;flex:0 0 3.3rem;border-radius:50%;background:#efefef;display:flex;align-items:center;justify-content:center;color:#9a9a9a;font-size:1.4rem}
.acc-name{font-weight:800;font-size:1.05rem;color:#1a1a1a}
.acc-sub{color:#555;font-size:.9rem}
.acc-mail{color:#9a9a9a;font-size:.85rem}
.acc-nav{display:flex;flex-direction:column;border-top:1px solid #ececec}
.acc-nav a{display:flex;align-items:center;gap:.9rem;padding:.95rem .15rem;color:#1a1a1a;text-decoration:none;font-weight:600;border-bottom:1px solid #f2f2f2}
.acc-nav a > i:first-child{width:1.4rem;text-align:center;color:#888;font-size:1rem}
/* position:static обязателен: базовый .badge — absolute, и без сброса он
   отрывается от строки и прилипает к правому краю документа (перелив ~11px). */
.acc-nav .badge{position:static;margin-left:auto;background:var(--yellow);color:#111;border-radius:1rem;min-width:1.3rem;height:1.3rem;display:inline-flex;align-items:center;justify-content:center;font-size:.72rem;padding:0 .42rem;font-weight:700}
.acc-arr{margin-left:auto;color:#c4c4c4;font-size:.85rem}
.acc-block{padding:1rem 0;border-bottom:1px solid #ececec}
.acc-block-h{font-weight:700;color:#1a1a1a;margin-bottom:.55rem}
.acc-catlink{display:flex;align-items:center;gap:.85rem;padding:.5rem 0;text-decoration:none;color:#1a1a1a}
.acc-catlink-img{width:2.7rem;height:2.7rem;flex:0 0 2.7rem;border-radius:.7rem;background:#f5f5f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.acc-catlink-img img{width:88%;height:88%;object-fit:contain}
.acc-catlink-txt b{display:block;font-size:.95rem}
.acc-catlink-txt i{color:#9a9a9a;font-size:.8rem;font-style:normal}
.acc-catlink .acc-arr{font-size:.85rem}
/* Аккордеон каталога в дровере (§Каталог 5) */
.acc-cat{border-bottom:1px solid #f2f2f2}
.acc-cat:last-child{border-bottom:none}
.acc-cat-head{display:flex;align-items:center;gap:.85rem;width:100%;padding:.6rem 0;background:none;border:none;cursor:pointer;font-family:inherit;text-align:left;color:#1a1a1a}
.acc-cat-head .acc-arr,.acc-sub-head .acc-arr{transition:transform .2s ease}
.acc-cat-head.is-open .acc-arr,.acc-sub-head.is-open .acc-arr{transform:rotate(180deg)}
.acc-sub{border-top:1px solid #f4f4f4}
.acc-sub-head{display:flex;align-items:center;width:100%;padding:.6rem .25rem;background:none;border:none;cursor:pointer;font-family:inherit;font-size:.92rem;font-weight:600;color:#2a2a2a;text-align:left}
.acc-sub-head span{flex:1}
.acc-sub-head .acc-arr{font-size:.8rem}
/* Плавное раскрытие аккордеона через grid 0fr↔1fr (как в FAQ).
   Вертикальный padding — только на клиппере он бы мешал схлопыванию в 0,
   поэтому у .acc-body-in лишь левый отступ, вертикальные интервалы дают сами ссылки. */
.acc-cat-body,.acc-sub-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}
.acc-cat-body.is-open,.acc-sub-body.is-open{grid-template-rows:1fr}
.acc-body-in{overflow:hidden;min-height:0;display:flex;flex-direction:column}
.acc-cat-body > .acc-body-in{padding-left:.5rem}
.acc-sub-body > .acc-body-in{padding-left:.75rem}
.acc-sublink{display:flex;align-items:center;gap:.55rem;padding:.5rem .25rem;color:#585858;text-decoration:none;font-size:.9rem}
.acc-sublink:hover{color:#000}
.acc-sublink i{width:1rem;text-align:center;color:#b3b3b3;font-size:.8rem}
.acc-sublink-all{font-weight:700;color:#1a1a1a}
.acc-sublink-lead{font-weight:600;color:#1a1a1a}
.acc-sublink-lone{font-weight:600;color:#2a2a2a}
/* §62: head — ссылка (текст → каталог) слева + кнопка-стрелка (раскрыть) справа */
.acc-cat-head,.acc-sub-head{display:flex;align-items:center;gap:.4rem;width:100%;padding:0;background:none;border:none}
.acc-cat-link{flex:1;display:flex;align-items:center;gap:.85rem;padding:.6rem 0;text-decoration:none;color:#1a1a1a;min-width:0}
.acc-sub-link{flex:1;padding:.6rem .25rem;text-decoration:none;font-size:.92rem;font-weight:600;color:#2a2a2a}
.acc-cat-link:hover .acc-catlink-txt b,.acc-sub-link:hover{color:#000}
.acc-toggle{flex:0 0 auto;background:none;border:0;cursor:pointer;padding:.55rem .5rem;color:#c4c4c4;display:flex;align-items:center;justify-content:center}
.acc-toggle .acc-arr{margin:0;transition:transform .2s ease}
.acc-toggle.is-open .acc-arr{transform:rotate(180deg)}
.ktg-dark .acc-cat-link,.ktg-dark .acc-sub-link{color:#e8e8e8}
.ktg-dark .acc-cat-head,.ktg-dark .acc-sub-head,.ktg-dark .acc-sublink-all,.ktg-dark .acc-sublink-lead,.ktg-dark .acc-sublink-lone{color:#e6e6e6}
.ktg-dark .acc-sublink{color:#b0b0b0}
.ktg-dark .acc-cat,.ktg-dark .acc-sub{border-color:#333}
.acc-link{display:flex;align-items:center;gap:.85rem;padding:.55rem 0;color:#333;text-decoration:none;font-size:.95rem}
.acc-link i{width:1.4rem;text-align:center;color:#888}
.acc-link:hover{color:#000}
/* Выбор города в бургер-меню (§Шапка) — раскрывается в потоке, а не выпадашкой */
.acc-city{border-bottom:1px solid #ececec}
/* flex-direction обязателен: у кнопки есть и класс .location-toggle с column */
.acc-city-head{display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;
  padding:1.05rem 0;background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:1rem;font-weight:600;color:#1a1a1a;text-align:left}
.acc-city-lbl{display:flex;align-items:center;gap:.85rem}
.acc-city-lbl i{width:1.4rem;text-align:center;color:#888;font-size:1rem}
.acc-city-val{display:flex;align-items:center;gap:.5rem;color:#555;font-weight:500;font-size:.95rem}
.acc-city-val .acc-arr{margin-left:0;transition:transform .2s ease}
.acc-city.is-open .acc-city-val .acc-arr{transform:rotate(180deg)}
.acc-city-menu{position:static;min-width:0;padding:0 0 .75rem;background:none;
  border:none;border-radius:0;box-shadow:none}
.acc-city-menu[hidden]{display:none}
.ktg-dark .acc-city{border-color:#333}
.ktg-dark .acc-city-head{color:#e8e8e8}
.ktg-dark .acc-city-val{color:#b0b0b0}
.ktg-dark .acc-city-menu{background:none;box-shadow:none;border:none}
.acc-theme{display:flex;align-items:center;justify-content:space-between;padding:1.05rem 0;border-bottom:1px solid #ececec;font-weight:600;color:#1a1a1a}
.acc-foot{padding:1.1rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem}
.acc-contact{display:flex;align-items:center;gap:.7rem;color:#333;text-decoration:none;font-size:.95rem}
/* §Меню #4: кнопка «Обратный звонок» в мобильном меню. */
.acc-callback-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.7rem 1rem;border-radius:.7rem;background:var(--yellow);color:#1a1a1a;font-weight:700;font-size:.95rem;text-decoration:none;transition:background .15s ease}
.acc-callback-btn:hover{background:var(--yellow-soft)}
.acc-contact i{width:1.3rem;text-align:center;color:#888}
.acc-social{display:flex;gap:1.1rem;font-size:1.25rem;margin-top:.35rem}
.acc-social a{color:#333}
.acc-social a:hover{color:#000}
.acc-logout{display:flex;align-items:center;justify-content:center;gap:.6rem;padding:1rem;margin-top:.5rem;color:#444;text-decoration:none;font-weight:600}
.acc-logout:hover{color:#000}

/* тёмная тема — страницы ЛК */
.ktg-dark .lk-head-t h1,.ktg-dark .fav-title,.ktg-dark .fav-price,.ktg-dark .cmp-h,.ktg-dark .acc-name,
.ktg-dark .acc-block-h,.ktg-dark .cmp-thead span:not(.cmp-label),.ktg-dark .acc-theme{color:#f2f2f2}
.ktg-dark .fav-card,.ktg-dark .cmp-table,.ktg-dark .cmp-filter{background:#232323;border-color:#333;box-shadow:0 0 .7rem rgba(0,0,0,.5)}
.ktg-dark .fav-sub,.ktg-dark .cmp-label,.ktg-dark .cmp-row span:not(.cmp-label),.ktg-dark .acc-sub,
.ktg-dark .acc-nav a,.ktg-dark .acc-link,.ktg-dark .acc-contact,.ktg-dark .cmp-filter,.ktg-dark .lk-act,.ktg-dark .acc-logout,
.ktg-dark .acc-catlink,.ktg-dark .acc-social a{color:#dcdcdc}
.ktg-dark .fav-sku,.ktg-dark .fav-rating,.ktg-dark .lk-head-t span,.ktg-dark .acc-mail,.ktg-dark .acc-catlink-txt i{color:#9a9a9a}
.ktg-dark .cmp-row,.ktg-dark .acc-nav a,.ktg-dark .acc-block,.ktg-dark .acc-theme,.ktg-dark .acc-nav{border-color:#333}
.ktg-dark .acc-avatar,.ktg-dark .acc-catlink-img{background:#2a2a2a}
.ktg-dark .lk-act i,.ktg-dark .acc-nav a > i:first-child,.ktg-dark .acc-link i,.ktg-dark .acc-contact i,.ktg-dark .cmp-filter i:first-child{color:#9a9a9a}

/* десктоп: Избранное — 3 карточки в ряд; Сравнение — 4 в ряд */
@media (min-width:901px){
  .lk-page.fav-page{max-width:var(--container-max)}
  .fav-page .fav-title{margin-right:1.6rem}

  .lk-page.cmp-page{max-width:var(--container-max)}
  .cmp-page .cmp-cards{grid-template-columns:repeat(4,1fr)}
}
/* очень узкие телефоны — карточка в избранном */
@media (max-width:400px){
  .fav-img{flex-basis:34%;max-width:34%}
}

/* ==================================================================
   МОБИЛЬНАЯ ВЁРСТКА — pixel-perfect доводка (макет 3073:16, 390px)
   ================================================================== */
@media (max-width:900px){
  /* --- нижний бар: только иконки, без подписей --- */
  .mbn-lbl{display:none}
  .mbottomnav{padding:.6rem .25rem calc(.6rem + env(safe-area-inset-bottom))}
  .mbn-item{gap:0;padding:.35rem 0;justify-content:center}
  .mbn-ico{font-size:1.65rem}
  .mbn-ico .badge{top:-.5rem;right:-.65rem}
  .mbn-home .mbn-ico{width:3.8rem;height:3.8rem;margin-top:-1.5rem;font-size:1.9rem;border-radius:1.2rem}
  .mbn-home .mbn-lbl{margin-top:0}
  body{padding-bottom:4rem}
  .ktg-fab{bottom:5rem}

  /* --- подвал: скрыть навигацию на мобилке --- */
  .footer-nav{display:none !important}

  /* --- категории: без стрелок, ~3.2 плитки в ряд --- */
  .cat-arrow{display:none !important}
  .cat-section .cat-icons-col{padding:0 !important;margin-bottom:1.15rem;margin-left:10px}
  .cat-icons-viewport{padding:.5rem 0}
  .cat-icons-track{gap:.7rem}
  .cat-icon-card{flex:0 0 calc((100% - 1.55rem)/3.2) !important;gap:.55rem}
  .cat-icon-img{border-radius:1.1rem}
  .cat-icon-name{font-size:.82rem;line-height:1.15;font-weight:600}

  /* --- баннеры категорий: title слева + пилюля-подзаголовок + «Все категории» справа --- */
  .cat-pill{position:relative;flex-direction:row;justify-content:space-between;align-items:flex-end;text-align:left;padding:1.15rem 1.3rem;border-radius:0;min-height:0}
  .cat-pill-txt{align-items:flex-start;text-align:left;min-width:0}
  .cat-pill .title{font-size:1.4rem;line-height:1.1;margin-bottom:.5rem;white-space:normal}
  .cat-pill .sub{display:inline-block;padding:.32rem .85rem;border-radius:2rem;font-weight:700;font-size:.82rem;opacity:1;margin-top:0}
  .cat-pill.yellow .sub{background:#fff;color:#111}
  .cat-pill.dark .sub{background:var(--yellow);color:#111;opacity:1}
  .cat-pill-all{display:flex;align-items:center;gap:.35rem;font-size:.85rem;font-weight:600;white-space:nowrap;flex-shrink:0;margin-left:.75rem;position:absolute;bottom:15px;right:15px}
  .cat-pill.dark .cat-pill-all{color:#fff}
  .cat-pill-all i{font-size:.72rem}

  /* --- заголовки секций --- */
  .products-col h2,.gallery-title,.benefits-title,.partners-title,.form-title,.section-title{font-size:1.6rem}

  /* --- карточка товара (сетка 2 колонки) --- */
  .products-grid{gap:.7rem}
  .product-card{padding:.7rem .7rem .8rem;border-radius:1rem}
  .pc-title{font-size:.95rem;line-height:1.2}
  .pc-subtitle{font-size:.8rem}
  .pc-sku{font-size:.72rem}
  /* зона тапа лайка/сравнения — возвращаем полный размер */
  .pc-fav i{font-size:1.7143rem}
  .pc-compare-ico{width:1.7143rem;height:1.7143rem}
  .pc-price{font-size:1rem}
  .pc-old{font-size:.75rem}
  .pc-install{font-size:.6rem}
  .pc-rating{font-size:.78rem}
  .pc-stock{font-size:.72rem}
  .pc-specs{font-size:.72rem}
  .pc-add{width:2.4rem;height:2.4rem;font-size:1.3rem}
  /* Фикс. высота слота = «+» и счётчик занимают одинаковую высоту, поэтому при
     клике «+» строка цены не меняет высоту и соседние блоки (старая цена/наличие)
     не смещаются. */
  .pc-add-slot{min-width:2rem;height:2.4rem}
  /* Тап-эффект на самом слоте «+» — замкнут на .pc-add-slot, карточку и соседние блоки не трогает. */
  .pc-add-slot{transition:transform .12s ease}
  .pc-add-slot:active{transform:scale(.88)}
  .pc-counter{font-size:.8rem}

  /* --- карточка каталога (плитки категорий на /catalog/) --- */
  .cg-grid{gap:.6rem}
  .cg-grid .cat-icon-name{font-size:.78rem}

  /* --- благодарности/выгоды, партнёры, форма --- */
  .benefit{font-size:.9rem}
  .section{padding:0 1rem}
}

/* --- очень узкие телефоны (≤380) — плитки чуть крупнее, 2.8 в ряд --- */
@media (max-width:380px){
  .cat-icon-card{flex:0 0 calc((100% - 1.3rem)/2.9) !important}
}

/* --- мобилка: галерея / форма / партнёры / подвал (доводка по макету) --- */
@media (max-width:900px){
  /* форма: колонки отзывов нет в мобильном макете */
  .reviews-col{display:none}
  .form-inner{grid-template-columns:1fr}

  /* партнёры: до инициализации — статичная лента со свайпом; когда JS включает
     авто-слайдер (.is-marquee), стилями управляет карусель (не мешаем transform). */
  .partners-row:not(.is-marquee){display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2.5rem;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    padding:0 1rem .6rem;scrollbar-width:none;-ms-overflow-style:none}
  .partners-row:not(.is-marquee)::-webkit-scrollbar{display:none}
  .partners-row:not(.is-marquee) .partner-logo{flex:0 0 auto;min-width:0;margin:0;display:flex;align-items:center;justify-content:center;padding:0}
  .partner-logo img,.partner-logo svg{max-height:4.8rem;width:auto;height:auto}
  .partner-tile{width:auto;max-width:100%}
  .partners-arrow,.partners-dots{display:none}

  /* подвал: бренд по центру, адреса 2×2 */
  .footer-brand{display:flex;flex-direction:column;align-items:center;text-align:center}
  .footer-tagline{max-width:none}
  .footer-social{justify-content:center;margin-top:1rem}
  /* категории — без боковых отступов секции */
  .section.cat-section{padding:0}
  .footer-addresses{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 1rem;align-items:start}
  .footer-addresses h4{grid-column:1/-1;text-align:center;margin-bottom:.35rem}
  /* филиал: иконки сверху по центру, название и адрес под ними (как в макете) */
  .footer-addr{flex-direction:column;align-items:center;text-align:center;gap:.45rem;margin-bottom:0}
  .footer-addr-icons{gap:.5rem}
  .footer-bottom{text-align:center}
}

/* --- мобилка: кнопку «наверх» — вправо, под WhatsApp. §7: FAB чуть выше,
   чтобы отступ до кнопки «наверх» был такой же, как у неё до нижнего бара. --- */
@media (max-width:900px){
  .ktg-fab{bottom:9.5rem}
  .smooth-back-to-top-button,
  .smooth-back-to-top-button.btn-left-side,
  .smooth-back-to-top-button.btn-right-side{left:auto !important;right:1rem !important;bottom:5.5rem !important}
}

/* --- мобилка: иконки нижнего бара из макета (сетка/корзина — картинки, персона — жёлтая) --- */
@media (max-width:900px){
  .mbn-ico .mbn-img{height:1.6rem;width:auto;display:block;object-fit:contain}
  .mbn-person{display:block;width:1.6rem;height:1.7rem;background-color:var(--yellow);
    -webkit-mask:url(../img/icon-person.png) no-repeat center/contain;
    mask:url(../img/icon-person.png) no-repeat center/contain}
}
/* тёмная тема: чёрные png-иконки бара инвертируем в белый (персона остаётся жёлтой) */
.ktg-dark .mbn-ico .mbn-img{filter:brightness(0) invert(1)}

/* --- «Открыть все» в шапке групп товаров: видно всегда (по правке клиента). --- */
.prod-viewall{display:flex;align-items:center;gap:.3rem;font-size:.9rem;font-weight:600;color:#1a1a1a;text-decoration:none;white-space:nowrap;flex-shrink:0}
.prod-viewall:hover{color:#000}
.prod-viewall i{font-size:.72rem}
@media (max-width:900px){
  .products-band{padding:1.75rem 0 2rem;margin-top:0}
  .products-head{display:flex;justify-content:space-around;align-items:center;gap:.3rem;margin-bottom:1.1rem;padding-right:10px;height:70px}
  .products-col h2{text-align:left;margin-bottom:0}
}

/* --- мобилка: выгоды (benefits) — слайдер по 2 с горизонтальным свайпом --- */
@media (max-width:900px){
  .benefits{padding:2.25rem var(--container-pad) 1.75rem}
  .benefits-inner{display:flex;grid-template-columns:none;overflow-x:auto;overflow-y:hidden;gap:1rem;
    padding:.25rem 0;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .benefits-inner::-webkit-scrollbar{display:none}
  .benefit{flex:0 0 calc(50% - .5rem);min-width:0}
}

/* очень узкие телефоны (≤450px) — заголовки секций мельче */
@media (max-width:450px){
  .section-title,.products-col h2,.gallery-block h3,.partners h3,.form-col h3,.reviews-col h3{font-size:1.4rem}
}

/* --- бургер-drawer как «Мой Керхер» (аккаунт-панель) --- */
@media (max-width:900px){
  .mdrawer-body{padding-left:1.2rem;padding-right:1.2rem}
  .mdrawer .acc-page{padding-top:.6rem;padding-bottom:1.5rem}
  .mdrawer .acc-user{padding:.25rem 0 1rem}
  .mdrawer .acc-nav a{padding:.85rem .1rem}
  .mdrawer .acc-block{padding:.9rem 0}
  .mdrawer .acc-catlink-txt b{font-size:.9rem;line-height:1.15}
}

/* мобилка: бейджи в аккаунт-навигации (drawer/account) скрыты */
@media (max-width:900px){
  .acc-nav .badge{display:none}
}

/* ============== СТРАНИЦА КОНТАКТЫ ============== */
.ct-section{padding-top:0;padding-bottom:4rem}
/* §Филиалы #7: заголовок страницы вместо баннера. */
.ct-page-h{font-size:2.2rem;font-weight:800;color:#1a1a1a;text-align:center;margin:1.5rem 0 .35rem;letter-spacing:-.01em}
.ct-page-sub{text-align:center;color:var(--gray-muted);margin:0}
.ktg-dark .ct-page-h{color:#f2f2f2}
/* §Филиалы #5: форма вынесена вниз — блок «Контакты» на всю ширину, форма по центру. */
.ct-top.ct-top{grid-template-columns:1fr}
.ct-form-section .ct-form{max-width:40rem;margin:0 auto}
/* §Меню #3: страница прайс-листов — карточки файлов в ряд. */
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-top:2rem}
.price-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.6rem;background:#fff;border:1px solid #ececec;border-radius:1rem;padding:1.5rem 1.25rem;text-decoration:none;color:#1a1a1a;transition:border-color .15s ease,box-shadow .15s ease,transform .12s ease}
.price-card:hover{border-color:#dcdcdc;box-shadow:0 8px 24px rgba(0,0,0,.07);transform:translateY(-2px)}
.price-card-ico{display:flex;align-items:center;justify-content:center;width:100%;height:6.5rem}
.price-card-ico i{font-size:3.5rem;color:var(--gray-muted)}
.price-card-ico .fa-file-pdf{color:#e02d2d}
.price-card-ico .fa-file-excel{color:#1f8a4c}
.price-card-ico .fa-file-word{color:#2a5699}
.price-card-ico img{max-width:100%;max-height:100%;object-fit:contain;border-radius:.5rem}
.price-card-name{font-weight:700;font-size:.98rem;line-height:1.3}
.price-card-meta{font-size:.82rem;color:var(--gray-muted)}
.price-card-dl{margin-top:auto;display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:.7rem;background:var(--yellow);color:#1a1a1a;font-weight:700;font-size:.88rem}
.price-card:hover .price-card-dl{background:var(--yellow-soft)}
.price-empty{text-align:center;padding:4rem 1rem;color:var(--gray-muted)}
.price-empty i{font-size:3rem;color:var(--gray-border);display:block;margin-bottom:1rem}
.ktg-dark .price-card{background:#232323;border-color:#333}
@media(max-width:900px){.price-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.price-grid{grid-template-columns:1fr}}

.ct-top{
  background:#fff;border:1px solid #ececec;border-radius:1.5rem;
  box-shadow:0 10px 40px rgba(0,0,0,.06);
  display:grid;grid-template-columns:26rem 1fr;gap:2.5rem;
  padding:2.25rem;margin-top:2.5rem;position:relative;z-index:2}

/* Блок «Контакты» на всю ширину — пункты (телефон/адрес/часы) в ряд. */
.ct-info{background:var(--yellow);border-radius:1.25rem;padding:2rem 1.75rem;color:#111;display:flex;flex-wrap:wrap;gap:1.25rem 2.5rem}
.ct-info-title{width:100%;font-size:1.75rem;font-weight:800;margin:0;text-align:center}
.ct-info-item{flex:1;min-width:14rem;margin-bottom:0}
.ct-info-item:last-child{margin-bottom:0}
.ct-info-h{display:flex;align-items:center;gap:.6rem;font-size:1.0625rem;font-weight:700;margin-bottom:.35rem}
.ct-info-h i{font-size:.95rem;width:1.1rem;text-align:center}
.ct-info-b{font-size:1rem;line-height:1.55;color:#1a1a1a;padding-left:1.7rem}
.ct-info-b a{color:#1a1a1a;text-decoration:none}
.ct-info-b a:hover{text-decoration:underline}

.ct-form{display:flex;flex-direction:column;gap:1rem}
.ct-input{
  border:1px solid #dcdcdc;border-radius:.75rem;padding:1rem 1.25rem;
  font-size:1rem;font-family:inherit;background:#fbfbfb;color:#1a1a1a;width:100%;
  transition:border-color .15s ease,background .15s ease}
.ct-input::placeholder{color:#9a9a9a}
.ct-input:focus{outline:none;border-color:#bdbdbd;background:#fff}
.ct-textarea{resize:vertical;min-height:9rem}
.ct-form-btn{
  align-self:flex-start;background:var(--yellow);border:0;border-radius:.75rem;
  padding:1rem 2.25rem;font-size:1rem;font-weight:700;color:#111;cursor:pointer;
  transition:filter .15s ease}
.ct-form-btn:hover{filter:brightness(.95)}

.ct-h{font-size:2rem;font-weight:800;text-align:center;margin:3.5rem 0 2rem;color:#1a1a1a;letter-spacing:-.01em}

.ct-offices{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
/* §Филиалы #1: карточки офисов по макету — плоские, слева, город капсом, серые иконки. */
.ct-office{
  border:1px solid #ececec;border-radius:1rem;overflow:hidden;background:#fff;
  box-shadow:none;display:flex;flex-direction:column;transition:border-color .15s ease,box-shadow .15s ease}
.ct-office:hover{border-color:#dcdcdc;box-shadow:0 6px 22px rgba(0,0,0,.05)}
.ct-office-photo{aspect-ratio:16/10;background:#f4f4f4}
.ct-office-photo img{width:100%;height:100%;object-fit:cover;display:block}
.ct-office-body{padding:1.5rem;text-align:left}
.ct-office-city{font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:#1a1a1a;margin-bottom:1rem}
.ct-office-addr,.ct-office-phone{
  display:flex;align-items:center;justify-content:flex-start;gap:.65rem;color:#3a3a3a;font-size:.95rem;
  margin-bottom:.65rem;text-decoration:none;line-height:1.35}
.ct-office-phone{margin-bottom:0}
.ct-office-addr i,.ct-office-phone i{color:var(--gray-muted);width:1.1rem;text-align:center;flex:0 0 auto}
.ct-office-phone:hover{color:#000}

.ct-map{
  display:block;position:relative;border-radius:1.25rem;overflow:hidden;
  box-shadow:0 8px 30px rgba(0,0,0,.08);line-height:0}
.ct-map img{display:block;width:100%;height:auto}
.ct-map-hint{
  position:absolute;right:1rem;bottom:1rem;background:rgba(20,20,20,.82);color:#fff;
  padding:.55rem 1.1rem;border-radius:2rem;font-size:.85rem;font-weight:600;line-height:1;
  display:inline-flex;align-items:center;gap:.45rem;transition:background .15s ease}
.ct-map:hover .ct-map-hint{background:#000}

.ct-h-first{margin-top:2.5rem}
/* Карточки филиалов (макет 3256:1330): фото + город + адрес + карты + телефоны */
.ct-fil-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.ct-fil-card{display:flex;flex-direction:column;background:#fff;border:1px solid #ececec;border-radius:1.1rem;overflow:hidden;box-shadow:0 6px 22px rgba(0,0,0,.05)}
.ct-fil-photo{position:relative;aspect-ratio:16/9;max-height:350px;background:#f4f4f4}
.ct-fil-photo img{width:100%;height:100%;object-fit:cover;display:block}
/* §Филиалы [4]: правило max-height:none на 2K/4K отключено по запросу клиента. */
@media(min-width:1921px){.ct-fil-photo{/* max-height:none; */}}
/* §Филиалы #8: бейдж статуса филиала. */
.ct-fil-badge{position:absolute;top:.7rem;left:.7rem;z-index:2;padding:.32rem .75rem;border-radius:1rem;font-size:.76rem;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.ct-fil-badge-soon{background:#1a1a1a;color:#fff}
.ct-fil-badge-new{background:var(--yellow);color:#111}
.ct-fil-badge-row{padding:.8rem .9rem 0}
.ct-fil-badge-row .ct-fil-badge{position:static;display:inline-block}
/* §Филиалы #4: кнопка фотоальбома в углу фото (пока заглушка, альбом — в будущем). */
.ct-fil-album{position:absolute;right:.7rem;bottom:.7rem;z-index:2;width:2.2rem;height:2.2rem;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:background .15s ease}
.ct-fil-album:hover{background:rgba(0,0,0,.82)}
/* §Филиалы #1: карточка филиала по макету — центр, телефон-пилюля, круглые соц-иконки. */
.ct-fil-body{display:flex;flex-direction:column;align-items:center;gap:.8rem;padding:1.4rem 1.4rem 1.6rem;text-align:center}
.ct-fil-city{margin:0;font-size:1.35rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;color:#1a1a1a}
.ct-fil-addr{display:flex;align-items:center;gap:.4rem;font-size:.95rem;color:#6a6a6a}
.ct-fil-addr i{color:var(--gray-muted);font-size:.9rem}
.ct-fil-maps{display:flex;gap:.5rem;justify-content:center}
.ct-fil-map{width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;border-radius:.55rem;background:#f5f5f5;transition:background .15s ease}
.ct-fil-map:hover{background:#ececec}
.ct-fil-map img{width:1.35rem;height:1.35rem;object-fit:contain}
.ct-fil-map-g{color:#ea4335;font-size:1.15rem}
.ct-fil-phone-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.35rem;border:1px solid var(--gray-border);border-radius:2rem;font-weight:700;color:#1a1a1a;text-decoration:none;font-size:.98rem;white-space:nowrap;transition:border-color .15s ease}
.ct-fil-phone-pill i{color:#1a1a1a;font-size:.9rem}
.ct-fil-phone-pill:hover{border-color:#1a1a1a}
/* §Контакты/Сервис: форма заявки чуть уже по ширине (как на главной, где она в
   колонке), а не на все 700px. */
.ct-form-sec .form-card{max-width:560px}
.ct-fil-soc{display:flex;gap:.55rem;justify-content:center}
.ct-fil-soc a{width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-size:.9rem;text-decoration:none;transition:transform .15s ease}
.ct-fil-soc a:hover{transform:translateY(-1px)}
.ct-fil-soc-call{background:var(--yellow);color:#1a1a1a}
.ct-fil-soc-wa{background:#25d366}
.ct-fil-soc-ig{background:radial-gradient(circle at 30% 110%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285AEB 90%)}
/* §Сервисы: организация в карточке нашего сервиса + список сервисов по КЗ. */
.ct-serv-org{font-size:.85rem;color:var(--gray-muted);margin-top:-.35rem}
.ct-serv-our{grid-template-columns:repeat(2,1fr)}
/* Multi-column (masonry-стиль): карточки городов заполняют пробелы, без пустых мест между рядами. */
.ct-serv-list{column-count:3;column-gap:1.25rem}
.ct-serv-city{break-inside:avoid;-webkit-column-break-inside:avoid;width:100%;margin-bottom:1.25rem;background:#fff;border:1px solid #ececec;border-radius:1rem;padding:1.25rem 1.35rem}
.ct-serv-city-h{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.02rem;text-transform:uppercase;letter-spacing:.02em;color:#1a1a1a;margin-bottom:.85rem}
.ct-serv-city-h i{color:var(--gray-muted);font-size:.9rem}
.ct-serv-city-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.9rem}
.ct-serv-item{display:flex;flex-direction:column;gap:.15rem;padding-bottom:.9rem;border-bottom:1px solid #f0f0f0}
.ct-serv-item:last-child{border-bottom:0;padding-bottom:0}
.ct-serv-org-name{font-weight:700;color:#1a1a1a;font-size:.92rem}
.ct-serv-addr{color:#6a6a6a;font-size:.88rem}
.ct-serv-phone{color:#1a1a1a;text-decoration:none;font-size:.9rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem;margin-top:.15rem}
.ct-serv-phone i{color:var(--gray-muted);font-size:.8rem}
.ct-serv-phone:hover{color:#000}
.ktg-dark .ct-serv-city{background:#232323;border-color:#333}
.ktg-dark .ct-serv-city-h,.ktg-dark .ct-serv-org-name,.ktg-dark .ct-serv-phone{color:#f2f2f2}
.ktg-dark .ct-serv-addr{color:#cfcfcf}
.ktg-dark .ct-serv-item{border-color:#333}
@media(max-width:900px){.ct-serv-list{column-count:2}}
@media(max-width:600px){.ct-serv-list{column-count:1}.ct-serv-our{grid-template-columns:1fr}}
/* §Сервис-центры: блок «Наши офисы в Казахстане» — компактные карточки,
   связаны с картой (клик → центр на офисе). */
.ct-offices-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.25rem}
.ct-office-card{position:relative;background:#fff;border:1px solid #ececec;border-radius:.9rem;box-shadow:0 6px 22px rgba(0,0,0,.05);
  padding:1.1rem 1.2rem;cursor:pointer;transition:box-shadow .2s ease,border-color .2s ease}
.ct-office-card:hover{box-shadow:0 10px 26px rgba(0,0,0,.12)}
/* Подсветка выбранной карточки — как в контактах (.ct-fil-card.is-active): жёлтое кольцо. */
.ct-office-card.is-active{border-color:var(--yellow);box-shadow:0 0 0 2px var(--yellow),0 8px 26px rgba(0,0,0,.10)}
.ct-office-city{font-size:1.15rem;font-weight:700;color:#1a1a1a;margin:0 0 .55rem}
.ct-office-addr{display:flex;align-items:flex-start;gap:.5rem;color:#6b6b6b;font-size:.95rem;line-height:1.35;margin-bottom:.6rem}
.ct-office-addr i{color:#1a1a1a;margin-top:.15rem;flex-shrink:0}
.ct-office-phone{display:inline-flex;align-items:center;gap:.5rem;color:#1a1a1a;font-weight:600;font-size:.98rem;text-decoration:none}
.ct-office-phone i{color:#1a1a1a}
.ct-office-phone:hover{color:#000}
.ct-office-maps{display:flex;align-items:center;gap:.5rem;margin-top:.7rem}
.ct-office-map{display:inline-flex;width:1.8rem;height:1.8rem;align-items:center;justify-content:center;border-radius:.45rem;background:#f4f4f4;transition:background .14s ease}
.ct-office-map img{max-width:1.1rem;max-height:1.1rem;object-fit:contain}
.ct-office-map-g i{color:#4285F4;font-size:1rem}
.ct-office-map:hover{background:#ececec}
.ktg-dark .ct-office-card{background:#232323;border-color:#333;box-shadow:none}
.ktg-dark .ct-office-city,.ktg-dark .ct-office-phone,.ktg-dark .ct-office-phone i{color:#f2f2f2}
.ktg-dark .ct-office-map{background:#2f2f2f}
@media(max-width:900px){.ct-offices-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ct-offices-grid{grid-template-columns:1fr}}
.ct-servcta-sub-center{text-align:center;color:#6b6b6b;margin:.25rem 0 1.35rem}
@media (max-width:900px){
  .section{padding:1rem}
}
/* Общая карта со всеми филиалами */
.ct-branch-map{position:relative;border-radius:1.25rem;overflow:hidden;box-shadow:0 8px 30px rgba(0,0,0,.08);min-height:30rem;background:#f4f4f4}
.ct-branch-frame{display:block;width:100%;height:100%;min-height:30rem;border:0}
.ct-branch-map .ct-map{height:100%}
.ct-branch-map .ct-map img{height:100%;object-fit:cover}
/* §Филиалы #6/#3: интерактивная карта + пульсация карточки при клике по метке. */
.ct-ymap{height:30rem}
.ct-fil-card{transition:box-shadow .2s ease}
.ct-fil-card.is-pulse{animation:ktgCardPulse 1.6s ease}
@keyframes ktgCardPulse{0%{box-shadow:0 0 0 0 rgba(255,222,0,.6)}60%{box-shadow:0 0 0 10px rgba(255,222,0,0)}100%{box-shadow:0 0 0 0 rgba(255,222,0,0)}}
@media (max-width:700px){
  .ct-fil-grid{grid-template-columns:1fr;gap:1.1rem}
  .ct-branch-map,.ct-branch-frame{min-height:22rem}
  .ct-ymap{height:22rem}
}
.ktg-dark .ct-fil-card{background:#232323;border-color:#333}
.ktg-dark .ct-fil-city{color:#f2f2f2}
.ktg-dark .ct-fil-addr,.ktg-dark .ct-fil-lbl,.ktg-dark .ct-fil-hours{color:#a8a8a8}
.ktg-dark .ct-fil-phone{color:#f2f2f2}
.ktg-dark .ct-fil-map{background:#2e2e2e}
.ktg-dark .ct-fil-map:hover{background:#383838}
.ktg-dark .ct-fil-hours{border-color:#333}
.ktg-dark .ct-branch-map{background:#232323}
/* §Контакты (тёмная тема): пилюля телефона филиала была #1a1a1a на тёмной
   карточке → не видно. Осветляем текст/иконку/рамку. */
.ktg-dark .ct-fil-phone-pill{color:#f2f2f2;border-color:#3a3a3a}
.ktg-dark .ct-fil-phone-pill i{color:#f2f2f2}
.ktg-dark .ct-fil-phone-pill:hover{border-color:#f2f2f2}
.ktg-dark .ct-office-addr i{color:#a8a8a8}

/* контакты — тёмная тема */
.ktg-dark .ct-top{background:#1c1c1c;border-color:#333;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.ktg-dark .ct-input{background:#262626;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .ct-input::placeholder{color:#8a8a8a}
.ktg-dark .ct-input:focus{border-color:#555;background:#2b2b2b}
.ktg-dark .ct-h{color:#f2f2f2}
.ktg-dark .ct-office{background:#232323;border-color:#333}
.ktg-dark .ct-office-city{color:#f2f2f2}
.ktg-dark .ct-office-addr,.ktg-dark .ct-office-phone{color:#cfcfcf}
.ktg-dark .ct-office-phone:hover{color:#fff}

/* контакты — мобилка */
@media (max-width:900px){
  .ct-section{padding-bottom:2.5rem}
  .ct-top{
    grid-template-columns:1fr;gap:1.25rem;padding:1.1rem;margin-top:1.25rem;
    border-radius:1rem}
  .ct-info{padding:1.5rem 1.25rem;border-radius:1rem}
  .ct-info-title{font-size:1.5rem;margin-bottom:0}
  .ct-h{font-size:1.6rem;margin:2.5rem 0 1.5rem}
  .ct-offices{grid-template-columns:1fr 1fr;gap:.85rem}
  .ct-office{border-radius:.85rem}
  .ct-office-body{padding:1.15rem}
  .ct-office-city{font-size:1.05rem;margin-bottom:.75rem}
  .ct-office-addr,.ct-office-phone{font-size:.85rem;gap:.5rem;margin-bottom:.5rem}
  .ct-map{border-radius:.85rem}
}
@media (max-width:480px){
  .ct-offices{grid-template-columns:1fr}
}

/* ============== ЛИСТИНГ ТОВАРОВ НА /catalog/ ============== */
.cat-products{margin:2.5rem auto}
.cat-products-head{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-bottom:1.25rem}
.cat-products-head h2{font-size:1.75rem;font-weight:800;color:#1a1a1a;margin:0;letter-spacing:-.01em}
.cat-products-count{color:var(--gray-muted);font-size:.9375rem}
.cat-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.cat-chip{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border-radius:2rem;border:1px solid #e4e4e4;background:#fff;color:#333;font-size:.875rem;font-weight:600;text-decoration:none;transition:border-color .15s ease,background .15s ease}
.cat-chip:hover{border-color:#bbb}
.cat-chip.is-active{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
.cat-chip-n{font-size:.75rem;color:var(--gray-muted);font-weight:600}
.cat-chip.is-active .cat-chip-n{color:#5a5203}
.cat-products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(12.5rem,1fr));gap:1rem}
/* §Каталог: AJAX-применение фильтра — приглушаем сетку на время загрузки. */
.cat-products-grid.is-ajax-loading{opacity:.45;pointer-events:none;transition:opacity .15s ease}
/* §Каталог: смена категории по AJAX — приглушаем весь блок каталога на загрузку. */
.ktg-cat-loading{opacity:.5;pointer-events:none;transition:opacity .15s ease}
.cat-products-grid .product-card{flex:none;width:auto}
.cat-empty{padding:3rem 1rem;text-align:center;color:var(--gray-muted);font-size:1rem}
.cat-empty a{color:#1a1a1a;font-weight:600}
.cat-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:.4rem;margin-top:2.25rem}
.cat-pagination a,.cat-pagination span{min-width:2.5rem;height:2.5rem;padding:0 .6rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.6rem;border:1px solid #e4e4e4;background:#fff;color:#333;font-weight:600;font-size:.9375rem;text-decoration:none;transition:border-color .15s ease}
.cat-pagination a:hover{border-color:#bbb}
.cat-pagination .is-active{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
/* §Каталог [4]: многоточие-пропуск в компактной пагинации. */
.cat-pagination .cat-pg-gap{border:0;background:none;color:#9a9a9a;min-width:1.4rem;font-weight:400;pointer-events:none}
.ktg-dark .cat-pagination .cat-pg-gap{background:none;border:0;color:#8a8a8a}
.fbar-sort-wrap{position:relative;cursor:pointer}
.fbar-sort-select{border:0;background:transparent;font:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none;outline:none;padding-right:.4rem}

/* тёмная тема листинга */
.ktg-dark .cat-products-head h2{color:#f2f2f2}
.ktg-dark .cat-chip{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .cat-chip:hover{border-color:#555}
.ktg-dark .cat-chip.is-active{background:var(--yellow);color:#1a1a1a}
.ktg-dark .cat-chip.is-active .cat-chip-n{color:#5a5203}
.ktg-dark .cat-pagination a,.ktg-dark .cat-pagination span{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .cat-pagination .is-active{background:var(--yellow);color:#1a1a1a}
.ktg-dark .fbar-sort-select option{background:#232323;color:#e8e8e8}

@media (max-width:560px){
  .cat-products-grid{grid-template-columns:1fr 1fr;gap:.7rem}
  .cat-products-head h2{font-size:1.4rem}
}

/* --- карусель фото в карточке товара --- */
.pc-image{overflow:hidden}
.pc-slides{display:flex;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:5px}
.pc-slides::-webkit-scrollbar{display:none}
.pc-slide{flex:0 0 100%;min-width:100%;height:100%;display:flex;align-items:center;justify-content:center;scroll-snap-align:center;pointer-events:none}
.pc-slide img{max-width:100%;max-height:100%;width:auto;object-fit:contain}
.pc-dots span{cursor:pointer}

/* --- сброс фильтра + плитки категорий каталога --- */
.cat-reset{margin-left:auto;font-size:.85rem;color:var(--gray-muted);text-decoration:none;display:inline-flex;align-items:center;gap:.3rem;font-weight:600;transition:color .15s ease}
.cat-reset:hover{color:#1a1a1a}
.cat-icon-card.is-soon{cursor:default}
.ktg-dark .cat-reset:hover{color:#f2f2f2}

/* --- живой поиск товаров --- */
.ktg-live{position:fixed;z-index:1000;background:#fff;border:1px solid #e4e4e4;border-radius:.75rem;box-shadow:0 14px 38px rgba(0,0,0,.16);max-height:70vh;overflow-y:auto;padding:.35rem;-webkit-overflow-scrolling:touch}
.ktg-live[hidden]{display:none}
.ktg-live-item{display:flex;align-items:center;gap:.7rem;padding:.5rem .6rem;border-radius:.5rem;text-decoration:none;color:#1a1a1a}
.ktg-live-item:hover{background:#f4f4f4}
/* §Шапка 2.2: фото в подсказках поиска увеличено до высоты текстового блока
   (имя/артикул/категория/цена) — фото крупнее, текст центрируется по нему. */
.ktg-live-item img,.ktg-live-ph{width:5rem;align-self:stretch;height:auto;min-height:3.2rem;object-fit:contain;flex:0 0 auto;background:#fff;border-radius:.4rem}
.ktg-live-txt{display:flex;flex-direction:column;min-width:0;gap:.1rem}
.ktg-live-name{font-size:.85rem;font-weight:600;line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ktg-live-sku{font-size:.72rem;color:var(--gray-muted);margin-top:.1rem}
.ktg-live-cat{font-size:.7rem;color:var(--black);font-weight:600;margin-top:.05rem}
.ktg-dark .ktg-live-cat{color:var(--yellow)}
.ktg-live-price{font-size:.8rem;color:#1a1a1a;font-weight:700;margin-top:.15rem}
.ktg-live-empty{padding:1rem;text-align:center;color:var(--gray-muted);font-size:.85rem}
.ktg-live-all{display:block;text-align:center;padding:.6rem;font-size:.8rem;font-weight:600;color:#1a1a1a;text-decoration:none;border-top:1px solid #eee;margin-top:.25rem}
.ktg-live-all:hover{background:#fafafa}
.ktg-dark .ktg-live{background:#232323;border-color:#3a3a3a;box-shadow:0 14px 38px rgba(0,0,0,.5)}
.ktg-dark .ktg-live-item{color:#e8e8e8}
.ktg-dark .ktg-live-item:hover{background:#2f2f2f}
.ktg-dark .ktg-live-name,.ktg-dark .ktg-live-price{color:#f2f2f2}
.ktg-dark .ktg-live-sku{color:#9a9a9a}
.ktg-dark .ktg-live-item img,.ktg-dark .ktg-live-ph{background:#fff}
.ktg-dark .ktg-live-all{color:#e8e8e8;border-top-color:#3a3a3a}
.ktg-dark .ktg-live-all:hover{background:#2a2a2a}

/* ПК: ровно 3 карточки по центру, стрелки в боковых жёлобах (4-я не выглядывает) */
@media (min-width:901px){
  .products-grid{padding-left:0;padding-right:0;margin-left:2.25rem;margin-right:2.25rem}
}

/* ============== СТРАНИЦА ТОВАРА (single-product) ============== */
.sp-page{padding-top:1.4rem;padding-bottom:3rem}
.sp-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;font-size:.85rem;color:var(--gray-muted);margin-bottom:1.25rem}
.sp-crumbs a{color:var(--gray-muted);text-decoration:none}
.sp-crumbs a:hover{color:#1a1a1a}
.sp-crumbs .cur{color:#1a1a1a}

.sp-top{display:grid;grid-template-columns:27rem minmax(0,1fr);gap:1.5rem;align-items:start;margin-bottom:1.15rem}
.sp-buy-col{display:flex;flex-direction:column;gap:1rem}
.sp-buy{background:#fff;border-radius:1.25rem;padding:1.5rem;box-shadow:0 6px 24px rgba(0,0,0,.06);text-align:center}
.sp-extra{background:#fff;border-radius:1.25rem;padding:1.4rem 1.5rem;box-shadow:0 6px 24px rgba(0,0,0,.06)}
.sp-extra > *:last-child{margin-bottom:0}
/* §16/§24/§26: на десктопе верхняя левая колонка — ОДИН блок (карточка = сама
   колонка), внутри секции с тонкими разделителями. Компактнее, без «россыпи» карточек. */
@media(min-width:901px){
  /* §Товар: раздельные карточки (не единая панель) — фон/тень остаются на самих
     .sp-buy / .sp-extra (базовые правила), колонка лишь задаёт отступ между ними. */
  .sp-buy-col{gap:1rem;border-radius:1.25rem}
  .sp-buy{padding:1.35rem 1.5rem 1.15rem}
  .sp-buy-col > .sp-extra{padding:1.05rem 1.5rem}
}
/* §Товар: ряд иконок с артикулом по центру, ниже — название и категория */
.sp-buy-head{width:100%;margin-bottom:1rem}
.sp-buy-icons{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:.7rem}
.sp-buy-icons .sp-sku{margin-top:0}
.sp-buy-main{display:block;width:100%}
.sp-fav{background:none;border:0;color:#cfcfcf;font-size:1.35rem;cursor:pointer;line-height:1;padding:.1rem 0 0}
/* §Товар [7]: сердце на странице товара — крупнее (как в макете, в размер действий). */
.sp-fav i{font-size:2.05rem}
.sp-fav.active i,.sp-fav i.fa-solid{color:#ff4646}
.sp-buy-titles{flex:1;min-width:0}
.sp-title{font-size:1.5rem;font-weight:800;color:#1a1a1a;margin:0;line-height:1.15}
.sp-subtitle{color:#555;font-size:.9rem;margin-top:.25rem}
.sp-sku{color:#9a9a9a;font-size:.85rem;margin-top:.2rem}
.sp-buy-acts{display:flex;gap:.55rem;align-items:flex-start}
/* §Товар 1: были мельче сердечка — выравниваем и увеличиваем (иконки макета). */
.sp-act{background:none;border:0;color:#9e9e9e;font-size:1.4rem;cursor:pointer;padding:.2rem;line-height:1;display:flex;align-items:center;justify-content:center}
.sp-act:hover{color:#1a1a1a}
.sp-act .pc-compare-ico{width:1.45rem;height:1.45rem;display:block}
.sp-stock{position:relative;display:flex;align-items:center;justify-content:center;gap:.45rem;font-size:.9rem;color:#22a34a;margin-bottom:.9rem}
.sp-stock .dot{width:.5rem;height:.5rem;border-radius:50%;background:#22a34a}
.sp-stock.out{color:#c98a00}.sp-stock.out .dot{background:#c98a00}
/* §Товар #13: наличие по городам — раскрытие по наведению (десктоп) / клику (мобилка). */
.sp-stock-has{cursor:pointer}
.sp-stock-caret{font-size:.65rem;transition:transform .2s ease}
.sp-stock-pop{position:absolute;top:calc(100% + .5rem);left:50%;min-width:15rem;background:#fff;border:1px solid var(--gray-border);border-radius:.7rem;box-shadow:0 .6rem 1.6rem rgba(0,0,0,.14);padding:.7rem .8rem;opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-4px);transition:opacity .15s ease,transform .15s ease;z-index:30;text-align:left}
.sp-stock-has:hover .sp-stock-pop,.sp-stock-has.is-open .sp-stock-pop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.sp-stock-has:hover .sp-stock-caret,.sp-stock-has.is-open .sp-stock-caret{transform:rotate(180deg)}
.sp-stock-pop-h{font-size:.8rem;font-weight:700;color:#1a1a1a;margin-bottom:.45rem}
.sp-stock-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}
.sp-stock-list li{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.85rem}
.ssc-city{color:#333}
.ssc-qty{color:#22a34a;font-weight:600;white-space:nowrap}
.ktg-dark .sp-stock-pop{background:#232323;border-color:#3a3a3a}
.ktg-dark .sp-stock-pop-h{color:#f2f2f2}
.ktg-dark .ssc-city{color:#cfcfcf}
.sp-price-row{display:flex;align-items:baseline;justify-content:center;gap:.7rem;margin-bottom:.9rem}
.sp-old{text-decoration:line-through;color:#9a9a9a;font-size:1rem}
.sp-price{font-size:1.95rem;font-weight:800;color:#1a1a1a;letter-spacing:-.01em}
/* §Товар [5]: при скидке главная цена — красная. */
.sp-price.is-sale{color:#F14635}
.ktg-dark .sp-price.is-sale{color:#ff6a5a}
/* §Товар [6]: категория-ссылка. */
.sp-subtitle a{color:inherit;text-decoration:none}
.sp-subtitle a:hover{color:#1a1a1a;text-decoration:underline}
.ktg-dark .sp-subtitle a:hover{color:#fff}
.sp-buttons{display:grid;grid-template-columns:1fr 1fr !important;gap:.6rem}
/* §Товар [2]: нет Kaspi-кнопки — «Добавить» на всю ширину. */
.sp-buttons.no-credit{grid-template-columns:1fr !important}
/* §Товар [2]: общая высота обеих кнопок — чтобы Kaspi-ячейка не была ниже/уже
   «Добавить» ни в одном разрешении. */
.sp-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.85rem .6rem;min-height:2.95rem;box-sizing:border-box;border-radius:.7rem;font-weight:700;font-size:.9rem;text-decoration:none;cursor:pointer;border:0;transition:filter .15s ease}
.sp-btn-cart{background:var(--yellow);color:#111}
.sp-btn-credit{background:#F14635;color:#fff}
.sp-kaspi{width:1.35rem;height:1.35rem;object-fit:contain;flex:0 0 auto}
.sp-btn:hover{filter:brightness(.95)}
/* §Kaspi [2]: официальный виджет выводится сразу. Ячейка и виджет занимают всю
   колонку сетки и по высоте совпадают с «Добавить»; сам iframe Kaspi имеет
   фиксированный размер — принудительно тянем его на 100% ширины/высоты ячейки,
   иначе он «схлопывается» уже соседа и по-разному в разных разрешениях. */
.sp-credit-cell{display:flex;flex-direction:column;min-width:0;width:100%}
.sp-kaspi-widget{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:2.95rem;border-radius:.7rem;overflow:hidden}
.sp-kaspi-widget[hidden]{display:none}
.sp-kaspi-widget>*{width:100% !important;max-width:100% !important}
.sp-kaspi-widget iframe{width:100% !important;max-width:100%;min-height:2.95rem;border:0;display:block}
.sp-install{font-size:.8rem;color:var(--gray-muted);margin:.5rem 0 1.1rem;text-align:center}
.sp-delivery{display:flex;gap:.8rem;align-items:center;justify-content:center}
.sp-delivery>i{font-size:2.5rem;color:#1a1a1a}
/* §Товар 2: город — кнопка выбора (flex-direction обязателен: .location-toggle ставит column) */
.sp-delivery-city{display:flex;flex-direction:row;align-items:center;gap:.28rem;
  font-size:.9rem;color:#1a1a1a;background:none;border:0;padding:0;margin:0;
  font-family:inherit;cursor:pointer;text-align:left;line-height:1.3}
.sp-delivery-city b{font-weight:700}
.sp-delivery-city i{font-size:.65rem;color:#9a9a9a;margin-left:.2rem;transition:transform .2s ease}
.sp-city.is-open .sp-delivery-city i{transform:rotate(180deg)}
/* §Товар: меню города — привязано к правому краю кнопки и растёт ВЛЕВО (внутрь
   правой колонки покупки), чтобы не вылезать за правый край и не срезаться
   body{overflow-x:clip}. На мобиле колонка на всю ширину — привязываем влево. */
.sp-city .city-menu{top:calc(100% + .4rem);left:auto;right:0;transform:none;min-width:15rem;max-width:calc(100vw - 2rem)}
@media(max-width:900px){
  .sp-city .city-menu{left:0;right:auto}
}
.sp-delivery-sub{font-size:.85rem;color:#555;margin-top:.15rem}
.sp-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:1.2rem}
.sp-doc{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.4rem .3rem;text-decoration:none;color:#555;font-size:.82rem;transition:color .15s ease}
.sp-doc i{font-size:2.5rem;color:#1a1a1a}
/* §Товар [7]: размеры иконок КАК В МАКЕТЕ (Figma «Товар» 3256:444, карточка 544px:
   документы 49–52px, доставка 75px, действия 47px). Масштаб под реальную карточку
   27rem/432px (×0.79 от макета): документы ~2.5rem, доставка ~3.7rem, действия ~2.3rem. */
.sp-ico{display:block;object-fit:contain}
.sp-act .sp-ico{width:1.95rem;height:1.95rem}
.sp-doc-ico{width:2.5rem;height:2.5rem;object-fit:contain;display:block}
.sp-delivery .sp-ico{width:3.7rem;height:3.7rem;object-fit:contain;flex:0 0 auto}
.sp-sku-under{text-align:center}
.sp-doc:hover{color:#000}
.sp-pack-h{text-align:center;font-weight:600;font-size:1.5rem;color:#1a1a1a;margin-bottom:.6rem}
.sp-pack-row{display:flex;justify-content:space-between;font-size:.9rem;padding:.3rem 0;color:#555}
.sp-pack-row b{color:#1a1a1a;font-weight:700}

.sp-gallery{display:flex;flex-direction:column;gap:1rem;height:100%}
/* §Товар 5: фото занимает остаток колонки, чтобы низ миниатюр совпадал
   с низом левых блоков (жёсткий max-height оставлял 20px пустоты). */
.sp-gallery-main{position:relative;background:#fff;border-radius:1.25rem;padding:1.4rem;box-shadow:0 6px 24px rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;min-height:20rem;flex:1 1 auto;overflow:hidden}
/* §Товар #5/#14/#22: клик по фото → лайтбокс; счётчик и кнопка «развернуть». */
.sp-gallery-main.is-zoomable img{cursor:zoom-in}
.sp-gallery-count{position:absolute;left:1rem;bottom:1rem;display:inline-flex;align-items:center;gap:.3rem;background:rgba(0,0,0,.6);color:#fff;font-size:.8rem;font-weight:600;padding:.25rem .6rem;border-radius:1rem;pointer-events:none}
.sp-gallery-expand{position:absolute;right:1rem;top:1rem;width:2.2rem;height:2.2rem;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:background .15s ease}
.sp-gallery-expand:hover{background:rgba(0,0,0,.82)}
.sp-gallery-main img{max-width:100%;max-height:32rem;object-fit:contain}
/* §Товар [11]: лента превью — везде одинаково, видно ~4.5 фото и можно листать. */
.sp-thumbs{display:flex;gap:.7rem;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:.25rem}
.sp-thumbs::-webkit-scrollbar{display:none}
.sp-thumb{flex:0 0 calc((100% - 3.5rem) / 4.5);min-width:0;max-width:none;aspect-ratio:16/11;border:1px solid #ececec;border-radius:.9rem;background:#fff;overflow:hidden;cursor:pointer;padding:.45rem;transition:border-color .15s ease}
.sp-thumb img{width:100%;height:100%;object-fit:contain}
.sp-thumb:hover{border-color:#bbb}
.sp-thumb.is-active{border-color:var(--yellow);border-width:2px}

.sp-block{background:#fff;border-radius:1.25rem;padding:1.75rem;margin-bottom:1.5rem}
.sp-block-h{text-align:center;font-size:1.5rem;font-weight:600;color:#1a1a1a;margin:0 0 1.1rem}
/* §Товар #1/#2/#23: на вебе блоки раскрыты и закреплены; сворачивание — только в мобилке. */
.sp-collapsible > .sp-block-h,.sp-collapsible > .sp-pack-h{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  cursor:pointer;-webkit-user-select:none;user-select:none}
.sp-collapsible:not(.is-open) > .sp-block-h,.sp-collapsible:not(.is-open) > .sp-pack-h{margin-bottom:0}
.sp-acc-arr{display:inline-block;flex:0 0 auto;color:#9a9a9a;font-size:.85rem;transition:transform .2s ease}
.sp-collapsible.is-open .sp-acc-arr{transform:rotate(180deg)}
.sp-collapsible:not(.is-open) > *:not(.sp-block-h):not(.sp-pack-h){display:none}
/* §Товар #2: десктоп — заголовки не сворачиваемые (без курсора и стрелки, по центру). */
@media(min-width:901px){
  .sp-collapsible > .sp-block-h,.sp-collapsible > .sp-pack-h{cursor:default;justify-content:center}
  .sp-collapsible .sp-acc-arr{display:none}
}
/* §Товар #6: иконка доставки (в наборе FA иногда пустая) — фиксируем глиф. */
.fa-truck-fast:before,.fa-shipping-fast:before{content:"\f48b"}
/* §Товар #3: «Где использовать» — маркеры-галочки как в комплектации. */
.sp-usage-text ul{list-style:none;margin:0;padding:0}
.sp-usage-text ul li{position:relative;padding-left:1.75rem;margin-bottom:.45rem}
.sp-usage-text ul li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:.05rem;color:var(--green);font-size:.85rem}
/* §Товар #9: ссылки гарантии — подчёркнуты, единый шрифт (как «политика конф.»). */
.sp-wcard a{text-decoration:underline;text-underline-offset:2px;color:inherit;font-size:.9rem}
.sp-desc-body{max-width:62rem;margin:0 auto;color:#333;line-height:1.65;font-size:.98rem}
.sp-desc-body p{margin:0 0 .8rem}

/* §Товар [17]: равные колонки среднего блока — ровно и одинаково (как в макете). */
.sp-mid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start;margin-bottom:1.5rem}
.sp-mid-left{display:flex;flex-direction:column;gap:1.15rem;min-width:0}
.sp-card,.sp-warranty,.sp-specs{background:#fff;border-radius:1.25rem;padding:1.75rem}
.sp-warranty-cards{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem}
.sp-wcard{text-align:center;border-radius:1rem;padding:0}
.sp-wcard i{font-size:5rem;color:var(--yellow);margin-bottom:.7rem}
.sp-wcard-t{font-weight:700;color:#1a1a1a;font-size:.95rem;margin-bottom:.4rem}
.sp-wcard a{font-size:.8rem;color:var(--gray-muted);text-decoration:underline}
.sp-wcard a:hover{color:#1a1a1a}
/* §Товар 5: компактные характеристики — без линий, значение сразу после названия.
   display:contents превращает строки в ячейки общей сетки, поэтому колонка
   значений выравнивается по самому длинному названию, а не по правому краю. */
/* §Товар: названия (длинные) переносятся и занимают остаток строки; значения
   получают ширину по содержимому, но не шире лимита (иначе одно длинное значение
   раздувает колонку и схлопывает названия). Короткие значения — в одну строку. */
.sp-specs-table{max-width:100%;display:grid;grid-template-columns:minmax(0,1fr) fit-content(14rem);column-gap:1.5rem;font-size:.92rem}
.sp-spec-row{display:contents}
.sp-spec-k{color:#555;padding:.42rem .2rem}
.sp-spec-v{font-weight:600;color:#1a1a1a;text-align:left;padding:.42rem .2rem}

/* Текст в плитке «Где использовать» */
.sp-usage-text{color:#333;line-height:1.65;font-size:.98rem}
.sp-usage-text p{margin:0 0 .6rem}

/* Медиа-ряд: видео (слева) + результаты ДО/После (справа) */
.sp-media{display:flex;gap:1.5rem;align-items:stretch;margin-bottom:1.5rem}
/* Обёртка колонки медиа-ряда: держит равные высоты, как было до аккордеонов */
.sp-media-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column}
.sp-media-col > .sp-media-video,.sp-media-col > .sp-results-card{flex:1 1 auto}
.sp-mob-h{display:none}
/* стрелка аккордеона — только на мобильной (на вебе блоки не сворачиваются) */
.sp-acc-arr{display:none}
.sp-media-video{flex:1 1 0;min-width:0;border-radius:1.25rem;overflow:hidden;background:#000;display:flex;flex-direction:column}
/* §Товар [12]: видео всегда 16:9 — одинаковая высота блока (не «то длинное, то широкое»). */
.sp-video{position:relative;overflow:hidden;aspect-ratio:16/9;width:100%}
.sp-media-video iframe,.sp-media-video video,.sp-media-video embed,.sp-media-video object{display:block;width:100%!important;height:100%!important;min-height:0;border:0;border-radius:1.25rem}
.sp-video-facade{aspect-ratio:16/9}
.sp-video-facade{background:#ffffff}
.sp-video-play{display:block;position:relative;width:100%;flex:1;min-height:16rem;padding:0;margin:0;border:0;cursor:pointer;background:#000;border-radius:1.25rem;overflow:hidden}
.sp-video-play img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sp-video-play::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.28))}
.sp-video-btn{position:absolute;inset:0;margin:auto;z-index:1;width:4.75rem;height:4.75rem;border-radius:50%;background:#F14635;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.35);transition:transform .18s ease,background .18s ease}
.sp-video-btn i{color:#fff;font-size:1.55rem;margin-left:.22rem}
.sp-video-play:hover .sp-video-btn{transform:scale(1.08);background:#d63a2c}
.sp-results-card{flex:1 1 0;min-width:0}
.sp-results{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;height:100%}
.sp-result-item{margin:0}
.sp-result-label{display:none}
.sp-result-item img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;display:block;border-radius:.9rem;background:var(--gray-light)}

/* Комплектация */
.sp-kit-body{max-width:62rem;margin:0 auto;color:#333;line-height:1.7;font-size:.98rem}
.sp-kit-body ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.6rem 2rem}
.sp-kit-body ul li{position:relative;padding-left:1.75rem}
.sp-kit-body ul li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:.05rem;color:var(--green);font-size:.85rem}
.sp-kit-body p{margin:0 0 .7rem}

/* Запчасти / Аксессуары — 2 колонки как блок на главной (но на белом фоне) */
/* §Товар: блоки «Запчасти/Аксессуары» — стили и отступы как у .products-wrap на главной.
   Заголовок h2 наследует .products-col h2 (2rem снизу), gap и брейкпоинт совпадают. */
.sp-bands{display:grid;grid-template-columns:1fr 1fr;gap:1rem;position:relative;margin-bottom:1.5rem}
.sp-bands.sp-bands-one{grid-template-columns:1fr}
@media(min-width:901px){
  .sp-bands > .products-col:first-child .product-arrow.left {left:-0.6rem}
  .sp-bands > .products-col:first-child .product-arrow.right{right:-0.8rem}
  .sp-bands > .products-col:last-child  .product-arrow.left {left:-0.8rem}
  .sp-bands > .products-col:last-child  .product-arrow.right{right:-0.6rem}
  .sp-bands .products-grid{gap:.4rem;padding:.5rem 0;margin-left:1rem;margin-right:1rem}
}
@media (max-width:900px){.sp-bands{grid-template-columns:1fr;gap:2rem;padding:0 0 0 1rem}}

/* Отдельная страница «Все отзывы» */
.sp-reviews-page .rv-list-full{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;align-items:start}
@media (max-width:900px){.sp-reviews-page .rv-list-full{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.sp-reviews-page .rv-list-full{grid-template-columns:1fr}}
.sp-reviews-h1{font-size:1.9rem;font-weight:700;color:#1a1a1a;margin:.5rem 0 1.5rem}
.rv-summary-wide{display:flex;align-items:center;gap:1.25rem;text-align:left;margin-bottom:1.5rem}
.rv-summary-wide .rv-avg{font-size:2.6rem}
.rv-summary-wide .rv-stars{margin:0}
.rv-summary-wide .rv-count{margin-left:auto}
.sp-reviews-sub{color:var(--gray-muted);font-size:1rem;margin:-.75rem 0 1.5rem}
.rv-item-global .rv-prod{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--gray-border)}
.rv-item-global .rv-prod img{width:2.6rem;height:2.6rem;object-fit:contain;border-radius:.5rem;background:#fff;flex:0 0 auto}
.rv-item-global .rv-prod-name{font-weight:700;color:#1a1a1a;font-size:.95rem;line-height:1.3}
.rv-item-global .rv-prod:hover .rv-prod-name{color:#5a5a5a}
.ktg-dark .rv-item-global .rv-prod{border-color:#333}
.ktg-dark .rv-item-global .rv-prod-name{color:#f2f2f2}
.rv-list-full{gap:1rem;margin-bottom:1.75rem}
.rv-pagination{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1.5rem}
.rv-pg{display:inline-flex;align-items:center;justify-content:center;min-width:2.6rem;height:2.6rem;padding:0 .6rem;border:1px solid var(--gray-border);border-radius:.7rem;background:#fff;color:#1a1a1a;font-weight:600;text-decoration:none;transition:background .15s ease,border-color .15s ease}
.rv-pg:hover{background:var(--gray-light);border-color:#bcbcbc}
.rv-pg.is-current{background:var(--yellow);border-color:var(--yellow);color:#1a1a1a}
.rv-back{display:inline-flex;align-items:center;gap:.5rem;color:#1a1a1a;font-weight:600;text-decoration:none}
.rv-back:hover{color:#000}
.ktg-dark .sp-reviews-h1{color:#f2f2f2}
.ktg-dark .rv-pg{background:#232323;border-color:#333;color:#e8e8e8}
.ktg-dark .rv-pg.is-current{background:var(--yellow);color:#1a1a1a}
.ktg-dark .rv-back{color:#f2f2f2}

/* Отзывы */
.sp-reviews{margin-bottom:1.5rem}
.rv-grid{display:grid;grid-template-columns:20rem minmax(0,1fr);gap:1.5rem;align-items:start}
.rv-side{display:flex;flex-direction:column;gap:1.5rem}
.rv-summary{text-align:center}
.rv-avg{font-size:3.2rem;font-weight:800;line-height:1;color:#1a1a1a}
.rv-stars{color:var(--star);font-size:1.05rem;letter-spacing:.1rem;margin:.5rem 0 .35rem}
.rv-count{color:var(--gray-muted);font-size:.9rem}
.rv-form-h{font-size:1.15rem;font-weight:700;color:#1a1a1a;margin:0 0 1rem;text-align:center}
.rv-form{display:flex;flex-direction:column;gap:.75rem}
.rv-rate{display:inline-flex;flex-direction:row-reverse;justify-content:center;gap:.25rem;margin-bottom:.35rem}
.rv-rate input{position:absolute;opacity:0;width:0;height:0}
.rv-rate label{cursor:pointer;color:#d9d9d9;font-size:1.7rem;transition:color .12s ease}
.rv-rate label:hover,.rv-rate label:hover ~ label,.rv-rate input:checked ~ label{color:var(--star)}
.rv-rate input:focus-visible + label{outline:2px solid var(--star);outline-offset:2px;border-radius:.2rem}
.rv-form input,.rv-form textarea{width:100%;border:1px solid var(--gray-border);border-radius:.75rem;padding:.7rem .9rem;font:inherit;color:#1a1a1a;background:#fff;transition:border-color .15s ease}
.rv-form input:focus,.rv-form textarea:focus{outline:none;border-color:#1a1a1a}
.rv-form textarea{resize:vertical;min-height:6rem}
.rv-submit{border:0;background:var(--yellow);color:#1a1a1a;font-weight:700;border-radius:.85rem;padding:.85rem 1rem;cursor:pointer;transition:background .15s ease}
.rv-submit:hover{background:var(--yellow-soft)}
.rv-list{display:flex;flex-direction:column;gap:1rem}
.rv-item-head{display:flex;align-items:center;gap:.85rem;margin-bottom:.75rem}
.rv-ava{border-radius:50%;flex:0 0 auto}
.rv-item-meta{flex:1;min-width:0}
.rv-name{font-weight:700;color:#1a1a1a;font-size:.98rem}
.rv-date{color:var(--gray-muted);font-size:.82rem;margin-top:.1rem}
.rv-item-stars{font-size:.9rem;margin:0}
.rv-text{color:#333;line-height:1.65;font-size:.95rem}
.rv-text p{margin:0 0 .6rem}
.rv-text p:last-child{margin-bottom:0}
.rv-hidden{display:none}
.rv-more{align-self:flex-start;border:1px solid var(--gray-border);background:#fff;color:#1a1a1a;font-weight:600;border-radius:.85rem;padding:.7rem 1.35rem;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.rv-more:hover{background:var(--gray-light);border-color:#bcbcbc}
.rv-all-link{align-self:center;display:inline-flex;align-items:center;gap:.45rem;margin-top:.35rem;color:#1a1a1a;font-weight:700;text-decoration:none;transition:gap .15s ease,color .15s ease}
.rv-all-link i{font-size:.85rem;transition:transform .15s ease}
.rv-all-link:hover{color:#000}
.rv-all-link:hover i{transform:translateX(3px)}
.ktg-dark .rv-all-link{color:#f2f2f2}
.rv-empty{display:flex;flex-direction:column;align-items:center;gap:.6rem;color:var(--gray-muted);background:#fff;border-radius:1.25rem;padding:2.5rem 2rem;text-align:center}
.rv-empty i{font-size:2rem;color:var(--gray-border)}
.rv-empty p{margin:0}
/* §Товар #19: без отзывов — блок компактный и по центру, не «висит» в пустой колонке. */
.rv-grid.rv-grid-empty{grid-template-columns:1fr 1fr;justify-content:space-between;text-align:center}
.rv-grid.rv-grid-empty .rv-summary{margin-bottom:.25rem}
/* §Товар [18]: в пустом состоянии всё содержимое по центру (не «съезжает»). */
.rv-grid.rv-grid-empty .rv-side{align-items:stretch}
.rv-grid.rv-grid-empty .rv-form,.rv-grid.rv-grid-empty .rv-form-locked{text-align:center;align-items:center}
.rv-grid.rv-grid-empty .rv-form-h{text-align:center}
.rv-grid.rv-grid-empty .rv-form .ktg-sec-link,.rv-grid.rv-grid-empty .rv-form-locked .ktg-sec-link,.rv-grid.rv-grid-empty .rv-form a{margin-left:auto;margin-right:auto}
/* §Товар #19: «Нет отзывов» на карточке — ровно и неброско. */
.pc-rating-none{color:#9a9a9a}
.pc-rating-none .star{color:#c9c9c9}
.ktg-dark .rv-empty{background:#232323}
.ktg-dark .rv-avg,.ktg-dark .rv-name,.ktg-dark .rv-form-h{color:#f2f2f2}
.ktg-dark .rv-text{color:#cfcfcf}
.ktg-dark .rv-form input,.ktg-dark .rv-form textarea{background:#262626;border-color:#3a3a3a;color:#f2f2f2}
.ktg-dark .rv-more{background:#232323;border-color:#333;color:#e8e8e8}

/* §Товар [14]: заметный отступ перед блоком «Похожие товары». */
.sp-related{margin-top:2.75rem}
.sp-related .products-col h2{text-align:left;margin-bottom:1.25rem}

/* тёмная тема — страница товара */
/* Ловим по общему классу .sp-card, а не перечислением: раньше блоки, добавленные
   позже (Комплектация, Где использовать, До/После, карточки отзывов), оставались
   белыми в тёмной теме — светлый текст на белом был нечитаем. */
.ktg-dark .sp-buy,.ktg-dark .sp-extra,.ktg-dark .sp-gallery-main,.ktg-dark .sp-block,
.ktg-dark .sp-card,.ktg-dark .sp-warranty,.ktg-dark .sp-specs{background:#1c1c1c;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.ktg-dark .sp-pack-row{color:#a8a8a8}
.ktg-dark .sp-title,.ktg-dark .sp-price,.ktg-dark .sp-block-h,.ktg-dark .sp-spec-v,.ktg-dark .sp-pack-h,.ktg-dark .sp-pack-row b,.ktg-dark .sp-wcard-t,.ktg-dark .crumbs .cur,.ktg-dark .sp-crumbs .cur{color:#f2f2f2}
.ktg-dark .sp-subtitle,.ktg-dark .sp-desc-body,.ktg-dark .sp-spec-k,.ktg-dark .sp-delivery-city,.ktg-dark .sp-delivery-sub,.ktg-dark .sp-doc,
/* содержимое блоков «Где использовать» и «Комплектация» — редакторский текст */
.ktg-dark .sp-usage-text,.ktg-dark .sp-kit-body{color:#cfcfcf}
.ktg-dark .sp-result-label{color:#f2f2f2}
.ktg-dark .sp-thumb,.ktg-dark .sp-wcard{background:#262626;border-color:#333}
.ktg-dark .sp-delivery>i{color:#e8e8e8}
.ktg-dark .sp-spec-row,.ktg-dark .sp-pack{border-color:#333}
.ktg-dark .sp-btn-credit{background:#F14635}

/* адаптив — страница товара */
@media (max-width:900px){
  /* §Товар: последовательность на мобильной — иконки+артикул/название/категория,
     затем ФОТО, затем цена→рассрочка→наличие→кнопки, затем остальные карточки.
     display:contents «растворяет» обёртки, чтобы фото встало в середину блока. */
  .sp-top{display:flex;flex-direction:column;gap:0}
  .sp-mid{grid-template-columns:1fr;gap:1rem}
  .sp-warranty,.sp-specs,.sp-card{width:auto}
  .sp-buy-col{display:contents}
  .sp-buy{display:contents}
  .sp-buy-head{order:1;margin-bottom:0}
  .sp-gallery{order:2;padding:0}
  .sp-buy-main{order:3}
  .sp-buy-col > .sp-extra{order:4}
  /* §Товар #21: «слитная лента» — название → фото → цена/рассрочка как одна карточка. */
  .sp-buy-head{background:#fff;border-radius:1.25rem 1.25rem 0 0;padding:1.25rem 1.25rem 1rem;box-shadow:0 6px 24px rgba(0,0,0,.05);text-align:center}
  .sp-gallery{width:100%;order:2;background:#fff;border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;box-shadow:0 6px 24px rgba(0,0,0,.05);gap:.5rem;padding:.9rem 0 .7rem}
  .sp-gallery-main{min-height:15rem;height:300px;background:none;border-radius:0;box-shadow:none;padding:.25rem 1.25rem}
  .sp-gallery-main img{height:100%!important}
  .sp-thumbs{padding:0 1.25rem}
  .sp-buy-main{background:#fff;border-radius:0 0 1.25rem 1.25rem;padding:1rem 1.25rem 1.25rem;box-shadow:0 6px 24px rgba(0,0,0,.05);text-align:center}
  .ktg-dark .sp-buy-head,.ktg-dark .sp-buy-main,.ktg-dark .sp-gallery{background:#1c1c1c;box-shadow:0 6px 24px rgba(0,0,0,.35)}
  .ktg-dark .sp-gallery{border-color:#333}
  /* extra-блоки (доставка/документы/габариты) — отдельными карточками с отступом от ленты. */
  .sp-buy-col > .sp-extra{width:100%;margin-top:1rem;background:#fff;border-radius:1.25rem;padding:1.1rem 1.25rem;box-shadow:0 6px 24px rgba(0,0,0,.06)}
  .ktg-dark .sp-buy-col > .sp-extra{background:#1c1c1c;box-shadow:0 6px 24px rgba(0,0,0,.4)}
  .sp-block,.sp-warranty,.sp-specs{padding:1.4rem}
  .sp-warranty{padding:1rem}
  .sp-warranty-cards{gap:0.3rem}
  .sp-wcard i{font-size:3rem}
  .sp-wcard-t{font-size:0.85rem;margin-bottom:0.2rem}
  .sp-thumbs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .sp-thumbs::-webkit-scrollbar{display:none}
  .sp-thumb{flex:0 0 calc((100% - 1.4rem) / 3);max-width:none;padding:.3rem;border-radius:.6rem}
  .sp-title{font-size:1.3rem}
  .sp-price{font-size:1.7rem}
  .sp-media{flex-direction:column}
  /* §Товар 5: на узком экране колонки гибкие — длинные названия переносятся,
     иначе таблица вылезает за карточку */
  .sp-specs-table{grid-template-columns:minmax(0,1fr) fit-content(9rem);column-gap:.75rem}
  .sp-mob-h{display:flex}
  .sp-kit-body ul{grid-template-columns:1fr}
  .rv-grid,.rv-grid.rv-grid-empty{grid-template-columns:1fr}
}
@media (max-width:480px){
  .sp-buttons{grid-template-columns:1fr}
  /* §Товар (моб.): «12 месяцев» и «Обслуживание» — 2 в одну строку */
  .sp-warranty-cards{grid-template-columns:1fr 1fr}
}

/* §Товар [6]: «Похожие товары» — фиксированная ширина карточки (одинаковая во ВСЕХ
   разрешениях), лента листается. Раньше было «ровно 6 в ряд» → на широких экранах
   карточки широкие, на узких узкие. */
@media (min-width:901px){
  .sp-related .products-grid .product-card{flex:0 0 clamp(11.5rem, 14vw, 14rem)}
}

/* Добавление в корзину: скрываем ссылку «Просмотр корзины», кнопка = галочка */
a.added_to_cart{display:none !important}
.sp-btn-cart.ktg-added{background:#22a34a;color:#fff}

/* ============== FAQ (главная) ============== */
.faq-section{padding:1rem 0 3.5rem}
.faq-inner{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad)}
.faq-title{font-size:2rem;font-weight:700;color:#1a1a1a;text-align:center;margin:0 0 2rem;letter-spacing:0}
.faq-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem;align-items:start}
.faq-col{display:flex;flex-direction:column;gap:.85rem}
.faq-item{background:#fff;border:1px solid var(--gray-border);border-radius:1rem;box-shadow:0 4px 16px rgba(0,0,0,.04);overflow:hidden;transition:border-color .15s ease}
.faq-item.is-open{border-color:var(--orange)}
.faq-q{width:100%;border:0;background:none;font-family:inherit;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.35rem;cursor:pointer;font-weight:600;font-size:1.0625rem;color:#1a1a1a;transition:color .15s ease}
.faq-q:hover{color:#000}
.faq-ico{flex:0 0 auto;font-size:.85rem;color:var(--gray-muted);transition:transform .25s ease,color .25s ease}
.faq-item.is-open .faq-ico{transform:rotate(180deg);color:#1a1a1a}
/* Плавная высота через grid: браузер анимирует трек 0fr→1fr нативно,
   без JS-замеров высоты — не рвётся при быстрых кликах. */
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.faq-item.is-open .faq-a{grid-template-rows:1fr}
/* .faq-a-in — только клиппер (overflow+min-height:0). Padding здесь мешает
   треку 0fr схлопнуться в ноль, поэтому отступы вынесены в .faq-a-txt. */
.faq-a-in{overflow:hidden;min-height:0}
.faq-a-txt{padding:0 1.35rem 1.2rem;color:#555;font-size:.95rem;line-height:1.6}
.ktg-dark .faq-title{color:#f2f2f2}
.ktg-dark .faq-item{background:#232323;border-color:#333;box-shadow:0 4px 16px rgba(0,0,0,.4)}
.ktg-dark .faq-item.is-open{border-color:var(--yellow)}
.ktg-dark .faq-q{color:#f2f2f2}
.ktg-dark .faq-a-txt{color:#bdbdbd}
.ktg-dark .faq-ico{color:#9a9a9a}
.ktg-dark .faq-item.is-open .faq-ico{color:#f2f2f2}
@media(max-width:760px){.faq-cols{grid-template-columns:1fr;gap:.85rem}.faq-col{display:contents}.faq-title{font-size:1.5rem;margin-bottom:1.5rem}}

/* ==========================================================================
   Корзина и оформление заказа (WooCommerce Blocks) — под дизайн темы
   ========================================================================== */
.wc-block-cart,
.wc-block-checkout{
	font-size:1rem;
	color:var(--black);
	accent-color:var(--black);
	--wc-blocks-color-primary:var(--black);
}
.entry-title,
.wc-block-cart + *,
.page-title{color:var(--black)}

/* Заголовки секций/шагов */
.wc-block-components-title,
.wc-block-components-checkout-step__title,
.wc-block-cart__totals-title,
.wc-block-components-order-summary .wc-block-components-title{
	color:var(--black);
	font-weight:700;
	letter-spacing:0;
}

/* Сайдбар (Сумма корзины / Детали заказа) — карточка темы */
.wc-block-components-sidebar{
	background:#fff;
	border:1px solid var(--gray-border);
	border-radius:1.25rem;
	padding:1.5rem 1.4rem;
	box-shadow:0 6px 24px rgba(0,0,0,.06);
}
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-sidebar .wc-block-components-totals-item{background:transparent}

/* Основные кнопки → жёлтая CTA темы, чёрный текст */
.wc-block-components-button.contained,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button{
	background:var(--yellow) !important;
	color:var(--black) !important;
	border:0 !important;
	border-radius:.85rem !important;
	font-weight:700 !important;
	text-transform:none;
	box-shadow:none !important;
	transition:background .15s ease,transform .05s ease;
}
.wc-block-components-button.contained:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover{
	background:var(--yellow-soft) !important;
}
.wc-block-components-button.contained:active{transform:translateY(1px)}
.wc-block-components-button.contained .wc-block-components-button__text,
.wc-block-components-checkout-place-order-button .wc-block-components-button__text{color:var(--black)}
/* Второстепенные кнопки (Применить купон и т.п.) — контурные */
.wc-block-components-button.outlined{
	border-radius:.85rem !important;
	border-color:var(--black) !important;
	color:var(--black) !important;
}

/* Поля ввода — скругление и чёрный фокус вместо синего */
/* «Страна/регион» — единственное поле без отступа WooCommerce, из-за чего
   слипается с «Фамилией». Выравниваем шаг с остальными полями. */
.wc-block-components-address-form .wc-block-components-address-form__country{margin-top:12px !important}
.wc-block-components-text-input input,
.wc-block-components-text-input .components-text-control__input,
.wc-block-components-select .components-form-token-field__input,
.wc-block-components-address-form input,
.wc-block-checkout input[type="text"],
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"]{
	border-radius:.75rem !important;
}
.wc-block-components-text-input.is-active input,
.wc-block-components-text-input input:focus,
.wc-block-components-address-form input:focus{
	border-color:var(--black) !important;
	box-shadow:0 0 0 1px var(--black) !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-checkout-step--with-step-number .wc-block-components-text-input.is-active label{color:var(--gray-text-dark) !important}

/* Ссылки/аккордеон купона — нейтральные цвета темы */
.wc-block-cart a,
.wc-block-checkout a,
.wc-block-components-panel__button{color:var(--black)}
.wc-block-cart a:hover,
.wc-block-checkout a:hover{color:var(--dark)}

/* Селектор количества — стиль товара */
.wc-block-components-quantity-selector{
	border:1px solid var(--gray-border) !important;
	border-radius:.6rem !important;
	overflow:hidden;
}
.wc-block-components-quantity-selector__button:hover{color:var(--black);background:var(--gray-light)}

/* Описание товара в строках корзины/деталях заказа не выводим */
.wc-block-components-product-metadata__description{display:none}

/* Итоговые строки */
.wc-block-components-totals-item__value{color:var(--black)}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item{font-weight:800;color:var(--black)}

/* Активные шаги/чекбоксы/радио — акцент темы */
.wc-block-components-checkbox__input:checked,
.wc-block-components-radio-control__input:checked{accent-color:var(--black)}
.wc-block-components-checkbox__mark{fill:var(--black)}

/* Тёмная тема */
.ktg-dark .wc-block-components-sidebar{
	background:#1c1c1c;
	border-color:#333;
	box-shadow:0 6px 24px rgba(0,0,0,.4);
}
.ktg-dark .wc-block-cart,
.ktg-dark .wc-block-checkout,
.ktg-dark .wc-block-components-title,
.ktg-dark .wc-block-components-totals-item__value,
.ktg-dark .wc-block-cart a,
.ktg-dark .wc-block-checkout a{color:#f2f2f2}
/* WooCommerce задаёт полям белый фон более специфичным селектором, поэтому
   тёмное правило темы не срабатывало: поля оставались белыми посреди тёмной
   страницы. Поднимаем специфичность. */
.ktg-dark .wc-block-checkout .wc-block-components-text-input input,
.ktg-dark .wc-block-components-text-input input,
.ktg-dark .wc-block-checkout input{background:#262626 !important;border-color:#3a3a3a !important;color:#f2f2f2 !important}
.ktg-dark .wc-block-checkout input::placeholder{color:#8f8f8f}
/* Выпадающий список «Страна/регион»: контейнер оставался белым, а подпись
   получала светлый цвет — надпись пропадала. */
.ktg-dark .wc-blocks-components-select__container{background:#262626;border-color:#3a3a3a}
.ktg-dark .wc-blocks-components-select__select{background:transparent;color:#f2f2f2}
.ktg-dark .wc-blocks-components-select__label{color:#cfcfcf}
/* «Добавить купоны» — тёмный текст на тёмном фоне */
.ktg-dark .wc-block-components-panel__button{color:#e8e8e8}

/* ==========================================================================
   ЛИЧНЫЙ КАБИНЕТ (WooCommerce My Account)
   Родной раздел WooCommerce, приведённый к оформлению темы: колонка навигации
   слева, содержимое справа; на мобильной навигация становится строкой сверху.
   ========================================================================== */
.woocommerce-account .woocommerce{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad) 3rem}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}

@media(min-width:901px){
  .woocommerce-account.logged-in .woocommerce-MyAccount-navigation{float:none;width:auto}
  .woocommerce-account.logged-in .woocommerce-MyAccount-content{float:none;width:auto}
  .woocommerce-account.logged-in .woocommerce::after{content:none}
  /* Разметку кабинета теперь целиком держит .ktg-lk (шапка + меню + контент).
     Обёртка .woocommerce — просто блок на всю ширину контейнера, без своего грида. */
  .woocommerce-account.logged-in .woocommerce{display:block}
}
/* страница входа/регистрации — колонка по центру */
.woocommerce-account:not(.logged-in) .woocommerce{max-width:60rem}

/* навигация */
.woocommerce-MyAccount-navigation li a{
  display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;
  color:#1a1a1a;text-decoration:none;font-weight:600;font-size:.95rem;
  border-radius:.75rem;transition:background .14s ease,color .14s ease;
}
.woocommerce-MyAccount-navigation li a:hover{background:#f2f2f2}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--yellow);color:#111}
.ktg-dark .woocommerce-MyAccount-navigation li a{color:#dcdcdc}
.ktg-dark .woocommerce-MyAccount-navigation li a:hover{background:#2a2a2a}
.ktg-dark .woocommerce-MyAccount-navigation li.is-active a{background:var(--yellow);color:#111}

@media(max-width:900px){
  .woocommerce-account .woocommerce-MyAccount-navigation ul{
    display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.5rem;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar{display:none}
  .woocommerce-MyAccount-navigation li a{white-space:nowrap;padding:.6rem .9rem;font-size:.9rem;background:#f4f4f4}
  .ktg-dark .woocommerce-MyAccount-navigation li a{background:#232323}
}

/* контент */
.woocommerce-MyAccount-content{
  background:#fff;border-radius:1.25rem;padding:1.75rem;
  box-shadow:0 6px 24px rgba(0,0,0,.06);
}
.ktg-dark .woocommerce-MyAccount-content{background:#1c1c1c;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.woocommerce-MyAccount-content p{color:var(--gray-text-dark)}
.ktg-dark .woocommerce-MyAccount-content p{color:#cfcfcf}

.ktg-acc-hello{margin-bottom:1.25rem}
.ktg-acc-hello-t{font-size:1.35rem;font-weight:800;color:#1a1a1a;margin:0 0 .2rem}
.ktg-acc-hello-s{color:var(--gray-text);font-size:.92rem;margin:0}
.ktg-dark .ktg-acc-hello-t{color:#f2f2f2}

/* формы входа и регистрации */
/* flex, а не grid: с плавающими потомками WooCommerce авторазмещение сетки
   ставило колонки в разные ячейки и они менялись местами. */
.woocommerce-account .u-columns{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:flex-start}
/* WooCommerce задаёт колонкам float и ширину 48% более специфичным селектором —
   без сброса они считали 48% уже от ячейки сетки и сжимались вдвое. */
.woocommerce-account .woocommerce .col2-set .col-1,
.woocommerce-account .woocommerce .col2-set .col-2{flex:1 1 22rem;width:auto;float:none;max-width:none}
.woocommerce form.login,.woocommerce form.register{
  background:#fff;border:0;border-radius:1.25rem;padding:1.75rem;
  box-shadow:0 6px 24px rgba(0,0,0,.06);margin:0;
}
.ktg-dark .woocommerce form.login,.ktg-dark .woocommerce form.register{background:#1c1c1c;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.woocommerce form .form-row label{font-weight:600;font-size:.9rem;color:#1a1a1a;margin-bottom:.3rem}
.ktg-dark .woocommerce form .form-row label{color:#e8e8e8}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row input[type="password"]{
  width:100%;padding:.75rem .9rem;border:1px solid var(--gray-border);
  border-radius:.6rem;font-family:inherit;font-size:.95rem;background:#fff;color:#1a1a1a;
}
.ktg-dark .woocommerce form .form-row input.input-text,
.ktg-dark .woocommerce form .form-row input[type="password"]{background:#262626;border-color:#3a3a3a;color:#f2f2f2}

/* кнопки */
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button{
  background:var(--yellow);color:#111;border:0;border-radius:.65rem;
  padding:.75rem 1.4rem;font-weight:700;font-family:inherit;font-size:.95rem;
  cursor:pointer;transition:filter .15s ease;
}
.woocommerce .button:hover,.woocommerce button.button:hover,
.woocommerce input.button:hover,.woocommerce a.button:hover{filter:brightness(.94);color:#111}

/* таблица заказов */
.woocommerce table.shop_table{border:0;border-radius:.9rem;overflow:hidden;width:100%}
.woocommerce table.shop_table th{background:#f6f6f6;font-size:.85rem;color:var(--gray-text-dark);padding:.8rem}
.woocommerce table.shop_table td{padding:.8rem;border-top:1px solid var(--line,#efefef)}
.ktg-dark .woocommerce table.shop_table th{background:#242424;color:#b0b0b0}
.ktg-dark .woocommerce table.shop_table td{border-top-color:#333}

/* Пустой счётчик не рисуем: на сервере значение известно не всегда (у гостя
   списки лежат в браузере), поэтому плашка приходит пустой, а скрипт её
   заполняет. Без этого правила мелькал бы пустой кружок. */
.badge:empty,.cm-badge:empty{display:none}

/* Пустую строку характеристик не рисуем: у неё есть верхняя граница, и без
   текста осталась бы висящая линия. */
/* #47: даже без характеристик строка резервируется — высота карточек и
   расположение блоков (цена/наличие) не «прыгают» между карточками. */
.pc-specs:empty{display:block}
/* (убрано .pc-specs{min-height:1.05em} — перебивало фикс-высоту и «съезжала» цена) */

/* ==========================================================================
   ОТЗЫВЫ: раздел «Мои отзывы» в кабинете + заблокированная форма на товаре
   ========================================================================== */
.ktg-rv-list{display:flex;flex-direction:column;gap:1rem}
.ktg-rv{border:1px solid #d9d9d9;border-radius:.9rem;padding:1.1rem 1.25rem;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
.ktg-rv:hover{border-color:#c4c4c4;box-shadow:0 4px 14px rgba(0,0,0,.05)}
.ktg-rv-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
/* §Мой Керхер: фото товара квадратом рядом с названием в «Мои отзывы». */
.ktg-rv-prod{display:inline-flex;align-items:center;gap:.7rem;font-weight:700;color:#1a1a1a;text-decoration:none;min-width:0}
.ktg-rv-prod:hover .ktg-rv-prod-name{text-decoration:underline}
.ktg-rv-thumb{width:48px;height:48px;flex:0 0 48px;border-radius:.5rem;overflow:hidden;background:#f4f4f4;display:flex;align-items:center;justify-content:center;color:var(--gray-muted)}
.ktg-rv-thumb img{width:100%;height:100%;object-fit:cover}
.ktg-rv-thumb i{font-size:1.2rem}
.ktg-dark .ktg-rv-thumb{background:#2a2a2a}
.ktg-rv-date{font-size:.85rem;color:var(--gray-text)}
.ktg-rv-stars{margin:.35rem 0;color:var(--star);font-size:.9rem}
.ktg-rv-text{color:var(--gray-text-dark);font-size:.95rem}
.ktg-rv-text p{margin:0 0 .4rem}
.ktg-rv-pending{font-size:.85rem;color:#9a6510;margin:.3rem 0 0}
/* #7: подвал отзыва — действия слева, метка «изменён» справа-снизу. */
.ktg-rv-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-top:.8rem}
.ktg-rv-act{display:flex;gap:.5rem;font-size:.85rem}
.ktg-rv-act a{display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;font-weight:600;
  padding:.42rem .85rem;border-radius:.55rem;border:1px solid #d9d9d9;transition:background .15s ease,border-color .15s ease}
.ktg-rv-edit{color:#1a1a1a}
.ktg-rv-edit:hover{background:#f6f6f6;border-color:#9a9a9a}
.ktg-rv-del{color:#c20000;border-color:#eec3c3}
.ktg-rv-del:hover{background:#fdecec;border-color:#e0a3a3}
.ktg-rv-edited{font-size:.75rem;color:#a4a2a2;font-style:italic;white-space:nowrap;flex-shrink:0}
.ktg-rv-empty{margin-bottom:1rem}
.ktg-dark .ktg-rv{background:#232323}
.ktg-dark .ktg-rv-act a{background:#2a2a2a;border-color:#3a3a3a}
.ktg-dark .ktg-rv-edit{color:#e8e8e8}
.ktg-dark .ktg-rv{border-color:#333}
.ktg-dark .ktg-rv-prod{color:#f2f2f2}
.ktg-dark .ktg-rv-text{color:#cfcfcf}
.ktg-dark .ktg-rv-pending{color:#e0ab55}

/* форма отзыва, недоступная гостю или уже оставившему отзыв */
.rv-form-locked{display:flex;flex-direction:column;gap:.7rem;align-items:flex-start}
.rv-locked-t{margin:0;color:var(--gray-text-dark);font-size:.92rem;line-height:1.5}
.ktg-dark .rv-locked-t{color:#cfcfcf}
.rv-form-locked .rv-submit{display:inline-block;text-decoration:none;text-align:center}

/* лайк на отзыв */
.rv-item-foot{margin-top:.8rem;display:flex;justify-content:flex-end}
.rv-like{display:inline-flex;align-items:center;gap:.4rem;background:none;border:1px solid var(--gray-border);
  border-radius:2rem;padding:.35rem .8rem;cursor:pointer;font:inherit;font-size:.85rem;
  color:var(--gray-text-dark);transition:border-color .15s ease,color .15s ease,background .15s ease}
.rv-like:hover:not(:disabled){border-color:#1a1a1a;color:#1a1a1a}
.rv-like.is-liked{background:var(--yellow);border-color:var(--yellow);color:#111}
.rv-like:disabled{opacity:.45;cursor:default}
.rv-like-n{font-weight:700;font-variant-numeric:tabular-nums}
.ktg-dark .rv-like{border-color:#3a3a3a;color:#b0b0b0}
.ktg-dark .rv-like:hover:not(:disabled){border-color:#e8e8e8;color:#e8e8e8}
.ktg-dark .rv-like.is-liked{background:var(--yellow);border-color:var(--yellow);color:#111}

/* ==========================================================================
   МОИ СПИСКИ ИЗБРАННОГО (§Избранное 3)
   ========================================================================== */
.fav-lists{margin:0 0 1.25rem}
.fav-lists[hidden]{display:none}
.fav-lists-bar{display:flex;gap:.6rem;align-items:center}
.fav-lists-toggle,.fav-lists-save{
  display:inline-flex;align-items:center;gap:.5rem;font:inherit;font-size:.9rem;font-weight:600;
  padding:.55rem .95rem;border-radius:.7rem;border:1px solid var(--gray-border);
  background:#fff;color:#1a1a1a;cursor:pointer;transition:border-color .15s ease,background .15s ease;
}
.fav-lists-toggle:hover,.fav-lists-save:hover{border-color:#1a1a1a}
.fav-lists-save{background:var(--yellow);border-color:var(--yellow)}
.fav-lists-save:hover{filter:brightness(.94)}
.fav-lists-n{font-variant-numeric:tabular-nums;color:var(--gray-text)}
.fav-lists-arr{font-size:.7rem;transition:transform .2s ease}
.fav-lists.is-open .fav-lists-arr{transform:rotate(180deg)}
.fav-lists-body{margin-top:.75rem}
.fav-lists-empty{color:var(--gray-text);font-size:.92rem;margin:0}
.fav-lists-items{display:flex;flex-direction:column;gap:.5rem}
.fav-list-row{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.7rem .95rem;border:1px solid var(--gray-border);border-radius:.7rem;background:#fff;
}
.fav-list-open{display:flex;flex-direction:column;gap:.1rem;text-decoration:none;color:#1a1a1a;min-width:0}
.fav-list-open b{font-size:.95rem}
.fav-list-open span{font-size:.82rem;color:var(--gray-text)}
.fav-list-open:hover b{text-decoration:underline}
.fav-list-act{display:flex;gap:.35rem;flex:0 0 auto}
.fav-list-act button{
  background:none;border:0;cursor:pointer;color:var(--gray-text);
  padding:.35rem .45rem;border-radius:.45rem;font-size:.9rem;transition:color .15s ease,background .15s ease;
}
.fav-list-act button:hover{background:#f2f2f2;color:#1a1a1a}
.fav-list-act .fl-del:hover{color:var(--red)}
.ktg-dark .fav-lists-toggle{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .fav-list-row{background:#232323;border-color:#3a3a3a}
.ktg-dark .fav-list-open{color:#f2f2f2}
.ktg-dark .fav-list-act button:hover{background:#2f2f2f;color:#f2f2f2}

/* ==== УДАЛЕНИЕ АККАУНТА (§Аккаунт 11) ==== */
.ktg-danger{margin-top:32px;padding:20px;border:1px solid #E5484D;border-radius:12px;background:rgba(229,72,77,.05)}
.ktg-danger h3{margin:0 0 8px;font-size:1.15rem;color:#E5484D}
.ktg-danger p{margin:0 0 14px;font-size:.95rem;line-height:1.5;color:var(--muted)}
.ktg-danger-form label{display:block;margin-bottom:6px;font-size:.9rem}
.ktg-danger-form input{width:100%;max-width:260px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--text)}
.ktg-danger-btn{margin-top:12px;padding:10px 18px;border:0;border-radius:8px;background:#E5484D;color:#fff;font-weight:600;cursor:pointer;transition:background .15s}
.ktg-danger-btn:hover{background:#C93A3F}
.ktg-flash{padding:12px 16px;background:var(--orange);color:#111;font-weight:600;text-align:center}
.ktg-dark .ktg-danger{background:rgba(229,72,77,.12)}

/* ==== ПОРЯДОК ИЗБРАННОГО ПЕРЕТАСКИВАНИЕМ ==== */
.fav-drag{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:grab;touch-action:none;transition:background .15s,color .15s}
.fav-drag:hover{background:var(--line);color:var(--text)}
.fav-drag:active{cursor:grabbing}
/* §1: перетаскиваемая карточка «приподнята» (тень + лёгкий масштаб) — видно,
   что двигается; соседние плавно расступаются (FLIP в JS). */
.fav-card.is-dragging{transform:scale(1.03);box-shadow:0 .9rem 2rem rgba(0,0,0,.18);z-index:5;position:relative;cursor:grabbing}
.fav-list.is-sorting{user-select:none}
.fav-list.is-sorting .fav-card:not(.is-dragging){transition:transform .2s ease}
/* §Избранное #4: перетаскивание (Trello-стиль). За курсором летит КЛОН
   (.ktg-drag-clone), оригинал (.is-dragging) остаётся в сетке как невидимое
   «место» той же ширины — раскладка не прыгает, соседи двигаются FLIP-ом. */
.product-card.is-dragging,.fav-card.is-dragging{opacity:0!important;transition:none!important}
.ktg-drag-clone{margin:0!important;box-shadow:0 1rem 2.4rem rgba(0,0,0,.26);border-radius:14px;transform:scale(1.02);cursor:grabbing;will-change:left,top;transition:none!important;opacity:.98}
.is-sorting{user-select:none}
.is-sorting .product-card:not(.is-dragging),.is-sorting .fav-card:not(.is-dragging){transition:transform .18s ease}
.fav-drag{cursor:grab;touch-action:none}

/* ==== ЧУЖОЙ СПИСОК / СРАВНЕНИЕ ==== */
.shared-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px;padding:12px 16px;border:1px solid var(--line);border-left:3px solid var(--orange);border-radius:10px;background:var(--card)}
.shared-bar-t{font-size:.95rem;color:var(--muted)}
.shared-bar-t i{margin-right:6px;color:var(--orange)}
.shared-bar-act{display:flex;flex-wrap:wrap;gap:8px}
.shared-bar-act button{padding:8px 14px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text);font-size:.9rem;cursor:pointer;transition:background .15s,border-color .15s}
.shared-bar-act button:hover{border-color:var(--orange);background:rgba(253,205,0,.12)}
.shared-bar-act .shared-take{border-color:var(--orange);background:var(--orange);color:#111;font-weight:600}
.shared-bar-act .shared-take:hover{filter:brightness(.94);background:var(--orange)}
@media(max-width:640px){.shared-bar{flex-direction:column;align-items:flex-start}.shared-bar-act{width:100%}.shared-bar-act button{flex:1}}

/* ==== НЕЗАПОЛНЕННЫЕ ССЫЛКИ (настройки темы пока пусты) ====
   Пункт остаётся на месте, но не притворяется кликабельным. Гасим цветом, а
   не прозрачностью: opacity поверх тёмного фона утягивает текст в фон и
   пункт становится нечитаемым. */
.link-soon{color:#9a9a9a;cursor:default;pointer-events:none;text-decoration:none}
.ktg-dark .link-soon{color:#7a7a7a}
.footer-nav-col ul li .link-soon{display:block}
.sp-doc.link-soon{color:#9a9a9a}
.ktg-dark .sp-doc.link-soon{color:#7a7a7a}
/* Кнопки поверх фото — там приглушаем целиком, цвет менять нечему. */
.sp-btn-credit.link-soon,.hero-cta.link-soon{opacity:.5;color:inherit}
.footer-social:empty,.acc-social:empty,.cm-b-social:empty{display:none}
.cat-icon-card.is-soon:hover .cat-icon-img{box-shadow:none;border-color:inherit}

/* Логотипам проставлены width/height в разметке — они резервируют место до
   загрузки. Ширину считаем от заданной высоты, иначе атрибут растягивает картинку. */
.mdrawer-logo,.logo-img,.mtopbar-logo img,.logo-link img{width:auto;max-width:100%}

/* ==== ПАНЕЛЬ ДОБАВЛЕНИЯ ТОВАРОВ В СРАВНЕНИЕ (doc1 №69–72) ==== */
.cmp-add-panel{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.cmp-add-h{font-size:1.15rem;font-weight:700;margin:0 0 1rem}
.cmp-cat-picker{margin-bottom:1.25rem}
.cmp-cat-lbl{display:block;margin-bottom:.55rem;font-size:.9rem;font-weight:600}
/* §Сравнить 2 (#2): каскад тип → категория → подкатегория — кастомные
   выпадашки (fancy-select), как в каталоге. */
.cmp-casc{display:flex;flex-wrap:wrap;gap:.6rem;align-items:stretch}
.cmp-casc .fancy-select{flex:1 1 12rem;min-width:10rem;max-width:19rem;border:1px solid #ededed;border-radius:20px;padding:8px 16px;background:#fff;box-shadow:0 .5rem 1.4rem rgba(0,0,0,.10)}
.cmp-casc .fancy-select.is-disabled{opacity:.5;pointer-events:none;box-shadow:none;background:#f6f6f6}
.ktg-dark .cmp-casc .fancy-select{border-color:#3a3a3a;background:#232323;box-shadow:0 .5rem 1.4rem rgba(0,0,0,.35)}
.ktg-dark .cmp-casc .fancy-select.is-disabled{background:#222}
@media(max-width:600px){.cmp-casc .fancy-select{flex:1 1 100%;max-width:none}}
.cmp-cat-select{padding:.6rem .8rem;border:1px solid var(--line);border-radius:.6rem;background:var(--card);color:var(--text);font:inherit;cursor:pointer}
/* Капсула фэнси-селекта категории (только на странице сравнения). */
.cmp-cat-picker .fancy-select{border:1px solid #ededed;border-radius:20px;padding:5px 14px;background:#fff;box-shadow:0 .5rem 1.4rem rgba(0,0,0,.12)}
.ktg-dark .cmp-cat-picker .fancy-select{border-color:#3a3a3a;background:#232323;box-shadow:0 .5rem 1.4rem rgba(0,0,0,.35)}
.cmp-add-hint{color:var(--muted);font-size:.9rem;margin:.5rem 0}
/* §Сравнить 2 (#11): фильтр в блоке добавления. */
.cmp-add-filter{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:1.1rem}
.cmp-add-filter[hidden]{display:none}
.cmp-f-search-wrap{position:relative;flex:1 1 14rem;min-width:12rem}
.cmp-f-search-wrap>i{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--gray-muted);font-size:.85rem}
.cmp-f-search{width:100%;box-sizing:border-box;border:1px solid var(--gray-border);border-radius:2rem;padding:.6rem .8rem .6rem 2.2rem;font-size:.9rem;background:#fff;color:#1a1a1a}
.cmp-f-price{display:flex;align-items:center;gap:.35rem}
.cmp-f-min,.cmp-f-max{width:6.2rem;box-sizing:border-box;border:1px solid var(--gray-border);border-radius:2rem;padding:.6rem .7rem;font-size:.9rem;background:#fff;color:#1a1a1a}
.cmp-f-dash{color:var(--gray-muted)}
.cmp-f-sort{border:1px solid var(--gray-border);border-radius:2rem;padding:.6rem .8rem;font-size:.9rem;background:#fff;color:#1a1a1a;cursor:pointer}
.cmp-f-check{display:inline-flex;align-items:center;gap:.35rem;font-size:.88rem;color:#333;cursor:pointer;white-space:nowrap}
.cmp-f-check input{accent-color:var(--yellow);width:1rem;height:1rem;cursor:pointer}
.cmp-f-reset{border:1px solid var(--gray-border);background:#fff;border-radius:2rem;padding:.6rem .9rem;font-size:.88rem;color:#555;cursor:pointer}
.cmp-f-reset:hover{border-color:#1a1a1a;color:#1a1a1a}
.cmp-f-search:focus,.cmp-f-min:focus,.cmp-f-max:focus,.cmp-f-sort:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,222,0,.22)}
.ktg-dark .cmp-f-search,.ktg-dark .cmp-f-min,.ktg-dark .cmp-f-max,.ktg-dark .cmp-f-sort,.ktg-dark .cmp-f-reset{background:#2a2a2a;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .cmp-f-check{color:#cfcfcf}
@media(max-width:600px){.cmp-f-search-wrap{flex:1 1 100%}.cmp-f-sort{flex:1 1 100%}}
.cmp-add-grid{display:grid;grid-template-columns:repeat(auto-fill,195px);justify-content:flex-start;gap:1rem}
.cmp-add-grid .product-card{flex:none;width:auto}
.cmp-add-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:.9rem;padding:.7rem;background:var(--card);text-align:center}
.cmp-add-card-img{display:flex;align-items:center;justify-content:center;height:7rem;margin-bottom:.5rem}
.cmp-add-card-img img{max-width:100%;max-height:100%;object-fit:contain}
.cmp-add-card-name{font-size:.82rem;font-weight:600;line-height:1.25;margin-bottom:.35rem;min-height:2.1rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cmp-add-card-name a{color:inherit;text-decoration:none}
.cmp-add-card-price{font-size:.85rem;font-weight:700;margin-bottom:.6rem}
.cmp-add-btn{margin-top:auto;padding:.5rem .7rem;border:1px solid var(--orange);border-radius:.5rem;background:transparent;color:var(--text);font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s}
.cmp-add-btn:hover{background:rgba(253,205,0,.14)}
.cmp-add-btn.active{background:var(--orange);color:#111;border-color:var(--orange)}
.cmp-add-scroll{cursor:pointer;border:0;background:none;font:inherit}
@media(max-width:900px){.cmp-add-grid{grid-template-columns:1fr 1fr}}
.ktg-dark .cmp-add-card{background:#1e1e1e}

/* ==== ПЛАВАЮЩАЯ КОРЗИНА (веб, doc1 №37) ==== */
.ktg-cart-fab{position:fixed;right:6.5rem;bottom:1.6rem;z-index:9998;display:flex;align-items:center;gap:.55rem;
  padding:.7rem 1.15rem .7rem .95rem;background:var(--orange);color:#111;border-radius:2rem;font-weight:700;
  font-size:.9rem;text-decoration:none;box-shadow:0 .4rem 1.2rem rgba(0,0,0,.25);
  transition:transform .15s ease,box-shadow .15s ease}
.ktg-cart-fab i{font-size:1.2rem}
.ktg-cart-fab:hover{transform:translateY(-2px);box-shadow:0 .6rem 1.5rem rgba(0,0,0,.32)}
.ktg-cart-fab-badge{position:absolute;top:-.45rem;left:1.5rem;min-width:1.3rem;height:1.3rem;padding:0 .32rem;
  background:#111;color:#fff;border-radius:1rem;font-size:.72rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.ktg-cart-fab[hidden]{display:none}
@keyframes ktgCartPulse{0%{transform:scale(1)}30%{transform:scale(1.13)}62%{transform:scale(.97)}100%{transform:scale(1)}}
.ktg-cart-fab.is-pulse{animation:ktgCartPulse .5s ease}
.ktg-dark .ktg-cart-fab-badge{background:#000}
/* только веб — на мобилке корзина в нижней навигации */
@media(max-width:900px){.ktg-cart-fab{display:none !important}}

/* ============== §2: МИКРО-ОТКЛИК ПРИ НАЖАТИИ ==============
   Лёгкое «нажатие» (scale) на кнопках/карточках/чипах — тактильная обратная
   связь. Только :active (без перезаписи существующих transition). */
.pc-add:active,.pc-counter span:first-child:active,.pc-counter span:last-child:active,
.nav-btn:active,.mbn-item:active,.fav-view-btn:active,.lk-act:active,
.cat-icon-card:active,.cat-chip:active,.mmx-cat:active,.catnav-item:active,
.fav-install-btn:active,.cart-checkout:active,.cart-order-submit:active,
.form-submit:active,.ct-form-btn:active,.hero-cta:active,.pc-fav:active,
.pc-compare:active,.fav-heart:active,.fav-cmp:active,.cmp-add:active,
.fav-lists-save:active,.ct-fil-soc a:active,.ct-fil-map:active,.addr-svc:active{
  transform:scale(.95);
}
.pc-card:active{transform:scale(.99)}
/* #17: у кнопок шапки свой transform:translateY(.72rem). Общий :active со
   scale() его затирал — кнопка «прыгала вверх». Сохраняем сдвиг при нажатии. */
.mainnav .nav-btn:active{transform:translateY(.72rem) scale(.96)}
@media(prefers-reduced-motion:reduce){
  .fav-list.is-sorting .fav-card:not(.is-dragging){transition:none}
}

/* Ширина карточки в ленте «Популярные/Со скидкой»: телефон (≤600) — 46%,
   планшет/большой телефон (601–900) — 44% (из блока выше). Это правило идёт
   ПОСЛЕ блока max-width:900, поэтому на ≤600 корректно перебивает его. */
@media(max-width:600px){
  .products-grid .product-card{flex:0 0 calc(46% - .2rem)}
}

/* ============== Прелоадер (жёлтый круг + размытие) ============== */
.ktg-preloader{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:opacity .4s ease,visibility .4s ease}
.ktg-preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.ktg-preloader-spin{width:3.5rem;height:3.5rem;border-radius:50%;
  border:4px solid rgba(0,0,0,.12);border-top-color:var(--yellow);animation:ktgspin .8s linear infinite}
@keyframes ktgspin{to{transform:rotate(360deg)}}
.ktg-dark .ktg-preloader{background:rgba(18,18,18,.6)}
.ktg-dark .ktg-preloader-spin{border-color:rgba(255,255,255,.14);border-top-color:var(--yellow)}

/* ============== Блокировка альбомной ориентации на телефоне ============== */
.ktg-rotate-lock{display:none}
@media (orientation:landscape) and (max-height:500px){
  .ktg-rotate-lock{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:1rem;background:#161616;color:#fff;text-align:center;padding:2rem}
  .ktg-rotate-lock i{font-size:3rem;color:var(--yellow);animation:ktgrotate 1.6s ease-in-out infinite}
  .ktg-rotate-lock p{font-size:1.15rem;font-weight:600;max-width:18rem}
  html,body{overflow:hidden !important}
}
@keyframes ktgrotate{0%,100%{transform:rotate(0)}50%{transform:rotate(-90deg)}}

/* ============== ПК: карточка товара 190px везде + компактнее + стрелки наружу ============== */
@media(min-width:901px){
  /* Главная: слайдеры «Со скидкой» / «Популярные» */
  .products-wrap{gap:1rem}                    /* зазор между колонками */
  .products-grid{gap:.4rem;padding:.5rem 0;margin-left:1.25rem;margin-right:1.25rem} /* меньше отступ между карточками + боковые поля под стрелки */
  .products-grid .product-card{flex:0 0 calc((100% - .7rem) / 3);width:auto} /* ровно 3 карточки в окне */
  /* Стрелки вне слайда: внешние — далеко в поля контейнера, внутренние — чуть-чуть
     (в зазоре 2.5rem между колонками, чтобы не наезжали друг на друга). */
  .products-wrap > .products-col:first-child  .product-arrow.left {left:-0.6rem}
  .products-wrap > .products-col:first-child  .product-arrow.right{right:-0.8rem}
  .products-wrap > .products-col:last-child   .product-arrow.left {left:-0.8rem}
  .products-wrap > .products-col:last-child   .product-arrow.right{right:-0.6rem}

  /* Каталог: сетка с фиксированными карточками 195px.
     §Каталог [3]: auto-fit (схлопывает пустые треки) + justify-content:center —
     товары центрируются по ширине блока, а не прижимаются влево на промежуточных
     разрешениях и при малом числе товаров. */
  .cat-products-grid{grid-template-columns:repeat(auto-fit,195px);gap:1rem}
  /* §Каталог [10]: ширина карточек в лентах подкатегорий — см. .cat-subsec .cat-products-grid > * (clamp до 195px). */
  .cat-products-grid .product-card{width:195px;flex:none}
  /* §Избранное #1: единая ширина карточки 195px везде — слайдеры (главная, «Похожие»). */
  .products-grid .product-card{flex:0 0 195px;width:195px}
}

/* ============== КАТАЛОГ: правки батча (страница категории) ============== */
/* §10: в категории баннера нет — даём воздух сверху к фильтрам. */
.section-nohero{padding-top:2rem}
@media(max-width:900px){.section-nohero{padding-top:1rem}}

/* ============== КАТАЛОГ: фильтры — полировка + новые элементы ============== */
/* #11/#15: мягкие эффекты и фокус у селектов/полей */
.fbar-select,.fbar-price,.fbar-search{transition:border-color .15s ease,box-shadow .15s ease}
.fbar-select:focus-within,.fbar-search:focus-within{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(253,205,0,.18)}
.fbar-sort-select{cursor:pointer;appearance:none;-webkit-appearance:none;background:none;padding-right:1.2rem}
.fbar-sort-wrap{position:relative}
.fbar-sort-wrap::after{content:"";position:absolute;right:.7rem;top:50%;width:.5rem;height:.5rem;border-right:2px solid var(--gray-muted);border-bottom:2px solid var(--gray-muted);transform:translateY(-70%) rotate(45deg);pointer-events:none}

/* #13: компактнее — фильтры не растягиваются на всю ширину без нужды */
.fbar-row-cats,.fbar-row-sort,.fbar-row-attrs{display:flex;flex-wrap:wrap}
.fbar-row-cats>*,.fbar-row-attrs>*{flex:1 1 12rem;min-width:0}
.fbar-row-sort>.fbar-sort-wrap{flex:0 1 14rem}
.fbar-row-sort>.fbar-price{flex:1 1 18rem}

/* #20: поиск по каталогу */
.fbar-search{display:flex;align-items:center;gap:.55rem;background:#fff;border:1px solid var(--gray-border);border-radius:50px;padding:.55rem .85rem}
.fbar-search>i{color:var(--gray-muted);font-size:.95rem}
.fbar-search input{flex:1;border:none;background:none;outline:none;font:inherit;font-size:.9rem;color:#1a1a1a;min-width:0}
.fbar-search-clear{margin-left:auto;color:var(--gray-muted);text-decoration:none;font-size:1.25rem;line-height:1;padding:0 .15rem}
.fbar-search-clear:hover{color:#1a1a1a}

/* #12: двухсторонний ползунок цены с жёлтой заливкой */
.fbar-price{flex-direction:column;align-items:stretch;gap:.55rem;padding:.55rem .85rem}
.fbar-price-lbl{color:var(--gray-muted);font-size:.85rem}
.fbar-price-fields{display:flex;align-items:center;gap:.5rem}
.fbar-price-fields input{flex:1;width:100%;min-width:0;border:none;background:#f0f0f0;border-radius:.4rem;padding:.45rem .55rem;font:inherit;font-size:.875rem;outline:none;color:#1a1a1a}
.fbar-price-fields input:focus{background:#e8e8e8}
.fbar-price-slider{position:relative;height:1.2rem;display:flex;align-items:center}
.fps-track{position:absolute;left:.4rem;right:.4rem;height:4px;background:#e2e2e2;border-radius:2px}
.fps-fill{position:absolute;top:0;bottom:0;background:var(--yellow);border-radius:2px}
/* !важно: селектор специфичнее базового .fbar-price input, иначе слайдер красится в поле */
.fbar-price input.fps-range{position:absolute;left:0;right:0;top:0;width:100%;height:1.2rem;margin:0;padding:0;flex:none;
  background:none;border:none;border-radius:0;pointer-events:none;-webkit-appearance:none;appearance:none;outline:none}
.fbar-price input.fps-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;pointer-events:auto;width:1.05rem;height:1.05rem;border-radius:50%;background:#fff;border:2px solid var(--yellow);box-shadow:0 1px 4px rgba(0,0,0,.28);cursor:pointer;margin-top:-.5rem}
.fbar-price input.fps-range::-moz-range-thumb{pointer-events:auto;width:1.05rem;height:1.05rem;border-radius:50%;background:#fff;border:2px solid var(--yellow);box-shadow:0 1px 4px rgba(0,0,0,.28);cursor:pointer}
.fbar-price input.fps-range::-webkit-slider-runnable-track{background:none;height:4px;border:none}
.fbar-price input.fps-range::-moz-range-track{background:none;height:4px;border:none}

/* #Мобайл 2: кнопка «Фильтры» + скрытие панели по умолчанию */
/* Кнопка «Фильтры / Скрыть фильтры» — на всех размерах */
.fbar-toggle{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--gray-border);
  border-radius:.7rem;padding:.6rem 1.05rem;font:inherit;font-weight:600;font-size:.95rem;color:#1a1a1a;cursor:pointer;
  margin-bottom:1rem;transition:border-color .15s,background .15s}
.fbar-toggle:hover{border-color:#9a9a9a}
.fbar-toggle.is-open{background:var(--yellow);border-color:var(--yellow)}
/* Строка «Фильтры + поиск» — всегда видна, элементы в одну линию и выровнены по высоте.
   Поиск вытащен из раскрывающейся панели и показан по умолчанию. */
.fbar-bar{display:flex;align-items:stretch;gap:.75rem;margin-bottom:1rem}
.fbar-bar .fbar-toggle{margin:0}
/* §Каталог3: кнопки применения фильтра (авто-применение убрано). */
.fbar-row-apply{display:flex;gap:.6rem;margin-top:.5rem}
.fbar-apply{background:var(--yellow);color:#1a1a1a;font-weight:700;border:0;border-radius:.6rem;padding:.7rem 1.5rem;cursor:pointer;font-size:.92rem;transition:filter .15s ease}
.fbar-apply:hover{filter:brightness(.95)}
.fbar-reset{background:#f1f1f1;color:#444;border:1px solid var(--gray-border);border-radius:.6rem;padding:.7rem 1.2rem;cursor:pointer;font-size:.92rem;transition:border-color .15s ease,color .15s ease}
.fbar-reset:hover{border-color:#1a1a1a;color:#1a1a1a}
.ktg-dark .fbar-reset{background:#333;color:#ddd;border-color:#3a3a3a}
.fbar-search-form{display:flex;align-items:stretch;gap:.5rem;flex:1 1 auto;min-width:0;max-width:520px;margin:0}
/* Мобайл: поле поиска в строке фильтра — уже, не растягивается на всю ширину. */
@media(max-width:900px){.fbar-search-form{flex:0 1 235px}}
/* Высота элементов строки фильтра — 32px (вровень с сортировкой). */
.fbar-bar{align-items:center}
.fbar-bar .fbar-toggle,.fbar-bar .fbar-search,.fbar-bar .fbar-find{height:32px;min-height:32px}
.fbar-bar .fbar-toggle{padding:0 .9rem;line-height:1;width:115px}
.fbar-bar .fbar-search{padding:0 .7rem}
.fbar-bar .fbar-search input{padding:.15rem 0}
.fbar-bar .fbar-find{padding:0 1.05rem}
.fbar-search-form .fbar-search{flex:1;min-width:0}
.fbar-toggle i{transition:transform .2s ease}
.fbar-toggle.is-open i{transform:rotate(90deg)}
/* Десктоп: фильтры видны по умолчанию, кнопка их скрывает (класс is-collapsed). */
.fbar.is-collapsed{display:none}
/* Мобайл: фильтры скрыты по умолчанию, кнопка их показывает (класс is-open). */
@media(max-width:900px){
  .fbar{display:none}
  .fbar.is-open{display:flex}
}

/* Тёмная тема для фильтров */
.ktg-dark .fbar-select,.ktg-dark .fbar-price,.ktg-dark .fbar-search,.ktg-dark .fbar-toggle{background:#232323;border-color:#3a3a3a;color:#e8e8e8}
.ktg-dark .fbar-sort-select,.ktg-dark .fbar-search input{color:#e8e8e8}
.ktg-dark .fbar-price-fields input{background:#2a2a2a;color:#e8e8e8}
.ktg-dark .fbar-sort-select option{background:#2a2a2a;color:#e8e8e8}
.ktg-dark .fps-track{background:#3a3a3a}

/* #16: «Показать ещё» */
.cat-loadmore-wrap{display:flex;flex-direction:column;align-items:center;gap:.6rem;margin:2rem 0 .5rem}
/* §Каталог [14]: строка результатов поиска на месте. */
.cat-search-info{font-size:.92rem;color:#797979;margin:.25rem 0 1rem}
.ktg-dark .cat-search-info{color:#9a9a9a}
/* §Каталог [4]: счётчик прогресса «Показано X из Y». */
.cat-loadmore-info{font-size:.88rem;color:#797979}
.cat-loadmore-info b{color:#1a1a1a;font-weight:700}
.ktg-dark .cat-loadmore-info{color:#9a9a9a}
.ktg-dark .cat-loadmore-info b{color:#f0f0f0}
.cat-loadmore{background:var(--yellow);border:none;border-radius:.75rem;padding:.85rem 2rem;font:inherit;font-weight:700;font-size:1rem;color:#1a1a1a;cursor:pointer;transition:filter .15s ease,transform .1s ease}
.cat-loadmore:hover{filter:brightness(.95)}
.cat-loadmore:active{transform:translateY(1px)}
.cat-loadmore.is-loading{opacity:.7;cursor:wait}
/* #7: «Назад к категориям» */
.cat-back{display:inline-flex;align-items:center;gap:.5rem;color:var(--gray-text-dark);text-decoration:none;font-weight:600;font-size:.95rem;margin:0 0 1rem;transition:color .15s ease}
.cat-back:hover{color:#1a1a1a}
.cat-back i{font-size:.85rem}
.ktg-dark .cat-back{color:#cfcfcf}
.ktg-dark .cat-back:hover{color:#fff}

/* #14: якорь товаров под липкой шапкой (как у заголовка категории). */
.cat-products{scroll-margin-top:12rem}
@media(max-width:900px){.cat-products{scroll-margin-top:4.5rem}}

/* ПК: поля цены и ползунок в одну линию (на мобиле остаются в столбик). */
@media(min-width:901px){
  .fbar-price{flex-direction:row;align-items:center;flex-wrap:nowrap;gap:.7rem}
  .fbar-price-lbl{flex:none}
  .fbar-price-fields{flex:0 0 auto}
  .fbar-price-fields input{flex:none;width:4.75rem}
  .fbar-price-slider{flex:1 1 auto;min-width:6rem}
  .fbar-row-sort>.fbar-price{flex:1 1 24rem}
}

/* ============== §19: ВИД «СПИСОК» (единый маркап карточки → грид-строка) ============== */
/* Переключатель сетка/список */
.view-toggle{display:inline-flex;gap:.2rem;margin-left:auto;background:#f0f0f0;border-radius:.6rem;padding:.2rem;align-self:center}
.view-toggle button{border:none;background:none;width:2rem;height:2rem;border-radius:.45rem;color:var(--gray-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:background .15s ease,color .15s ease}
.view-toggle button:hover{color:#1a1a1a}
.view-toggle button.is-active{background:#fff;color:#1a1a1a;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.ktg-dark .view-toggle{background:#2a2a2a}
.ktg-dark .view-toggle button.is-active{background:#151515;color:#fff}

/* Контейнер списка — одна колонка строк */
.cat-products-grid.is-list{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
@media(max-width:700px){.cat-products-grid.is-list{grid-template-columns:1fr}}

/* §Список: фото + точки слева | инфо вторым столбцом справа | лайк+сравнение
   верх-право | «в корзину» низ-право (фикс.). Цена сразу после названия/категории.
   «Список везде одинаковый» — единые правила для .is-list во всех разделах. */
.is-list .product-card{
  position:relative;
  flex:none;width:auto;
  display:grid;
  grid-template-columns:7rem 1fr;
  grid-template-areas:
    "img  title"
    "img  cat"
    "img  price"
    "img  specs"
    "img  stock";
  column-gap:1.15rem;row-gap:.12rem;
  align-items:start;text-align:left;
  min-height:9rem;
  padding:.95rem 3.4rem .95rem 1.05rem;
}
/* Фото + точки пролистывания под ним (левый столбец). */
.is-list .pc-image{grid-area:img;align-self:start;width:7rem;height:7rem;aspect-ratio:1;margin:0}
.is-list .pc-badges{grid-area:img;align-self:start;justify-self:center;justify-content:center;margin:7.35rem 0 0;min-height:0;position:static}
.is-list .pc-badges .pc-discount,.is-list .pc-badges .pc-tag{display:none}
.is-list .pc-dots{position:static;left:auto;transform:none}
/* Лайк + сравнение — в ряд, правый верхний угол. */
.is-list .pc-head{position:absolute;top:.7rem;right:.8rem;margin:0;display:flex;gap:.5rem;justify-content:flex-end;z-index:3}
.is-list .pc-head .pc-sku{display:none}
.is-list .pc-fav{order:1;margin:0}
.is-list .pc-compare{order:2}
/* Инфо-столбец. */
.is-list .pc-title{grid-area:title;font-size:1.02rem;line-height:1.25;margin:0;text-align:left;-webkit-line-clamp:2;padding-right:.5rem}
.is-list .pc-subtitle{grid-area:cat;text-align:left;margin:.1rem 0 0}
.is-list .pc-price-row{grid-area:price;margin:.15rem 0 0;min-height:0;display:flex;flex-direction:column;align-items:flex-start;gap:.15rem}
.is-list .pc-old-slot{height:auto;justify-content:flex-start}
.is-list .pc-price-line{flex-direction:row;align-items:baseline;gap:.7rem;width:100%;justify-content:flex-start;margin-left:0}
.is-list .pc-price-info{align-items:flex-start;text-align:left}
/* Кнопка «в корзину» / счётчик — фиксированно в правом нижнем углу карточки. */
/* Фикс. ширина слота 55px и прижатие вправо: «+» и счётчик занимают одно место,
   при добавлении кнопка/счётчик не прыгает влево. */
.is-list .pc-add-slot{position:absolute;right:.8rem;bottom:1rem;flex:none;width:55px;justify-content:flex-end;z-index:3}
.is-list .pc-specs{grid-area:specs;text-align:left;margin:.25rem 0 0;border:none;padding:0}
.is-list .pc-stock{grid-area:stock;align-self:start;flex-direction:row;flex-wrap:wrap;align-items:center;gap:.35rem 1rem;margin:-1.5rem 0 0}
/* Рейтинг в списке по макету не показываем; точки и «в корзину» — показаны. */
.is-list .pc-rating{display:none}

/* Мобайл: та же раскладка, компактнее. */
@media(max-width:600px){
  .is-list .product-card{grid-template-columns:6rem 1fr;column-gap:.8rem;padding:.75rem 3rem .75rem .8rem;min-height:8rem}
  .is-list .pc-image{width:6rem;height:6rem}
  .is-list .pc-badges{margin-top:6.3rem}
  .is-list .pc-title{font-size:.94rem}
}

/* §19: избранное/корзина — «строка» = компактный список: 1 колонка на мобиле, 2 на десктопе. */
.fav-app .fav-list.is-rows,.cart-app .cart-list.is-rows{grid-template-columns:1fr}
@media(min-width:900px){.fav-app .fav-list.is-rows,.cart-app .cart-list.is-rows{grid-template-columns:repeat(2,1fr)}}
/* доп-элементы карточек избранного/корзины (рассрочка, сумма позиции) в списке — во всю ширину под строкой */
.is-list .pc-install-btn,.is-list .pc-linetotal{grid-column:1 / -1;justify-self:start;margin-top:.35rem;text-align:left}

/* Сортировка у заголовка «Товары» (рядом с переключателем вид сетка/список) */
/* §Каталог3: поиск первым, потом «Фильтры» — строка слева (не центрирована). */
.cat-products-head .fbar-bar{margin:0;flex:1 1 auto;align-self:center;max-width:none;justify-content:space-between}
.cat-products-head .cat-sort{margin-left:auto;align-self:center;display:inline-flex;align-items:center;background:#fff;border:1px solid var(--gray-border);border-radius:.6rem;padding:0;min-width:165px;transition:border-color .15s ease}
.cat-products-head .cat-sort:hover{border-color:#9a9a9a}
.cat-products-head .view-toggle{margin-left:.5rem}
.cat-sort-select{appearance:none;-webkit-appearance:none;border:none;background:none;font:inherit;font-size:.9rem;color:#1a1a1a;cursor:pointer;padding-right:1.15rem;outline:none}
.ktg-dark .cat-products-head .cat-sort{background:#232323;border-color:#3a3a3a}
.ktg-dark .cat-sort-select{color:#e8e8e8}
.ktg-dark .cat-sort-select option{background:#2a2a2a;color:#e8e8e8}
@media(max-width:560px){
  .cat-products-head .cat-sort{margin-left:0;flex:1 1 auto;max-width:200px}
  .cat-products-head .cat-sort-select{width:100%}
  .cat-products-head .view-toggle{margin-left:auto}
}

/* §21/#22: в тёмной теме белые линии делаем серыми (#b0b0b0). */
.ktg-dark .pc-specs{border-top-color:rgba(176,176,176,.3)}
.ktg-dark .pc-specs:empty{border-top-color:transparent}
.ktg-dark .topbar{border-bottom:1px solid rgba(176,176,176,.3)}

/* Мобайл: у свёрнутого блока категорий боковые отступы не нужны (стрелок нет). */
@media(max-width:900px){.cg-panel.collapsed{padding:0;margin-right:-1rem}}

/* Заголовок + счётчик товаров — единый блок (чтобы на мобиле держались вместе). */
.cat-products-title{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;min-width:0}
@media(max-width:560px){.cat-products-title{flex:1 1 100%}}

/* Мобайл: отступ кнопки «свернуть/развернуть» — сверху 0, снизу 1rem. */
@media(max-width:900px){.cg-toggle{margin:0 auto 1rem}}

/* §Карточка 3.1: лёгкий плавный эффект нажатия (без «прыжков»). Скоуп — каталог и
   блоки товаров; в избранном/корзине не трогаем (там перетаскивание карточек). */
.cat-products-grid .product-card,.products-grid .product-card{transition:box-shadow .18s ease,transform .14s cubic-bezier(.4,0,.2,1),border-color .15s ease}
.cat-products-grid .product-card:active,.products-grid .product-card:active{transform:scale(.985)}

/* §Подвал 4: компактный счётчик посетителей под соцсетями */
.footer-visitors{display:inline-flex;align-items:center;gap:.45rem;margin-top:1.9rem;font-size:.85rem;opacity:.92;
  border:none;padding:0;width:max-content}
.footer-visitors i{color:var(--yellow);font-size:.9rem}
.footer-visitors .fv-num{font-weight:700}

/* §12: кнопка «Открыть весь каталог / все товары» под блоками главной */
/* Кнопки «Открыть весь каталог / все товары» под блоками главной убраны и в веб-версии (по правке клиента). */
.home-viewall-wrap{display:none}
.home-viewall{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 1.9rem;border:1.5px solid var(--yellow);
  border-radius:.75rem;background:transparent;color:#1a1a1a;font-weight:700;font-size:1rem;text-decoration:none;
  transition:background .15s ease,transform .1s ease}
.home-viewall:hover{background:var(--yellow)}
.home-viewall:active{transform:translateY(1px)}
.home-viewall i{font-size:.85rem;transition:transform .15s ease}
.home-viewall:hover i{transform:translateX(3px)}
.ktg-dark .home-viewall{color:#f2f2f2}
.ktg-dark .home-viewall:hover{color:#1a1a1a}
/* «Открыть все» под каждым блоком товаров — текстовая кнопка, своя ссылка. На мобиле скрыта. */
.col-viewall{display:block;margin:1.35rem auto 0;background:none;border:none;color:var(--gray-text);font-size:.9375rem;cursor:pointer;font-weight:600;font-family:inherit;text-decoration:none;text-align:center;transition:color .15s ease}
.col-viewall:hover{color:#1a1a1a}
.ktg-dark .col-viewall:hover{color:#f2f2f2}
@media(max-width:900px){.col-viewall{display:none}}

/* Мобайл: точки-пагинация фото на карточке мельче и плотнее. */
@media(max-width:600px){
  .pc-dots{gap:.2rem}
  .pc-dots span{width:.3rem;height:.3rem}
}

/* Мобайл: плашка «Хит/Новинка» к правому краю карточки; карточку обрезаем по скруглению. */
@media(max-width:600px){
  .pc-tag{margin-right:-1rem}
  .cat-products-grid .product-card,.products-grid .product-card{overflow:hidden}
}

/* §7: стрелки перелистывания видимы в тёмной теме (были #1a1a1a на тёмном фоне). */
.ktg-dark .cat-arrow,.ktg-dark .product-arrow{color:#e8e8e8}
/* §6: хвостовой отступ в карусели товаров — после последнего товара «воздух», не стена. */
.products-grid::after{display:none}

/* §Шапка 1.1: меню «Сервис» — стиль как у остальных (51rem, 3 колонки, промо на месте).
   Позиционирование задаётся исходным правилом .catnav-group:last-child (right:0). */

/* §Шапка 1.3: крестик очистки в поле поиска */
.search-clear{position:absolute;right:.7rem;top:50%;transform:translateY(-50%);width:1.5rem;height:1.5rem;border:none;
  background:rgba(0,0,0,.14);color:#333;border-radius:50%;font-size:1.15rem;line-height:1;cursor:pointer;
  display:none;align-items:center;justify-content:center;padding:0;z-index:3}
.search-clear.is-visible{display:flex}
.search-clear:hover{background:rgba(0,0,0,.26)}
.msearch-bar .search-clear{right:1.35rem}
.ktg-dark .search-clear{background:rgba(255,255,255,.18);color:#eee}
.ktg-dark .search-clear:hover{background:rgba(255,255,255,.3)}

/* §Шапка 1.2: «Обратный звонок» под телефоном (стиль как «адреса филиалов»). */
.contact-phone-wrap{display:flex;flex-direction:column;align-items:flex-end}
.contact-callback{font-size:.8125rem;color:#000;font-weight:400;margin-top:.1rem;text-decoration:underline;
  text-decoration-skip-ink:none;cursor:pointer;transition:opacity .15s ease}
.contact-callback:hover{opacity:.65}
.ktg-dark .contact-callback{color:#9a9a9a}

/* §5: счётчик до конца акции (над блоком «Товары со скидкой») */
/* Таймер акции: «До конца акции:» на первой строке, цифры — по центру ниже.
   Отступы ужаты, чтобы не увеличивать расстояние заголовок↔товары (шапка держит min-height:90px). */
.sale-countdown{display:flex;justify-content:center;align-items:center;gap:.1rem .45rem;margin:.1rem 0 .2rem;padding:.25rem 0;
  border-radius:.6rem;font-size:.82rem;color:#1a1a1a;flex-wrap:wrap}
.sale-countdown .fa-fire{color:#e23c3c}
.sc-label{font-weight:600;flex-basis:100%;text-align:center}
.sc-unit{display:inline-flex;align-items:baseline;gap:.12rem}
.sc-unit b{font-weight:800;font-variant-numeric:tabular-nums;min-width:1.1em;text-align:center}
.sc-unit i{font-style:normal;color:var(--gray-muted);font-size:.72rem}
.ktg-dark .sale-countdown{color:#f2f2f2}
.ktg-dark .sc-unit i{color:#aaa}

/* §3: красная цена у товара со скидкой */
.pc-price.is-sale{color:var(--red)}
/* §9: компактный поиск в фильтре (последняя строка) + кнопка «Найти» */
.fbar-row-search{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch}
.fbar-search{flex:1 1 15rem;max-width:22rem;position:relative}
.fbar-find{flex:0 0 auto;padding:.55rem 1.5rem;border:none;border-radius:.625rem;background:var(--yellow);
  color:#1a1a1a;font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;transition:filter .15s ease}
.fbar-find:hover{filter:brightness(.94)}
.fbar-find:active{transform:translateY(1px)}
/* §4: крестик очистки в поле фильтра-поиска */
.fbar-search .search-clear{right:.55rem}

/* §1: в конце горизонтальной ленты прокрутка не уходит на страницу (не «пробрасывается»). */
.pc-slides,.products-grid,.cat-icons-viewport,.cg-panel.collapsed .cg-grid{overscroll-behavior:contain}
/* §10: кнопка «Назад» на листовой категории — отступ сверху. */
.cat-back-leaf{margin-top:.5rem}

/* «Похожие товары» — плотнее между карточками. */
.sp-related .products-grid{gap:.6rem}

/* §Мобайл 8: кастомный выпадающий список с иконками у опций */
.fancy-select{position:relative;width:100%;padding:.45rem .85rem}
.fancy-select select{display:none}
.fs-btn{display:flex;align-items:center;gap:.5rem;width:100%;background:none;border:none;font:inherit;font-size:.9rem;color:#1a1a1a;cursor:pointer;padding:0;text-align:left}
.fs-btn>i:first-child{color:var(--gray-muted);font-size:.9rem;flex-shrink:0}
.fs-cur{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fs-caret{margin-left:auto;font-size:.7rem;color:var(--gray-muted);transition:transform .15s ease}
.fancy-select.is-open .fs-caret{transform:rotate(180deg)}
.fs-list{position:absolute;z-index:60;top:calc(100% + .7rem);left:0;width:100%;min-width:0;max-width:none;
  list-style:none;margin:0;padding:.3rem;background:#fff;border:1px solid var(--gray-border);border-radius:.7rem;
  box-shadow:0 .6rem 1.6rem rgba(0,0,0,.14);max-height:16rem;overflow:auto}
.fs-opt{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:.5rem;font-size:.9rem;color:#1a1a1a;cursor:pointer;white-space:normal}
.fs-opt>span,.fs-opt{min-width:0}
.fs-opt>i{color:var(--gray-muted);width:1.1rem;text-align:center;flex-shrink:0}
.fs-opt:hover{background:var(--yellow)}
/* §Сравнить 2: заголовок группы (тип техники) в кастомном списке. */
.fs-group{padding:.5rem .7rem .25rem;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-muted);cursor:default;pointer-events:none}
.fs-group:not(:first-child){margin-top:.25rem;border-top:1px solid var(--gray-border);padding-top:.5rem}
.ktg-dark .fs-group{color:#9a9a9a}.ktg-dark .fs-group:not(:first-child){border-color:#3a3a3a}
/* §Сравнить 2 (#6): стильная модалка ввода названия (замена prompt). */
.ktg-ask-back{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:1rem}
.ktg-ask{position:relative;background:#fff;border-radius:1rem;width:100%;max-width:23rem;padding:1.6rem 1.5rem 1.35rem;box-shadow:0 1.5rem 4rem rgba(0,0,0,.32);animation:ktgAskIn .18s ease}
@keyframes ktgAskIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.ktg-ask-x{position:absolute;top:.6rem;right:.8rem;background:none;border:0;font-size:1.5rem;line-height:1;color:#aaa;cursor:pointer}
.ktg-ask-x:hover{color:#666}
.ktg-ask-t{margin:0 0 .35rem;font-size:1.2rem;font-weight:800;color:#1a1a1a}
.ktg-ask-sub{margin:0 0 1rem;font-size:.85rem;color:var(--gray-muted);line-height:1.5}
.ktg-ask-inp{width:100%;box-sizing:border-box;border:1px solid #dcdcdc;background:#fbfbfb;border-radius:.7rem;padding:.85rem 1rem;font-size:1rem;color:#1a1a1a;margin:0 0 1.1rem}
.ktg-ask-inp:focus{outline:none;border-color:var(--yellow);background:#fff;box-shadow:0 0 0 3px rgba(255,222,0,.25)}
.ktg-ask-inp.is-err{border-color:#e23b3b;box-shadow:0 0 0 3px rgba(226,59,59,.15)}
.ktg-ask-act{display:flex;gap:.6rem}
.ktg-ask-cancel,.ktg-ask-ok{flex:1;border:0;border-radius:.7rem;padding:.8rem;font-size:.95rem;font-weight:700;cursor:pointer}
.ktg-ask-cancel{background:#f1f1f1;color:#444}.ktg-ask-cancel:hover{background:#e7e7e7}
.ktg-ask-ok{background:var(--yellow);color:#1a1a1a}.ktg-ask-ok:hover{filter:brightness(.95)}
.ktg-dark .ktg-ask{background:#232323}.ktg-dark .ktg-ask-t{color:#f0f0f0}
.ktg-dark .ktg-ask-inp{background:#2c2c2c;border-color:#3a3a3a;color:#eee}
.ktg-dark .ktg-ask-cancel{background:#333;color:#ddd}
/* §Корзина #3: кнопка «заявка в WhatsApp» на экране подтверждения заказа. */
.cart-order-wa{margin:.6rem 0}
.cart-order-wa-btn{display:inline-flex;align-items:center;gap:.5rem;background:#25D366;color:#fff;font-weight:700;text-decoration:none;padding:.7rem 1.15rem;border-radius:.7rem;font-size:.95rem}
.cart-order-wa-btn:hover{filter:brightness(.95)}
.cart-order-wa-btn i{font-size:1.15rem}
.fbar-sort-wrap:has(.fancy-select)>i:first-child{display:none}
.fbar-sort-wrap:has(.fancy-select)::after{display:none}
.ktg-dark .fs-btn,.ktg-dark .fs-cur{color:#e8e8e8}
.ktg-dark .fs-list{background:#232323;border-color:#3a3a3a}
.ktg-dark .fs-opt{color:#e8e8e8}
.ktg-dark .fs-opt:hover{background:#333;color:#fff}

/* §5/#18: секции товаров по подкатегориям */
.cat-subsec{margin-bottom:2.25rem}
/* §правка: в секциях подкатегорий (Пылесосы и т.п.) товары — ОДНОЙ строкой с горизонтальным
   листанием (карусель), а не сеткой в несколько рядов. «Смотреть все» ведёт на полный список. */
.cat-subsec .cat-products-grid{
  display:flex;flex-wrap:nowrap;overflow-x:auto;gap:1rem;
  -webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  padding-bottom:.4rem;
  scrollbar-width:none;-ms-overflow-style:none; /* полоса прокрутки скрыта */
}
.cat-subsec .cat-products-grid::-webkit-scrollbar{display:none}
.cat-subsec .cat-products-grid > *{flex:0 0 clamp(9.5rem,42vw,195px)}
/* §Каталог [8]: в подсекциях в режиме «Список» — максимум 2 ряда с горизонтальным
   листанием (а не вся сетка). «Смотреть все» ведёт на полный список. */
.cat-subsec .cat-products-grid.is-list{
  display:grid;grid-template-columns:none;grid-auto-flow:column;grid-template-rows:repeat(2,auto);
  grid-auto-columns:calc(50% - .5rem);gap:.75rem 1rem;
  overflow-x:auto;overflow-y:visible;padding-bottom:.4rem;
  /* Без scroll-snap: он «прищёлкивал» ленту обратно к началу и ломал листание
     колесом мыши (снап-точки далеко — шаг колеса меньше). Плавный доводчик —
     в JS (initHScroll → snapNearest) после перетаскивания. */
  justify-content:flex-start;
  scrollbar-width:none;-ms-overflow-style:none;
}
.cat-subsec .cat-products-grid.is-list::-webkit-scrollbar{display:none}
.cat-subsec .cat-products-grid.is-list > *{flex:none;width:auto}
@media(max-width:600px){
  /* на телефоне 2 колонки узкие — показываем по 1 в ширину, 2 ряда, листаем */
  .cat-subsec .cat-products-grid.is-list{grid-auto-columns:minmax(85vw,90vw)}
}
.cat-subsec-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:1.75rem 0 1rem}
.cat-subsec-h{font-size:1.35rem;font-weight:800;color:#1a1a1a;margin:0;letter-spacing:-.01em}
.cat-subsec-all{color:var(--gray-text);text-decoration:none;font-weight:600;font-size:.9rem;white-space:nowrap;display:inline-flex;align-items:center;gap:.4rem;transition:color .15s ease}
.cat-subsec-all:hover{color:#1a1a1a}
.cat-subsec-all i{font-size:.72rem}
.ktg-dark .cat-subsec-h{color:#f2f2f2}
.ktg-dark .cat-subsec-all{color:#bbb}
.ktg-dark .cat-subsec-all:hover{color:#fff}

/* В режиме секций по подкатегориям заголовок «Товары»+счётчик прячем (у секций свои заголовки). */
.cat-products.is-grouped .cat-products-title{display:none}

/* Описание подкатегории под её заголовком в секции. */
.cat-subsec-desc{color:var(--gray-text);font-size:.95rem;line-height:1.5;margin:-.3rem 0 1rem;max-width:100%}
.ktg-dark .cat-subsec-desc{color:#bbb}
/* §Каталог [11]: сворачиваемое описание подкатегории — слева. */
.cat-subsec-desc-c{max-width:100%;margin:.15rem 0 .9rem;text-align:left}
.cat-subsec-desc-c .cat-desc-body{margin:.15rem 0 .5rem}
/* «Подробнее» рядом с заголовком подсекции; «Смотреть все» остаётся справа. */
.cat-desc-more-inline{margin:0;font-size:.82rem;padding:.1rem .3rem;flex:0 0 auto;align-self:center}
.cat-subsec-head .cat-subsec-all{margin-left:auto}

/* Каталог «два независимых окна»: когда раскрыты обе группы — держим 2 колонки рядом. */
.cat-groups.two-open{grid-template-columns:1fr 1fr}
.cat-groups.two-open .cat-group-col{display:flex}
@media(max-width:900px){.cat-groups.two-open{grid-template-columns:1fr}}

.products-head h2{margin-bottom:0}

/* §правка: счётчик переехал ПОД товары — резерв высоты в шапке убран,
   расстояние заголовок↔товары как было до счётчика. */
.products-head{position:relative;display:flex;justify-content:center;align-items:center;gap:.6rem;margin-bottom:1.1rem}
/* «Все товары» справа, заголовок остаётся по центру (десктоп). */
@media(min-width:901px){.products-head .prod-viewall{position:absolute;right:25px;top:50%;transform:translateY(-50%)}}
/* Счётчик акции под товарами: подпись сверху, цифры по центру ниже. */
.sale-countdown-under{margin:1.1rem 0 .2rem}

/* В мобилке кнопки «Открыть все» под блоками главной скрываем. */
@media(max-width:900px){.home-viewall-wrap{display:none}}

@media (max-width: 900px) {
  .products-head { flex-wrap: wrap; }
}

/* §правка: на мобиле карточка даёт лёгкий тап-эффект (scale — соседей не двигает).
   При нажатии на «+»/счётчик/избранное/сравнение карточку НЕ давим (у них свои эффекты). */
@media(max-width:900px){
  /* Тап по карточке: лёгкое сжатие + тень. Тень (не меняет границы) видна и при нажатии «+»,
     поэтому «+» тоже даёт отклик карточки, но соседи не «двигаются». */
  .cat-products-grid .product-card:active,.products-grid .product-card:active{transform:scale(1.02);box-shadow:0 6px 18px rgba(0,0,0,.14)}
  /* «+» тоже даёт полный эффект карточки; исключаем только угловые иконки избранного/сравнения. */
  .cat-products-grid .product-card:has(.pc-fav:active,.pc-compare:active):active,
  .products-grid .product-card:has(.pc-fav:active,.pc-compare:active):active{transform:none}
}

/* §Мобайл 1: на мобиле убираем «залипание» — прокрутка фото/лент не держит страницу. */
@media(max-width:900px){
  .pc-slides,.products-grid,.cat-icons-viewport,.cg-panel.collapsed .cg-grid{overscroll-behavior:auto}
}
/* §Мобайл 2: карточка со скидкой — цвета цены/рассрочки + мягче категория (тёмная тема). */
.ktg-dark .pc-price.is-sale{color:#d95757}                              /* цена красная, не яркая */
.pc-price-info:has(.pc-price.is-sale) .pc-install{color:#000}           /* светлая: рассрочка чёрным */
.ktg-dark .pc-price-info:has(.pc-price.is-sale) .pc-install{color:#fff} /* тёмная: рассрочка белой */
.ktg-dark .pc-subtitle{color:#9a9a9a}                                   /* категория мягче/серее */
/* §Мобайл 3: крестик очистки в поиске каталога — круглый (не овал). */
.fbar-search .search-clear{width:1.5rem;height:1.5rem;min-width:1.5rem;flex:none;padding:0}

/* ============================================================================
 * §Подвал 4: адаптив подвала на промежуточных ширинах (601–1024px).
 * Не сваливаем всё в одну колонку — минимум 2 блока в ряд, логика/пропорции
 * как на десктопе (лево-выравнивание). Бренд | Навигация сверху, Адреса — во всю
 * ширину ниже (карточки авто-раскладкой). На телефонах (<601px) — прежний
 * центрированный одностолбцовый вид. Правила в конце файла → перекрывают ранние.
 * ========================================================================== */
/* 901–1240px: навигация видна — 3 блока в ряд: Бренд 23% | Навигация 48% | Адреса 30%. */
@media (min-width:901px) and (max-width:1240px){
  .footer-inner{grid-template-columns:25% 40% 30%;gap:2rem 28px;text-align:left}
  .footer-brand{align-items:flex-start;text-align:left;margin:0}
  .footer-nav-inner{display:block}
  .footer-nav h4,.footer-addresses h4{padding-left:0}
  .footer-nav-cols{flex-direction:row;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:1.4rem 2rem}
  .footer-nav-col{flex:0 0 auto;text-align:left}
  .footer-addresses{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem 2rem;justify-items:start}
  .footer-addr{flex-direction:row;align-items:flex-start;text-align:left;gap:.6rem}
  .footer-addr-text{align-items:flex-start}
  .footer-addr-text span{white-space:normal}
}
/* 601–900px: навигация подвала скрыта (2 блока) → Бренд | Адреса в один ряд. */
@media (min-width:601px) and (max-width:900px){
  .footer-inner{grid-template-columns:1fr 1fr;gap:2rem 2.5rem;text-align:left;align-items:start}
  .footer-brand{align-items:flex-start;text-align:left;margin:0}
  .footer-addresses{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem 1.5rem;justify-items:start}
  .footer-addresses h4{text-align:left;grid-column:1 / -1}
  .footer-addr{flex-direction:row;align-items:flex-start;text-align:left;gap:.6rem}
  .footer-addr-text{align-items:flex-start}
  .footer-addr-text span{white-space:normal}
}

/* §Меню 3: некликабельные пункты-заглушки (Обсуждения/Вопрос-ответ/О компании). */
.acc-soon,.cm-soon{color:#9a9a9a;cursor:default;pointer-events:none}
.ktg-dark .acc-soon,.ktg-dark .cm-soon{color:#6f6f6f}
/* §Меню 5/6: промо-блок сервиса — кнопки как ссылки + вторая (Заключить договор). */
.mmx-promo .mmx-promo-btn{cursor:pointer;text-decoration:none}
.mmx-promo-btn-2{margin-top:.45rem;background:transparent!important;border:1px solid currentColor}

/* §Совместимость [2-3]: фильтр «по модели» на страницах Аксессуары/Запчасти/Химия. */
.ktg-fits{position:relative;margin:.75rem 0 0;max-width:34rem}
.ktg-fits-field{display:flex;align-items:center;gap:.5rem;border:1px solid var(--gray-border,#e0e0e0);border-radius:.7rem;background:#fff;padding:.55rem .8rem}
.ktg-fits-field:focus-within{border-color:var(--yellow)}
.ktg-fits-ico{color:#9a9a9a;font-size:.95rem}
.ktg-fits-input{flex:1;border:0;outline:0;background:transparent;font:inherit;font-size:.95rem;color:#1a1a1a;min-width:0}
.ktg-fits-clear{border:0;background:transparent;color:#9a9a9a;font-size:1.3rem;line-height:1;cursor:pointer;padding:0 .2rem}
.ktg-fits-clear:hover{color:#1a1a1a}
.ktg-fits-drop{position:absolute;left:0;right:0;top:calc(100% + .3rem);z-index:40;background:#fff;border:1px solid var(--gray-border,#e0e0e0);border-radius:.7rem;box-shadow:0 .8rem 2rem rgba(0,0,0,.14);max-height:20rem;overflow:auto;padding:.3rem}
.ktg-fits-opt{display:flex;align-items:center;gap:.6rem;width:100%;text-align:left;border:0;background:transparent;cursor:pointer;padding:.45rem .5rem;border-radius:.5rem;font:inherit}
.ktg-fits-opt:hover{background:#f5f5f5}
.ktg-fits-opt-img{width:2rem;height:2rem;flex:0 0 2rem;object-fit:contain;border-radius:.3rem;background:#f2f2f2}
.ktg-fits-opt-t{flex:1;font-size:.9rem;color:#1a1a1a}
.ktg-fits-opt-sku{font-size:.78rem;color:#9a9a9a;white-space:nowrap}
.ktg-fits-empty{padding:.6rem .5rem;color:#9a9a9a;font-size:.9rem}
.ktg-fits-status{margin:.7rem 0 0;font-size:.95rem;font-weight:600;color:#1a1a1a}
.ktg-fits-results{margin-top:1rem}
.ktg-dark .ktg-fits-field,.ktg-dark .ktg-fits-drop{background:#232323;border-color:#3a3a3a}
.ktg-dark .ktg-fits-input,.ktg-dark .ktg-fits-opt-t,.ktg-dark .ktg-fits-status{color:#e8e8e8}
.ktg-dark .ktg-fits-opt:hover{background:#2e2e2e}

/* §Галерея [34-35]: веб-набор фото/видео на десктопе, моб-набор на телефоне (независимые). */
.gallery-mob{display:none}
@media(max-width:900px){
  .gallery-web{display:none}
  .gallery-mob{display:block}
}

/* §Главная [26]: на мобилке шапка блоков товаров — заголовок слева, кнопка справа. */
@media(max-width:900px){
  .products-head{justify-content:space-between;flex-wrap:nowrap}
}
/* §Главная [27]: шапка блоков галереи — заголовок слева, «Открыть все» справа (некликабельная). */
.gallery-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:1rem}
.gallery-head h3{margin:0}
.gallery-viewall{display:inline-flex;align-items:center;gap:.3rem;font-size:.9rem;font-weight:600;color:#9a9a9a;cursor:default;white-space:nowrap;flex-shrink:0}
.gallery-viewall i{font-size:.72rem}
/* §Главная [11]: на ВЕБ-версии заголовок «Галерея»/«Видео» по центру
   (в мобильной оставляем как есть — слева). «Открыть все» — справа, поверх. */
@media(min-width:901px){
  .gallery-head{justify-content:center;position:relative}
  .gallery-head .gallery-viewall{position:absolute;right:0;top:50%;transform:translateY(-50%)}
}
.ktg-dark .gallery-viewall{color:#7a7a7a}

/* §Подвал: центрируем текст адреса только на телефонах (≤600px), а не с 900px. */
@media (max-width:600px){
  .footer-addr-text{text-align:center}
}

/* §Филиалы [6,7]: карточка компактнее + ряд «соцсети | телефон | карты», иконки квадратно-скруглённые одного размера. */
.ct-fil-body{gap:.7rem;padding:1rem 1.1rem 1.1rem}
.ct-fil-actions{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;width:100%;margin-top:.15rem}
.ct-fil-actions .ct-fil-soc{justify-self:start;gap:.4rem}
.ct-fil-actions .ct-fil-phone-pill{justify-self:center}
.ct-fil-actions .ct-fil-maps{justify-self:end;gap:.4rem}
.ct-fil-soc a{border-radius:.55rem}   /* квадратно-скруглённые, как иконки карт (не круглые) */
.ct-fil-phone-pill{padding:.5rem .95rem;font-size:.8rem;cursor:pointer}

/* §Сервис [21-22]: «Записаться на сервис» — компактный блок, кнопка в одну строку. */
.ct-servcta{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:#f7f7f7;border-radius:1rem;padding:1.25rem 1.5rem}
.ct-servcta-h{margin:0;font-size:1.25rem}
.ct-servcta-sub{margin:.2rem 0 0;color:#555;font-size:.95rem}
.ct-servcta-btn{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;background:var(--yellow);color:#111;font-weight:700;padding:.7rem 1.4rem;border-radius:.7rem;text-decoration:none;flex-shrink:0;cursor:pointer}
.ct-servcta-btn:hover{filter:brightness(.97)}
.ktg-dark .ct-servcta{background:#232323}
.ktg-dark .ct-servcta-sub{color:#9a9a9a}
@media(max-width:600px){.ct-servcta{flex-direction:column;align-items:stretch;text-align:center}.ct-servcta-btn{justify-content:center}}

/* §Филиалы [13]: постоянная подсветка выбранной карточки (клик по городу/метке). */
.ct-fil-card.is-active{border-color:var(--yellow);box-shadow:0 0 0 2px var(--yellow),0 8px 26px rgba(0,0,0,.10)}

/* §Корзина [27]: на мобилке чуть больше воздуха между «Оформить заказ» и подвалом. */
@media(max-width:900px){ .cart-page-x{padding-bottom:2.5rem} }
/* §Избранное [21]: на мобиле товары упирались в подвал — добавляем нижний отступ. */
@media(max-width:900px){ .fav-page{padding-bottom:2.5rem} }
/* §Избранное [19]: ручка перетаскивания видна только в режиме «Изменить». */
.fav-app .fav-list .pc-extra-drag{display:none}
.fav-app .fav-list.is-editing .pc-extra-drag{display:flex}
.fav-app .fav-list.is-editing .product-card{cursor:grab}
.fav-app .fav-list.is-editing{outline:2px dashed var(--yellow);outline-offset:.5rem;border-radius:.5rem}
.lk-act.fav-edit.is-active{color:#1a1a1a}
.lk-act.fav-edit.is-active i{color:var(--accent-deep,#a88a00)}

/* §Мой Керхер [8]: галочка согласия при регистрации. */
.auth-consent{display:flex;align-items:flex-start;gap:.5rem;font-size:.82rem;color:#555;line-height:1.4;margin:.1rem 0;cursor:pointer}
.auth-consent input{margin-top:.15rem;flex-shrink:0}
.auth-consent a{color:#1a1a1a;text-decoration:underline}
.ktg-dark .auth-consent{color:#9a9a9a}.ktg-dark .auth-consent a{color:#e8e8e8}

@media (min-width: 901px) and (max-width: 1240px) {
  .footer-nav h4, .footer-addresses h4 { padding-left: 0; }
}


@media (max-width: 1200px) {
  .cat-pill .title { font-size: 1.6rem; }
}

@media (max-width: 1200px) {
  .products-head { justify-content: space-between; flex-wrap: nowrap; }
}

@media (min-width: 1920px) {
  .search-wrap { max-width: 800px; }
}

@media (max-width: 900px) {
  .products-head { margin: 0; }
}

.cat-desc { display: none; }
.cat-desc.is-open { display: block; }

/* §Карточка [7]: пустая строка характеристик не должна занимать место и
   толкать «В наличии»/кнопку вниз — прячем, карточка становится ниже. */
.pc-specs:empty{display:none}

@media (max-width: 480px) {
  .cg-pill { margin-bottom: 1rem; border-radius: 1rem; }
}

@media (max-width: 900px) {
  .cat-pill-txt { align-items: flex-start; text-align: left; min-width: 0; }
  .cat-pill.is-cat .cat-pill-txt { align-items: center; text-align: center; }
}

@media (max-width: 480px) {
  .cat-subsec-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.75rem 0 1rem;
    flex-wrap: wrap;
  }
  .cat-subsec-h {
    font-size: 1.35rem;
    font-weight: 800;
    color: #1a1a1a;
    margin: 0;
    letter-spacing: -.01em;
    flex: 0 1 100%;
  }
}

.auth-sub{display:none}

/* Мобилка: на фото карточки товара — тап открывает товар, без нативного
   «сохранить изображение»/выделения/перетаскивания (долгое нажатие по фото
   больше не «цепляет» картинку). Свайп слайдера фото не затрагивается. */
@media (max-width: 900px) {
  .product-card img,
  .product-card .pc-image,
  .product-card .pc-slide,
  .product-card .pc-slide img,
  .fav-card img {
    -webkit-touch-callout: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
  }
}

/* §Каталог [5]: жёлтая пилюля на листовой подкатегории. */
.cat-leaf{margin-bottom:1rem}
.cat-leaf .cat-desc{margin-top:.75rem}

/* §Корзина: верхний блок (шапка+действия) и нижний (Итого+Оформить) закреплены
   при прокрутке. Верх — под залипающей шапкой сайта (--ktg-sticky-top, задаётся JS);
   низ — у нижней кромки экрана, у подвала перестаёт опускаться (sticky в .cart-body). */
.cart-page-x .lk-head{position:sticky;top:var(--ktg-sticky-top,0);z-index:30}
.cart-page-x .cart-summary{position:sticky;bottom:0;z-index:20;box-shadow:0 -4px 18px rgba(0,0,0,.08)}
@media(max-width:900px){
  .cart-page-x .cart-summary{margin-top:1rem}
}
/* §Корзина (мобилка): липкая шапка ниже фикс-хедера, с отступом сверху. */
@media(max-width:600px){
  .cart-page-x .lk-head{position:sticky;top:40px;z-index:30;padding-top:20px}
}

/* §Сравнить [7]: индикатор загрузки таблицы (пока тянутся товары из Store API). */
.cmp-loading{display:flex;align-items:center;justify-content:center;gap:.65rem;padding:2.5rem 1rem;color:var(--gray-text);font-size:.95rem}
.cmp-loading[hidden]{display:none}
.cmp-spinner{width:1.35rem;height:1.35rem;border:2px solid var(--gray-border);border-top-color:var(--yellow);border-radius:50%;display:inline-block;animation:ktgCmpSpin .7s linear infinite}
@keyframes ktgCmpSpin{to{transform:rotate(360deg)}}

/* §Товар [5]: иконки-картинки (share/compare/delivery/док) с тёмным глифом не видны
   на тёмной теме — инвертируем яркость (hue-rotate возвращает цвет цветным частям). */
.ktg-dark .sp-ico,.ktg-dark .sp-doc-ico{filter:invert(1) hue-rotate(180deg)}

/* §Товар [20]: свёрнутые отзывы (>3) — раскрываются кнопкой «Открыть все отзывы». */
.rv-item-hidden{display:none}
.rv-list.is-expanded .rv-item-hidden{display:block}
.rv-all-toggle{display:inline-flex;align-items:center;gap:.45rem;margin-top:.6rem;background:none;border:0;cursor:pointer;font:inherit;font-weight:700;color:#1a1a1a;padding:.35rem 0}
.rv-all-toggle i{font-size:.72rem;transition:transform .2s ease}
.rv-list.is-expanded .rv-all-toggle i{transform:rotate(180deg)}
.rv-all-toggle:hover{text-decoration:underline}
.ktg-dark .rv-all-toggle{color:#e8e8e8}

/* §Товар (мобилка): единый формат разделов-аккордеона — одинаковая невысокая
   закрытая строка, текст слева, одинаковый шрифт; все разделы выглядят как
   карточки (в т.ч. «Габариты упаковки» и «Гарантия и сервис»). */
@media(max-width:900px){
  .sp-pack.sp-collapsible,.sp-block.sp-collapsible,.sp-card.sp-collapsible,
  .sp-warranty.sp-collapsible,.sp-specs.sp-collapsible,.sp-media-col.sp-collapsible{
    background:#fff;border-radius:1.25rem;padding:0;overflow:hidden}
  .ktg-dark .sp-pack.sp-collapsible,.ktg-dark .sp-block.sp-collapsible,
  .ktg-dark .sp-card.sp-collapsible,.ktg-dark .sp-warranty.sp-collapsible,
  .ktg-dark .sp-specs.sp-collapsible,.ktg-dark .sp-media-col.sp-collapsible{background:#1c1c1c}
  /* §Товар [19]: у «Видео»/«До и после» внутренние карточки уже дают отступы/фон —
     на мобиле убираем их, чтобы не было двойной карточки и лишних отступов. */
  /* §Товар (мобилка): .sp-media-col базово flex:1 1 0 (для равных колонок на вебе).
     В колоночном флексе + overflow:hidden авто-минимум высоты = 0 → колонка
     схлопывается и заголовок обрезается («Видео»/«До и после» пропадают).
     На мобиле сайзим по контенту. */
  .sp-media-col.sp-collapsible{flex:0 0 auto}
  .sp-media-col.sp-collapsible .sp-results-card{padding:0;background:none;border-radius:0}
  .sp-media-col.sp-collapsible.is-open .sp-media-video{border-radius:.9rem;overflow:hidden}
  .sp-media-col.sp-collapsible .sp-results{gap:.7rem}
  .sp-collapsible > .sp-block-h,
  .sp-collapsible > .sp-pack-h{
    font-size:1.05rem;line-height:1.35;font-weight:600;text-align:left;
    justify-content:space-between;margin:0;padding:.95rem 1.15rem;
    min-height:3rem;box-sizing:border-box}
  .sp-collapsible.is-open{padding-bottom:1.15rem}
  .sp-collapsible.is-open > *:not(.sp-block-h):not(.sp-pack-h){
    padding-left:1.15rem;padding-right:1.15rem}
  /* «Габариты» вложены в карточку-обёртку .sp-pack-card; сам .sp-pack теперь тоже
     карточка — убираем внешнюю, чтобы не было двойной карточки/лишней высоты. */
  .sp-buy-col > .sp-extra.sp-pack-card{padding:0;background:none;box-shadow:none}
}