/**
 * WeMake: фоновое изображение для сайта
 * Файл: /images/background.webp (корень сайта)
 *
 * Раньше часть правил была только для главной (.front_page, .front, .wide_page).
 * Для всех страниц: фон на .wrapper1 + общие селекторы без классов главной.
 *
 * У body id="main", перед .wrapper1 в DOM есть #panel — используем потомка body#main .wrapper1
 */

/* #content в header.php = div.wraps#content. Сам #content чаще без фона; непрозрачность даёт
   Aspro: .wrapper_inner, .maxwidth-theme (template_styles.css) — background: var(--black_bg_black).
   Ниже — !important, чтобы перебить объединённый кеш/порядок CSS. */
#content.wraps,
#content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

body#main .wrapper1 #content .wrapper_inner,
body#main .wrapper1 #content .container_inner,
body#main .wrapper1 #content .middle,
body#main .wrapper1 #content .right_block:not(.error_page),
body#main .wrapper1 #content .left_block,
body#main .wrapper1 #content .section-content-wrapper,
body#main .wrapper1 #content .inner_wrapper,
body#main .wrapper1 #content .maxwidth-theme,
body#main .wrapper1 #content .maxwidth-theme > .inner-theme {
  background: transparent !important;
  background-color: transparent !important;
}

/* fill_bg_n: серые .grey_block (template_styles ~145) внутри контента */
body.fill_bg_n .wrapper1 #content .grey_block,
body.fill_bg_n .wrapper1 #content .grey_block .maxwidth-theme,
body#main .wrapper1 #content .content_wrapper_block {
  background: transparent !important;
  background-color: transparent !important;
}

/**
 * Каталог: плитки подкатегорий в .top-content-block
 * (.section-compact-list > .row > .col > .section-compact-list__item) — тот же приём, что
 * на главной для CATALOG_SECTIONS: полупрозрачный белый, по :hover — непрозрачный белый.
 * Длинный селектор из DevTools: … .top-content-block > div > … > div:nth-child(1) — это первая
 * плитка; стилизуем все .section-compact-list__item, чтобы в ряду вело себя одинаково.
 */
body#main .wrapper1 #content .top-content-block .section-compact-list__item.item {
  background-color: rgba(255, 255, 255, 0.7) !important;
  background: rgba(255, 255, 255, 0.7) !important;
  transition: background-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
body#main .wrapper1 #content .top-content-block .section-compact-list__item.item:hover {
  background-color: #fff !important;
  background: #fff !important;
}

/* Промежуток между плиткам: .row.margin0 в Aspro даёт col padding:0 и margin 0 0 -1px -1px
   (см. styles.css) — плитки слипаются. Галтер 12px + 12px ≈ 24px между карточками. */
body#main .wrapper1 #content .top-content-block .section-compact-list > .row.margin0 {
  margin-left: -12px !important;
  margin-right: -12px !important;
}
body#main .wrapper1 #content .top-content-block .section-compact-list > .row.margin0 > div[class*="col-"] {
  padding-left: 12px !important;
  padding-right: 12px !important;
  margin: 0 0 20px 0 !important;
}

/**
 * «Загрузить ещё» (#right_block_ajax) — макет: широкая кнопка, без скруглений, прозрачный фон,
 * тонкий бордер и текст в тёплом «медном» тоне; по наведению — заливка темой + белый текст.
 * Перебиваем .ajax_load_btn, .rounded3, .colored_theme_hover_bg и template_styles.
 */
#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  padding: 0 20px !important;
  margin: 0 0 30px !important;
  border: 1px solid #c4956a !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg .more_text_ajax {
  color: #c4956a !important;
  letter-spacing: 0.06em;
}

#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg:hover,
#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg:focus {
  border-color: #d2874a !important;
  background: #d2874a !important;
  background-color: #d2874a !important;
}

#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg:hover .more_text_ajax,
#right_block_ajax .inner_wrapper .ajax_load.cur.block .bottom_nav.animate-load-state .ajax_load_btn.rounded3.colored_theme_hover_bg:focus .more_text_ajax {
  color: #fff !important;
}

/* Корень /catalog/: bitrix:catalog.section.list (sections_1) — плитки разделов как в .top-content-block: полупрозрачные, при hover — белый фон, отступы между колонками; SHOW_ICONS — UF_CATALOG_ICON. */
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list.row.margin0 {
  margin-left: -12px !important;
  margin-right: -12px !important;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list.row.margin0 > [class*="item_block"] {
  padding-left: 12px !important;
  padding-right: 12px !important;
  margin-bottom: 20px;
  box-sizing: border-box;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .section_item.item {
  background: rgba(255, 255, 255, 0.7) !important;
  background-color: rgba(255, 255, 255, 0.7) !important;
  box-shadow: none !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  transition: background-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .section_item.item:hover {
  background: #fff !important;
  background-color: #fff !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
}
/* Центр плитки: иконка + название + счётчик (шаблон .lg) */
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .section_info,
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .image {
  text-align: center;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item li.name {
  text-align: center;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .image.with-icons img,
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .image.with-icons svg,
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .image.with-icons .svg {
  max-width: 72px;
  max-height: 72px;
  width: auto;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
body#main .main-catalog-wrapper .section-content-wrapper .catalog_section_list .item_block.lg .section_item .image .thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

body#main .wrapper1 {
  background-color: #f5f5f5;
  background-image: url("/images/background.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-attachment: scroll;
}

@media (min-width: 992px) {
  body#main .wrapper1 {
    background-attachment: fixed;
  }
}

@media (max-width: 991px) {
  body#main .wrapper1 {
    background-attachment: scroll;
    background-size: cover;
    background-position: center top;
  }
}

/**
 * Блок «вкладки каталога» на главной (и любая такая же вёрстка в #content).
 * Прямой потомок .drag-block и внутренний > div > div > div.
 */
#content .drag-block.container.grey.CATALOG_TAB.js-load-block > div,
#content .drag-block.container.grey.CATALOG_TAB.js-load-block > div > div > div {
  background: transparent;
  background-color: transparent;
  background-image: none;
}

/**
 * WeMake: стрелки прокрутки табов (arrow_scroll_init) в CATALOG_TAB — прозрачный фон.
 * В template_styles: .arrows_wrapper .arrow { background: white / var(--black_bg_black); }
 * и .wrapper1:not(.with_left_block) .drag-block.grey_block … — иначе белая подложка.
 */
body#main #content .drag-block.container.grey.CATALOG_TAB.grey_block .arrow_scroll_init .arrows_wrapper .arrow.arrow_left,
body#main #content .drag-block.container.grey.CATALOG_TAB.grey_block .arrow_scroll_init .arrows_wrapper .arrow.arrow_right,
body#main #content .drag-block.container.CATALOG_TAB.grey_block .arrow_scroll_init .arrows_wrapper .arrow.arrow_left,
body#main #content .drag-block.container.CATALOG_TAB.grey_block .arrow_scroll_init .arrows_wrapper .arrow.arrow_right {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none;
}

/**
 * Блок «Разделы каталога»: .drag-block и внутренний > div > div.
 */
#content .drag-block.container.CATALOG_SECTIONS.js-load-block,
#content .drag-block.container.CATALOG_SECTIONS.js-load-block > div > div {
  background: transparent;
  background-color: transparent;
  background-image: none;
}

/**
 * WeMake: карточки категорий в CATALOG_SECTIONS — белый 70% (alpha 0,7), по :hover — 100%. Родитель не трогаем.
 */
body#main #content .drag-block.container.CATALOG_SECTIONS .sections_wrapper .item.compact,
body#main
  #content
  .drag-block.container.CATALOG_SECTIONS
  .sections_wrapper
  .list
  .item:not(.section_item) {
  background-color: rgba(255, 255, 255, 0.7) !important;
  background: rgba(255, 255, 255, 0.7) !important;
}

body#main #content .drag-block.container.CATALOG_SECTIONS .sections_wrapper .item.compact:hover,
body#main
  #content
  .drag-block.container.CATALOG_SECTIONS
  .sections_wrapper
  .list
  .item:not(.section_item):hover {
  background: #fff !important;
}

/**
 * CATALOG_SECTIONS — мобилка: отступы; родитель .drag-block / > div > div; фон карточек — см. white 0,7 / hover выше.
 */
@media (max-width: 767px) {
  body#main #content .drag-block.container.CATALOG_SECTIONS.js-load-block,
  body#main #content .drag-block.container.CATALOG_SECTIONS.js-load-block > div > div {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  body#main #content .drag-block.container.CATALOG_SECTIONS .sections_wrapper .swiper-slide {
    box-sizing: border-box;
    padding-left: 6px;
    padding-right: 6px;
  }

  body#main #content .drag-block.container.CATALOG_SECTIONS .sections_wrapper .list .row:not(.margin0) > div {
    padding-left: 6px;
    padding-right: 6px;
    padding-bottom: 14px;
  }

  body#main #content .drag-block.container.CATALOG_SECTIONS .sections_wrapper .item.compact {
    border-radius: 8px;
    padding: 10px 8px 12px;
    box-sizing: border-box;
  }
}

/**
 * Два первых уровня div внутри .middle (все страницы с типовой вёрсткой Aspro).
 * На внутренних страницах первый уровень часто .container — учитывайте при отладке.
 */
#content .wrapper_inner .middle > div > div,
#content > div.middle > div > div {
  background: transparent;
  background-color: transparent;
  background-image: none;
}

/**
 * WeMake: CATALOG_TAB (главная) — одинаковая высота карточек в одном ряду (по самой высокой).
 * Причина: длина названия; цена и «В корзину» должны быть на одном уровне в строке.
 * Внутренний flex на inner_wrap и margin-top:auto на блоке цены выравнивает низ текстового блока.
 * :not(.owl-carousel) — не затрагиваем слайдер owl.
 */
body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items.row.flexbox:not(.owl-carousel) {
  align-items: stretch !important;
}

body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items.row.flexbox:not(.owl-carousel) .item-parent:not(.big) {
  display: flex !important;
  align-items: stretch;
}

body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .item-parent:not(.big) > .catalog_item_wrapp.catalog_item:not(.big) {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  box-sizing: border-box;
}

body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item_wrapp.catalog_item:not(.big) > .inner_wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  box-sizing: border-box;
}

body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .item_info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  box-sizing: border-box;
}

body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .item_info--bottom_block {
  margin-top: auto;
}

/**
 * WeMake: блок вкладок каталога (CATALOG_TAB) — две колонки, без горизонтального скролла.
 * Правки только в style.css шаблона wm_catalog_block_no_article не работали: при AJAX-загрузке
 * содержимого вкладок CSS компонента в документ не подключается. Здесь файл всегда в head (head_custom.php).
 * Перебиваем: media.css #main .mobile-overflow, #main .mobile-overflow > div, compact-catalog 172px.
 * Сетка: CSS Grid (а не flex + width:50%): иначе .col-xxs-12 { width:100% } (max-width:600px) даёт «одна карточка = вся строка».
 */
@media (max-width: 767px) {
  body#main #content .drag-block.container.CATALOG_TAB .js_wrapper_items,
  body#main #content .drag-block.container.CATALOG_TAB .js_wrapper_items.load-offer-js {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .top_wrapper,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .compact-catalog-slider {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items.swipeignore.mobile-overflow,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items.row.flexbox {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 8px;
    row-gap: 12px;
    grid-auto-flow: row;
    align-items: stretch;
    justify-content: stretch;
    justify-items: stretch;
    overflow: visible !important;
    -webkit-overflow-scrolling: auto !important;
    white-space: normal !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 0 20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Сильнее, чем .wrapper1.front_page .compact-catalog-slider … margin/width:172px (wm style.css). Класс front_page — на .wrapper1, не на body. */
  body#main .wrapper1.front_page #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .compact-catalog-slider .catalog_block.items {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* В ячейке грида — 100% ширины ячейки; перекрываем .col-xs-6 / .col-xxs-12 (иначе 100% от строки = одна колонка). */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items .item-parent,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items .item-parent.col-xxs-12,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items .item_block.col-xs-6 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: none !important;
  }

  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block.items .item-parent.big {
    grid-column: 1 / -1;
  }

  body#main .wrapper1.front_page #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .compact-catalog-slider .catalog_block.items .item-parent,
  body#main .wrapper1.front_page #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .compact-catalog-slider .catalog_block.items .item-parent:last-of-type {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Макет карточки (только CATALOG_TAB, моб.): крупнее фото, цена под названием, иконки в углу картинки. */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) > .inner_wrap {
    padding: 2px 2px 4px !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .ajax_load .top_wrapper .catalog_block .catalog_item > div,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .top_wrapper .catalog_block .catalog_item > div {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item .image_wrapper_block {
    position: relative;
    margin: 0 auto 4px !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .ajax_load.block .footer_button {
    margin-left: -2px !important;
    margin-right: -2px !important;
  }

  /*
   * Кнопка «В корзину»: в паре колонок сливалась с соседней из-за 100%-ширины.
   * Ид вида #bx_*_basket_actions динамические — только классы + область вкладки.
   */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_item:not(.big) .footer_button span.btn-exlg.to-cart {
    display: block !important;
    box-sizing: border-box !important;
    width: calc(100% - 14px) !important;
    max-width: calc(100% - 14px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Цена и название в колонку (перекрываем row из wm style.css / compact-catalog). */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .inner_wrap .item_info {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 2px 0 !important;
    padding-bottom: 4px !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .item_info--top_block {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .item_info--bottom_block {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: flex-start !important;
    text-align: left !important;
    align-self: stretch !important;
  }
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .catalog_block .catalog_item:not(.big) .item_info--bottom_block .cost.prices,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .ajax_load .catalog_block .catalog_item:not(.big) .cost.prices .price:not(.discount) {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  /* Избранное/сравнение: вверху справа на зоне фото (перекрываем .compact-catalog … bottom/left). */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .image_wrapper_block .like_icons,
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .ajax_load .like_icons {
    position: absolute !important;
    left: auto !important;
    right: 4px !important;
    top: 4px !important;
    bottom: auto !important;
    text-align: right !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    align-items: center;
    margin: 0 !important;
    z-index: 3;
  }

  /* «Загрузить ещё» дублируется: compact-slider выводит .bottom_nav.mobile_slider (иконка) + обычный .bottom_nav.
     Оставляем основную кнопку по центру, моб. вариант со стрелкой/иконкой скрываем (только CATALOG_TAB). */
  body#main #content .drag-block.container.CATALOG_TAB .wm_catalog_block_no_article_template .bottom_nav.mobile_slider {
    display: none !important;
  }
}

/**
 * WeMake: верхний баннер BIG_BANNER_INDEX (type_2, шаблон top_big_banners) —
 * hero (.col-md-9.slide) + 2 малых баннера в .col-md-3.child → .row.side-childs.normal.c_2.
 *
 * Мобилка: переводим `.row.dd` в горизонтальную ленту, «вытаскиваем» малые наружу
 * через display: contents, чтобы hero и оба малых стали одной свайпаемой линией.
 * Ширина слайда 88% — остаток даёт «peek» следующего слайда.
 */
@media (max-width: 767px) {
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    gap: 10px;
    /* pan-x: горизонтальная прокрутка ленты; pan-y: вертикальная страницы — не «ломаем» весь <a>-оверлей */
    touch-action: pan-x pan-y;
  }

  /* Inline overflow: hidden + .top_slider_wrapp { overflow:hidden } мешают нативному скроллу ленты (iOS) */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_one_banner.top_big_banners {
    overflow-x: visible !important;
    overflow-y: hidden !important;
  }

  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide .top_slider_wrapp {
    overflow-x: visible !important;
    overflow-y: hidden !important;
  }

  /* Полноэкранные ссылки Aspro (a.target, .opacity_block1) иначе перехватывают касания — скролл .row.dd не срабатывает */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd a.target,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd .item a.opacity_block1,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd .item a.outer_text,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide a[href] {
    touch-action: pan-x pan-y !important;
  }

  /* Swiper по умолчанию touch-action: none — разрешаем всплытие к скроллящемуся предку */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide .main-slider,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide .main-slider.swiper-initialized,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide .swiper-wrapper {
    touch-action: pan-x pan-y !important;
  }

  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd::before,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd::after {
    content: none !important;
  }

  /* hero-слайд: ширина и выравнивание как у малых */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide {
    float: none !important;
    clear: none !important;
    flex: 0 0 88% !important;
    max-width: none !important;
    width: 88% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
    scroll-snap-align: start;
  }

  /* Расчленяем обёртки, чтобы .item'ы стали прямыми детьми .row.dd */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-3.child,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-3.child > .row.side-childs {
    display: contents !important;
  }

  /* Каждый малый баннер — полноценный слайд */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-3.child .side-childs > .item {
    float: none !important;
    clear: none !important;
    flex: 0 0 88% !important;
    max-width: none !important;
    width: 88% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
    scroll-snap-align: start;
  }

  /* === Выравнивание высоты всех слайдов — единая пропорция 100:85 === */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-9.slide,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-3.child .side-childs > .item {
    aspect-ratio: 100 / 85 !important;
    height: auto !important;
    position: relative !important;
    overflow: hidden !important;
  }

  /* Малый: item_inner на всю высоту, без padding-top-трюка */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-3.child .side-childs > .item .item_inner {
    padding-top: 0 !important;
    height: 100% !important;
    position: absolute !important;
    inset: 0 !important;
  }

  /* Hero: растягиваем внутренние обёртки swiper-слайдера на всю высоту col-md-9 */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide > .top_slider_wrapp,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper.slider-solution,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-wrapper,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide > div,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide .wrapper_inner,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide table,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide tbody,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide tr {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  /* Hero: фон-изображение целиком внутри кадра */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .col-md-9.slide .swiper-slide .main_info {
    background-size: cover !important;
    background-position: center !important;
  }

  /* Пустая строка-заглушка под баннерами не нужна на мобильной */
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-12.items.clearfix:empty,
  body#main #content .drag-block.BIG_BANNER_INDEX .top_big_banners .row.dd > .col-md-12.items.clearfix > .row:empty {
    display: none !important;
  }

  /* ——— MIDDLE_ADV: float_banners (шаблон с тремя баннерами 1+2) ——— */
  body#main #content .drag-block.container.MIDDLE_ADV .item-views.float_banners .items .row,
  /* ——— FLOAT_BANNERS: float_banners2 ——— */
  body#main #content .drag-block.container.FLOAT_BANNERS .item-views.float_banners2 .items .row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    gap: 10px;
    touch-action: pan-x;
  }

  body#main #content .drag-block.container.MIDDLE_ADV .item-views.float_banners .items .row::before,
  body#main #content .drag-block.container.MIDDLE_ADV .item-views.float_banners .items .row::after,
  body#main #content .drag-block.container.FLOAT_BANNERS .item-views.float_banners2 .items .row::before,
  body#main #content .drag-block.container.FLOAT_BANNERS .item-views.float_banners2 .items .row::after {
    content: none !important;
  }

  body#main #content .drag-block.container.MIDDLE_ADV .item-views.float_banners .items .row > [class*="col-"],
  body#main #content .drag-block.container.FLOAT_BANNERS .item-views.float_banners2 .items .row > [class*="col-"] {
    float: none !important;
    clear: none !important;
    flex: 0 0 88% !important;
    max-width: none !important;
    width: 88% !important;
    min-width: 0 !important;
    box-sizing: border-box;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    scroll-snap-align: start;
  }
}

/**
 * WeMake: главная — блок «Наши сотрудники» (wemake_staff_index): прозрачный фон у .content_wrapper_block
 * (первый div внутри .drag-block; иначе тянется серая/белая подложка от темы).
 */
body#main #content .drag-block.container.grey.wemake_staff_index {
  border-top: none !important;
  box-shadow: none !important;
}

body#main #content .drag-block.container.grey.wemake_staff_index > .content_wrapper_block {
  background: transparent !important;
  background-color: transparent !important;
  border-top: none !important;
  box-shadow: none !important;
}

/* Второй div — .maxwidth-theme.pblock (тема задаёт #fff / var) */
body#main #content .drag-block.container.grey.wemake_staff_index > .content_wrapper_block > .maxwidth-theme {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  margin-top: 0 !important;
  border-top: none !important;
  box-shadow: none !important;
}

/**
 * WeMake: главная — блок «Наши товары» (CATALOG_TAB): убрать бордер у внутреннего > div > div
 */
body#main #content .drag-block.container.grey.CATALOG_TAB.grey_block.js-load-block > div > div,
body#main #content .drag-block.container.grey.CATALOG_TAB.grey_block > div > div {
  border: none !important;
  border-top: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/**
 * WeMake: футер — блок «ранее просмотренные» (viewed_product_block.no_fill).
 * 1) Не использовать #footer > — перед этим div в <footer> может быть вывод
 *    (напр. Aspro\Max\Notice::showOnAuth в under_footer), тогда селектор с «>» не матчит.
 * 2) .no_fill в styles.css: фон #fafafa / var(--darkerblack_bg_black);
 * 3) .wrapper_inner: в template_styles глобально #fff; плюс .viewed-wrapper — проверка фона.
 */
body#main #footer .viewed_product_block.no_fill,
html body #footer .viewed_product_block.no_fill,
footer#footer .viewed_product_block.no_fill {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

body#main #footer .viewed_product_block.no_fill > .wrapper_inner,
body#main #footer .viewed_product_block.no_fill .viewed-wrapper,
#footer .viewed_product_block.no_fill .viewed-wrapper,
#footer .viewed_product_block.no_fill > .wrapper_inner {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}