/* ============================================================
   Общая шапка и подвал в стиле mattest.store
   Используется на всех страницах кроме главной (главная имеет свой Next.js header)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap');

/* Единый шрифт сайта — Montserrat (как в каталоге) */
:root { --font-site: 'Montserrat', 'Segoe UI', sans-serif; }
html, body { font-family: 'Montserrat', 'Segoe UI', sans-serif !important; }
/* Гарантируем шрифт во всех вложенных элементах главной */
.header-shell-px, .header-menu-px, .header-menu-item-px,
section, footer, header, main, h1, h2, h3, h4, h5, h6, p, a, span, button, div {
  font-family: 'Montserrat', 'Segoe UI', sans-serif !important;
}

/* Уменьшение шрифтов на главной до уровня каталога.
   Кастомные классы Next.js + Tailwind text-[Npx]. */
.hero-title-px { font-size: 44px !important; line-height: 1.05 !important; }
.section-advantages-title-px { font-size: 28px !important; line-height: 1.15 !important; }
[class*="text-[129"] { font-size: 60px !important; line-height: 1 !important; }
[class*="text-[120"], [class*="text-[110"], [class*="text-[100"], [class*="text-[90"], [class*="text-[80"] { font-size: 48px !important; }

[class*="text-[70px]"]  { font-size: 44px !important; line-height: 1.1 !important; }
[class*="text-[60px]"]  { font-size: 38px !important; line-height: 1.1 !important; }
[class*="text-[50px]"]  { font-size: 32px !important; }
[class*="text-[48px]"]  { font-size: 30px !important; }
[class*="text-[42px]"]  { font-size: 28px !important; }
[class*="text-[40px]"]  { font-size: 28px !important; }
[class*="text-[38px]"]  { font-size: 26px !important; }
[class*="text-[36px]"]  { font-size: 24px !important; }
[class*="text-[34px]"]  { font-size: 22px !important; }
[class*="text-[32px]"]  { font-size: 22px !important; }
[class*="text-[30px]"]  { font-size: 20px !important; }
[class*="text-[28px]"]  { font-size: 19px !important; }
[class*="text-[26px]"]  { font-size: 18px !important; }
[class*="text-[25px]"]  { font-size: 18px !important; }
[class*="text-[24px]"]  { font-size: 17px !important; }
[class*="text-[22px]"]  { font-size: 16px !important; }
[class*="text-[20px]"]  { font-size: 15px !important; }
[class*="text-[19px]"]  { font-size: 14px !important; }
[class*="text-[18px]"]  { font-size: 14px !important; }
[class*="text-[17px]"]  { font-size: 13px !important; }
[class*="text-[16px]"]  { font-size: 13px !important; }
[class*="text-[15px]"]  { font-size: 13px !important; }

/* Системные сбросы локально для своих классов */
.mt-header *,
.mt-footer * { box-sizing: border-box; }

/* ============ HEADER ============ */
.mt-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid #efefef;
  height: 64px;
  display: flex;
  align-items: center;
  font-family: 'Proxima Nova', 'Nunito Sans', 'Segoe UI', sans-serif;
}
.mt-header__inner {
  margin: 0 auto;
  width: min(1160px, calc(100% - 24px));
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.mt-header__logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}
.mt-header__logo img {
  height: 36px;
  width: 200px;
  object-fit: contain;
  display: block;
}
.mt-header__menu {
  display: none;
  align-items: center;
  gap: 2px;
  color: #000;
  margin-left: 40px;
  margin-right: auto;
}
@media (min-width: 768px) {
  .mt-header__menu { display: flex; }
}
.mt-header__menu > * {
  position: relative;
}
.mt-header__item {
  display: inline-flex;
  align-items: center;
  font-size: 15px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  padding: 8px 14px;
  border-radius: 6px;
  cursor: pointer;
  background: transparent;
  border: 0;
  font-family: inherit;
  transition: background .15s;
  white-space: nowrap;
}
.mt-header__item:hover {
  background: rgba(0, 0, 0, .05);
}
.mt-header__item.is-active {
  background: rgba(0, 0, 0, .05);
}
.mt-header__caret {
  margin-left: 6px;
  transition: transform .2s;
}
[aria-expanded="true"] .mt-header__caret {
  transform: rotate(180deg);
}

.mt-header__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.mt-header__icon-btn {
  width: 40px;
  height: 40px;
  border: 1px solid #e4e4e4;
  border-radius: 8px;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #000;
  text-decoration: none;
  transition: background .15s;
}
.mt-header__icon-btn:hover { background: #f7f7f7; }
.mt-header__lang {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  height: 40px;
  border: 1px solid #e4e4e4;
  border-radius: 8px;
  background: #fff;
  color: #000;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}
.mt-cart-btn { position: relative; }
.mt-cart-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: #FFC914;
  color: #000;
  font-size: 11px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
}
.mt-cart-badge.is-shown { display: flex !important; }

/* FAQ на главной: скрываем вертикальную палочку у плюсика когда блок открыт */
article.border-\[\#FFC914\] button svg path:nth-child(2),
article.faq-open button svg path:nth-child(2) { display: none; }

/* Попап контактов от иконки телефона */
.mt-contact-popup {
  position: absolute;
  background: #fff;
  border: 1px solid #efefef;
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .15);
  padding: 18px 22px;
  min-width: 240px;
  font-family: 'Montserrat', 'Segoe UI', sans-serif;
  z-index: 9999;
}
.mt-contact-popup__title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: #888;
  margin-bottom: 8px;
  font-weight: 700;
}
.mt-contact-popup a {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
  color: #000;
  text-decoration: none;
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
}
.mt-contact-popup a:last-child { border: 0; }
.mt-contact-popup a:hover { color: #ffaa00; }
.mt-contact-popup svg { width: 18px; height: 18px; flex-shrink: 0; color: #FFC914; }

/* ============ DROPDOWN ============ */
.mt-dropdown {
  position: absolute;
  /* Прижато к кнопке вплотную, без зазора (чтобы мышь могла перейти не теряя hover) */
  top: 100%;
  left: 0;
  min-width: 220px;
  background: #fff;
  border: 1px solid #efefef;
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
  padding: 8px;
  display: none;
  z-index: 200;
  /* Невидимый "мостик" сверху чтобы курсор не терял hover при движении к меню */
  margin-top: 0;
}
.mt-dropdown::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 12px;
  background: transparent;
}
.mt-dropdown.is-open { display: block; }
/* Открытие по hover на родителе кнопки-триггера (наша единая шапка) */
.mt-header__menu > div { position: relative; padding-bottom: 0; }
.mt-header__menu > div:hover > .mt-dropdown,
.mt-header__menu > div:focus-within > .mt-dropdown { display: block; }
.mt-header__menu > div:hover > [data-mt-dropdown],
.mt-header__menu > div:focus-within > [data-mt-dropdown] {
  background: rgba(0, 0, 0, .05);
}
/* Открытие по hover в шапке главной (header-menu-px от Next.js) */
.header-menu-px > div { position: relative; padding-bottom: 0; }
.header-menu-px > div:hover > .mt-dropdown,
.header-menu-px > div:focus-within > .mt-dropdown { display: block; }
.header-menu-px .mt-dropdown {
  top: 100%;
  left: 0;
}
.mt-dropdown__item {
  display: block;
  padding: 10px 14px;
  color: #000;
  text-decoration: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  transition: background .15s;
}
.mt-dropdown__item:hover { background: rgba(0, 0, 0, .05); }

/* ============ FOOTER ============ */
.mt-footer {
  font-family: 'Proxima Nova', 'Nunito Sans', 'Segoe UI', sans-serif;
}
.mt-footer__cta {
  background: #000;
  color: #fff;
  text-align: center;
  padding: 60px 24px 56px;
}
.mt-footer__cta-inner { max-width: 720px; margin: 0 auto; }
.mt-footer__cta h2 {
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 700;
  margin: 0 0 12px;
  letter-spacing: -.3px;
  line-height: 1.25;
}
.mt-footer__cta p {
  color: #ffc914;
  font-size: 14px;
  font-weight: 500;
  margin: 0 0 32px;
}
.mt-footer__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #ffc914;
  color: #000;
  border: 0;
  padding: 14px 56px 14px 28px;
  font-size: 15px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
  margin-bottom: 36px;
}
.mt-footer__cta-contacts {
  display: flex;
  gap: 36px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 8px;
}
.mt-footer__cta-c {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #ffc914;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}

.mt-footer__main {
  background: #ffc914;
  color: #000;
  padding: 60px 24px 40px;
}
.mt-footer__main-inner {
  max-width: 1160px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 56px;
}
@media (max-width: 900px) {
  .mt-footer__main-inner { grid-template-columns: 1fr 1fr; gap: 40px; }
}
@media (max-width: 600px) {
  /* На мобиле: первая колонка (лого+описание) на всю ширину, две следующие колонки (Контакты, Ссылки) рядом — экономим высоту */
  .mt-footer__main-inner,
  .footer-link-px {
    grid-template-columns: 1.05fr 1fr !important;
    gap: 28px 0 !important;
    text-align: left !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .mt-footer__main-inner > *:first-child,
  .footer-link-px > *:first-child {
    grid-column: 1 / -1 !important;
    text-align: left !important;
  }
  /* Ссылки колонку — чуть отодвигаем вправо для воздуха */
  .footer-link-px > *:nth-child(3) {
    padding-left: 24px !important;
  }

  /* Нижний блок (© + Политика конф./Согл./Обработки) — мелкий шрифт как везде */
  .footer-fine-px,
  .footer-fine-px a,
  .footer-fine-px p {
    font-size: 13px !important;
    line-height: 18px !important;
  }
}
.mt-footer__logo { width: 60px; height: 60px; display: block; margin-bottom: 18px; }
.mt-footer__desc {
  font-size: 14px;
  line-height: 1.6;
  max-width: 380px;
  margin: 0 0 22px;
}
.mt-footer__socials {
  display: flex;
  gap: 10px;
}
.mt-footer__social {
  width: 36px;
  height: 36px;
  background: #000;
  color: #ffc914;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: opacity .15s;
}
.mt-footer__social:hover { opacity: .8; }

.mt-footer__col h4 {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 18px;
  color: #000;
}
.mt-footer__col p { font-size: 14px; margin: 0 0 10px; line-height: 1.5; color: #000; }
.mt-footer__col ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mt-footer__col a {
  color: #000;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: opacity .15s;
}
.mt-footer__col a:hover { opacity: .7; }

.mt-footer__bottom {
  background: #ffc914;
  border-top: 1px solid rgba(0, 0, 0, .12);
  padding: 18px 24px;
}
.mt-footer__bottom-inner {
  max-width: 1160px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 13px;
  color: #000;
}
.mt-footer__bottom-legal {
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.mt-footer__bottom-legal a {
  color: #000;
  text-decoration: none;
  font-size: 13px;
}
.mt-footer__bottom-legal a:hover { text-decoration: underline; }

/* Скрываем только дубликаты от нашей старой версии шапки/подвала.
   Не трогаем .header-shell-px — это шапка главной страницы (Next.js). */
.u-nav, .u-footer__main, .u-footer__bottom,
.footer-bot, .footer-main { display: none !important; }

/* ============================================================
   МОБИЛЬНЫЕ СТИЛИ (max-width: 768px)
   ============================================================ */

/* Гамбургер-меню — кнопка в шапке */
.mt-burger {
  display: none;
  width: 40px;
  height: 40px;
  border: 1px solid #e4e4e4;
  border-radius: 8px;
  background: #fff;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.mt-burger svg { width: 22px; height: 22px; }
@media (max-width: 767px) {
  .mt-burger { display: inline-flex; }
  /* Существующий бургер Next.js — форсируем видимость, добавляем рамку */
  button[aria-label="Open menu"][data-mt-menu-open] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid #c7c9cc !important;
    border-radius: 6px;
    background: #fff !important;
    margin-left: 6px;
  }
}
/* Прячем Next.js бургер на десктопе (md+) — там полное меню */
@media (min-width: 768px) {
  button[aria-label="Open menu"][data-mt-menu-open] { display: none !important; }
}

/* Мобильное выезжающее меню */
.mt-mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  z-index: 9999;
  transform: translateX(-100%);
  transition: transform .25s ease-out;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.mt-mobile-menu.is-open { transform: translateX(0); }
.mt-mobile-menu__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid #efefef;
}
.mt-mobile-menu__top img { height: 32px; }
.mt-mobile-menu__close {
  width: 40px;
  height: 40px;
  border: 1px solid #e4e4e4;
  border-radius: 8px;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.mt-mobile-menu__list {
  list-style: none;
  padding: 12px 20px;
  margin: 0;
}
.mt-mobile-menu__list li { border-bottom: 1px solid #f4f4f4; }
.mt-mobile-menu__list li:last-child { border-bottom: 0; }
.mt-mobile-menu__list a,
.mt-mobile-menu__list button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 16px 4px;
  font-size: 16px;
  font-weight: 600;
  color: #000;
  text-decoration: none;
  background: transparent;
  border: 0;
  font-family: inherit;
  cursor: pointer;
}
.mt-mobile-menu__sublist {
  display: none;
  list-style: none;
  padding: 0 0 8px 16px;
  margin: 0;
}
.mt-mobile-menu__sublist.is-open { display: block; }
.mt-mobile-menu__sublist a {
  padding: 12px 4px;
  font-size: 15px;
  font-weight: 500;
  color: #555;
}
.mt-mobile-menu__sublist li { border-bottom: 1px solid #fafafa; }
.mt-mobile-menu__caret { float: right; transition: transform .2s; }
.mt-mobile-menu__cart-link { display: flex !important; justify-content: space-between; align-items: center; padding-right: 8px; }
.mt-mobile-menu__cart-wrap { position: relative; display: inline-flex; align-items: center; margin-left: 12px; flex-shrink: 0; }
.mt-mobile-menu__cart-icon { color: #111; display: block; }
.mt-mobile-menu__cart-badge { position: absolute; top: -6px; right: -8px; min-width: 20px; height: 20px; padding: 0 6px; background: #e11d1d; color: #fff; border-radius: 10px; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center; box-sizing: border-box; display: none; }
.mt-mobile-menu__list button[aria-expanded="true"] .mt-mobile-menu__caret { transform: rotate(180deg); }
.mt-mobile-menu__lang {
  padding: 20px 20px 12px;
  border-top: 1px solid #f4f4f4;
}
.mt-mobile-menu__lang-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: #666;
  letter-spacing: 0.5px;
  margin-bottom: 10px;
}
.mt-mobile-menu__lang-btns {
  display: flex;
  gap: 8px;
}
.mt-mobile-menu__lang-btns a {
  flex: 1;
  padding: 10px 0;
  text-align: center;
  border: 1.5px solid #d0d0d0;
  border-radius: 8px;
  color: #333;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  background: #fff;
  transition: all 0.15s;
}
.mt-mobile-menu__lang-btns a.is-active {
  background: #ffc914;
  border-color: #000;
  color: #000;
}
.mt-mobile-menu__contacts {
  margin-top: auto;
  padding: 24px 20px 32px;
  background: #ffc914;
}
.mt-mobile-menu__contacts a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  color: #000;
  font-weight: 600;
  text-decoration: none;
  font-size: 15px;
}
body.mt-menu-open { overflow: hidden; }

/* Шапка под мобилу */
@media (max-width: 767px) {
  .mt-header { height: 56px; }
  .mt-header__inner {
    width: 100%;
    padding: 0 12px;
    gap: 8px;
  }
  .mt-header__logo img {
    height: 28px;
    width: auto;
    max-width: 150px;
  }
  .mt-header__right { gap: 6px; }
  .mt-header__icon-btn { width: 36px; height: 36px; }
  .mt-header__icon-btn svg { width: 16px; height: 16px; }
  .mt-header__lang { display: none; }   /* RU-кнопка отъедает место */
}
@media (max-width: 480px) {
  .mt-header__inner { padding: 0 10px; }
  .mt-header__logo img { max-width: 130px; }
}

/* Уменьшение огромных шрифтов на мобиле */
@media (max-width: 767px) {
  [class*="text-[129"] { font-size: 36px !important; line-height: 1.05 !important; }
  [class*="text-[120"], [class*="text-[110"], [class*="text-[100"],
  [class*="text-[90"], [class*="text-[80"] { font-size: 32px !important; line-height: 1.1 !important; }
  [class*="text-[70px]"]  { font-size: 28px !important; line-height: 1.1 !important; }
  [class*="text-[60px]"]  { font-size: 26px !important; line-height: 1.1 !important; }
  [class*="text-[50px]"]  { font-size: 24px !important; }
  [class*="text-[48px]"]  { font-size: 24px !important; }
  [class*="text-[46px]"]  { font-size: 22px !important; }
  [class*="text-[42px]"]  { font-size: 22px !important; }
  [class*="text-[40px]"]  { font-size: 22px !important; }
  [class*="text-[38px]"]  { font-size: 20px !important; }
  [class*="text-[36px]"]  { font-size: 20px !important; }
  [class*="text-[34px]"]  { font-size: 19px !important; }
  [class*="text-[32px]"]  { font-size: 19px !important; }
  [class*="text-[30px]"]  { font-size: 18px !important; }
  [class*="text-[28px]"]  { font-size: 17px !important; }
  [class*="text-[26px]"]  { font-size: 17px !important; }
  .hero-title-px { font-size: 30px !important; line-height: 1.1 !important; }
  .section-advantages-title-px { font-size: 20px !important; }
}

/* Footer CTA — выравнивание */
@media (max-width: 600px) {
  .mt-footer__cta { padding: 40px 20px 36px; }
  .mt-footer__cta h2 { font-size: 22px !important; }
  .mt-footer__cta p { font-size: 13px; margin-bottom: 24px; }
  .mt-footer__cta-btn { padding: 12px 48px 12px 22px; font-size: 14px; margin-bottom: 28px; }
  .mt-footer__cta-contacts { gap: 14px; flex-direction: column; align-items: center; }
  .mt-footer__main { padding: 40px 20px 30px; }
  .mt-footer__bottom { padding: 14px 20px; }
  .mt-footer__bottom-inner { font-size: 12px; gap: 10px; flex-direction: column; text-align: center; }
  .mt-footer__bottom-legal { gap: 14px; justify-content: center; font-size: 12px; }
}

/* Каталог — товары: убеждаемся что не вылезают за экран */
@media (max-width: 767px) {
  .container { padding: 0 16px !important; }
  body { font-size: 15px; }
  img { max-width: 100%; height: auto; }
}

/* Большие inline-фото товаров на мобиле скейлятся */
@media (max-width: 600px) {
  table { font-size: 13px; }
  table img { max-width: 60px !important; height: auto !important; }
}

/* Блоки преимуществ STANDARD / PRO в карточке товара на мобиле:
   на десктопе flex row (лого слева, текст справа) — текст съедается на узком экране.
   На мобиле — column: лого сверху, текст под ним. */
@media (max-width: 767px) {
  .std-inner, .pro-inner {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 24px !important;
    padding: 36px 20px !important;
  }
  .std-badge {
    width: auto !important;
    max-width: 200px !important;
    height: 48px !important;
  }
  .pro-badge {
    width: 64px !important;
    height: 64px !important;
  }
  .std-title, .pro-title {
    font-size: 19px !important;
    margin-bottom: 14px !important;
  }
  /* списки преимуществ — нормальный отступ и без выреза справа */
  .std-section ol, .pro-section ol,
  .std-section ul, .pro-section ul {
    padding-left: 0 !important;
    margin: 0 !important;
  }
  .std-section li, .pro-section li {
    font-size: 14px !important;
    line-height: 1.45 !important;
    padding: 12px 14px !important;
  }
  /* Главный заголовок секции "Базовые преимущества" — поменьше и без обреза */
  .std-section h2, .pro-section h2 {
    font-size: 22px !important;
    line-height: 1.2 !important;
    margin-bottom: 16px !important;
  }
}

/* ТОП-3 оборудования: стрелки переносим на боковые стороны картинки на мобиле */
@media (max-width: 1023px) {
  /* 1) Прячем верхние стрелки */
  .mb-\[23px\].flex.items-start.justify-between.lg\:hidden > .flex.items-center.gap-\[15px\] {
    display: none !important;
  }
  /* 2) Включаем боковые (которые были lg:flex) — теперь видны и на мобиле */
  button[aria-label="Предыдущая карточка"].absolute,
  button[aria-label="Следующая карточка"].absolute {
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
    background: #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.18) !important;
    z-index: 20 !important;
  }
  button[aria-label="Предыдущая карточка"].absolute {
    left: 4px !important;
  }
  button[aria-label="Следующая карточка"].absolute {
    right: 4px !important;
  }
  /* svg тёмно-серый видный */
  button[aria-label="Предыдущая карточка"].absolute svg,
  button[aria-label="Следующая карточка"].absolute svg {
    width: 18px;
    height: 18px;
  }
}

/* Скрываем скидки/старые цены на всех страницах (приняли решение убрать скидки) */
.price-old,
.price-discount-row,
.price-badge,
.sim-old,
.card-old-price,
[style*="line-through"] {
  display: none !important;
}

/* Каталог: горизонтальный скролл табов категорий на мобиле */
@media (max-width: 767px) {
  .cat-tabs, [class*="category-tab"], .tabs-bar {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    white-space: nowrap;
    flex-wrap: nowrap !important;
  }
  .cat-tabs > *, [class*="category-tab"] > * { flex-shrink: 0; }
}

/* Превентим overflow страницы по горизонтали (типичная мобильная беда).
   ВАЖНО: overflow-x:hidden на html ломает position:sticky у потомков (баг Chrome) —
   поэтому используем только на body, и через clip там где поддерживается. */
body { overflow-x: clip; }
@supports not (overflow-x: clip) {
  body { overflow-x: hidden; }
}
img, video { max-width: 100%; }
@media (max-width: 767px) {
  * { max-width: 100vw; }
  .mt-mobile-menu, .mt-mobile-menu * { max-width: none; }
}

/* ============================================================
   КАТАЛОГ — мобильные фиксы
   ============================================================ */
@media (max-width: 767px) {
  /* "Стандарт vs PRO" hero — стэкаем вертикально */
  .rob-hero,
  .rob-hero-b {
    flex-direction: column !important;
    min-height: auto !important;
  }
  .rob-hero-b-left { padding: 16px 14px !important; gap: 8px !important; }
  .rob-hero-headline { font-size: 12px !important; line-height: 1.35 !important; }
  .rob-hero-cols,
  .rob-hero-cols-row {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
    gap: 0 !important;
  }
  .rob-hero-col,
  .rob-col-std,
  .rob-col-pro {
    border-right: 0 !important;
    border-bottom: 1px solid #ebebea !important;
    padding: 12px 0 !important;
    width: 100% !important;
  }
  .rob-col-std:last-child,
  .rob-col-pro:last-child,
  .rob-hero-col:last-child { border-bottom: 0 !important; }
  .rob-col-inner { gap: 8px !important; }
  .rob-col-logo { height: 32px !important; }
  .rob-col-desc { font-size: 11px !important; line-height: 1.45 !important; }
  .rob-hero-img-wrap,
  .rob-col-rob {
    width: 100% !important;
    padding: 12px 0 !important;
  }
  .rob-img,
  .rob-hero-img { height: 140px !important; max-width: 100% !important; }

  /* Сетка карточек товара — 1 в ряд (крупно) */
  .cards { grid-template-columns: 1fr !important; gap: 14px !important; }

  /* Карточка — горизонтальная компоновка: фото слева, инфо справа */
  .card {
    aspect-ratio: auto !important;
    flex-direction: row !important;
    min-height: 140px !important;
    align-items: stretch !important;
  }
  .card-img-wrap {
    width: 45% !important;
    max-width: 160px !important;
    padding: 14px !important;
    flex-shrink: 0 !important;
  }
  .card-img-wrap img.card-img {
    max-height: 130px !important;
    width: auto !important;
    margin: auto !important;
  }
  .card-divider { display: none !important; }
  .card-body {
    padding: 14px 14px 14px 0 !important;
    justify-content: center !important;
    flex: 1 !important;
    min-width: 0 !important;
  }
  .card-price { font-size: 17px !important; }
  .card-name, .card-subname {
    white-space: normal !important;
    -webkit-line-clamp: unset !important;
  }

  /* Бейджи поменьше чтобы не съедали площадь */
  .badge-std-img { height: 28px !important; }
  .badge-pro-img { height: 38px !important; }
  .badge-wrap { top: 8px !important; left: 8px !important; }

  /* Tabs скроллируются */
  .cat-tabs {
    padding-left: 14px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap !important;
  }
  .tab {
    flex-shrink: 0 !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
  }
  .cat-section { margin-bottom: 24px !important; }
  .cat-section-name { font-size: 16px !important; }

  /* Подвал каталога — в одну колонку */
  .footer-dark-inner,
  .footer-main-inner,
  .footer-main-i {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    width: 100% !important;
    padding: 0 16px !important;
  }
  .footer-yellow-inner {
    width: 100% !important;
    padding: 0 16px !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
}

/* Совсем маленькие экраны — карточки уже 1 в ряд (выше), просто уменьшаем фото */
@media (max-width: 380px) {
  .card-img-wrap { width: 40% !important; max-width: 130px !important; padding: 10px !important; }
  .card-img-wrap img.card-img { max-height: 110px !important; }
  .card { min-height: 120px !important; }
}

/* ============================================================
   КАРТОЧКА ТОВАРА (mit-*.html) — мобильные фиксы
   ============================================================ */
@media (max-width: 767px) {
  /* .hero обычно "фото слева, инфо справа" — стэкаем */
  .hero {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 16px !important;
  }
  /* Название большое — уменьшим */
  .p-name { font-size: 22px !important; line-height: 1.2 !important; word-wrap: break-word; }
  /* Цена — пусть переноситься */
  .price-row, .p-price-row, .price-block { flex-wrap: wrap !important; gap: 8px !important; }
  /* Trust-row иконок: 4→2 столбца */
  .trust-row { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  /* Сетки наборов, сертификатов */
  .kit-grid, .cert-grid, .acc-grid, .media-grid, .sim-grid, .usage-grid, .rob-points {
    grid-template-columns: 1fr 1fr !important; gap: 10px !important;
  }
  /* Стандарт/PRO описания на продукте */
  .std-points, .pro-points { grid-template-columns: 1fr !important; gap: 8px !important; }
  /* Подвал каталога/продукта в один столбец (на всякий) */
  .footer-main-inner, .footer-main-i, .u-footer__inner {
    grid-template-columns: 1fr !important; gap: 24px !important; padding: 0 16px !important;
  }
  /* Заголовки секций поменьше */
  .section-title, .h-section { font-size: 22px !important; line-height: 1.2 !important; }
  /* Tabs внизу страницы товара — горизонтальный скролл */
  .product-tabs, [class*="tabs-row"], [class*="-tabs"]:not(.cat-tabs) {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
  }
}

/* === CTA-form modal ====================================== */
/* ============================================================
   CTA-форма «Оставьте заявку» — стили модалки.
   Префикс классов: .mt-cta-*  (не конфликтует с остальным сайтом)
   Подключение: <link rel="stylesheet" href="cta-form.css">
   ============================================================ */

.mt-cta-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.mt-cta-overlay.is-open { display: flex; opacity: 1; }

.mt-cta-modal {
  position: relative;
  width: 100%;
  max-width: 520px;
  max-height: calc(100vh - 32px);
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transform: translateY(20px);
  transition: transform 0.25s ease;
}
.mt-cta-overlay.is-open .mt-cta-modal { transform: translateY(0); }

.mt-cta-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: #f3f3f3;
  color: #111;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  transition: background 0.15s;
}
.mt-cta-modal__close:hover { background: #ffc914; }

.mt-cta-modal__body {
  padding: 32px 32px 28px;
  overflow-y: auto;
}
.mt-cta-modal__title {
  font-size: 22px;
  font-weight: 700;
  color: #111;
  margin: 0 0 6px;
  padding-right: 32px;
}
.mt-cta-modal__subtitle {
  font-size: 14px;
  color: #666;
  margin: 0 0 22px;
}

.mt-cta-form { display: flex; flex-direction: column; gap: 14px; }
.mt-cta-field { display: flex; flex-direction: column; gap: 6px; }
.mt-cta-field__label {
  font-size: 13px;
  font-weight: 500;
  color: #333;
}
.mt-cta-field__label .req { color: #e53935; margin-left: 2px; }

.mt-cta-field input,
.mt-cta-field select,
.mt-cta-field textarea {
  width: 100%;
  padding: 11px 14px;
  font-size: 14px;
  font-family: inherit;
  color: #111;
  background: #fff;
  border: 1px solid #d7d7d7;
  border-radius: 10px;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.mt-cta-field textarea {
  resize: vertical;
  min-height: 80px;
}
.mt-cta-field select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1L6 6L11 1' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.mt-cta-field input:focus,
.mt-cta-field select:focus,
.mt-cta-field textarea:focus {
  border-color: #ffc914;
  box-shadow: 0 0 0 3px rgba(255, 201, 20, 0.25);
}
.mt-cta-field.is-invalid input,
.mt-cta-field.is-invalid select,
.mt-cta-field.is-invalid textarea {
  border-color: #e53935;
}
.mt-cta-field__err {
  font-size: 12px;
  color: #e53935;
  display: none;
}
.mt-cta-field.is-invalid .mt-cta-field__err { display: block; }

.mt-cta-note {
  font-size: 12px;
  color: #888;
  margin: 4px 0 0;
}
.mt-cta-note .req { color: #e53935; }

.mt-cta-submit {
  margin-top: 8px;
  width: 100%;
  padding: 14px 20px;
  font-size: 15px;
  font-weight: 700;
  color: #111;
  background: #ffc914;
  border: 0;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.15s, transform 0.05s;
}
.mt-cta-submit:hover { background: #ffd84d; }
.mt-cta-submit:active { transform: scale(0.98); }
.mt-cta-submit:disabled { opacity: 0.6; cursor: not-allowed; }

/* Экран благодарности (показывается после отправки) */
.mt-cta-thanks {
  display: none;
  padding: 28px 32px 36px;
  text-align: center;
}
.mt-cta-modal.is-success .mt-cta-modal__body { display: none; }
.mt-cta-modal.is-success .mt-cta-thanks { display: block; }
.mt-cta-thanks__img {
  display: block;
  max-width: 260px;
  width: 100%;
  height: auto;
  margin: 0 auto 12px;
}
.mt-cta-thanks__text {
  font-size: 18px;
  font-weight: 700;
  color: #111;
  margin: 0;
}

@media (max-width: 480px) {
  .mt-cta-modal__body { padding: 28px 20px 24px; }
  .mt-cta-modal__title { font-size: 20px; }
  .mt-cta-thanks { padding: 20px 20px 28px; }
  .mt-cta-thanks__img { max-width: 200px; }
}

body.mt-cta-open { overflow: hidden; }

/* === CTA press effect (живой клик) =================== */
.hero-cut-button,
.hero-button-px,
.btn-y,
.btn-cart,
.mt-cta-submit,
.btn-order,
[data-mt-cta-form] {
  transition: transform 0.12s cubic-bezier(.4,.0,.2,1), box-shadow 0.12s, filter 0.12s !important;
  will-change: transform;
}
.hero-cut-button:hover,
.hero-button-px:hover,
.btn-y:hover,
.btn-cart:hover,
.mt-cta-submit:hover,
.btn-order:hover {
  filter: brightness(1.05);
  box-shadow: 0 4px 12px rgba(255,201,20,0.35);
}
.hero-cut-button:active,
.hero-button-px:active,
.btn-y:active,
.btn-cart:active,
.mt-cta-submit:active,
.btn-order:active,
[data-mt-cta-form]:active {
  transform: translateY(2px) scale(0.97);
  box-shadow: 0 1px 3px rgba(0,0,0,0.15) !important;
  filter: brightness(0.95);
}
/* marker: mt-cta-press-effect */


/* ===== Scroll-to-top button (desktop only) ===== */
.mt-scroll-top {
  position: fixed;
  right: 16px;
  /* В самом углу; z-index 9999 (выше виджета Роба 9998) — клик всегда попадает в стрелку */
  bottom: 24px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #FFC914;
  color: #1a1a1a;
  border: none;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18), 0 0 0 1px rgba(0,0,0,0.05);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease, background .15s;
  /* Выше виджета Роба (z-index 9998), чтобы клик 100% попал в стрелку */
  z-index: 9999;
  padding: 0;
}
.mt-scroll-top:hover { background: #FBB13C; }
.mt-scroll-top:active { transform: translateY(0) scale(0.96); }
.mt-scroll-top.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.mt-scroll-top svg { width: 22px; height: 22px; stroke: #1a1a1a; stroke-width: 2.5; fill: none; }
@media (min-width: 768px) {
  .mt-scroll-top { display: flex; }
}

/* ===== Kit/Accessories empty state ===== */
.kit-empty, .acc-empty {
  grid-column: 1 / -1;
  padding: 48px 20px;
  text-align: center;
  color: #999;
  font-size: 14px;
  font-weight: 500;
  background: #fafafa;
  border: 1px dashed #e0e0e0;
  border-radius: 8px;
  line-height: 1.5;
}
.kit-empty::before, .acc-empty::before {
  content: '';
  display: block;
  width: 36px;
  height: 36px;
  margin: 0 auto 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bbb' stroke-width='1.5'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpolyline points='21 15 16 10 5 21'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.7;
}

/* Mobile fix for product card gallery overlap
   .gal has position:sticky on desktop; on mobile it overlaps .info block */
@media (max-width: 720px) {
  .hero .gal {
    position: static !important;
    top: auto !important;
  }
}