@charset "UTF-8";
/* ==========================================================================
   STYLE.SCSS — project styles
   --------------------------------------------------------------------------
   ========================================================================== */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Regular.woff2") format("woff2"), url("../fonts/Inter-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Medium.woff2") format("woff2"), url("../fonts/Inter-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Medium.woff2") format("woff2"), url("../fonts/Inter-Medium.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* Table of contents
   01. Base / Typography / Rhythm
   02. UI Controls
   03. Header
   04. Mobile menu
   05. Quick search
   06. Breadcrumbs
   07. Single product (hero, gallery, tabs)
   08. Desktop catalog mega menu
   09. Catalog sections
   10. ... (rest of file continues in existing order)
*/
/* ==========================================================================
   Base / Typography / Rhythm
   ========================================================================= */
* {
  box-sizing: border-box;
  outline: none;
}

html {
  scrollbar-gutter: stable;
}

html,
body {
  height: 100%;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

body {
  position: relative;
  overflow-x: hidden;
  margin: 0;
  color: var(--font-dark-color);
  font-optical-sizing: auto;
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
  font-weight: var(--base-Font-weight);
  min-width: 320px;
}

a {
  text-decoration: none;
  color: inherit;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

a:hover {
  text-decoration: none;
  color: var(--accent-color-01);
}

ul,
ol,
dl {
  margin: 0px;
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
}

button,
input,
textarea {
  font: inherit;
  color: inherit;
}

:root {
  --swiper-theme-color: #00303F;
  /* Typography */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  /* Layout */
  --container: 1720px;
  --big-Cat-btn--size: 240px;
  --pad-x: 50px;
  --pad-y: 70px;
  --pad-inner: 50px;
  --pad-gap: 30px;
  --pad-gap-line: 20px;
  --pad-gap-mini: 10px;
  --pad-box: 20px;
  --pad-btns: 30px;
  /* Colors */
  --font-light-color: #ffffff;
  --font-dark-color: #00303F;
  --main-light-color: #F7F8FD;
  --main-light-color-opcity: 247, 248, 253, 0.5;
  --White-color-opcity: 255, 255, 255, 0.5;
  --second-light-color: #D5DEF4;
  --main-dark-color: #00303F;
  --accent-color-01: #309971;
  --accent-color-02: #99303D;
  --gray-color: #8E8E8E;
  /* Radius */
  --border-color: #DCE4F3;
  --border-radius-form: 10px;
  --padding-form: 20px;
  --radius-full: 999px;
  --radius-internal: 10px;
  --radius-external: 20px;
  --radius-main: 30px;
  /* Images */
  --img-mini-width: 80px;
  --img-mini-height: 80px;
  --img-middle-width: 480px;
  --img-middle-height: 480px;
  --img-big-width: 1024px;
  --img-big-height: 1024px;
  /* Fonts */
  --base-Font-size: 18px;
  --base-Line-height: 24px;
  --base-Font-weight: 400;
  --large-Font-size: 20px;
  --large-Line-height: 26px;
  --Heading-Font-size: 24px;
  --Heading-Line-height: 30px;
  --large-Font-weight: 500;
  --mini-Font-size: 16px;
  --mini-Line-height: 22px;
  --Title-h1-Font-size: 60px;
  --Title-h1-Line-height: 60px;
  --Title-h2-Font-size: 40px;
  --Title-h2-Line-height: 46px;
  --Title-h3-Font-size: 30px;
  --Title-h3-Line-height: 36px;
  --header-posotopn-and-size: 140px;
  --popup-custom-Top-base: 140px;
  --popup-custom-Top-correct: 30px;
  --popup-custom-sticky-Top-correct: 10px;
}

@media (max-width: 1560px) {
  :root {
    --big-Cat-btn--size: 200px;
  }
}
@media (max-width: 1024px) {
  :root {
    --pad-x: 20px;
    --pad-y: 50px;
    --pad-inner: 20px;
    --pad-box: 10px;
    --Title-h1-Font-size: 40px;
    --Title-h1-Line-height: 46px;
  }
}
@media (max-width: 767px) {
  :root {
    /* Fonts */
    --base-Font-size: 18px;
    --base-Line-height: 24px;
    --large-Font-size: 18px;
    --large-Line-height: 24px;
    --Heading-Font-size: 20px;
    --Heading-Line-height: 26px;
    --Title-h1-Font-size: 34px;
    --Title-h1-Line-height: 40px;
    --Title-h2-Font-size: 30px;
    --Title-h2-Line-height: 36px;
    --Title-h3-Font-size: 20px;
    --Title-h3-Line-height: 26px;
  }
}
@media (max-width: 410px) {
  :root {
    /* Fonts */
    --base-Font-size: 16px;
    --base-Line-height: 22px;
    --large-Font-size: 16px;
    --large-Line-height: 22px;
    --Heading-Font-size: 20px;
    --Heading-Line-height: 26px;
    --Title-h1-Font-size: 30px;
    --Title-h1-Line-height: 36px;
    --Title-h2-Font-size: 20px;
    --Title-h2-Line-height: 26px;
    --Title-h3-Font-size: 18px;
    --Title-h3-Line-height: 24px;
  }
}
@media (max-width: 390px) {
  :root {
    /* Fonts */
    --Heading-Font-size: 18px;
    --Heading-Line-height: 24px;
    --Title-h1-Font-size: 26px;
    --Title-h1-Line-height: 32px;
    --Title-h2-Font-size: 22px;
    --Title-h2-Line-height: 28px;
  }
}
/* Контейнер как в твоём проекте */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--pad-x);
}

/* Заголовки и отступы как на странице “Каталог” (без цветов) */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
  font-weight: var(--large-Font-weight);
}

h1 {
  font-size: var(--Title-h1-Font-size);
  line-height: var(--Title-h1-Line-height);
}

h2 {
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
}

h3 {
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
}

h4,
h5,
h6 {
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
}

.home_h1 h1 {
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
  max-width: 790px;
}

.section-title__like-h1 {
  font-size: var(--Title-h1-Font-size);
  line-height: var(--Title-h1-Line-height);
  font-weight: var(--large-Font-weight);
}

.section-title__like-h2 {
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
  font-weight: var(--large-Font-weight);
}

.section-title__like-h3,
.zpm-seo__content h3 {
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
}

main section:nth-of-type(even),
section.backlight {
  background-color: var(--main-light-color);
}

section .section-title__like-h1 {
  margin-bottom: var(--pad-inner);
}

section .section-title__like-h2 {
  margin-bottom: var(--pad-gap);
}

section .section-title__like-h3,
section .zpm-seo__content h3,
.zpm-fb__title.section-title__like-h3 {
  margin-bottom: var(--pad-box);
}

p {
  margin: 0px;
}

main > section, main > .section, main > div {
  padding-top: var(--pad-y);
  padding-bottom: var(--pad-y);
}

main > div.home_h1 {
  padding-top: 0px;
  padding-bottom: 0px;
}

main > section.full-size-block,
main > .section.full-size-block,
main > div.full-size-block {
  padding-top: 0px;
  padding-bottom: 0px;
}

/* ================================
   OVERLAY (2 темы) + универсальные анимации попапов
================================ */
/* Оверлей: базовый */
.page_overlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}

/* Режим оверлея включён */
body.has-overlay .page_overlay {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  /* при показе visibility включаем сразу */
  transition: opacity 0.3s ease, visibility 0s linear 0s;
}

/* Тема оверлея: светлая */
body.overlay--light .page_overlay {
  background-color: rgba(247, 248, 253, 0.2);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

/* Тема оверлея: тёмная (подстроишь сам) */
body.overlay--dark .page_overlay {
  /* пример: */
  background-color: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.page_overlay {
  transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}

body.has-overlay .page_overlay {
  transition: opacity 0.3s ease, visibility 0s linear 0s;
}

/* Блокировка скролла без дёрганий (у тебя scrollbar-gutter: stable) */
body.is-scroll-locked {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

/* ================================
   POPUPS: универсальная анимация
   - Открытие: fade + translateY(100px -> 0)
   - Закрытие: fade + translateY(0 -> 100px)
================================ */
/* Каталог */
.zpm-catalog {
  opacity: 0;
  transform: translateY(100px);
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}

html.is-catalog-open .zpm-catalog {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

/* Мобайл панель поиска */
.zpm-header__m-search {
  opacity: 0;
  transform: translateY(100px);
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}

html.is-qsearch-mobile-open .zpm-header__m-search {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

/* ==========================================================
   FANCYBOX: отключаем компенсацию скроллбара (прыжок вбок)
   У тебя уже есть html { scrollbar-gutter: stable; }
   Поэтому Fancybox-компенсация не нужна.
========================================================== */
html.with-fancybox {
  --f-scrollbar-compensate: 0px;
  --f-body-margin: 0px;
}

html.with-fancybox body.hide-scrollbar {
  margin-right: 0 !important;
  width: auto !important;
}

.zpm-prod-patch .fancybox__viewport {
  border-radius: var(--radius-main);
  color: var(--font-dark-color);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: rgb(255, 255, 255);
  margin: var(--pad-x);
  padding: var(--pad-gap);
  box-sizing: border-box;
}

.zpm-prod-patch .fancybox__thumbs {
  padding: 0px;
}

.f-carousel__toolbar__column.is-right {
  border-radius: var(--radius-main);
  color: var(--font-light-color);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  margin: 0px;
  padding: var(--pad-gap-mini) var(--pad-gap-line);
  box-sizing: border-box;
  gap: var(--pad-gap-mini);
}

.f-carousel__toolbar__column.is-right > .f-button {
  background-color: transparent;
}

.f-panzoom__wrapper {
  border-radius: var(--radius-main);
  overflow: hidden;
}

.f-carousel__toolbar {
  padding: calc(var(--pad-x) + var(--pad-gap));
}

.is-horizontal.is-ltr .f-button.is-arrow.is-prev {
  left: calc(var(--pad-x) + var(--pad-gap));
}

.is-horizontal.is-ltr .f-button.is-arrow.is-next {
  right: calc(var(--pad-x) + var(--pad-gap));
}

.fancybox__container.has-thumbs .fancybox__slide {
  gap: 10%;
}

.f-caption {
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
  color: var(--font-dark-color);
  background: var(--second-light-color);
  padding: 10px 20px;
  border-radius: var(--radius-main);
}

/* Формы и поля ввода */
input[type=password],
input[type=text],
input[type=email],
input[type=tel] {
  line-height: 58px;
}

input[type=password],
input[type=text],
input[type=email],
input[type=tel],
textarea {
  padding: 0px var(--padding-form);
  margin: 0px;
  width: 100%;
  color: var(--font-dark-color);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius-form);
  background-color: rgb(255, 255, 255);
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.white input[type=password],
.white input[type=text],
.white input[type=email],
.white input[type=tel],
.white textarea {
  color: var(--font-light-color);
}

input[type=password]:hover,
input[type=text]:hover,
input[type=email]:hover,
input[type=tel]:hover,
textarea:hover {
  border-color: var(--gray-color);
}

input[type=password]:focus,
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
textarea:focus {
  border-color: var(--accent-color-01);
}

textarea {
  padding: 10px;
  resize: vertical;
  height: 105px;
  min-height: 105px;
  max-height: 400px;
  margin: 0px;
}

select,
opions {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

input[type=checkbox],
input[type=radio] {
  accent-color: var(--accent-color-01);
  height: 50px;
  width: 50px;
  min-width: 50px;
  cursor: pointer;
  margin: 0px;
}

button,
input[type=submit] {
  padding: 0px;
}

/* END. Формы и поля ввода */
/* ==========================================================================
   UI Controls
   ========================================================================= */
.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--pad-btns);
  background-color: transparent;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  cursor: pointer;
  font-weight: 400;
  line-height: 60px;
  height: 60px;
  white-space: nowrap;
  gap: var(--pad-gap-mini);
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.btn:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-seo--zm-inline-btn {
  display: block;
  margin-top: var(--pad-gap-line);
}

.zm-inline-btn {
  display: inline-block;
}

.zpm-icon {
  transition: color 0.3s ease, opacity 0.3s ease, fill 0.3s ease;
}

.zpm-header__catalog .btn:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}
.zpm-header__catalog .btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn > img {
  display: block;
  width: 28px;
}

.zpm-catalog__last-block .btn > img {
  width: 16px;
}

.btn-no-text {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  min-width: 60px;
  height: 60px;
}

.btn-no-text.active {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
}

.btn-no-text.active .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn-no-text:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
}
.btn-no-text:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn_dark {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn_white {
  border-color: var(--border-radius-form);
  background-color: var(--font-light-color);
  color: var(--font-dark-color);
  fill: var(--font-dark-color);
}

.btn_dark .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn_white .zpm-icon {
  color: var(--font-dark-color);
  fill: var(--font-dark-color);
}

.btn_dark:hover {
  border-color: var(--font-light-color);
  background-color: var(--font-light-color);
  color: var(--font-dark-color);
}
.btn_dark:hover .zpm-icon {
  color: var(--font-dark-color);
  fill: var(--font-dark-color);
}

.btn_white:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.btn_white:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

a:active,
.btn:active {
  opacity: 0.9;
}

/* ==========================================================================
   ИКОНКИ
   ========================================================================= */
.zpm-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--main-dark-color);
  transition: color 0.3s ease;
}

.zpm-icons-test__item:hover .zpm-icon,
.zpm-icons-test__item:focus-visible .zpm-icon {
  color: #ff0000;
}

.zpm-icon--sm {
  width: 16px;
  height: 16px;
}

.zpm-icon--md {
  width: 40px;
  height: 40px;
}

.zpm-icon--lg {
  width: 60px;
  height: 60px;
}

.zpm-social__link {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--font-light-color);
  border-radius: var(--radius-full);
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.zpm-social__link:hover {
  background-color: var(--main-light-color);
}

.zpm-footer__social .zpm-icon {
  width: 40px;
  height: 40px;
}

.zpm-footer__social .zpm-social__link--telegram {
  padding-right: calc(var(--pad-gap-line) + 2px);
  padding-left: calc(var(--pad-gap-line) - 2px);
}

.zpm-social__link--telegram:hover .zpm-icon,
.zpm-social__link--telegram:focus-visible .zpm-icon {
  color: #229ED9;
}

.zpm-social__link--whatsapp:hover .zpm-icon,
.zpm-social__link--whatsapp:focus-visible .zpm-icon {
  color: #25D366;
}

.zpm-social__link--max {
  --zpm-max-bg: #043D4F;
  --zpm-max-fg: #ffffff;
}

.zpm-social__link--max:hover,
.zpm-social__link--max:focus-visible {
  --zpm-max-bg: rgb(0, 132, 255);
  --zpm-max-fg: #ffffff;
}

.zpm-icons-test {
  position: relative;
}

.zpm-icons-test__title {
  margin: 0 0 16px;
}

.zpm-icons-test__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--pad-gap-line);
}
@media (max-width: 1024px) {
  .zpm-icons-test__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 580px) {
  .zpm-icons-test__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.zpm-icons-test__item {
  display: grid;
  justify-items: center;
  gap: var(--pad-gap);
  padding: var(--pad-inner);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  align-items: center;
  border-radius: var(--radius-main);
}

.zpm-icons-test__name {
  text-align: center;
  word-break: break-word;
}

.zpm-help_ico {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  border-color: var(--accent-color-02);
  border-radius: var(--radius-main);
  width: 40px;
  height: 40px;
  color: var(--accent-color-02);
  min-width: 40px;
  font-size: 18px;
  line-height: 18px;
}

/* =========================================
   Copy article
========================================= */
.zpm-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  cursor: pointer;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}

.zpm-copy__value {
  display: inline-block;
}

.zpm-copy:hover .zpm-copy__value {
  opacity: 0.72;
}

.zpm-copy:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

.zpm-copy__value {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-light-color);
  cursor: pointer;
  white-space: nowrap;
  padding: 2px 8px;
}

.zpm-copy__value:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.is-tip .zpm-copy__value {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.p-card .zpm-tip__body {
  font-size: 14px;
}

.hero {
  position: relative;
  overflow: hidden;
  color: var(--main-dark-color);
  background-color: var(--main-light-color);
  --hero-bg-shift: 0px;
  --hero-bg-blur: 0px;
  min-height: 70vh;
}

.hero--home .swiper-wrapper {
  align-items: center;
}

.hero__bg-slider,
.hero__bg-slider .swiper-wrapper,
.hero__bg-slider .swiper-slide {
  position: absolute;
  inset: 0;
  height: 100%;
}

.hero__bg-slider {
  z-index: 0;
  pointer-events: none;
}

.hero__bg-slider .swiper-wrapper {
  display: block;
}

.hero__bg-slider .swiper-slide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  overflow: hidden;
}

.hero__bg-slider .swiper-slide.is-current,
.hero__bg-slider .swiper-slide.is-leaving {
  visibility: visible;
}

.hero__bg-slider .swiper-slide.is-current {
  opacity: 1;
  z-index: 2;
}

.hero__bg-slider .swiper-slide.is-leaving {
  opacity: 1;
  z-index: 1;
}

.hero__bg-media {
  width: 100%;
  height: calc(100% + 200px);
  margin-top: -100px;
  transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  filter: blur(var(--hero-bg-blur));
  will-change: transform, filter, opacity;
  backface-visibility: hidden;
}

.hero__bg-media img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: none;
  object-fit: none;
  -o-object-position: 40%;
  object-position: 40%;
}

.hero.is-dir-next .hero__bg-slider .swiper-slide.is-current .hero__bg-media {
  animation: heroBgInNext 0.3s ease forwards;
}

.hero.is-dir-next .hero__bg-slider .swiper-slide.is-leaving .hero__bg-media {
  animation: heroBgOutNext 0.3s ease forwards;
}

.hero.is-dir-prev .hero__bg-slider .swiper-slide.is-current .hero__bg-media {
  animation: heroBgInPrev 0.3s ease forwards;
}

.hero.is-dir-prev .hero__bg-slider .swiper-slide.is-leaving .hero__bg-media {
  animation: heroBgOutPrev 0.3s ease forwards;
}

.hero__content {
  position: relative;
  z-index: 2;
  padding-top: calc(var(--pad-y) + 140px);
  padding-bottom: calc(var(--pad-y) + 20px);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-height: 60vh;
}

.hero__content > .container {
  position: relative;
  width: 100%;
}

.hero__content-slider,
.hero__content-slider .swiper-wrapper,
.hero__content-slider .swiper-slide {
  height: 100%;
}

.hero-slide {
  display: grid;
  grid-template-columns: minmax(320px, 530px) minmax(240px, 1fr);
  align-items: center;
  gap: var(--pad-gap);
}

.hero-slide__info-wrap {
  width: 100%;
}

.hero-slide__info-wrap {
  display: flex;
  flex-flow: column;
  gap: var(--pad-y);
}

.hero-slide__info-wrap--top {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.hero-slide__description {
  display: block;
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
}

.hero-slide__btns {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap);
}

.hero-slide__btns > a,
.hero-slide__btns > span {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
  align-items: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.hero-slide__btns > a:hover,
.hero-slide__btns > span:hover {
  color: var(--accent-color-01);
}

.hero-slide__btns > a:hover .btn--primary.btn,
.hero-slide__btns > span:hover .btn--primary.btn {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.hero-slide__decor-wrap {
  width: 100%;
  height: 100%;
}

main > div.hero-one-wrap, main > div.hero-wrap {
  padding-top: 0px;
  padding-bottom: var(--pad-y);
  margin-top: -140px;
  z-index: 2;
}

@media (max-width: 1024px) {
  main > div.hero-one-wrap, main > div.hero-wrap {
    margin-top: -90px;
  }
  .hero__content {
    padding-top: calc(var(--pad-y) + 70px);
    padding-bottom: calc(var(--pad-y) + 30px + var(--pad-y));
  }
}
.hero-one__nav-wrapper .container,
.hero__nav-wrapper .container {
  position: relative;
}

.hero__navigation {
  position: absolute;
  right: var(--pad-x);
  bottom: 0;
  z-index: 3;
}

.hero__catalog-btn {
  width: var(--big-Cat-btn--size);
  height: var(--big-Cat-btn--size);
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: calc(0px - var(--big-Cat-btn--size) / 2);
  right: calc(var(--pad-y) + 200px);
  z-index: 1;
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.hero__catalog-btn > span {
  width: var(--big-Cat-btn--size);
  height: var(--big-Cat-btn--size);
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  text-align: center;
  text-decoration: none;
  font-size: 28px;
  color: #fff;
  background-color: var(--main-dark-color);
  position: relative;
  z-index: 20;
  transition: font-size 0.3s ease;
}

.hero__catalog-btn:hover > span {
  background-color: var(--accent-color-01);
  font-size: 30px;
}

.hero__catalog-btn > div {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(40px + var(--big-Cat-btn--size));
  height: calc(40px + var(--big-Cat-btn--size));
  border-radius: var(--radius-full);
  background-color: var(--font-light-color);
  z-index: 10;
  pointer-events: none;
}

.hero__catalog-btn > b {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 30;
  color: #fff;
  font-weight: 400;
  margin-top: -50px;
  transition: opacity 0.3s ease, margin-top 0.3s ease;
  opacity: 0;
  text-transform: uppercase;
  font-size: 16px;
  pointer-events: none;
  display: none;
}

.hero__catalog-btn:hover > b {
  margin-top: -30px;
  opacity: 1;
}

.hero__catalog-btn > em {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  color: #fff;
  font-style: normal;
  margin-top: 50px;
  transition: opacity 0.3s ease, margin-top 0.3s ease;
  opacity: 0;
  text-transform: uppercase;
  font-size: 16px;
  pointer-events: none;
  display: none;
}

.hero__catalog-btn:hover > em {
  margin-top: 36px;
  opacity: 1;
}

.hero__catalog-btn > div:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(40px + var(--big-Cat-btn--size));
  height: calc(40px + var(--big-Cat-btn--size));
  border-radius: var(--radius-full);
  background-color: var(--font-light-color);
  pointer-events: none;
  opacity: 0.7;
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.hero__catalog-btn:hover > div:before {
  width: calc(140px + var(--big-Cat-btn--size));
  height: calc(140px + var(--big-Cat-btn--size));
  background-color: var(--font-light-color);
}

.hero__btn-wrap {
  display: none;
  align-items: center;
  gap: var(--pad-gap-line);
  z-index: 2;
}

.hero__btn {
  flex: 0 0 auto;
}

.hero__btn.is-disabled,
.hero__btn:disabled {
  pointer-events: none;
  opacity: 0.35;
}

.hero__content-slider .swiper-slide {
  opacity: 0 !important;
  visibility: hidden;
  transition: opacity 0.7s ease, visibility 0.7s ease;
}

.hero__content-slider .swiper-slide.is-current {
  opacity: 1 !important;
  visibility: visible;
}

.hero-slide__info-wrap,
.hero-slide__decor-wrap {
  opacity: 0;
  will-change: transform, opacity;
}

.hero.is-dir-next .hero__content-slider .swiper-slide.is-current .hero-slide__info-wrap {
  animation: heroContentInNext 0.8s ease forwards;
}

.hero.is-dir-next .hero__content-slider .swiper-slide.is-prev .hero-slide__info-wrap {
  animation: heroContentOutNext 0.8s ease forwards;
}

.hero.is-dir-prev .hero__content-slider .swiper-slide.is-current .hero-slide__info-wrap {
  animation: heroContentInPrev 0.8s ease forwards;
}

.hero.is-dir-prev .hero__content-slider .swiper-slide.is-next .hero-slide__info-wrap {
  animation: heroContentOutPrev 0.8s ease forwards;
}

.hero.is-dir-next .hero__content-slider .swiper-slide.is-current .hero-slide__decor-wrap {
  animation: heroDecorInNext 0.9s ease forwards;
}

.hero.is-dir-next .hero__content-slider .swiper-slide.is-prev .hero-slide__decor-wrap {
  animation: heroDecorOutNext 0.9s ease forwards;
}

.hero.is-dir-prev .hero__content-slider .swiper-slide.is-current .hero-slide__decor-wrap {
  animation: heroDecorInPrev 0.9s ease forwards;
}

.hero.is-dir-prev .hero__content-slider .swiper-slide.is-next .hero-slide__decor-wrap {
  animation: heroDecorOutPrev 0.9s ease forwards;
}

@keyframes heroBgInNext {
  from {
    opacity: 0;
    transform: translate3d(48px, var(--hero-bg-shift), 0) scale(1.04);
  }
  to {
    opacity: 1;
    transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  }
}
@keyframes heroBgOutNext {
  from {
    opacity: 1;
    transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  }
  to {
    opacity: 0;
    transform: translate3d(-48px, var(--hero-bg-shift), 0) scale(1.04);
  }
}
@keyframes heroBgInPrev {
  from {
    opacity: 0;
    transform: translate3d(-48px, var(--hero-bg-shift), 0) scale(1.04);
  }
  to {
    opacity: 1;
    transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  }
}
@keyframes heroBgOutPrev {
  from {
    opacity: 1;
    transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  }
  to {
    opacity: 0;
    transform: translate3d(48px, var(--hero-bg-shift), 0) scale(1.04);
  }
}
@keyframes heroContentInNext {
  from {
    opacity: 0;
    transform: translate3d(56px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes heroContentOutNext {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-56px, 0, 0);
  }
}
@keyframes heroContentInPrev {
  from {
    opacity: 0;
    transform: translate3d(-56px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes heroContentOutPrev {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(56px, 0, 0);
  }
}
@keyframes heroDecorInNext {
  from {
    opacity: 0;
    transform: translate3d(72px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes heroDecorOutNext {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-72px, 0, 0);
  }
}
@keyframes heroDecorInPrev {
  from {
    opacity: 0;
    transform: translate3d(-72px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes heroDecorOutPrev {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(72px, 0, 0);
  }
}
.hero-one__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.hero-one .hero__bg-media {
  width: 100%;
  height: calc(100% + 200px);
  margin-top: -100px;
  transform: translate3d(0, var(--hero-bg-shift), 0) scale(1.04);
  filter: blur(var(--hero-bg-blur));
  will-change: transform, filter;
}

.hero-one__btn-wrap {
  display: none;
  align-items: center;
  gap: var(--pad-gap-line);
  z-index: 2;
}

.hero-one__btn.is-disabled,
.hero-one__btn:disabled {
  pointer-events: none;
  opacity: 0.35;
}

.hero-one.is-one-dir-next .hero__content-slider .swiper-slide.is-current .hero-slide__info-wrap {
  animation: heroContentInNext 0.8s ease forwards;
}

.hero-one.is-one-dir-next .hero__content-slider .swiper-slide.is-prev .hero-slide__info-wrap {
  animation: heroContentOutNext 0.8s ease forwards;
}

.hero-one.is-one-dir-prev .hero__content-slider .swiper-slide.is-current .hero-slide__info-wrap {
  animation: heroContentInPrev 0.8s ease forwards;
}

.hero-one.is-one-dir-prev .hero__content-slider .swiper-slide.is-next .hero-slide__info-wrap {
  animation: heroContentOutPrev 0.8s ease forwards;
}

.hero-one.is-one-dir-next .hero__content-slider .swiper-slide.is-current .hero-slide__decor-wrap {
  animation: heroDecorInNext 0.9s ease forwards;
}

.hero-one.is-one-dir-next .hero__content-slider .swiper-slide.is-prev .hero-slide__decor-wrap {
  animation: heroDecorOutNext 0.9s ease forwards;
}

.hero-one.is-one-dir-prev .hero__content-slider .swiper-slide.is-current .hero-slide__decor-wrap {
  animation: heroDecorInPrev 0.9s ease forwards;
}

.hero-one.is-one-dir-prev .hero__content-slider .swiper-slide.is-next .hero-slide__decor-wrap {
  animation: heroDecorOutPrev 0.9s ease forwards;
}

.zpm-about__text,
.zpm-adv-top__text,
.zpm-dealers__text {
  max-width: 540px;
}

.zpm-universal__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pad-gap);
  align-items: start;
}

.zpm-universal__grid .section-title__like-h1,
.zpm-universal__grid .section-title__like-h2,
.zpm-universal__grid .section-title__like-h3 {
  margin-bottom: 0px;
}

.zpm-universal__grid-First {
  position: relative;
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  justify-content: space-between;
  height: 100%;
}

.zpm-universal__grid-First > span {
  position: relative;
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.zpm-universal__grid-Second {
  position: relative;
}

.zpm-universal__grid-First > span.zpm-universal__auto-wrap {
  flex-flow: wrap;
  align-items: end;
}

.one-images-block {
  position: relative;
  display: flex;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  align-items: center;
  justify-content: center;
  background: var(--second-light-color);
}

.one-images-block > a {
  border-radius: var(--radius-main);
  overflow: hidden;
}

.one-images-block > a > img {
  border-radius: var(--radius-main);
  transition: transform 0.3s ease;
}

.one-images-block > a:hover > img {
  transform: scale(1.05);
}

.one-images-block a {
  display: block;
  cursor: zoom-in;
  width: 100%;
}

.one-images-block__hiden-elements {
  display: none;
}

.zpm-slider__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.zpm-slider__btn_wrap {
  display: none;
  position: relative;
  gap: var(--pad-gap-line);
  margin-bottom: var(--pad-gap);
  display: flex;
}

.hero-sliders-counet {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 3px 0px;
  white-space: nowrap;
  box-sizing: border-box;
  text-align: center;
  transition: all 0.3s ease;
  opacity: 0.3;
}

.zpm-slider__btn_wrap:hover .hero-sliders-counet {
  opacity: 0.9;
}

.zpm-slider__btn {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  height: 60px;
}

.zpm-slider__btn:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.zpm-slider__btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-slider__btn.swiper-button-disabled {
  opacity: 0.5;
  background-color: var(--font-light-color);
  border-color: var(--border-color);
}

.zpm-slider__btn.swiper-button-disabled:hover .zpm-icon {
  color: var(--main-dark-color);
  fill: var(--main-dark-color);
}

.swiper {
  padding-right: 1px;
  box-sizing: border-box;
}

/* ==========================================================================
   HEADER (layout)
   ========================================================================= */
.header_wrap {
  background: #DAE2F2;
  background: linear-gradient(0deg, rgb(160, 180, 210) 0%, rgb(218, 226, 242) 50%, rgb(114, 144, 182) 100%);
  padding: 0px 0px var(--pad-y) 0px;
}

.zpm-header {
  display: flex;
  flex-flow: column;
  align-items: center;
  position: relative;
  z-index: 200;
}

.zpm-header__top,
.zpm-header__main {
  width: 100%;
}

.zpm-header__top {
  padding: 30px 0 0px;
}

.zpm-header__top-inner {
  display: flex;
  align-items: center;
  gap: var(--pad-x) var(--pad-inner);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-header__place {
  display: flex;
  flex-flow: row;
  align-items: center;
  white-space: nowrap;
}

.zpm-header__place-link {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  padding: 0px;
  border: none;
  background-color: transparent;
  cursor: pointer;
}

.zpm-header__place-link:hover {
  color: var(--accent-color-01);
}

.zpm-header__place-link:hover .zpm-icon {
  color: var(--accent-color-01);
  fill: var(--accent-color-01);
}

.zpm-header__top-nav-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  padding: 0px 20px;
  box-sizing: border-box;
}

.zpm-header__top-nav {
  display: block;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-behavior: smooth;
}

.zpm-header__top-nav::-webkit-scrollbar {
  display: none;
}

.zpm-header__top-list {
  display: flex;
  flex-flow: row nowrap;
  gap: var(--pad-gap-line);
  margin: 0;
  padding: 0;
  list-style: none;
  width: -moz-max-content;
  width: max-content;
  min-width: 100%;
}

.zpm-header__top-item {
  flex: 0 0 auto;
}

.zpm-header__top-link {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

/* Кнопки прокрутки */
.zpm-header__top-scroll-btn {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  z-index: 5;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0);
  color: var(--font-dark-color);
  font-size: 26px;
  line-height: 1;
  transition: opacity 0.3s ease, visibility 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.zpm-header__top-scroll-btn:hover {
  color: var(--accent-color-01);
}

.zpm-header__top-scroll-btn.is-left {
  left: -20px;
}

.zpm-header__top-scroll-btn.is-right {
  right: -20px;
}

.zpm-header__top-scroll-btn[hidden] {
  display: none !important;
}

/* Маска самого меню, а не фоновые хвосты */
.zpm-header__top-nav.has-mask-right {
  -webkit-mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 40px), transparent 100%);
  mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 40px), transparent 100%);
}

.zpm-header__top-nav.has-mask-left {
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 100%);
}

.zpm-header__top-nav.has-mask-both {
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
}

/* Многоточие без плашек и без фона */
.zpm-header__top-nav-wrap.is-overflow-right::after,
.zpm-header__top-nav-wrap.is-overflow-left::before {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  z-index: 4;
  display: block;
  pointer-events: none;
  font-size: 18px;
  letter-spacing: 1px;
  font-weight: 500;
}

.zpm-header__top-nav-wrap.is-overflow-right::after {
  content: "...";
  right: 2px;
}

.zpm-header__top-nav-wrap.is-overflow-left::before {
  content: "...";
  left: 2px;
}

.zpm-header__phone {
  white-space: nowrap;
  font-size: 22px;
  font-weight: 500;
  width: 250px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 250px;
}

.zpm-header__main {
  padding: 30px 0 0px;
}

.zpm-header__main-inner {
  display: grid;
  grid-template-columns: auto auto 1fr auto auto;
  align-items: center;
  gap: var(--pad-gap);
}

.zpm-header__brand {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
}

.zpm-header__logo,
.zpm-header__m-logo,
.zpm-mmenu__logo {
  display: inline-flex;
  align-items: center;
}

.zpm-header__logo-box {
  display: block;
}

.zpm-header__logo-box > img {
  max-height: 60px;
}

/* Логотип и бейдж */
.zpm-header__logo-box img,
.zpm-header__badge-box img {
  display: block;
  max-width: 100%;
  height: auto;
  transition: filter 0.25s ease;
}

/* hover эффект */
.zpm-header__logo-box:hover img {
  filter: brightness(1.6) contrast(1.2);
}

.zpm-header__logo:focus-visible .zpm-header__logo-box img,
.zpm-header__badge-box:hover img {
  filter: brightness(1.1) contrast(1.2);
}

/* accessibility */
@media (prefers-reduced-motion: reduce) {
  .zpm-header__logo-box img,
  .zpm-header__badge-box img {
    transition: none;
  }
}
.zpm-header__account {
  width: 250px;
  min-width: 250px;
  white-space: nowrap;
}

.zpm-header__catalog-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--pad-gap-mini);
}

.zpm-header__catalog-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--pad-gap-mini);
  padding: 0 var(--pad-btns);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  cursor: pointer;
  font-weight: 400;
  line-height: 60px;
  height: 60px;
  white-space: nowrap;
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.btn-whit-burger {
  position: relative;
}

.zpm-btn__ico-burger {
  display: flex;
  width: 30px;
  height: 16px;
  flex-flow: column;
  justify-content: space-between;
  transform: scaleX(-1);
}

.zpm-btn__ico-burger > span {
  display: block;
  position: relative;
  right: 0px;
  width: 100%;
  height: 2px;
  background-color: var(--font-light-color);
  transition: width 0.3s ease;
}

.btn-whit-burger.btn_dark .zpm-btn__ico-burger > span {
  background-color: var(--font-light-color);
}

.btn-whit-burger.btn_white .zpm-btn__ico-burger > span {
  background-color: var(--font-dark-color);
}

.btn-whit-burger.btn_white:hover .zpm-btn__ico-burger > span {
  background-color: var(--font-light-color);
}

.btn-whit-burger.btn_dark:hover .zpm-btn__ico-burger > span {
  background-color: var(--font-dark-color);
}

.zpm-header__catalog .btn:hover .zpm-btn__ico-burger > span {
  background-color: var(--font-light-color);
}

.btn-whit-burger:hover .zpm-btn__ico-burger > span:nth-child(1) {
  width: 60%;
}
.btn-whit-burger:hover .zpm-btn__ico-burger > span:nth-child(2) {
  width: 90%;
}
.btn-whit-burger:hover .zpm-btn__ico-burger > span:nth-child(3) {
  width: 60%;
}

.btn-whit-burger.open {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.btn-whit-burger.open .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__catalog-text {
  font-size: 18px;
  line-height: 18px;
  font-weight: 500;
}

/* Search */
.zpm-header__search-wrapper {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.zpm-header__search {
  max-width: 470px;
  width: 100%;
}

.zpm-header__search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  height: 60px;
  padding: 0 30px;
  border-radius: var(--radius-full);
  background-color: var(--main-light-color);
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.page--home .zpm-header__search-form {
  background-color: rgba(var(--main-light-color-opcity));
}

.page--home .zpm-header__search-input:focus {
  color: var(--font-dark-color);
}

.zpm-header__search-form:hover .zpm-header__search-btn,
.zpm-header__search-form:hover {
  border-color: var(--main-dark-color);
}

.zpm-header__search-form.open .zpm-header__search-btn,
.zpm-header__search-form.open {
  border-color: var(--main-dark-color);
}

.header_wrap .zpm-header__search-form {
  background-color: rgba(var(--main-light-color-opcity));
}

.zpm-header__search-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.zpm-header__search-input {
  width: 100%;
  min-width: 170px;
  border: 0;
  padding: 0;
  background: none;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  color: var(--gray-color);
  height: 100%;
  box-sizing: border-box;
}

.zpm-header__search-btn {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  cursor: pointer;
  right: -20px;
  position: relative;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-header__search-form:hover .zpm-header__search-btn {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-header__search-form:hover .zpm-header__search-btn .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__search-form.open .zpm-header__search-btn {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-header__search-form.open .zpm-header__search-btn .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__search-form .zpm-header__search-btn:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
}

.zpm-header__search-btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__actions {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  justify-content: flex-end;
}

.zpm-header__action {
  display: inline-flex;
  width: 60px;
  height: 60px;
  border-radius: var(--radius-full);
  background-color: var(--main-light-color);
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  position: relative;
  cursor: pointer;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  transition: all 0.3s ease;
}

.page--home .zpm-header__action {
  background-color: rgba(var(--main-light-color-opcity));
}

.zpm-header__action:hover {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.zpm-header__action:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.header_wrap .zpm-header__action {
  background-color: rgba(var(--main-light-color-opcity));
}

.header_wrap .zpm-header__action:hover {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-header__action.open {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-header__action.open .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

/* Mobile bar */
.zpm-header__mobilebar {
  width: 100%;
  padding: var(--pad-gap-line) 0;
  background-color: #fff;
}

.zpm-header__mobilebar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-line);
}

.zpm-header__mobilebar-brand {
  display: flex;
  flex-flow: row;
  align-items: center;
  gap: var(--pad-gap-line);
}

.zpm-header__m-actions {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
}

.zpm-header__m-btn {
  display: flex;
  position: relative;
  width: 50px;
  min-width: 50px;
  height: 50px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-dark-color);
  align-items: center;
  justify-content: center;
  background: none;
  background-color: var(--main-dark-color);
  cursor: pointer;
}

.zpm-header__Pad-btn {
  display: none;
}

@media (min-width: 1025px) and (max-width: 1310px) {
  .zpm-header__Pad-btn {
    display: flex;
    width: 60px;
    min-width: 60px;
    height: 60px;
  }
}
@media (max-width: 1310px) {
  .zpm-header__search-wrapper {
    display: none;
  }
}
.zpm-header__m-btn .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__m-btn:hover {
  border-color: var(--main-dark-color);
  color: var(--accent-color-01);
  opacity: 0.9;
}

.zpm-btn__mobile-ico-burger {
  display: flex;
  width: 18px;
  height: 14px;
  flex-flow: column;
  justify-content: space-between;
}

.zpm-header__m-btn:hover .zpm-btn__mobile-ico-burger {
  width: 18px;
}

.zpm-btn__mobile-ico-burger > span {
  display: block;
  position: relative;
  right: 0px;
  width: 100%;
  height: 2px;
  background-color: var(--font-light-color);
  transition: width 0.3s ease;
}

.zpm-header__m-search {
  padding-top: calc(var(--space-md) - 4px);
  padding-bottom: calc(var(--space-md) - 4px);
}

/* Breakpoints: desktop shows top+main, mobile shows mobilebar */
@media (max-width: 1024px) {
  .zpm-header__top,
  .zpm-header__main {
    display: none;
  }
  .zpm-header__mobilebar {
    display: block;
  }
  .zpm-header__m-logo,
  .zpm-header__badge-box img {
    height: 50px;
  }
  .zpm-header__logo-box {
    height: 100%;
  }
  .zpm-header__logo-box > img {
    height: 100%;
  }
}
@media (min-width: 1025px) {
  .zpm-header__mobilebar {
    display: none;
  }
}
.zpm-header__count {
  position: absolute;
  display: flex;
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  top: -20px;
  right: -20px;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  align-items: center;
  justify-content: center;
  font-size: var(--mini-Font-size);
  line-height: 16px;
  color: var(--font-light-color);
  font-weight: 500;
}

a > .zpm-header__count {
  border-color: var(--second-light-color);
  background-color: var(--second-light-color);
  top: -10px;
  right: -10px;
  width: 30px;
  height: 30px;
  font-size: 12px;
  line-height: 12px;
  color: var(--font-dark-color);
}

.goto_sticky .zpm-header__count {
  top: -10px;
  right: -10px;
  width: 30px;
  height: 30px;
  font-size: 12px;
  line-height: 12px;
}

.zpm-header__m-cart.zpm-header__action {
  width: 50px;
  height: 50px;
}

.zpm-header__m-cart__count {
  position: absolute;
  display: flex;
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  top: -15px;
  right: -15px;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-full);
  align-items: center;
  justify-content: center;
  font-size: var(--mini-Font-size);
  color: var(--font-light-color);
  font-weight: 500;
  font-size: 12px;
  line-height: 12px;
}

/* ==========================================================================
   Mobile offcanvas menu (layout + animation) - offcanvas-menu.html
   ========================================================================= */
.zpm-mmenu[hidden] {
  display: none;
}

.zpm-mmenu {
  position: fixed;
  inset: 0;
  z-index: 100;
}

/* Внутренний overlay меню: ловит клик для закрытия.
   Визуально его можно не красить — у нас есть ГЛОБАЛЬНЫЙ overlay. */
.zpm-mmenu__overlay {
  position: absolute;
  inset: 0;
  top: 90px;
}

.zpm-mmenu__panel {
  position: absolute;
  top: 110px;
  left: 50%;
  max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
  width: calc(100% - 40px);
  max-width: 690px;
  will-change: transform, opacity;
  border-radius: var(--radius-main);
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  background: var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  transform: translate3d(-50%, 50%, 0);
  opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
  will-change: transform, opacity;
}

.zpm-mmenu__panel--inner {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
  box-sizing: border-box;
  padding: var(--pad-inner);
}

/* Открыто: приезжает в 0 + fade */
.is-mmenu-open .zpm-mmenu__panel {
  transform: translate3d(-50%, 0, 0);
  opacity: 1;
}

.zpm-mmenu__head {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  min-height: 40px;
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}

.zpm-mmenu__close {
  display: flex;
  position: absolute;
  top: var(--pad-inner);
  right: var(--pad-inner);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--main-light-color);
  box-sizing: border-box;
  cursor: pointer;
  box-shadow: 0px 0px 16px 20px var(--main-light-color);
}

.zpm-mmenu__close svg {
  color: var(--main-dark-color);
  width: 24px;
  height: 24px;
}

.zpm-mmenu__close:hover {
  border-color: var(--accent-color-02);
}

.zpm-mmenu__close:hover svg {
  color: var(--accent-color-02);
}

.zpm-mmenu__meta {
  display: grid;
  gap: calc(var(--space-md) - 4px);
}

.zpm-mmenu__phone {
  display: inline-flex;
  align-items: center;
  margin-right: var(--pad-gap-line);
  font-size: 20px;
  line-height: 40px;
  white-space: nowrap;
}

.zpm-mmenu__phone-ofcanvas {
  font-size: 18px;
  line-height: 38px;
  white-space: nowrap;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  padding: 0px 20px;
  margin-right: 0;
  font-weight: var(--large-Font-weight);
  text-align: center;
}

.zpm-mmenu__place {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
}

.zpm-mmenu__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 5px;
  flex-flow: column;
}

.zpm-mmenu__link {
  display: inline-flex;
  font-size: 18px;
  line-height: 22px;
  padding: 5px 0px;
  border-bottom: 1px solid var(--border-color);
}

/* CTA внизу меню */
.zpm-mmenu__cta {
  margin-top: auto;
}

.zpm-mmenu__bottom-panel {
  display: flex;
  gap: var(--pad-gap-line);
  box-sizing: border-box;
  padding: var(--pad-inner);
  flex-flow: row;
}

.zpm-mmenu__bottom-panel > button {
  width: 100%;
}

@media (max-width: 560px) {
  .zpm-mmenu__phone {
    font-size: 18px;
    font-weight: 500;
  }
}
/* ==========================================================================
   Mobile menu: Catalog accordion
   ========================================================================= */
.zpm-mmenu__row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-sm);
}

.zpm-mmenu__toggle {
  display: inline-flex;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  align-items: center;
  justify-content: center;
  background: none;
}

.zpm-mmenu__subwrap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease, opacity 0.3s ease;
  opacity: 0;
}

.zpm-mmenu__subinner {
  overflow: hidden;
}

.zpm-mmenu__sublist {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: calc(var(--space-sm) - 2px);
  padding-top: var(--space-sm);
}

.zpm-mmenu__sublink {
  display: inline-flex;
}

/* open state */
.zpm-mmenu__item.is-sub-open .zpm-mmenu__subwrap {
  grid-template-rows: 1fr;
  opacity: 1;
}

/* ======================================================================
   GLOBAL PAGE PRELOADER
   - only first session visit
   - minimal line loader
   ====================================================================== */
.zpm-preloader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

html.is-preloader-active .zpm-preloader {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.zpm-preloader__inner {
  display: grid;
  justify-items: center;
  gap: var(--pad-gap-line);
}

.zpm-preloader__bar {
  width: 20vw;
  max-width: 320px;
  min-width: 180px;
  height: 2px;
  background: rgba(0, 0, 0, 0.12);
  overflow: hidden;
}

.zpm-preloader__line {
  display: block;
  width: 0%;
  height: 100%;
  background: var(--main-dark-color);
  transition: width 0.3s ease;
}

.zpm-preloader__percent {
  min-width: 56px;
  text-align: center;
  font-size: var(--mini-Font-size);
  line-height: 1;
  font-weight: 600;
}

@media (max-width: 1024px) {
  .zpm-preloader__bar {
    width: 30vw;
    min-width: 140px;
    max-width: 220px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .zpm-preloader,
  .zpm-preloader__line {
    transition: none !important;
  }
}
/* ================================
   QUICK SEARCH (desktop + mobile)
   Назначение: анимированная панель поиска + состояния "подсказка/результаты"
================================ */
.zpm-qsearch__go-search_page {
  white-space: nowrap;
  width: 290px;
  margin-top: calc(var(--pad-inner) - var(--pad-gap-line));
}

.zpm-qsearch--desktop {
  position: fixed;
  left: var(--qs-left);
  top: var(--qs-top);
  right: auto;
  z-index: 210;
  opacity: 0;
  transform: translateY(100px);
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
  padding-right: var(--pad-x);
  box-sizing: border-box;
}

html.is-qsearch-open .zpm-qsearch--desktop {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

/* Mobile search panel animation (сам контейнер раскрывашки под баром) */
.zpm-header__m-search {
  opacity: 0;
  transform: translateY(100px);
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}

html.is-qsearch-mobile-open .zpm-header__m-search {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

.zpm-qsearch-mobile__hint,
.zpm-qsearch__hint {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  font-size: var(--mini-Font-size);
  color: var(--gray-color);
  max-width: 310px;
  line-height: var(--mini-Line-height);
  align-items: center;
}

.zpm-qsearch__help-nav {
  position: absolute;
  display: flex;
  top: 15px;
  left: var(--pad-inner);
  gap: var(--pad-gap-mini);
  z-index: 1;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--padding-form);
  padding: 0px 10px;
  height: 30px;
  background-color: var(--main-light-color);
}

.goto_sticky .zpm-qsearch__help-nav {
  top: 25px;
}

.zpm-qsearch__help-nav > button {
  border: none;
  background: none;
  opacity: 1;
  cursor: pointer;
  padding: 0px 5px;
  line-height: 28px;
  /* margin: 10px 0px; */
  font-size: 14px;
  transition: all 0.3s ease;
}

.zpm-qsearch__help-nav > button:hover {
  color: var(--accent-color-01);
}

.zpm-qsearch__panel {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-flow: column;
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  margin-top: var(--popup-custom-Top-correct);
  gap: var(--pad-gap);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  box-sizing: border-box;
  max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
  max-width: 940px;
  min-width: 430px;
}

.goto_sticky .zpm-qsearch__panel {
  margin-top: 40px;
}

.zpm-qsearch__panel .zpm-popup_manager__head {
  padding-right: 80px;
}

.zpm-qsearch__found {
  font-size: 14px;
  line-height: var(--mini-Line-height);
}

.zpm-qsearch__list {
  display: grid;
  gap: var(--pad-gap-line);
  position: relative;
}

.zpm-qsearch__list-title {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}

.zpm-qsearch__list-wrapper {
  display: flex;
  flex-flow: column;
  gap: var(--pad-inner);
  overflow-x: hidden;
  overflow-y: auto;
  max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
  min-height: 160px;
}

.zpm-qsearch__item {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: var(--pad-gap-mini);
  align-items: start;
}

.zpm-qsearch__icon {
  display: flex;
  padding: 5px 10px;
  font-size: var(--mini-Font-size);
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background-color: var(--main-light-color);
  border-radius: var(--border-radius-form);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-qsearch__icon > .zpm-icon {
  color: var(--main-dark-color);
}

.zpm-qsearch__count {
  display: flex;
  padding: 5px 10px;
  font-size: var(--mini-Font-size);
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background-color: var(--main-light-color);
  border-radius: var(--border-radius-form);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
}

.zpm-qsearch__meta {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.zpm-qsearch__title {
  position: relative;
  padding-right: var(--pad-inner);
}

.zpm-qsearch__label {
  display: block;
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
}

.zpm-qsearch__item:hover .zpm-qsearch__icon,
.zpm-qsearch__item:hover .zpm-qsearch__label {
  color: var(--font-dark-color);
}

.zpm-qsearch__item:hover .zpm-qsearch__icon {
  background-color: var(--main-dark-color);
  border-color: var(--main-dark-color);
}

.zpm-qsearch__item:hover .zpm-qsearch__icon > .zpm-icon {
  color: var(--font-light-color);
}

.zpm-qsearch__item:hover .zpm-qsearch__count {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
  border-color: var(--main-dark-color);
}

.zpm-qsearch__close {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
}

/* mobile screen layout */
.zpm-qsearch--mobile {
  display: grid;
  gap: calc(var(--space-md) - 4px);
}

.zpm-qsearch__m-top {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.zpm-qsearch__back {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  height: var(--h);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 0 14px;
  background: none;
  cursor: pointer;
}

.zpm-qsearch__m-found {
  font-size: 14px;
  line-height: var(--mini-Line-height);
}

.zpm-qsearch__m-list {
  display: grid;
  gap: var(--space-sm);
  /* как в макете: список скроллится внутри экрана */
  max-height: calc(100vh - 240px);
  overflow: auto;
  padding-right: 6px;
}

/* desktop only quicksearch */
@media (max-width: 1024px) {
  .zpm-qsearch--desktop {
    display: none !important;
  }
}
/* ==========================================================================
   Mobile quick search
   ========================================================================== */
.zpm-qsearch-mobile {
  position: fixed;
  inset: 0;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}

.is-qsearch-mobile-open .zpm-qsearch-mobile {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s ease, visibility 0s linear 0s;
}

.zpm-qsearch-mobile__overlay {
  position: absolute;
  inset: 0;
  top: 0px;
  pointer-events: auto;
  height: 100vh;
}

.zpm-qsearch-mobile__panel {
  position: absolute;
  top: 170px;
  left: 50%;
  width: calc(100% - 40px);
  max-width: 690px;
  max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
  display: flex;
  flex-direction: column;
  padding: var(--pad-inner);
  gap: var(--pad-gap);
  border-radius: var(--radius-main);
  box-sizing: border-box;
  overflow: hidden;
  pointer-events: auto;
  border: 1px solid var(--border-color);
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  transform: translate3d(-50%, 50%, 0);
  opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
  will-change: transform, opacity;
}

.goto_sticky .zpm-qsearch-mobile__panel {
  top: 152px;
}

.is-qsearch-mobile-open .zpm-qsearch-mobile__panel {
  transform: translate3d(-50%, 0, 0);
  opacity: 1;
}

.zpm-qsearch-mobile__head {
  display: flex;
  flex-flow: row;
  align-items: center;
  gap: 20px;
}

.zpm-qsearch-mobile__back {
  display: flex;
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  min-width: 50px;
  background: var(--main-light-color);
  box-sizing: border-box;
  cursor: pointer;
  box-shadow: 0px 0px 16px 20px var(--main-light-color);
}

.zpm-qsearch-mobile__back svg {
  color: var(--main-dark-color);
  width: 24px;
  height: 24px;
}

.zpm-qsearch-mobile__back:hover {
  border-color: var(--accent-color-02);
}

.zpm-qsearch-mobile__back:hover svg {
  color: var(--accent-color-02);
}

.zpm-qsearch-mobile__search {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 20px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-full);
  background: #fff;
}

.zpm-qsearch-mobile__search-ico {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}

.zpm-qsearch-mobile__input {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  outline: none;
  font: inherit;
}

.zpm-qsearch-mobile__reset {
  flex: 0 0 auto;
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  cursor: pointer;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-qsearch-mobile__body {
  min-height: 0;
  overflow: auto;
}

.zpm-qsearch-mobile__hint,
.zpm-qsearch-mobile__meta {
  margin-bottom: 12px;
}

.zpm-qsearch-mobile__list {
  display: grid;
  gap: var(--pad-gap-line);
  position: relative;
}

.zpm-qsearch-mobile__list + .zpm-qsearch-mobile__list {
  margin-top: 18px;
}

.zpm-qsearch-mobile__icon,
.zpm-qsearch-mobile__count {
  flex: 0 0 auto;
}

.zpm-qsearch-mobile__meta-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.zpm-qsearch-mobile__title,
.zpm-qsearch-mobile__label {
  display: block;
}

.zpm-qsearch-mobile__go-search-page {
  display: inline-flex;
  margin-top: 12px;
}

@media (min-width: 1311px) {
  .zpm-qsearch-mobile {
    display: none;
  }
}
@media (max-width: 1024px) {
  .zpm-qsearch-mobile__panel {
    top: 110px;
  }
}
/* ======================================================================
   Mini cart popup (global layer) - minicart.html
   - open: снизу вверх + fade in
   - close: сверху вниз (уход вверх) + fade out
   ====================================================================== */
.zpm-minicart[hidden] {
  display: none;
}

.zpm-minicart {
  position: fixed;
  inset: 0;
  z-index: 2001;
  /* слой не кликается, кликается только panel */
  pointer-events: none;
}

/* PANEL */
.zpm-minicart__panel {
  pointer-events: auto;
  position: absolute;
  width: 100%;
  max-width: 520px;
  display: grid;
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  box-sizing: border-box;
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  margin-top: var(--popup-custom-Top-correct);
  gap: var(--pad-gap);
  background: var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  top: var(--mc-top);
  left: var(--mc-left);
  right: auto;
  /* CLOSED state (desktop): ниже и прозрачно */
  opacity: 0;
  transform: translate3d(-50%, 16px, 0);
  transition: transform 0.3s ease, opacity 0.3s ease;
  will-change: transform, opacity;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
}

.goto_sticky .zpm-minicart__panel {
  margin-top: 40px;
}

/* OPEN state */
.is-minicart-open .zpm-minicart__panel {
  opacity: 1;
  transform: translate3d(-50%, 0, 0);
}

/* CLOSE motion hint: при закрытии уходим вверх (если слой остаётся видимым до hidden) */
html:not(.is-minicart-open) .zpm-minicart__panel {
  transform: translate3d(-50%, -16px, 0);
}

@media (max-width: 1024px) {
  .zpm-minicart__panel {
    left: 50%;
    right: auto;
    top: 80px;
    max-width: 690px;
    overflow: auto;
    /* CLOSED state (mobile): ниже */
    transform: translate3d(-50%, 100px, 0);
  }
  .is-minicart-open .zpm-minicart__panel {
    transform: translate3d(-50%, 0, 0);
  }
  html:not(.is-minicart-open) .zpm-minicart__panel {
    transform: translate3d(-50%, -16px, 0);
  }
}
.zpm-minicart__title {
  position: relative;
}

.zpm-minicart__close {
  display: inline-flex;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  align-items: center;
  justify-content: center;
  background: none;
}

.zpm-minicart__hint {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  font-size: var(--mini-Font-size);
  color: var(--gray-color);
  max-width: 310px;
  line-height: var(--mini-Line-height);
  align-items: center;
}

.zpm-minicart__order-wrap {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.zpm-minicart__body {
  display: flex;
  flex-flow: column;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: calc(100vh - 600px);
  min-height: 180px;
}

.zpm-minicart__empty {
  color: var(--gray-color);
}

.zpm-minicart__list {
  display: flex;
  flex-flow: column;
}

.zpm-minicart__item {
  display: flex;
  flex-flow: row;
  border-bottom: 1px solid #333;
  padding-top: var(--pad-gap-line);
  padding-bottom: var(--pad-gap-line);
}

.zpm-minicart__item:last-child {
  border-bottom: none;
}

.zpm-minicart__item-inner {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
  width: 100%;
}

.zpm-minicart__item-title {
  font-size: var(--mini-Font-size);
  position: relative;
  padding-right: 20px;
}

.zpm-minicart__item-calc {
  font-size: 14px;
  display: flex;
  flex-flow: wrap;
  gap: var(--pad-gap-mini);
}

.zpm-minicart__item-calc__numb {
  display: flex;
  flex-flow: row;
  gap: 10px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 2px 15px;
}

.zpm-minicart__item-calc__numb > em {
  font-style: normal;
}

.zpm-minicart__item-calc__numb > span {
  display: block;
}

.zpm-minicart__item-calc__total {
  display: flex;
  flex-flow: row;
  gap: 10px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 2px 15px;
  background: var(--second-light-color);
  font-weight: 500;
}

.zpm-minicart__item-calc__total > em {
  font-style: normal;
}

.zpm-minicart__item-calc__total > span {
  display: block;
}

.zpm-cart_item_delete {
  display: flex;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 20px;
  min-width: 20px;
  height: 20px;
  background: var(--second-light-color);
  box-sizing: border-box;
  cursor: pointer;
}

.zpm-cart_item_delete svg {
  color: var(--main-dark-color);
  width: 14px;
  height: 14px;
}

.zpm-cart_item_delete:hover {
  border-color: var(--accent-color-02);
}

.zpm-cart_item_delete:hover svg {
  color: var(--accent-color-02);
}

.zpm-minicart__foot {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

.zpm-minicart__checkout {
  cursor: pointer;
}

.zpm-minicart__continue {
  cursor: pointer;
}

.fancybox__container:not(.zpm-prod-patch) .f-button.is-close-button {
  display: flex;
  position: absolute;
  top: calc(var(--pad-gap-line) + var(--pad-inner));
  right: var(--pad-inner);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--main-light-color);
  box-sizing: border-box;
  cursor: pointer;
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.f-button.is-arrow {
  display: flex;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--main-light-color);
  box-sizing: border-box;
  cursor: pointer;
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.f-button.is-arrow svg,
.f-button.is-close-button svg {
  color: var(--main-dark-color);
  stroke-width: 1.5;
  transition: color 0.3s ease;
}

.f-button.is-arrow:hover,
.f-button.is-close-button:hover {
  border-color: var(--accent-color-01);
  background: var(--main-light-color);
}

.f-button.is-arrow:hover svg,
.f-button.is-close-button:hover svg {
  color: var(--accent-color-01);
}

.f-carousel__toolbar__column.is-left .f-counter {
  padding: 0px;
  font-weight: 500;
  font-size: 20px;
  line-height: 22px;
}

.zpm-prod-patch .f-carousel__toolbar__column.is-left .f-counter {
  padding: 0px;
  color: var(--main-dark-color);
  text-shadow: none;
}

.zpm-fb {
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--main-dark-color);
  width: 100%;
}

.zpm-fb__wrap {
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  box-sizing: border-box;
  box-shadow: 0px 0px 20px 5px #121212;
  margin-top: var(--pad-gap-line);
  gap: var(--pad-gap);
  background: var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  display: flex;
  flex-flow: column;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  width: 100%;
}

.zpm-fb__wrap--mini {
  max-width: 520px;
}

.zpm-fb__wrap--max {
  max-width: 690px;
}

.zpm-form__agree-text {
  font-size: 14px;
  line-height: 16px;
  max-width: 360px;
}

.zpm-fb__state {
  margin: auto;
  gap: var(--pad-inner);
  display: flex;
  flex-flow: column;
  width: 100%;
}

.zpm-fb__state > svg {
  margin: auto;
}

.zpm-fb__state[hidden] {
  display: none;
}

.zpm-fb__title {
  display: block;
  text-align: center;
  white-space: nowrap;
  line-height: 40px;
}

.zpm-fb__sub {
  display: block;
  text-align: center;
}

.zpm-fb__x {
  position: absolute;
  bottom: -50px;
  left: 50%;
  transform: translate(-50%, 0);
  border: none;
  background: none;
  color: #fff;
  opacity: 0.7;
  cursor: pointer;
  padding: 10px;
}

.zpm-fb__x:hover {
  opacity: 1;
}

.zpm-icon.success {
  color: var(--accent-color-01);
}

.zpm-icon.error {
  color: var(--accent-color-02);
}

.zpm-popup_close {
  display: flex;
  position: absolute;
  top: var(--pad-inner);
  right: var(--pad-inner);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--main-light-color);
  box-sizing: border-box;
  cursor: pointer;
  box-shadow: 0px 0px 16px 20px var(--main-light-color);
}

.zpm-popup_close svg {
  color: var(--main-dark-color);
  width: 24px;
  height: 24px;
}

.zpm-popup_close:hover {
  border-color: var(--accent-color-02);
}

.zpm-popup_close:hover svg {
  color: var(--accent-color-02);
}

/* ======================================================================
   City popup (center modal) - city-popup.html
   - open: снизу вверх + fade in
   - close: вниз + fade out
   ====================================================================== */
.zpm-city[hidden] {
  display: none;
}

.zpm-city {
  position: fixed;
  inset: 0;
  z-index: 2002;
  /* слой сам не кликается, кликается только panel */
  pointer-events: none;
}

/* PANEL */
.zpm-city__panel {
  pointer-events: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(490px, 100vw - 24px);
  max-height: calc(100vh - 24px);
  overflow: auto;
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  box-sizing: border-box;
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  /* начальное состояние (закрыто) */
  opacity: 0;
  transform: translate3d(-50%, calc(-50% + 100px), 0);
  transition: opacity 0.3s ease, transform 0.3s ease;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
}

.zpm-city__title {
  position: relative;
}

/* OPEN state */
.is-city-open .zpm-city__panel {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0);
}

/* close hint: при закрытии слегка уезжаем вниз */
html:not(.is-city-open) .zpm-city__panel {
  transform: translate3d(-50%, calc(-50% + 100px), 0);
}

.zpm-city__body {
  padding-top: var(--pad-gap);
}

.zpm-city__list {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

.zpm-city__item {
  position: relative;
}

.zpm-city__item.active.btn {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

/* ======================================================================
   Fancybox animations (ZPM) — driven by our classes
   - overlay: fade 0.3s immediately
   - content open: deeper zoomIn + fade 0.3s with 0.3s delay after overlay
   - content close: slide DOWN + fade 0.3s (as ZPM popups feel)
   ====================================================================== */
html.with-fancybox .fancybox__container.zpm-fancybox .fancybox__backdrop {
  transition: opacity 0.3s ease;
}

/* Content base */
html.with-fancybox .fancybox__container.zpm-fancybox .fancybox__content {
  will-change: transform, opacity;
  transform-origin: center center;
}

/* OPEN (we add .zpm-fb-opening on container) */
html.with-fancybox .fancybox__container.zpm-fancybox.zpm-fb-opening .fancybox__content {
  opacity: 0;
  /* глубже старт: больше смещение и меньше scale */
  transform: translate3d(0, 28px, 0) scale(0.86);
  animation: zpmFbZoomInFade 0.3s ease forwards;
  animation-delay: 0.3s; /* задержка после overlay */
}

/* CLOSE (we add .zpm-fb-closing on container) */
html.with-fancybox .fancybox__container.zpm-fancybox.zpm-fb-closing .fancybox__content {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  animation: zpmFbCloseDownFade 0.3s ease forwards;
  animation-delay: 0s;
}

@keyframes zpmFbZoomInFade {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}
@keyframes zpmFbCloseDownFade {
  to {
    opacity: 0;
    transform: translate3d(0, 36px, 0) scale(1);
  }
}
/* ======================================================================
   Fancybox FORMS animations (ZPM)
   Работает когда на контейнере есть .zpm-fancybox и .zpm-fb-anim
   ====================================================================== */
.fancybox__container.zpm-fancybox.zpm-fb-anim .fancybox__backdrop {
  transition: opacity 0.3s ease;
}

/* Отключаем transition на transform у fancybox-контента (чтобы не спорить с drag),
   а анимируем через keyframes, которые перезаписывают transform в конце.
*/
.fancybox__container.zpm-fancybox.zpm-fb-anim .fancybox__content {
  will-change: transform, opacity;
  transform-origin: center center;
}

/* OPEN */
.fancybox__container.zpm-fancybox.zpm-fb-anim.zpm-fb-opening .fancybox__content {
  opacity: 0;
  transform: translate3d(0, 34px, 0) scale(0.82);
  animation: zpmFbFormOpen 0.3s ease forwards;
  animation-delay: 0.3s;
}

/* CLOSE (down + fade) */
.fancybox__container.zpm-fancybox.zpm-fb-anim.zpm-fb-closing .fancybox__content {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  animation: zpmFbFormClose 0.3s ease forwards;
  animation-delay: 0s;
}

@keyframes zpmFbFormOpen {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}
@keyframes zpmFbFormClose {
  to {
    opacity: 0;
    transform: translate3d(0, 44px, 0) scale(1);
  }
}
/* ======================================================================
   Fancybox FORMS animations (ZPM)
   - overlay показывается сразу (Fancybox)
   - контент появляется через 0.3s: zoom+fade 0.3
   - закрытие: вниз+fade 0.3
====================================================================== */
.fancybox__container.zpm-fancybox-anim .fancybox__content {
  will-change: transform, opacity;
  transform-origin: center center;
}

/* старт: пока нет .zpm-fb-open — контент невидим */
.fancybox__container.zpm-fancybox-anim.zpm-fb-opening .fancybox__content {
  opacity: 0;
  transform: translate3d(0, 38px, 0) scale(0.82);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* через 0.3s добавится .zpm-fb-open */
.fancybox__container.zpm-fancybox-anim.zpm-fb-open .fancybox__content {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* закрытие: вниз+fade */
.fancybox__container.zpm-fancybox-anim.zpm-fb-closing .fancybox__content {
  opacity: 0;
  transform: translate3d(0, 44px, 0) scale(1);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* ==========================================================================
   page-intro
   ========================================================================= */
.page-intro {
  padding: 50px 0px 0px;
}

.page-intro > .container {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}

.page-intro .page-intro__title {
  max-width: 1280px;
}

/* ==========================================================================
   breadcrumbs
   ========================================================================= */
.breadcrumbs {
  padding: 30px 0px 0px;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.breadcrumbs__list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.breadcrumbs__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.breadcrumbs__item:not(:last-child)::after {
  content: "/";
  opacity: 0.5;
}
.breadcrumbs__link {
  text-decoration: none;
  color: inherit;
  opacity: 0.6;
}
.breadcrumbs__current {
  color: inherit;
}

/* ==========================================================================
   SINGLE PRODUCT
   ========================================================================= */
.product-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
.product-hero {
  /* КРИТИЧНО: чтобы grid-колонки могли сжиматься */
}
.product-hero__media, .product-hero__info {
  min-width: 0;
}
.product-hero__media {
  overflow: hidden;
  height: 100%;
  display: flex;
}
.product-hero__title {
  font-size: 40px;
  line-height: 44px;
}
.product-hero__subtitle {
  padding-right: 10%;
}
.product-hero__status {
  display: inline-flex;
  align-items: center;
  gap: var(--pad-gap-mini) var(--pad-gap-line);
  font-weight: 500;
  flex-wrap: wrap;
}
.product-hero__props {
  display: grid;
  gap: var(--pad-box);
  border-width: 0px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  padding: var(--pad-gap);
  border-radius: var(--radius-main);
}
.product-hero__prop {
  display: flex;
  justify-content: space-between;
  gap: var(--pad-gap-line);
}
.product-hero__prop dt {
  margin: 0;
  font-weight: 500;
}
.product-hero__prop dd {
  margin: 0;
}
.product-hero__actions {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
}
@media (max-width: 1024px) {
  .product-hero__grid {
    grid-template-columns: 1fr;
    gap: var(--pad-gap);
  }
}

.product-hero__actions-wrap {
  display: flex;
  flex-flow: wrap-reverse;
  gap: var(--pad-gap-line);
  justify-content: space-between;
}

.product-hero__other {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-line);
}

.product-hero {
  padding-top: var(--pad-y);
}

.product-tabs {
  padding-top: var(--pad-y);
}

.product-hero__price {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pad-gap-mini);
  margin-top: 10px;
  align-items: center;
}

.product-hero__price > div {
  white-space: nowrap;
}

.product-hero__price-label {
  width: 100%;
}

.product-hero__price-value {
  font-size: 24px;
  line-height: 30px;
  font-weight: 500;
}

.product-hero__old-price-value {
  text-decoration: line-through;
  color: var(--gray-color);
}

.product-hero__discount {
  display: flex;
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
  font-size: var(--mini-Font-size);
  line-height: 16px;
  align-items: center;
  height: 30px;
  padding: 0px 6px;
  border-radius: var(--border-radius-form);
  /* position: relative; */
  /* top: -5px; */
  font-weight: 500;
}

.product-hero__info {
  display: flex;
  justify-content: space-between;
  flex-flow: column;
  height: 100%;
  gap: var(--pad-gap-line);
}

.product-hero__info > span {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

.product-hero__brand {
  width: 140px;
}

.btn--primary.btn:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}
.btn--primary.btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.btn--catalog-cart:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.product-gallery {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}
.product-gallery__main {
  display: block;
  position: relative;
  border-radius: var(--radius-main);
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  height: 100%;
}
.product-gallery__img {
  display: block;
  width: 100%;
  height: 520px;
  -o-object-fit: contain;
     object-fit: contain;
}
.product-gallery__nav {
  position: absolute;
  right: var(--pad-gap);
  bottom: var(--pad-gap);
  display: flex;
  gap: var(--pad-gap-line);
  z-index: 1;
}
.product-gallery__btn {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  height: 60px;
}
.product-gallery__thumbs {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.product-gallery__thumb {
  display: flex;
  padding: 0;
  border: 0px solid transparent;
  background: transparent;
  cursor: pointer;
}
.product-gallery__thumb img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.product-gallery .swiper-wrapper {
  align-items: stretch;
}
.product-gallery .swiper-slide {
  height: auto;
  display: flex;
  padding: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: transparent;
  border-radius: var(--radius-main);
  cursor: pointer;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1024px) {
  .product-gallery__img {
    height: 460px;
  }
}

.product-gallery .swiper-slide.swiper-slide-thumb-active {
  border-color: var(--main-dark-color);
}

.product-gallery__btn:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.product-gallery__btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.product-gallery__btn.swiper-button-disabled {
  opacity: 0.5;
  background-color: var(--font-light-color);
  border-color: var(--border-color);
}

.product-gallery__btn.swiper-button-disabled:hover .zpm-icon {
  color: var(--main-dark-color);
  fill: var(--main-dark-color);
}

.rel-products__btn:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.rel-products__btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.rel-products__btn.swiper-button-disabled {
  opacity: 0.5;
  background-color: var(--font-light-color);
  border-color: var(--border-color);
}

.rel-products__btn.swiper-button-disabled:hover .zpm-icon {
  color: var(--main-dark-color);
  fill: var(--main-dark-color);
}

.tabs__head {
  display: flex;
  gap: var(--pad-inner);
}
.tabs__tab {
  padding: 0px 0px 10px 0px;
  background: transparent;
  border: 0;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  color: var(--gray-color);
}
.tabs__tab.is-active {
  color: var(--font-dark-color);
}
.tabs__panel {
  display: none;
}
.tabs__panel.is-active {
  display: flex;
}

.tabs__tab:hover {
  color: var(--accent-color-01);
}

.tabs__tab.is-active:hover {
  color: var(--font-dark-color);
}

.spec-table {
  display: grid;
  gap: var(--pad-box);
  border-width: 0px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  padding: var(--pad-gap);
  border-radius: var(--radius-main);
}
.spec-table__row {
  display: flex;
  justify-content: space-between;
  gap: var(--pad-gap-line);
}
.spec-table__key {
  margin: 0;
  font-weight: 500;
}
.spec-table__val {
  margin: 0;
}

.tabs__panel > div.spec-table {
  padding-right: var(--pad-gap);
}

.tabs__panel > div {
  display: flex;
  flex-flow: column;
  gap: var(--pad-box);
  padding: var(--pad-gap);
  padding-right: 10%;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  border-radius: var(--radius-main);
  width: 100%;
}

.tabs__panel > ul.docs-list {
  display: flex;
  flex-flow: wrap;
  gap: var(--pad-gap);
  padding: 0px;
  margin: 0px;
}

.tabs__panel > ul.docs-list .docs-list__item {
  display: block;
}

.tabs__panel > ul.docs-list .docs-list__item > a {
  display: flex;
  width: 100%;
  position: relative;
  flex-direction: column;
  padding: var(--pad-inner);
  min-height: 280px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  overflow: hidden;
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
  align-content: center;
  justify-content: center;
}

.tabs__panel > ul.docs-list .docs-list__item > a {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  text-align: center;
}

.tabs__panel > ul.docs-list .docs-list__item > a:hover {
  color: var(--font-dark-color);
  border-color: var(--accent-color-01);
}

.tabs__panel > ul.docs-list .docs-list__item > a::before {
  content: "";
  display: block;
  width: var(--pad-y);
  height: var(--pad-y);
  /* делаем черно-белой */
  filter: grayscale(1);
  transition: filter 0.3s ease;
}

.tabs__panel > ul.docs-list .docs-list__item > a.pdf::before {
  background: url("../img/pdf_ico.png") center/contain no-repeat;
}

.tabs__panel > ul.docs-list .docs-list__item > a.word::before {
  background: url("../img/word_ico.png") center/contain no-repeat;
}

.tabs__panel > ul.docs-list .docs-list__item > a.excel::before {
  background: url("../img/excel_ico.png") center/contain no-repeat;
}

.tabs__panel > ul.docs-list .docs-list__item > a.png::before {
  background: url("../img/png_ico.png") center/contain no-repeat;
}

.tabs__panel > ul.docs-list .docs-list__item > a.jpg::before {
  background: url("../img/jpg_ico.png") center/contain no-repeat;
}

.tabs__panel > ul.docs-list .docs-list__item > a:hover::before {
  /* возвращаем цвет */
  filter: grayscale(0);
}

/* ==========================================================================
   DESKTOP CATALOG MEGA MENU (layout)
   ========================================================================= */
.zpm-catalog[hidden] {
  display: none;
}

.zpm-catalog {
  position: absolute;
  top: 100%;
  left: auto;
  right: auto;
  z-index: 200;
  width: 100%;
}

.zpm-catalog__panel {
  display: flex;
  width: 100%;
  max-width: calc(var(--container) + var(--pad-gap) + var(--pad-gap));
  flex-flow: column;
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  box-sizing: border-box;
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
  margin-top: var(--popup-custom-Top-correct);
  gap: var(--pad-gap);
  background: var(--main-light-color);
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
}

.goto_sticky .zpm-catalog__panel {
  margin-top: 12px;
}

.zpm-catalog__last-block {
  display: flex;
  justify-content: flex-end;
  gap: var(--pad-box);
}

.btn__close {
  width: 180px;
  gap: 5px;
  background-color: var(--accent-color-02);
  color: var(--font-light-color);
}

.btn__close .zpm-icon {
  width: 24px;
  height: 24px;
  color: var(--font-light-color);
}

.zpm-catalog__inner {
  min-height: 320px;
}

.zpm-catalog__inner {
  display: flex;
  gap: var(--pad-gap);
  position: relative;
}

.zpm-catalog__all {
  display: block;
  width: 100%;
}

.zpm-catalog__all > .btn--primary {
  width: 100%;
}

.zpm-catalog__all-link {
  gap: var(--pad-gap-mini);
}

.zpm-catalog__all-link > span {
  display: block;
  font-weight: 500;
}

.zpm-catalog__all-link > svg {
  display: block;
  width: 15px;
  height: 15px;
  margin-top: 1px;
}

.zpm-catalog__megamenu {
  position: relative;
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  width: 390px;
  min-width: 390px;
}

.zpm-catalog__wrapp {
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: var(--radius-main);
}

.zpm-catalog__wrapp-blur-box::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: var(--pad-y);
  bottom: calc(var(--pad-gap) + var(--pad-y));
  background: transparent;
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
}

.zpm-catalog__wrapp-blur-box {
  justify-content: space-between;
  width: 100%;
}

.zpm-catalog__wrapp-blur-box > .zpm-catalog__wrapp {
  max-height: 580px;
}

.zpm-catalog__cats {
  background-color: var(--font-light-color);
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  overflow: hidden;
}

.zpm-catalog__cats-list {
  margin: 0;
  list-style: none;
  display: grid;
  gap: 1px;
  overflow: hidden;
  padding: 15px 0px;
}

.zpm-catalog__cats-list > li {
  display: block;
  border-bottom: 1px solid var(--main-light-color);
}

.zpm-catalog__cats-list > li:last-child {
  border-bottom: none;
}

.zpm-catalog__cats-btn {
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-mini);
  padding: 15px 30px;
  border: none;
  background: none;
  cursor: pointer;
  font-weight: 500;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-catalog__cats-btn:hover {
  color: var(--font-light-color);
  background-color: var(--main-dark-color);
}

.zpm-catalog__cats-btn.is-active {
  background-color: var(--second-light-color);
  color: var(--font-dark-color);
}

.zpm-catalog__content {
  min-width: 0;
}

.zpm-catalog__pane {
  display: none;
}

.zpm-catalog__pane.is-active {
  display: block;
}

.zpm-catalog__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--pad-gap);
  padding-bottom: var(--pad-y);
  box-sizing: border-box;
}

.zpm-catalog__tile {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  min-width: 0;
  padding: 10px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--font-light-color);
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-catalog__tile:hover {
  border-color: var(--accent-color-01);
}

.zpm-catalog__tile-img {
  width: var(--img-mini-width);
  min-width: var(--img-mini-width);
  height: var(--img-mini-height);
  display: block;
  border-radius: var(--border-radius-form);
  padding: 5px;
  overflow: hidden;
}

.zpm-catalog__tile .zpm-catalog__tile-img > .noimage_plug {
  opacity: 0.5;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-catalog__tile:hover .zpm-catalog__tile-img > .noimage_plug {
  opacity: 0.9;
}

.zpm-catalog__tile-block {
  display: flex;
  flex-flow: column;
  padding-left: calc(var(--pad-gap-mini) + var(--pad-gap-mini));
  box-sizing: border-box;
  position: relative;
  gap: 5px;
}

.zpm-catalog__tile-block::before {
  display: block;
  content: "";
  height: 100%;
  width: 1px;
  background-color: var(--border-color);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  transition: opacity 0.3s ease, background-color 0.3s ease, height 0.3s ease;
}

.zpm-catalog__tile:hover .zpm-catalog__tile-block::before {
  height: 130%;
  background-color: var(--accent-color-01);
}

.zpm-catalog__tile-title {
  display: block;
  font-weight: 500;
}

.zpm-catalog__tile-list-counter {
  display: flex;
  flex-flow: wrap;
  gap: 0px 5px;
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-catalog__tile-list-subcat {
  display: flex;
  padding: var(--pad-gap-mini) 0px 0px;
  flex-flow: wrap;
  gap: 5px 10px;
}

.zpm-catalog__tile-list-subcat > li {
  display: flex;
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

/* hide on mobile/tablet (ты перенесёшь в offcanvas) */
@media (max-width: 1024px) {
  .zpm-catalog {
    display: none !important;
  }
}
/* ==========================================================================
   Catalog Sections (big)
   ========================================================================= */
.zpm-cat-sections__grid-wrapper {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.zpm-cat-sections__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pad-gap);
}

/* Карточка */
.zpm-cat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--pad-inner);
  min-height: 300px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  overflow: hidden;
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

/* стеклянный блик */
.zpm-cat-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.45) 50%, transparent 70%);
  transform: translateX(-120%);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.3s ease;
  pointer-events: none;
}

/* hover */
.zpm-cat-card:hover {
  color: var(--font-dark-color);
  border-color: var(--main-dark-color);
  background: var(--second-light-color);
  background: linear-gradient(140deg, rgb(247, 248, 253) 20%, rgb(225, 232, 240) 80%);
}

.zpm-cat-card:hover::after {
  transform: translateX(120%);
  opacity: 1;
}

.zpm-cat-card__ico_arrow {
  position: absolute;
  z-index: 2;
  background-color: var(--font-light-color);
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: var(--pad-inner);
  right: var(--pad-inner);
  width: 90px;
  height: 90px;
  opacity: 0.9;
  border-radius: var(--radius-full);
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.zpm-cat-card__ico_arrow > .zpm-icon {
  width: 30px;
  height: 30px;
  transition: width 0.3s ease, opacity 0.3s ease, height 0.3s ease;
  opacity: 0.7;
}

.zpm-cat-card:hover .zpm-cat-card__ico_arrow > .zpm-icon {
  opacity: 0.9;
}

.zpm-cat-card:hover .zpm-cat-card__ico_arrow {
  border-color: var(--main-dark-color);
  border-width: 10px;
  opacity: 1;
  background-color: var(--font-light-color);
}

.zpm-cat-card__ico_arrow:before {
  position: absolute;
  z-index: 2;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 90px;
  opacity: 0, 7;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--second-light-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-cat-card:hover .zpm-cat-card__ico_arrow::before {
  border-width: 1px;
  border-color: var(--main-dark-color);
}

.zpm-cat-card__ico_arrow:after {
  position: absolute;
  z-index: 1;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 90px;
  opacity: 0;
  border-radius: var(--radius-full);
  border-width: 0px;
  border-style: solid;
  border-color: var(--main-dark-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-cat-card:hover .zpm-cat-card__ico_arrow::after {
  opacity: 1;
  border-width: 100px;
  border-color: rgba(var(--main-light-color-opcity));
}

.zpm-cat-card__title {
  max-width: 190px;
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
  position: relative;
  z-index: 2;
}

.zpm-cat-card__img {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--pad-gap-line) 0;
  position: relative;
  z-index: 1;
}

.zpm-cat-card__img img {
  max-height: 300px;
  -o-object-fit: contain;
  object-fit: contain;
}

/* ==========================================================================
   sub Catalog Sections (mini)
   ========================================================================= */
.zpm-sub-cat-sections__grid-wrapper {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.zpm-sub-cat-sections__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

/* Карточка */
.zpm-sub-cat-card {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
  padding: 20px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  overflow: hidden;
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

/* стеклянный блик */
.zpm-sub-cat-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.45) 50%, transparent 70%);
  transform: translateX(-120%);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.3s ease;
  pointer-events: none;
}

/* hover */
.zpm-sub-cat-card:hover {
  color: var(--font-dark-color);
  border-color: var(--main-dark-color);
  background: var(--second-light-color);
  background: linear-gradient(140deg, rgb(247, 248, 253) 20%, rgb(225, 232, 240) 80%);
}

.zpm-sub-cat-card:hover::after {
  transform: translateX(120%);
  opacity: 1;
}

.zpm-sub-cat-card__ico_arrow {
  position: absolute;
  z-index: 2;
  background-color: var(--font-light-color);
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: var(--pad-inner);
  right: var(--pad-inner);
  width: 90px;
  height: 90px;
  opacity: 0.9;
  border-radius: var(--radius-full);
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.zpm-sub-cat-card__ico_arrow > .zpm-icon {
  width: 30px;
  height: 30px;
  transition: width 0.3s ease, opacity 0.3s ease, height 0.3s ease;
  opacity: 0.7;
}

.zpm-sub-cat-card:hover .zpm-sub-cat-card__ico_arrow > .zpm-icon {
  opacity: 0.9;
}

.zpm-sub-cat-card:hover .zpm-sub-cat-card__ico_arrow {
  border-color: var(--main-dark-color);
  border-width: 10px;
  opacity: 1;
  background-color: var(--font-light-color);
}

.zpm-sub-cat-card__ico_arrow:before {
  position: absolute;
  z-index: 2;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 90px;
  opacity: 0, 7;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--second-light-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-sub-cat-card:hover .zpm-sub-cat-card__ico_arrow::before {
  border-width: 1px;
  border-color: var(--main-dark-color);
}

.zpm-sub-cat-card__ico_arrow:after {
  position: absolute;
  z-index: 1;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 90px;
  opacity: 0;
  border-radius: var(--radius-full);
  border-width: 0px;
  border-style: solid;
  border-color: var(--main-dark-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-sub-cat-card:hover .zpm-sub-cat-card__ico_arrow::after {
  opacity: 1;
  border-width: 100px;
  border-color: rgba(var(--main-light-color-opcity));
}

.zpm-sub-cat-card__title {
  font-size: 16px;
  line-height: 22px;
  font-weight: var(--large-Font-weight);
  position: relative;
  z-index: 2;
}

.zpm-sub-cat-card__img {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  /* padding: var(--pad-gap-line) 0; */
  position: relative;
  z-index: 1;
  width: 50px;
  max-width: 50px;
  min-width: 50px;
}

.zpm-sub-cat-card__img img {
  -o-object-fit: contain;
  object-fit: contain;
}

/* ==========================================================================
   ARTICLES
   ========================================================================= */
.rel-articles {
  display: block;
}

.zpm-rel-articles-card {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  overflow: hidden;
  position: relative;
  background-color: var(--font-light-color);
}

.zpm-rel-articles-card__top {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

.zpm-rel-articles-card__img {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--second-light-color);
  border-radius: var(--radius-main);
  overflow: hidden;
}

.zpm-rel-articles-card__img > img {
  display: block;
}

.zpm-rel-articles-card__title {
  display: block;
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
  padding-right: 15%;
  min-height: 90px;
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__title {
  color: var(--accent-color-01);
}

.zpm-rel-articles-card:hover .zpm-icon {
  color: var(--accent-color-01);
  fill: var(--accent-color-01);
}

.zpm-rel-articles-card__bottom {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}

.zpm-rel-articles-card__meta {
  display: flex;
  flex-flow: wrap;
  gap: var(--pad-gap-mini) var(--pad-gap-line);
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-rel-articles-card__meta > div {
  display: flex;
  flex-flow: wrap;
  gap: 5px;
}

.zpm-rel-articles-card__meta > div > b {
  display: block;
  font-weight: 400;
}

.zpm-rel-articles-card__meta > div > span {
  display: block;
}

.zpm-rel-articles-card__bottom-wrap {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  align-items: flex-end;
}

.zpm-rel-articles-card__anonce {
  display: block;
  color: var(--font-dark-color);
  padding-right: 100px;
  height: 120px;
  box-sizing: border-box;
  overflow: hidden;
}

.zpm-rel-articles-card__anonce > div {
  display: block;
}

.zpm-rel-articles-card__ico_arrow {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: var(--pad-gap-line);
  right: var(--pad-gap-line);
  width: 60px;
  height: 60px;
  border-radius: var(--radius-full);
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.zpm-rel-articles-card__ico_arrow > .zpm-icon {
  width: 20px;
  height: 20px;
  transition: width 0.3s ease, opacity 0.3s ease, height 0.3s ease;
  opacity: 0.7;
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow > .zpm-icon {
  opacity: 0.9;
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow {
  border-color: var(--main-dark-color);
  border-width: 10px;
  opacity: 1;
  background-color: var(--font-light-color);
}

.zpm-rel-articles-card__ico_arrow:before {
  position: absolute;
  z-index: 2;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  opacity: 0, 7;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--second-light-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow::before {
  border-width: 1px;
  border-color: var(--main-dark-color);
}

.zpm-rel-articles-card__ico_arrow:after {
  position: absolute;
  z-index: 1;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  opacity: 0;
  border-radius: var(--radius-full);
  border-width: 0px;
  border-style: solid;
  border-color: var(--main-dark-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow::after {
  opacity: 1;
  border-width: 70px;
  border-color: rgba(var(--main-light-color-opcity));
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow:hover {
  background-color: var(--main-dark-color);
}

.zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

/* ==========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1199px) {
  .zpm-cat-sections__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .zpm-cat-sections {
    padding: 40px 0 60px;
  }
  .zpm-cat-sections__grid {
    gap: 20px;
  }
  .zpm-cat-card {
    min-height: 240px;
    padding: 20px;
    border-radius: 20px;
  }
  .zpm-cat-card__img img {
    max-height: 150px;
  }
  .zpm-cat-card__arrow {
    right: 18px;
    bottom: 18px;
  }
}
.zpm-popup_manager__head {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  min-height: 40px;
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}

/* ==========================================================================
   ADVANTAGES TOP
   ========================================================================= */
.zpm-adv-top {
  padding: 100px 0;
}

.zpm-adv-top__grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 80px;
  align-items: start;
}

.zpm-adv-top__title {
  font-size: 48px;
  line-height: 1.1;
  margin: 0 0 32px 0;
}

.zpm-adv-top__more {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

/* карточки преимуществ */
.zpm-adv-cards__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--pad-gap);
}

.zpm-adv-card {
  border-radius: var(--radius-main);
  overflow: hidden;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.zpm-adv-card__txt {
  padding: 30px 0px 0px 30px;
  box-sizing: border-box;
  max-width: 300px;
  display: flex;
  flex-flow: column;
  gap: 20px;
}

.zpm-adv-card__txt > h3 {
  margin: 0;
  max-width: 260px;
}

.block_version .zpm-adv-card {
  background-color: var(--main-light-color);
}
.block_version .zpm-adv-card:nth-child(2), .block_version .zpm-adv-card:nth-child(3) {
  background: var(--main-dark-color);
  color: #fff;
}

/* 560px и ниже */
@media (max-width: 390px) {
  .block_version .zpm-adv-card:nth-child(3) {
    background: var(--main-light-color);
    color: var(--main-dark-color);
  }
  .block_version .zpm-adv-card:nth-child(2), .block_version .zpm-adv-card:nth-child(4) {
    background: var(--main-dark-color);
    color: #fff;
  }
}
.line_version .zpm-adv-card {
  background-color: var(--main-light-color);
}
.line_version .zpm-adv-card:nth-child(2), .line_version .zpm-adv-card:nth-child(4) {
  background: var(--main-dark-color);
  color: #fff;
}

.zpm-adv-card__title {
  margin: 0;
  max-width: 200px;
  padding: 30px 0px 0px 30px;
  box-sizing: border-box;
}

.about-adv__title {
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-adv-card__img img {
  max-width: 100%;
  height: auto;
  transition: all 0.3s ease;
}

/* ==========================================================================
   DEALERS + FORM
   ========================================================================= */
.zpm-dealers {
  padding: 120px 0;
}

.zpm-dealers__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}

.zpm-dealers__title {
  font-size: 48px;
  line-height: 1.1;
  margin: 0 0 32px 0;
}

.zpm-dealers__text > p {
  margin-bottom: var(--pad-box);
}

.zpm-dealers__text > p:last-child {
  margin-bottom: 0px;
}

/* ==========================================================================
   FORM
   ========================================================================= */
.zpm-form__grid {
  display: flex;
  gap: var(--pad-gap);
  flex-flow: column;
}

.zpm-form__field {
  display: grid;
  gap: var(--pad-gap-mini);
}

.zpm-login__restore {
  display: flex;
  flex-flow: revert;
  gap: var(--pad-gap-mini);
  align-items: center;
  justify-content: flex-start;
}

.zpm-login__restore:hover {
  color: var(--accent-color-02);
}

.zpm-login__restore .zpm-help_ico {
  width: 30px;
  height: 30px;
  min-width: 30px;
  font-size: 16px;
  line-height: 16px;
}

.zpm-form__label > em {
  font-style: normal;
  color: var(--accent-color-02);
  padding-left: 5px;
  font-weight: 700;
}

.zpm-form__check-text > em {
  font-style: normal;
  color: var(--accent-color-02);
  padding-right: 5px;
  font-weight: 700;
}

.zpm-form__input,
.zpm-form__textarea {
  width: 100%;
  border-radius: var(--border-radius-form);
  padding: 16px 18px;
  font-size: var(--mini-Font-size);
}

.zpm-form__textarea {
  resize: vertical;
}

.zpm-form__phone {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
}

.zpm-form__flag {
  width: 28px;
  height: 18px;
  flex-shrink: 0;
}

.zpm-form__actions {
  display: grid;
  gap: var(--pad-gap-line);
}

.zpm-form__actions.remember-wrap {
  display: flex;
  gap: var(--pad-gap);
  flex-flow: row;
}

.zpm-form__actions.remember-wrap input[type=checkbox] {
  height: 60px;
  width: 60px;
  min-width: 60px;
}

.zpm-form__actions.remember-wrap .zpm-form__agree-text {
  font-size: 18px;
  line-height: 22px;
}

.zpm-form__actions.remember-wrap > button {
  width: 100%;
}

.zpm-form__submit.btn:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}
.zpm-form__submit.btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-form__agree {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  cursor: pointer;
}

.zpm-form__agree-text > a {
  text-decoration: underline;
}

.zpm-form__checkbox {
  margin-top: 3px;
}

/* ==========================================================================
   ADVANTAGES BOTTOM
   ========================================================================= */
.zpm-adv-bottom {
  padding: 80px 0 120px 0;
}

.zpm-adv-cards__grid--row4 {
  grid-template-columns: repeat(4, 1fr);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 1199px) {
  .zpm-adv-top__grid,
  .zpm-dealers__grid {
    gap: 48px;
  }
}
@media (max-width: 1024px) {
  .zpm-adv-top {
    padding: 80px 0;
  }
  .zpm-dealers {
    padding: 80px 0;
  }
  .zpm-adv-cards__grid--row4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 580px) {
  .zpm-adv-top__title,
  .zpm-dealers__title {
    font-size: 34px;
  }
  .zpm-adv-top__grid,
  .zpm-dealers__grid {
    grid-template-columns: 1fr;
  }
  .zpm-form__actions.remember-wrap {
    flex-flow: column-reverse;
    justify-content: center;
    align-items: center;
  }
  .zpm-form__actions.remember-wrap input[type=checkbox] {
    height: 30px;
    width: 32px;
    min-width: 30px;
  }
}
/* ==========================================================================
   About teaser (layout only)
   ========================================================================= */
.zpm-about {
  position: relative;
}

/* ==========================================================================
   Страница О КОМПАНИИ
   ========================================================================= */
.about-page--big-media-capture {
  padding: 0px;
}

.about-page--big-media-capture > img {
  display: block;
  width: 100%;
}

.about-page--main-wrap {
  display: flex;
  flex-flow: row;
  gap: var(--pad-inner);
}

.about-page--main-text {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  width: 100%;
  justify-content: space-between;
}

.about-page--main-text > h2 {
  max-width: 520px;
}

.about-page--main-text > p {
  padding-right: 10%;
}

.about-page--main-img {
  display: flex;
  width: 100%;
}

.about-page--main-img > img {
  display: block;
  width: 100%;
}

.about-page-video {
  position: relative;
  overflow: hidden;
  width: 100%;
  line-height: 0;
}

.about-page-video__media {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  pointer-events: none;
  max-height: 70vh;
}

.about-page-video__scroll-btn {
  position: absolute;
  left: 50%;
  bottom: 10%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  height: 60px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.about-page-video__scroll-btn .zpm-icon {
  transform: rotate(90deg);
}

.about-page-video__scroll-btn:hover {
  transform: translateX(-50%) translateY(-3px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.about-page-video__scroll-btn:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
}
.about-page-video__scroll-btn:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.about-page--sert-promo-wrap {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
  max-width: 1440px;
  margin-bottom: var(--pad-inner);
}

.about-page--geo-promo-wrap {
  display: flex;
  flex-flow: row;
  gap: var(--pad-inner);
}

.about-page--geo-promo-wrap > div {
  display: flex;
  width: 100%;
  flex-flow: column;
  justify-content: center;
}

.about-page--geo-promo-wrap > div.about-page--geo-promo-img {
  display: flex;
  align-items: flex-end;
}

.about-page--geo-promo-wrap > div.about-page--geo-promo-img > img {
  display: block;
  max-width: 600px;
}

/* ======================================================
   CART PAGE
====================================================== */
.zpm-cart-page__product-title {
  display: block;
}

.zpm-cart-page__product-art {
  display: block;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-cart-page__product-art b,
.zpm-cart-page__product-art .zpm-copy__value {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-cart-page__price {
  display: flex;
  flex-direction: column;
}

.zpm-cart-page__price > strong {
  font-weight: var(--large-Font-weight);
}

.zpm-cart-page__price > span {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  color: var(--gray-color);
  text-decoration: line-through;
}

.zpm-cart-page__status {
  display: flex;
  align-items: flex-start;
  gap: 0px;
}

.zpm-cart-page__qty {
  display: flex;
  align-items: center;
  gap: 10px;
}

.zpm-cart-page__sum {
  display: block;
}

.zpm-cart-total__rows {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

.zpm-cart-total__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-line);
}

.zpm-cart-total__promo {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

.zpm-cart-page .btn-qty--toogle {
  width: 170px;
}

/* ======================================================
   ACCOUNT ORDERS
====================================================== */
.zpm-account-orders {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
}

.zpm-account-orders__title {
  margin: 0;
}

.zpm-account-orders__table {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  overflow: hidden;
}

.zpm-account-orders__head {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
  min-height: 64px;
  padding: 0 var(--pad-box);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--border-color);
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-account-orders__head-col {
  min-width: 0;
}

.zpm-account-orders__head-col--number {
  width: 220px;
  min-width: 220px;
  flex: 0 0 220px;
}

.zpm-account-orders__head-col--date {
  width: 210px;
  min-width: 210px;
  flex: 0 0 210px;
}

.zpm-account-orders__head-col--status {
  width: 220px;
  min-width: 220px;
  flex: 0 0 220px;
}

.zpm-account-orders__head-col--sum {
  width: 100%;
  flex: 1 1 auto;
}

.zpm-account-orders__head-col--action {
  width: 56px;
  min-width: 56px;
  flex: 0 0 56px;
}

.zpm-account-orders__body {
  display: flex;
  flex-direction: column;
}

.zpm-account-orders__item {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
  min-height: 74px;
  padding: 0 var(--pad-box);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--border-color);
}

.zpm-account-orders__item:last-child {
  border-bottom: 0;
}

.zpm-account-orders__col {
  min-width: 0;
}

.zpm-account-orders__col--number {
  width: 220px;
  min-width: 220px;
  flex: 0 0 220px;
}

.zpm-account-orders__col--date {
  width: 190px;
  min-width: 190px;
  flex: 0 0 190px;
}

.zpm-account-orders__col--status {
  width: 170px;
  min-width: 170px;
  flex: 0 0 170px;
}

.zpm-account-orders__col--sum {
  width: 100%;
  flex: 1 1 auto;
}

.zpm-account-orders__col--action {
  width: 56px;
  min-width: 56px;
  flex: 0 0 56px;
  display: flex;
  justify-content: flex-end;
}

.zpm-account-orders__value {
  display: block;
}

.zpm-account-orders__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background-color: var(--main-light-color);
  transition: background-color 0.3s ease, color 0.3s ease;
}

.zpm-account-orders__link:hover {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 10px;
  border-width: 1px;
  border-style: solid;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  white-space: nowrap;
  min-width: 130px;
}

.zpm-status--processing {
  border-color: var(--main-dark-color);
  color: var(--main-dark-color);
}

.zpm-status--done {
  border-color: var(--accent-color-01);
  color: var(--accent-color-01);
}

.zpm-status--cancel {
  border-color: var(--accent-color-02);
  color: var(--accent-color-02);
}

@media (max-width: 960px) {
  .zpm-account-orders__head {
    display: none;
  }
  .zpm-account-orders__table {
    gap: 14px;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .zpm-account-orders__body {
    gap: 14px;
  }
  .zpm-account-orders__item {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    min-height: 0;
    padding: 20px;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-main);
  }
  .zpm-account-orders__col--number,
  .zpm-account-orders__col--date,
  .zpm-account-orders__col--status,
  .zpm-account-orders__col--sum,
  .zpm-account-orders__col--action {
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
  }
  .zpm-account-orders__col--number,
  .zpm-account-orders__col--date,
  .zpm-account-orders__col--status,
  .zpm-account-orders__col--sum {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .zpm-account-orders__col--number::before,
  .zpm-account-orders__col--date::before,
  .zpm-account-orders__col--status::before,
  .zpm-account-orders__col--sum::before {
    content: attr(data-label);
    font-size: var(--large-Font-size);
    line-height: var(--large-Line-height);
    font-weight: var(--large-Font-weight);
    color: var(--font-dark-color);
  }
  .zpm-account-orders__col--action {
    justify-content: stretch;
  }
  .zpm-account-orders__link {
    width: 100%;
    height: 54px;
    border-radius: 14px;
    font-size: var(--large-Font-size);
    line-height: var(--large-Line-height);
    font-weight: var(--large-Font-weight);
  }
  .zpm-account-orders__link .zpm-icon {
    display: none;
  }
  .zpm-account-orders__link::before {
    content: "Просмотр заказа";
  }
}
@media (max-width: 410px) {
  .zpm-account-orders__col--number,
  .zpm-account-orders__col--date,
  .zpm-account-orders__col--status,
  .zpm-account-orders__col--sum {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
}
.page--account-all-orders .user-account__like-h2 {
  margin-bottom: var(--pad-gap);
}

.user-account--all-orders--empty p {
  margin-bottom: var(--pad-inner);
}

.user-account__header {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap);
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--pad-gap);
}

/* ======================================================
   CHECKOUT PAGE
====================================================== */
.zpm-checkout-page {
  position: relative;
}

.zpm-checkout-page [hidden] {
  display: none !important;
}

.zpm-checkout-page__main {
  min-width: 0;
}

.zpm-checkout-page__aside {
  min-width: 0;
}

.zpm-checkout-page__box {
  position: relative;
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.zpm-checkout-page__top {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
}

.zpm-checkout-page__login-note {
  display: block;
}

.zpm-checkout-page__promo-note {
  display: block;
  padding: var(--pad-gap-mini) var(--pad-gap);
  border-radius: var(--radius-main);
  background-color: rgba(255, 255, 255, 0.5);
}

.zpm-checkout-page__promo-note a {
  text-decoration: underline;
}

.zpm-checkout-form {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-line);
}

.zpm-form__grid--checkout {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pad-gap);
}

.zpm-form__grid--checkout .zpm-form__field {
  width: calc(50% - var(--pad-gap) / 2);
}

.zpm-form__grid--checkout .zpm-form__field--full {
  width: 100%;
}

.zpm-form__grid--checkout .zpm-form__field--quarter {
  width: calc(25% - var(--pad-gap) * 3 / 4);
}

.zpm-form__textarea {
  display: block;
  width: 100%;
  min-height: 110px;
  resize: vertical;
}

.zpm-checkout-total {
  position: relative;
  display: flex;
  flex-flow: column;
  width: 100%;
  gap: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  background-color: var(--main-light-color);
}

.zpm-checkout-total__title {
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-checkout-total__list {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
}

.zpm-checkout-total__item {
  display: flex;
  align-items: flex-start;
  gap: var(--pad-gap-mini);
}

.zpm-checkout-total__img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  min-width: 56px;
  flex: 0 0 56px;
}

.zpm-checkout-total__img img {
  display: block;
  width: 100%;
  height: auto;
}

.zpm-checkout-total__info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 auto;
}

.zpm-checkout-total__name {
  display: block;
}

.zpm-checkout-total__art {
  display: block;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-checkout-total__art .zpm-copy__value {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-checkout-total__price {
  min-width: -moz-max-content;
  min-width: max-content;
  white-space: nowrap;
  font-weight: var(--large-Font-weight);
}

.zpm-checkout-total__rows {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

.zpm-checkout-total__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-line);
}

.zpm-checkout-total__row--result {
  font-weight: var(--large-Font-weight);
}

.zpm-checkout-total__agree {
  margin-top: 0;
}

.zpm-checkout-total__submit {
  width: 100%;
}

/* ======================================================
   CHECKOUT SWITCH
====================================================== */
.zpm-checkout-form__delivery-toggle {
  display: block;
}

.zpm-checkout-switch {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  cursor: pointer;
}

.zpm-checkout-switch__text {
  order: 1;
  flex: 1 1 auto;
  font-size: var(--mini-Font-size);
  line-height: 1.25;
  font-weight: 600;
}

.zpm-checkout-switch__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.zpm-checkout-switch__ui {
  order: 2;
  flex: 0 0 auto;
  width: 52px;
  height: 30px;
  border-radius: var(--radius-full);
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: rgba(0, 0, 0, 0.05);
  transition: background 0.3s ease, border-color 0.3s ease;
}

.zpm-checkout-switch__ui::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.18);
  transition: transform 0.3s ease, background 0.3s ease;
}

.zpm-checkout-switch.active .zpm-checkout-switch__ui {
  background: var(--accent-color-01);
  border-color: #1d6a4d;
}

.zpm-checkout-switch__input:checked + .zpm-checkout-switch__ui::before {
  transform: translateX(22px);
}

/* ======================================================
   CHECKOUT AUTH / STEPS
====================================================== */
.zpm-checkout-auth__actions {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

.zpm-checkout-auth__login,
.zpm-checkout-auth__success,
.zpm-checkout-form__register,
.zpm-checkout-form__delivery,
.zpm-checkout-form__comment {
  flex-direction: column;
  gap: var(--pad-gap);
}

.zpm-checkout-auth__login:not([hidden]),
.zpm-checkout-auth__success:not([hidden]),
.zpm-checkout-form__register:not([hidden]),
.zpm-checkout-form__delivery:not([hidden]),
.zpm-checkout-form__comment:not([hidden]) {
  display: flex;
}

.zpm-checkout-form__section-title {
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-checkout-form__section-text {
  display: block;
}

.zpm-checkout-form__actions {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

/* ======================================================
   RESPONSIVE
====================================================== */
@media (max-width: 1310px) {
  .zpm-checkout-page__layout {
    grid-template-columns: 1fr 380px;
  }
}
@media (max-width: 1024px) {
  .zpm-checkout-page__layout {
    grid-template-columns: 1fr;
  }
  .zpm-checkout-page__aside {
    order: -1;
  }
}
@media (max-width: 767px) {
  .zpm-checkout-page__top {
    flex-wrap: wrap;
  }
  .zpm-checkout-auth__actions {
    width: 100%;
  }
  .zpm-checkout-auth__actions .btn {
    width: 100%;
  }
  .zpm-form__grid--checkout .zpm-form__field {
    width: 100%;
  }
  .zpm-form__grid--checkout .zpm-form__field--quarter {
    width: calc(50% - var(--pad-gap) / 2);
  }
}
@media (max-width: 490px) {
  .zpm-form__grid--checkout .zpm-form__field--quarter {
    width: 100%;
  }
  .zpm-checkout-total__item {
    align-items: flex-start;
  }
}
.zpm-checkout-fade {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.zpm-checkout-fade.is-active {
  opacity: 1;
  visibility: visible;
}

/* ======================================================
   FORM ROW (2 fields per row)
   универсальная строка формы
====================================================== */
.zpm-form__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pad-gap);
}

.zpm-form__row > .zpm-form__field {
  width: calc(50% - var(--pad-gap) / 2);
}

.zpm-form__row > .zpm-form__field--full {
  width: 100%;
}

@media (max-width: 767px) {
  .zpm-form__row > .zpm-form__field {
    width: 100%;
  }
}
/* ======================================================
   LOGIN PAGE
====================================================== */
.zpm-login {
  position: relative;
}

.zpm-Form__box {
  gap: calc(var(--pad-inner) + var(--pad-inner));
  border: 1px solid var(--border-color);
  position: relative;
  display: flex;
  flex-flow: row;
  padding: var(--pad-inner);
  min-height: 300px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.zpm-Form__box .section-title__like-h2 {
  margin-bottom: 0px;
}

.zpm-Form__box .zpm-form__radio-group {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap);
}

.zpm-Form__box input[type=radio] {
  height: 30px;
  width: 30px;
  min-width: 30px;
}

.zpm-Form__box .zpm-form__radio {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  align-content: center;
  align-items: center;
  cursor: pointer;
}

/* ======================================================
   AUTH BLOCK
====================================================== */
.zpm-login__auth {
  display: flex;
  flex-direction: column;
  width: 100%;
  box-sizing: border-box;
  gap: var(--pad-gap);
  justify-content: center;
}

.zpm-login__form {
  position: relative;
}

.zpm-login__submit {
  width: 100%;
}

.zpm-login__remember {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* ======================================================
   REGISTER BLOCK
====================================================== */
.zpm-login__register {
  display: flex;
  position: relative;
  flex-flow: column;
  width: 100%;
  box-sizing: border-box;
  gap: var(--pad-gap);
  justify-content: space-between;
}

.zpm-register .zpm-login__register {
  justify-content: flex-start;
}

.zpm-login__register:before {
  display: block;
  content: "";
  width: 1px;
  height: 100%;
  position: absolute;
  top: 0px;
  left: calc(0px - var(--pad-inner));
  background-color: var(--border-color);
}

.zpm-checkout-page .zpm-login__register::before {
  display: none;
}

.zpm-Form__box-top-head {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.zpm-Form__box-head {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
}

.zpm-Form__box-text {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}

.zpm-login__register-btn {
  margin-top: 0px;
}

/* ======================================================
   FORM FIELDS
====================================================== */
.zpm-form-field {
  margin-bottom: 0px;
}

.zpm-form-field__label {
  display: block;
}

.zpm-form-field__input {
  width: 100%;
}

.zpm-form-field__password {
  position: relative;
}

.zpm-form-field__toggle {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: none;
  background: none;
  cursor: pointer;
}

.zpm-form-success {
  display: flex;
  flex-direction: column;
  width: 100%;
  box-sizing: border-box;
  gap: var(--pad-gap);
  align-items: center;
  text-align: center;
  max-width: 380px;
  align-self: center;
}

/* ======================================================
   MOBILE
====================================================== */
@media (max-width: 1024px) {
  .zpm-Form__box {
    flex-flow: column;
    gap: var(--pad-y);
    background: transparent;
    padding: 0px;
    border-width: 0px;
  }
  .zpm-login__register::before {
    display: none;
  }
  .zpm-Form__box > div {
    border: 1px solid var(--border-color);
    padding: var(--pad-inner);
    min-height: 300px;
    border-radius: var(--radius-main);
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    background-color: var(--main-light-color);
  }
}
.certificates__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}
.certificates__nav {
  display: flex;
  gap: var(--pad-gap-line);
}
.certificates__nav--mobile {
  display: none;
}
.certificates__btn {
  width: 56px;
  height: 56px;
  padding: 0;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  cursor: pointer;
}
.certificates__slider {
  margin-top: 20px;
}
.certificates__card {
  display: block;
}
.certificates__img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

/* ==========================================================================
   Category Layout (carcass)
   ========================================================================= */
.category__layout {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: var(--pad-gap);
  align-items: start;
}
.category__sidebar {
  /* на десктопе показываем сайдбар */
  position: relative;
}
.category__content {
  min-width: 0;
}
.category__topbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--pad-gap-line);
  margin-bottom: var(--pad-gap-line);
}
.category__sort {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}
.category__sort-btn {
  border-color: var(--border-color);
  background: transparent;
  padding: 0px 30px;
  height: 50px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  cursor: pointer;
}
.category__sort-menu {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 10px;
  z-index: 5;
  min-width: 250px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: #fff;
  padding: 20px;
  border-radius: var(--radius-main);
}
.category__sort-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.category__filters-btn {
  padding: 0px 30px;
  height: 50px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  cursor: pointer;
  color: #fff;
}
.category__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pad-gap);
}
@media (max-width: 1024px) {
  .category__layout {
    grid-template-columns: 1fr;
  }
  .category__sidebar {
    /* на мобиле сайдбар скрыт, открываем кнопкой */
    display: block;
  }
  .category__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--pad-gap-line);
  }
}
@media (min-width: 1025px) {
  .category__filters-btn {
    display: none;
  }
  .category__sidebar {
    /* на десктопе сайдбар всегда виден */
    display: block;
  }
  .category .category__sidebar > div {
    gap: var(--pad-box);
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    background-color: var(--main-light-color);
    padding: var(--pad-box);
    border-radius: var(--radius-main);
  }
}

.category-list .category__grid,
.page--account-order .category__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pad-gap);
}

.page--account-password .user-account__like-h2 {
  margin-bottom: var(--pad-gap);
}

.page--account-order .p-card__title {
  display: inline-flex;
  align-items: flex-end;
}

.page--account-order .p-card__buy-ok {
  display: none;
}

/* ==========================================================================
   Filters carcass
   ========================================================================= */
.filters__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-line);
  margin-bottom: 12px;
}
.filters__close {
  width: 40px;
  height: 40px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  cursor: pointer;
}
.filters__group {
  border: 0;
  padding: 0;
  margin: 0 0 16px;
}
.filters__legend {
  margin: 0 0 10px;
  font-weight: 600;
}
.filters__range {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.filters__input {
  width: 100%;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  padding: 10px 12px;
}
.filters__switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.filters__switch-ui {
  width: 46px;
  height: 26px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  display: inline-block;
}
.filters__check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
}
.filters__scroll {
  max-height: 180px;
  overflow: auto;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 10px;
}
.filters__footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}
.filters__apply, .filters__reset {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  cursor: pointer;
  padding: 10px 12px;
}

/* ==========================================================================
   Product card carcass
   ========================================================================= */
.p-card.p-card--in-stock:hover {
  border-color: var(--accent-color-01);
}

.p-card.p-card--order:hover {
  border-color: var(--accent-color-02);
}

.p-card {
  display: flex;
  flex-direction: column;
  gap: var(--pad-box);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding-top: calc(var(--pad-box) * 5);
  padding-bottom: var(--pad-box);
  padding-left: var(--pad-box);
  padding-right: var(--pad-box);
  min-width: 0;
  border-radius: var(--radius-main);
  position: relative;
  box-sizing: border-box;
  background-color: var(--font-light-color);
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}
.p-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  position: absolute;
  top: var(--pad-box);
  left: var(--pad-box);
  right: var(--pad-box);
  z-index: 2;
}
.p-card__actions {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
  padding: 0px;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}
.p-card__action {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  background: var(--main-light-color);
  cursor: pointer;
  border: none;
}
.p-card__article {
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}
.p-card__media-wrap {
  display: block;
  flex-shrink: 0;
  position: relative;
}
.p-card__media {
  display: block;
  flex-shrink: 0;
}
.p-card__img {
  width: 100%;
  height: 160px;
  -o-object-fit: contain;
     object-fit: contain;
  display: block;
}
.p-card__body {
  display: grid;
  gap: var(--pad-gap-mini);
  margin-top: auto;
  height: 100%;
  align-content: flex-start;
}
.p-card__title {
  display: inline-block;
  text-decoration: none;
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
  height: 105px;
  overflow: hidden;
}
.p-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--pad-gap-line);
}
.p-card__btn {
  display: inline-block;
  padding: 10px 12px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  text-decoration: none;
}
.p-card__cart {
  width: 40px;
  height: 40px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  cursor: pointer;
}
.p-card__status {
  display: flex;
  flex-flow: column;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  gap: 5px;
}
@media (max-width: 1024px) {
  .p-card__img {
    height: 140px;
  }
}

.p-card__action.active {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
}

.p-card__action.active .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.p-card__action:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
}

.p-card__action:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.product-hero__meta {
  display: flex;
  flex-flow: wrap;
  gap: 10px;
  align-items: center;
}

.product-hero__meta > b,
.product-hero__meta > span {
  display: block;
}

.product-hero__meta > span {
  text-decoration: none;
}

.product-hero__meta > span:hover {
  color: var(--accent-color-01);
}

.p-card__status-Yes {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  color: var(--accent-color-01);
  white-space: nowrap;
}

.p-card__status-Yes:before {
  position: relative;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background-color: var(--accent-color-01);
  border-radius: var(--radius-full);
}

.p-card__status-None {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  color: var(--accent-color-02);
  white-space: nowrap;
}

.p-card__status-None:before {
  position: relative;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background-color: var(--accent-color-02);
  border-radius: var(--radius-full);
}

.p-card__delivery {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  color: var(--gray-color);
  white-space: nowrap;
  width: 100%;
}

.category-list {
  position: relative;
}

.message-if-empty {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap);
}

.message-if-empty > div, .message-if-empty > span {
  display: flex;
  flex-flow: column;
  width: 100%;
  gap: var(--pad-gap);
  justify-content: center;
  box-sizing: border-box;
}

.message-if-empty .section-title__like-h2 {
  margin-bottom: 0px;
}

.message-if-empty .img-decor {
  display: flex;
  padding: 10%;
  justify-content: center;
  align-items: center;
}

.message-if-empty .img-decor > img {
  display: block;
  width: 70%;
  height: auto;
}

.message-if-404 {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.message-if-404 > div, .message-if-404 > span {
  display: flex;
  flex-flow: column;
  width: 100%;
  gap: var(--pad-gap);
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
}

.message-if-404 > div > .txt {
  max-width: 660px;
  text-align: center;
}

.message-if-404 .section-title__like-h2 {
  margin-bottom: 0px;
}

.message-if-404 .img-decor {
  display: flex;
  align-items: center;
  justify-content: center;
}

.message-if-404 .img-decor > img {
  display: block;
  width: 50%;
  height: auto;
}

.blog-list {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
}

.blog-list__item {
  display: flex;
  flex-flow: row;
  gap: 30px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: 20px;
  border-radius: var(--radius-main);
  overflow: hidden;
  position: relative;
  background-color: var(--font-light-color);
}

.blog-list__item:hover {
  border-color: var(--main-dark-color);
}

.blog-list__item-img {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--pad-box);
  overflow: hidden;
}

.blog-list__item-img > img {
  display: block;
}

.blog-list__item-main {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
  justify-content: space-between;
  width: 100%;
}

.blog-list__item-main > div {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}

.blog-list__item__title {
  display: block;
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
  padding-right: 15%;
}

.blog-list__item:hover .blog-list__item__title {
  color: var(--accent-color-01);
}

.blog-list__item:hover .zpm-icon {
  color: var(--accent-color-01);
  fill: var(--accent-color-01);
}

.zpm-rel-articles-card__bottom {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
}

.blog-list__item__meta {
  display: flex;
  flex-flow: wrap;
  gap: var(--pad-gap-mini) var(--pad-gap-line);
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.blog-list__item__meta > div {
  display: flex;
  flex-flow: wrap;
  gap: 5px;
}

.blog-list__item__meta > div > b {
  display: block;
  font-weight: 400;
}

.blog-list__item__meta > div > span {
  display: block;
}

.blog-list__item__bottom {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap-mini);
  align-items: flex-end;
}

.blog-list__item__anonce {
  display: block;
  color: var(--font-dark-color);
  padding-right: 100px;
  box-sizing: border-box;
  overflow: hidden;
}

.blog-list__item__anonce > div {
  display: block;
}

.blog-list__item__ico_arrow {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: var(--pad-gap-line);
  right: var(--pad-gap-line);
  width: 60px;
  height: 60px;
  border-radius: var(--radius-full);
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border-width 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}

.blog-list__item__ico_arrow > .zpm-icon {
  width: 20px;
  height: 20px;
  transition: width 0.3s ease, opacity 0.3s ease, height 0.3s ease;
  opacity: 0.7;
}

.blog-list__item:hover .blog-list__item__ico_arrow > .zpm-icon {
  opacity: 0.9;
}

.blog-list__item:hover .blog-list__item__ico_arrow {
  border-color: var(--main-dark-color);
  border-width: 10px;
  opacity: 1;
  background-color: var(--font-light-color);
}

.blog-list__item__ico_arrow:before {
  position: absolute;
  z-index: 2;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  opacity: 0, 7;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--second-light-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.blog-list__item:hover .blog-list__item__ico_arrow::before {
  border-width: 1px;
  border-color: var(--main-dark-color);
}

.blog-list__item__ico_arrow:after {
  position: absolute;
  z-index: 1;
  display: block;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  opacity: 0;
  border-radius: var(--radius-full);
  border-width: 0px;
  border-style: solid;
  border-color: var(--main-dark-color);
  transition: opacity 0.3s ease, border-width 0.3s ease, border-color 0.3s ease;
}

.blog-list__item:hover .blog-list__item__ico_arrow::after {
  opacity: 1;
  border-width: 70px;
  border-color: rgba(var(--main-light-color-opcity));
}

.blog-list__item:hover .blog-list__item__ico_arrow:hover {
  background-color: var(--main-dark-color);
}

.blog-list__item:hover .blog-list__item__ico_arrow:hover .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.page--blog-list .zpm-slider__btn_wrap > div {
  display: none;
}

.blog-item-img__wrap {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  overflow: hidden;
  margin-top: calc(var(--pad-inner) - var(--pad-gap-mini));
  margin-bottom: calc(var(--pad-inner) - var(--pad-gap-mini));
}

.blog-item-img__wrap > img {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.blog-item__meta {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-gap-line) var(--pad-box);
  border-radius: var(--radius-main);
  overflow: hidden;
  display: flex;
  flex-flow: wrap;
  gap: var(--pad-gap-mini) var(--pad-gap-line);
  color: var(--font-dark-color);
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
  justify-content: center;
  /* background-color: var(--second-light-color); */
}

.blog-item__meta > div {
  display: flex;
  flex-flow: wrap;
  gap: 5px;
}

.blog-item__meta > div > b {
  display: block;
  font-weight: 400;
}

.blog-item__meta > div > span {
  display: block;
}

.contacts-blocks {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pad-gap-line);
}

.contacts-block--item:last-child {
  grid-column: 1/-1;
}

.contacts-block--item {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-inner);
  border-radius: var(--radius-main);
  gap: var(--pad-box);
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
  min-height: 300px;
}

.contacts-block--item-title {
  gap: var(--pad-gap-mini);
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
}

.contacts-block--item-desc {
  gap: var(--pad-gap-mini);
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
}

a.contacts-block--item .contacts-block--item-desc {
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
}

@media (max-width: 1024px) {
  .contacts-blocks {
    grid-template-columns: repeat(2, 1fr);
  }
  .contacts-block--item:last-child {
    grid-column: 1/-1;
  }
}
@media (max-width: 580px) {
  .contacts-blocks {
    grid-template-columns: 1fr;
  }
  .contacts-block--item {
    min-height: 200px;
  }
}
.user-account-Menu {
  position: relative;
}

.user-account--wrap {
  display: flex;
  flex-flow: column;
  gap: var(--pad-box);
}

.user-account__like-h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
  font-weight: var(--large-Font-weight);
}

.user-account--order .user-account__like-h2 {
  margin-bottom: var(--pad-gap);
}

.user-account__header > .user-account__like-h2 {
  margin-bottom: 0px;
}

.user-account__like-h2 .zpm-icon {
  width: var(--Title-h2-Font-size);
  height: var(--Title-h2-Font-size);
}

.user-account__status {
  display: flex;
  color: var(--gray-color);
  flex-flow: column;
  gap: 5px;
}

.user-account-Menu-wrapper {
  display: none;
  flex-flow: row;
  gap: var(--pad-box);
}

.page--account .user-account-Menu-wrapper {
  display: flex;
}

.page--account .user-account-Menu-wrapper {
  margin-top: var(--pad-gap);
}

.user-account-Menu--item {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  padding: 50px 30px;
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: transparent;
  min-width: auto;
  width: 100%;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.user-account-Menu--item:hover {
  color: var(--accent-color-01);
}

.user-account-Menu--item > span {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.user-account-Menu--item > span > div {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
}

.user-account-Menu--item > span > span {
  font-weight: 500;
  font-size: 20px;
}

.user-account-Menu--item > span > div > .zpm-icon {
  width: 40px;
  height: 40px;
}

.user-account-Menu--item:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-light-color);
}

.user-account-Menu--item.active {
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  color: var(--accent-color-01);
}

.user-account-Menu-back-btn .user-account-Menu--item-descr {
  display: none;
}

.user-account-Menu--item.active .user-account-Menu--item-descr,
.user-account-Menu--item:hover .user-account-Menu--item-descr {
  color: var(--font-dark-color);
}

.user-account-Menu--item.active .zpm-icon,
.user-account-Menu--item:hover .zpm-icon {
  color: var(--accent-color-01);
}

.user-account-Menu--item.active .zpm-help_ico,
.user-account-Menu--item:hover .zpm-help_ico {
  border-color: var(--accent-color-01);
  color: var(--accent-color-01);
}

.user-account-Menu--item .zpm-help_ico {
  border-width: 2px;
  border-color: var(--font-dark-color);
  color: var(--font-dark-color);
  font-size: 20px;
  line-height: 20px;
  font-weight: 500;
}

.page--account-order .p-card .p-card__footer,
.page--account-order .p-card .p-card__prices,
.page--account-order .p-card .p-card__status {
  display: none;
}

.page--account-order .p-card .p-card__top {
  justify-content: flex-end;
}

.page--account-profile .user-account__like-h2 {
  margin-bottom: var(--pad-gap);
}

.user-account-profile-form {
  display: flex;
  flex-flow: column;
  gap: var(--pad-inner);
}

.user-account-password-form {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  max-width: 580px;
}

.user-account-Menu-back-btn {
  display: flex;
  flex-flow: row;
  gap: 20px;
  margin-top: 50px;
}

.page--account .user-account-Menu-back-btn {
  display: none;
}

.user-account-Menu-back-btn .user-account-Menu--item {
  padding: 10px 20px;
  gap: 10px;
  align-items: flex-start;
  max-width: 200px;
  width: auto;
  gap: 5px;
  justify-content: center;
}

.user-account-Menu-back-btn .user-account-Menu--item > span {
  flex-flow: row;
  gap: 5px;
}

.user-account-Menu-back-btn .user-account-Menu--item > span > div > .zpm-icon {
  width: 18px;
  height: 18px;
}

.user-account-Menu-back-btn .user-account-Menu--item > span > div {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  margin-left: -8px;
}

.user-account-Menu-back-btn--share-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  max-width: 680px;
}

.user-account-Menu-back-btn--share-menu > .user-account-Menu--item {
  flex: 1 1 calc(33.333% - 10px);
  max-width: none;
  width: auto;
  justify-content: center;
}

.user-account-Menu-back-btn--share-menu .user-account-Menu--item > span > div {
  margin-left: 0;
}

.user-account-Menu-back-btn--share-menu .user-account-Menu--item > span > span {
  font-weight: 400;
  font-size: 18px;
  white-space: nowrap;
}

.user-account-Menu-back-btn--share-menu .user-account-Menu--item .zpm-help_ico {
  font-size: 14px;
  line-height: 14px;
  font-weight: 400;
  width: 20px;
  height: 20px;
  min-width: 20px;
  border-width: 1px;
}

.user-account-Menu-back-btn--share-menu .user-account-Menu--item > span {
  gap: 10px;
}

/* ==========================================================================
   COMPARE TABLE
   ========================================================================= */
.compare-table {
  padding: var(--pad-y) 0;
}
.compare-table__top {
  margin-bottom: var(--pad-y);
}
.compare-table__head {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
}
.compare-table__title {
  color: var(--font-dark-color);
}
.compare-table__controls {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--pad-gap);
  flex-wrap: wrap;
}
.compare-table__lists {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-line);
  flex: 1 1 auto;
  min-width: 0;
}
.compare-table__lists-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-line);
  flex-wrap: wrap;
}
.compare-table__lists-title {
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
}
.compare-table__lists-select {
  position: relative;
  display: none;
  width: 100%;
  max-width: 420px;
}
.compare-table__lists-current {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pad-gap-mini);
  width: 100%;
  min-height: 60px;
  padding: 0 var(--padding-form);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-full);
  background-color: var(--font-light-color);
  color: var(--font-dark-color);
  cursor: pointer;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.compare-table__lists-current svg {
  flex: 0 0 auto;
  transition: transform 0.3s ease;
}
.compare-table__lists-current[aria-expanded=true] {
  border-color: var(--main-dark-color);
}
.compare-table__lists-current[aria-expanded=true] svg {
  transform: rotate(180deg);
}
.compare-table__lists-current:hover {
  border-color: var(--main-dark-color);
}
.compare-table__lists-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  padding: 10px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-main);
  background-color: var(--font-light-color);
  box-shadow: 0 10px 30px rgba(0, 48, 63, 0.08);
}
.compare-table__lists-option {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 48px;
  padding: 0 16px;
  border: 0;
  border-radius: 16px;
  background-color: transparent;
  color: var(--font-dark-color);
  text-align: left;
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.compare-table__lists-option:hover {
  background-color: var(--main-light-color);
}
.compare-table__lists-option.is-active {
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__lists-tabs {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.compare-table__lists-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 24px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-full);
  background-color: var(--font-light-color);
  color: var(--font-dark-color);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.compare-table__lists-tab:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__lists-tab.is-active {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__actions {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  flex-wrap: wrap;
  justify-content: flex-end;
}
.compare-table__action, .compare-table__clear, .compare-table__empty-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  padding: 0 var(--pad-btns);
  border-width: 1px;
  border-style: solid;
  border-radius: var(--radius-full);
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.compare-table__action, .compare-table__clear {
  border-color: var(--border-color);
  background-color: var(--font-light-color);
  color: var(--font-dark-color);
}
.compare-table__action:hover, .compare-table__clear:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__empty-link {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__empty-link:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}
.compare-table__body {
  min-width: 0;
}
.compare-table__layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 20px;
  align-items: end;
}
.compare-table__params {
  min-width: 0;
}
.compare-table__params-offset {
  height: auto;
}
.compare-table__param, .compare-table__value {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 12px 18px;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}
.compare-table__param {
  font-weight: var(--large-Font-weight);
  color: var(--font-dark-color);
}
.compare-table__param:nth-child(even) {
  background-color: var(--main-light-color);
  border-radius: var(--border-radius-form);
}
.compare-table__param:nth-child(odd) {
  background-color: var(--font-light-color);
  border-radius: var(--border-radius-form);
}
.compare-table__value {
  color: var(--font-dark-color);
}
.compare-table__value:nth-child(even) {
  background-color: var(--main-light-color);
  border-radius: var(--border-radius-form);
}
.compare-table__value:nth-child(odd) {
  background-color: var(--font-light-color);
  border-radius: var(--border-radius-form);
}
.compare-table__param--heading, .compare-table__value--heading {
  opacity: 0;
  pointer-events: none;
}
.compare-table__content {
  position: relative;
  min-width: 0;
}
.compare-table__slider {
  min-width: 0;
  overflow: hidden;
}
.compare-table__slider.swiper {
  padding-right: 1px;
  box-sizing: border-box;
}
.compare-table__slider .swiper-wrapper {
  align-items: stretch;
}
.compare-table__slide {
  height: auto;
  min-width: 0;
}
.compare-table__product {
  margin-bottom: 20px;
}
.compare-table__values {
  min-width: 0;
}
.compare-table__navigation {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.compare-table__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  height: 60px;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.compare-table__nav:hover {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}
.compare-table__nav:disabled, .compare-table__nav.swiper-button-disabled {
  opacity: 0.5;
  background-color: var(--font-light-color);
  border-color: var(--border-color);
  cursor: default;
}
.compare-table__nav:disabled:hover, .compare-table__nav.swiper-button-disabled:hover {
  color: var(--font-dark-color);
  background-color: var(--font-light-color);
  border-color: var(--border-color);
}
.compare-table__scrollbar {
  margin-top: 10px;
  height: 5px;
  background-color: rgba(var(--main-light-color-opcity), 1);
  border-radius: var(--radius-full);
}
.compare-table__scrollbar .swiper-scrollbar-drag {
  background-color: var(--main-dark-color);
  border-radius: var(--radius-full);
}
.compare-table__note {
  margin-top: 30px;
  padding: 24px 30px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  background-color: var(--main-light-color);
}
.compare-table__note p {
  margin: 0;
  max-width: 900px;
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
}
.compare-table__empty {
  padding: 40px 0 0;
}
.compare-table__empty-inner {
  max-width: 860px;
  padding: 40px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  background-color: var(--main-light-color);
}
.compare-table__empty-title {
  margin-bottom: 16px;
}
.compare-table__empty-text {
  margin: 0 0 30px;
  max-width: 680px;
}

.compare-table__params.with-scrollbar {
  padding-bottom: 15px;
}

@media (max-width: 1360px) {
  .compare-table__layout {
    grid-template-columns: 220px minmax(0, 1fr);
  }
}
@media (max-width: 1024px) {
  .compare-table__top {
    margin-bottom: 40px;
  }
  .compare-table__controls {
    flex-direction: column;
    align-items: stretch;
  }
  .compare-table__actions {
    justify-content: flex-start;
  }
  .compare-table__lists-tabs {
    display: none;
  }
  .compare-table__lists-select {
    display: block;
    max-width: 100%;
  }
  .compare-table__layout {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .compare-table__params {
    display: none;
  }
  .compare-table__params-offset {
    display: none;
  }
  .compare-table__product {
    margin-bottom: 16px;
  }
  .compare-table__value--heading {
    display: none;
  }
  .compare-table__values {
    display: grid;
    gap: 10px;
  }
  .compare-table__value {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-height: auto;
    gap: 6px;
    padding: 14px 16px;
    background-color: var(--main-light-color);
    border-radius: var(--border-radius-form);
  }
  .compare-table__value:nth-child(even) {
    background-color: var(--main-light-color);
    border-radius: var(--border-radius-form);
  }
  .compare-table__value span {
    display: block;
  }
  .compare-table__navigation {
    margin-top: 16px;
  }
  .compare-table__scrollbar {
    margin-top: 16px;
  }
  .compare-table__empty-inner {
    padding: 24px 20px;
  }
}
@media (max-width: 767px) {
  .compare-table {
    padding: 50px 0;
  }
  .compare-table__top {
    margin-bottom: 30px;
  }
  .compare-table__title {
    font-size: 44px;
    line-height: 48px;
  }
  .compare-table__lists-title {
    font-size: var(--base-Font-size);
    line-height: var(--base-Line-height);
  }
  .compare-table__lists-head {
    align-items: stretch;
  }
  .compare-table__actions {
    flex-direction: column;
    align-items: stretch;
  }
  .compare-table__action, .compare-table__clear, .compare-table__empty-link {
    width: 100%;
    min-height: 54px;
    padding: 0 20px;
    line-height: normal;
  }
  .compare-table__nav {
    width: 54px;
    height: 54px;
  }
  .compare-table__note {
    padding: 20px;
  }
  .compare-table__note p {
    font-size: var(--base-Font-size);
    line-height: var(--base-Line-height);
  }
}
.compare-table__product {
  position: relative;
}

.compare-table__remove {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translate(-50%, 0);
  gap: 5px;
  border: none;
  background: no-repeat;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

/* =========================================
   Tooltip (favorites / compare)
   Real popup block with unified animation
========================================= */
.zpm-tip {
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.zpm-tip__popup {
  position: absolute;
  left: 50%;
  top: -36px;
  display: block;
  transform: translate(-50%, -6px) scale(0.96);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 20;
  will-change: opacity, transform;
}

.zpm-tip__body {
  position: relative;
  padding: 10px 15px;
  font-size: var(--mini-Font-size);
  line-height: 1;
  white-space: nowrap;
  background: var(--accent-color-01);
  color: #fff;
  border-radius: 8px;
}

.zpm-tip__arrow {
  position: absolute;
  left: 50%;
  bottom: -20px;
  transform: translate(-50%, -1px);
  width: 20px;
  height: 12px;
  background: var(--accent-color-01);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}

/* show */
.zpm-tip.is-tip .zpm-tip__popup {
  opacity: 1;
  transform: translate(-50%, -10px) scale(1);
}

/* remove state */
.zpm-tip.is-remove .zpm-tip__body,
.zpm-tip.is-remove .zpm-tip__arrow {
  background: var(--accent-color-02);
}

/* =========================================
   LEFT tooltip (product cards)
========================================= */
.zpm-tip--left {
  overflow: visible;
}

.zpm-tip--left .zpm-tip__popup {
  left: auto;
  right: calc(100% + 12px);
  top: 50%;
  bottom: auto;
  transform: translate(-6px, -50%) scale(0.96);
}

.zpm-tip--left .zpm-tip__arrow {
  left: 100%;
  top: 50%;
  transform: translate(-1px, -50%);
  width: 12px;
  height: 20px;
  background: var(--accent-color-01);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.zpm-tip--left.is-tip .zpm-tip__popup {
  transform: translate(0, -50%) scale(1);
}

.zpm-tip--left.is-remove .zpm-tip__body,
.zpm-tip--left.is-remove .zpm-tip__arrow {
  background: var(--accent-color-02);
}

/* ======================================================================
   CART (Category card): replace button -> stepper (fade only)
   - p-card__buy-ok animation оставляем как было
   ====================================================================== */
.product-card__actions {
  position: relative;
  display: grid;
  grid-template-areas: "stack";
  align-items: center;
}

.product-card__actions > [data-cart-add],
.product-card__actions > [data-cart-qty-card] {
  grid-area: stack;
}

/* DEFAULT: button visible, stepper hidden (animatable) */
.product-card__actions > [data-cart-add] {
  opacity: 1;
  pointer-events: auto;
}

.product-card__actions > [data-cart-qty-card] {
  opacity: 0;
  pointer-events: none;
}

/* ACTIVE (qty >= 1): button hidden, stepper visible */
.product-card__actions.is-qty > [data-cart-add] {
  opacity: 0;
  pointer-events: none;
}

.product-card__actions.is-qty > [data-cart-qty-card] {
  opacity: 1;
  pointer-events: auto;
}

/* базовый вид степпера */
.btn-qty--toogle {
  width: auto;
}

.zpm-qty {
  display: flex;
  align-items: center;
  gap: 10px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  justify-content: space-between;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: var(--border-color);
  padding: 4px;
  box-sizing: border-box;
}

.zpm-qty__btn {
  width: 50px;
  min-width: 50px;
  height: 50px;
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-dark-color);
  background: var(--main-dark-color);
  color: var(--font-light-color);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  padding: 0;
  font-size: 22px;
  padding-bottom: 2px;
  transition: background-color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease, color 0.3s ease;
}

.added .zpm-qty__btn {
  border-color: var(--accent-color-01);
  background: var(--accent-color-01);
}

.zpm-qty--card .zpm-qty__btn {
  border-color: var(--accent-color-01);
  background: var(--accent-color-01);
}

.zpm-qty__btn:hover {
  opacity: 0.7;
}

.zpm-qty__btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.zpm-qty__val {
  min-width: 24px;
  text-align: center;
  font-weight: 600;
}

.p-card__buy-ok {
  transition: opacity 0.3s ease, transform 0.3s ease;
  border-radius: var(--radius-full);
  background: rgba(48, 153, 113, 0.9294117647);
  color: var(--font-light-color);
  display: inline-flex;
  gap: 7px;
  padding: 18px 20px;
  box-sizing: border-box;
  flex-flow: row;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  top: 40%;
  font-size: 20px;
  text-align: center;
}

.p-card__buy-ok > span {
  white-space: nowrap;
  min-width: 55px;
  text-align: left;
}

.p-card__buy-ok[hidden] {
  display: block; /* чтобы можно было анимировать */
  opacity: 0;
  transform: translateY(var(--pad-gap));
  pointer-events: none;
}

.p-card__buy-ok:not([hidden]) {
  opacity: 1;
}

.added > .zpm-icon {
  width: 22px;
  height: 22px;
  margin-top: 2px;
}

.btn--primary.added {
  gap: 7px;
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
}

.product-hero__info button.btn-qty--toogle {
  width: 230px;
}

/* ==========================================================================
   Pagination carcass
   ========================================================================= */
.pagination {
  margin-top: 24px;
}
.pagination__pages {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
}
.pagination__link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 60px;
  height: 60px;
  text-decoration: none;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--main-light-color);
}
.pagination__more {
  display: none;
  width: 100%;
  margin-top: var(--pad-gap-line);
}
@media (max-width: 1024px) {
  .pagination__pages {
    display: none;
  }
  .pagination__more {
    display: block;
  }
}

.pagination__link:hover {
  background-color: var(--main-dark-color);
  border-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.pagination__link.is-active:hover,
.pagination__link.is-active {
  background-color: var(--second-light-color);
  border-color: var(--second-light-color);
  color: var(--main-dark-color);
}

.category__sort-label {
  white-space: nowrap;
}

/* Mobile-only topbar над товарами */
.category__topbar--mobile {
  display: flex;
}

@media (max-width: 1024px) {
  .category__topbar--mobile {
    display: flex;
    gap: var(--pad-gap-line);
  }
  .category__topbar {
    justify-content: space-between;
  }
  .category__sidebar {
    position: fixed;
    inset: 0;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
  }
  .is-filter-open .category__sidebar {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease, visibility 0s linear 0s;
  }
  .category__sidebar__overlay {
    position: absolute;
    inset: 0;
    top: 90px;
    pointer-events: auto;
  }
  .category__sidebar__panel {
    position: absolute;
    top: 110px;
    left: 50%;
    max-height: calc(100vh - 140px - var(--pad-inner) - var(--pad-y));
    height: 100%;
    width: calc(100% - 40px);
    max-width: 690px;
    display: flex;
    flex-flow: column;
    padding: var(--pad-inner);
    border-radius: var(--radius-main);
    box-sizing: border-box;
    box-shadow: 0px 0px 20px 5px var(--main-light-color);
    gap: var(--pad-gap);
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(247, 248, 253) 100%);
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    transform: translate3d(-50%, 50%, 0);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
    will-change: transform, opacity;
    pointer-events: auto;
    overflow: hidden;
  }
  .is-filter-open .category__sidebar__panel {
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
  .filter-mobile__head {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    min-height: 40px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
  }
  .filter-mobile__title {
    text-align: center;
  }
  .filter-mobile__body {
    min-height: 0;
    padding-right: 2px;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .filter-mobile__back,
  .filter-mobile__reset {
    background: transparent;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
  }
}
@media (min-width: 1025px) {
  .filter-mobile__head,
  .filter-mobile__footer,
  .category__sidebar__overlay {
    display: none;
    pointer-events: none;
  }
  .category__sidebar__panel .zpm-popup_close {
    display: none;
  }
}
/* ==========================================================================
   PRODUCT FANCYBOX
   белая подложка только в ширину контейнера
   ========================================================================= */
.fancybox__container.is-product-fancybox .fancybox__backdrop {
  background: rgba(18, 22, 32, 0.84);
}

.fancybox__container.is-product-fancybox .fancybox__viewport {
  padding: 20px 0;
}

.fancybox__container.is-product-fancybox .fancybox__content {
  background: transparent;
  box-shadow: none;
}

.fancybox__container.is-product-fancybox .zpm-fb-product__shell {
  width: 100%;
}

.fancybox__container.is-product-fancybox .zpm-fb-product__stage {
  min-height: calc(90svh - 120px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  border-radius: var(--radius-main);
  background: #fff;
  overflow: hidden;
}

.fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox__content,
.fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox-image,
.fancybox__container.is-product-fancybox .zpm-fb-product__stage img {
  background: transparent;
}

.fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox-image,
.fancybox__container.is-product-fancybox .zpm-fb-product__stage img {
  max-width: 100%;
  max-height: calc(90svh - 160px);
  -o-object-fit: contain;
     object-fit: contain;
}

.fancybox__container.is-product-fancybox .f-thumbs {
  width: 100%;
  max-width: none;
  padding-top: 12px;
}

.fancybox__container.is-product-fancybox .f-thumbs__track {
  padding-left: 0;
  padding-right: 0;
}

.fancybox__container.is-product-fancybox .f-button.is-close-button {
  top: 20px;
  right: 20px;
}

@media (max-width: 1024px) {
  .fancybox__container.is-product-fancybox .fancybox__viewport {
    padding: 12px 0;
  }
  .fancybox__container.is-product-fancybox .zpm-fb-product__stage {
    min-height: calc(90svh - 96px);
    padding: 12px;
  }
  .fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox-image,
  .fancybox__container.is-product-fancybox .zpm-fb-product__stage img {
    max-height: calc(90svh - 128px);
  }
  .fancybox__container.is-product-fancybox .f-button.is-close-button {
    top: 12px;
    right: 12px;
  }
}
/* ==========================================================================
   Filter component (inside filters-sidebar.html)
   ========================================================================= */
.flt {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  margin-top: var(--pad-gap-line);
}

.flt__form {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

.flt__group {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
}

/* accordion head */
.flt__group-head {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--pad-gap-line);
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  min-height: 30px;
}

.flt__group-title {
  font-weight: var(--large-Font-weight);
}

/* chevron */
.flt__chev {
  display: block;
  width: 20px;
  height: 20px;
  position: relative;
  transition: transform 0.1s ease;
  transform: rotate(45deg) scaleY(1);
  margin-top: 3px;
}

.flt__group.is-open .flt__chev {
  transform: rotate(315deg) scaleY(-1);
}

.flt__chev::before,
.flt__chev::after {
  content: "";
  display: block;
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 2px;
}

.flt__chev::before {
  z-index: 1;
  background: var(--main-dark-color);
}

.flt__chev::after {
  z-index: 2;
  background: var(--main-light-color);
  top: -2px;
  left: -2px;
}

/* panel */
/* divider */
.flt__divider {
  height: 1px;
  margin: 14px 0;
  background: rgba(0, 0, 0, 0.08);
}

/* fields */
.flt__field,
.flt__field-wrap {
  display: block;
}

.flt__field-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.flt__range-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pad-gap-line);
  margin-bottom: 12px;
}

.flt__input, .flt__select {
  width: 100%;
  min-height: 58px;
  padding: 0px var(--padding-form);
  margin: 0px;
  color: var(--font-dark-color);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius-form);
  background-color: rgb(255, 255, 255);
  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
  font-size: var(--mini-Font-size);
}

.flt__input:hover, .flt__select:hover {
  border-color: var(--gray-color);
}

.flt__input:focus, .flt__select:focus {
  border-color: var(--accent-color-01);
}

.flt__input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.4);
}

.flt__input::placeholder {
  color: rgba(0, 0, 0, 0.4);
}

.flt__search {
  margin-bottom: var(--pad-gap-mini);
}

/* custom select block */
.flt__select-group {
  padding: 0 0 20px;
}

.flt__select-title {
  margin: 0 0 12px;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 600;
}

.flt__select-wrap {
  position: relative;
}

.flt__select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  padding-right: 44px;
}

.flt__select-wrap::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  width: 10px;
  height: 10px;
  margin-top: -7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  pointer-events: none;
  opacity: 0.65;
}

/* range */
.flt__range {
  display: block;
}

.flt__range-slider {
  position: relative;
  height: 34px;
  margin-top: 8px;
}

.flt__range-track,
.flt__range-progress {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 4px;
  border-radius: var(--radius-full);
}

.flt__range-track {
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.12);
}

.flt__range-progress {
  left: 0;
  width: 0;
  background: currentColor;
}

.flt__range-thumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 34px;
  margin: 0;
  background: transparent;
  pointer-events: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.flt__range-thumb::-webkit-slider-runnable-track {
  height: 34px;
  background: transparent;
}

.flt__range-thumb::-moz-range-track {
  height: 34px;
  background: transparent;
  border: 0;
}

.flt__range-thumb::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  pointer-events: auto;
  width: 18px;
  height: 18px;
  margin-top: 8px;
  border-radius: 50%;
  border: 2px solid currentColor;
  background: #fff;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  -webkit-transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.flt__range-thumb::-moz-range-thumb {
  pointer-events: auto;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid currentColor;
  background: #fff;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  -moz-transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.flt__range-thumb:hover::-webkit-slider-thumb,
.flt__range-thumb:focus-visible::-webkit-slider-thumb {
  transform: scale(1.08);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

.flt__range-thumb:hover::-moz-range-thumb,
.flt__range-thumb:focus-visible::-moz-range-thumb {
  transform: scale(1.08);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

/* switches */
.flt__switches {
  gap: var(--pad-gap-mini);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--font-light-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  flex-flow: column;
}

.flt__switches:hover {
  border-color: var(--accent-color-01);
}

.flt__switch {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  cursor: pointer;
}

.flt__switch-text {
  order: 1;
  flex: 1 1 auto;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  font-weight: var(--large-Font-weight);
}

.flt__switch-ui {
  order: 2;
  flex: 0 0 auto;
  width: 52px;
  height: 30px;
  border-radius: var(--radius-full);
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: rgba(0, 0, 0, 0.05);
  transition: background 0.3s ease, border-color 0.3s ease;
}

.flt__switch-ui::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.18);
  transition: transform 0.3s ease, background 0.3s ease;
}

.flt__switch.active .flt__switch-ui {
  background: var(--accent-color-01);
  border-color: #1d6a4d;
}

.flt__switch-input:checked + .flt__switch-ui::before {
  transform: translateX(22px);
}

.flt__switch.active .flt__switch-text {
  opacity: 1;
}

/* hide native inputs but keep accessible */
.flt__check-input,
.flt__switch-input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

/* checkbox row */
.flt__check {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  padding: 5px 0;
  cursor: pointer;
}

.flt__check-box {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 3px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background: transparent;
  position: relative;
  transition: border-color 0.3s ease, background 0.3s ease, background-color 0.3s ease;
}

.flt__check-box::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 5px;
  width: 6px;
  height: 12px;
  border-right: 3px solid var(--font-light-color);
  border-bottom: 3px solid var(--font-light-color);
  transform: rotate(45deg);
  opacity: 0;
  border-radius: 1px;
  transition: border-right 0.3s ease, border-bottom 0.3s ease;
}

.flt__check-input:checked + .flt__check-box,
.flt__check.active .flt__check-box {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
}

.flt__check-input:checked + .flt__check-box::after,
.flt__check.active .flt__check-box::after {
  opacity: 1;
}

.flt__check-input:disabled + .flt__check-box,
.flt__check-input:disabled ~ .flt__check-text {
  opacity: 1;
}

.flt__check-text {
  font-size: var(--mini-Font-size);
  line-height: 1.25;
}

.flt__check:hover .flt__check-box {
  border-color: var(--font-dark-color);
}

.flt__group-body {
  gap: var(--pad-gap-mini);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: rgba(var(--White-color-opcity));
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  flex-flow: column;
}

.flt__group-body:hover {
  border-color: var(--accent-color-01);
}

/* lists */
.flt__list {
  display: flex;
  gap: var(--pad-gap-mini);
  flex-flow: column;
}

.flt__more {
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: underline;
  text-underline-offset: 2px;
  opacity: 0.7;
}

.flt__more[hidden] {
  display: none;
}

/* bottom actions */
.flt__actions {
  display: flex;
  gap: var(--pad-gap-line);
  flex-flow: column;
}

.flt__copy {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--pad-btns);
  background-color: transparent;
  border-radius: var(--radius-full);
  border-width: 0px;
  border-style: solid;
  cursor: pointer;
  font-weight: 400;
  line-height: 60px;
  height: 60px;
  white-space: nowrap;
  gap: var(--pad-gap-mini);
  transition: all 0.3s ease;
}

.flt__copy:hover {
  color: var(--accent-color-01);
}

.flt__copy.is-done {
  opacity: 0.7;
}

/* focus */
.flt__group-head:focus-visible,
.flt__input:focus-visible,
.flt__select:focus-visible,
.flt__more:focus-visible,
.flt__submit:focus-visible,
.flt__clear:focus-visible,
.flt__copy:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.rel-products__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}
.rel-products__nav {
  display: flex;
  gap: var(--pad-gap-line);
}
.rel-products__nav--mobile {
  display: none;
}
.rel-products__btn {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-light-color);
  border-radius: var(--radius-full);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  cursor: pointer;
  width: 60px;
  height: 60px;
}
.rel-products__slider {
  margin-top: 20px;
}
.rel-products__card {
  display: block;
}
.rel-products__img {
  width: 100%;
  height: 420px;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
@media (max-width: 1024px) {
  .rel-products__img {
    height: 520px;
  }
}
@media (max-width: 767px) {
  .rel-products__nav--desktop {
    display: none;
  }
  .rel-products__nav--mobile {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
  }
  .rel-products__img {
    height: 560px;
  }
}
@media (max-width: 490px) {
  .rel-products__img {
    height: 520px;
  }
}

.p-card__prices {
  display: flex;
  gap: var(--pad-gap-mini);
  margin-top: 10px;
  align-items: center;
}

.zpm-cart-page__sum,
.zpm-account-orders__sum,
.p-card__price {
  font-size: 24px;
  line-height: 24px;
  font-weight: 500;
  white-space: nowrap;
}

.p-card__old-price {
  text-decoration: line-through;
  color: var(--gray-color);
  white-space: nowrap;
}

.p-card__discount {
  display: flex;
  background-color: var(--accent-color-01);
  color: var(--font-light-color);
  font-size: var(--mini-Font-size);
  line-height: 16px;
  align-items: center;
  height: 30px;
  padding: 0px 6px;
  border-radius: var(--border-radius-form);
  /* position: relative; */
  /* top: -5px; */
  font-weight: 500;
  white-space: nowrap;
}

/* ==========================================================================
   SEO text block (layout only)
   ========================================================================= */
.zpm-seo {
  position: relative;
}

.zpm-seo h2,
.zpm-seo h3,
.zpm-seo h4,
.zpm-seo h5,
.zpm-seo h6 {
  margin-bottom: var(--pad-gap-line);
}

.zpm-seo > div > * + :is(h2, h3, h4, h5, h6) {
  margin-top: calc(var(--pad-inner) - var(--pad-gap-mini));
}

.zpm-seo blockquote {
  background: var(--second-light-color);
  border-radius: var(--radius-main);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  margin: 0 0 var(--pad-gap-mini);
  padding: var(--pad-gap);
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-seo ul {
  margin-bottom: var(--pad-gap-mini);
}

.zpm-seo ol {
  margin-bottom: var(--pad-gap-mini);
}

.zpm-seo p {
  margin-bottom: var(--pad-gap-mini);
}

.zpm-seo__table {
  width: 100%;
  overflow-x: auto;
  margin-bottom: var(--pad-gap-mini);
  border-radius: var(--border-radius-form);
}

.zpm-seo__table table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  border-spacing: 0;
  background: var(--main-light-color);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius-form);
  overflow: hidden;
}

.zpm-seo__table th,
.zpm-seo__table td {
  padding: var(--pad-gap-line) var(--pad-gap);
  text-align: left;
  vertical-align: top;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
}

.zpm-seo__table th {
  font-weight: var(--large-Font-weight);
  background: var(--second-light-color);
}

.zpm-seo > div > :last-child {
  margin-bottom: 0;
}

.zpm-map {
  position: relative;
}

.map-wrapper {
  display: block;
  position: relative;
  height: 600px;
  background-color: var(--second-light-color);
  overflow: hidden;
  margin: 0px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  transition: all 0.3s ease;
}

.map-wrapper iframe {
  filter: grayscale(0.7);
  opacity: 0.95;
  transition: all 1.5s ease;
}

.map-wrapper:hover iframe {
  filter: grayscale(0);
  opacity: 1;
  transition: all 1.5s ease;
}

/* ==========================================================================
 FOOTER (layout + mono bg)
 ========================================================================= */
.zpm-footer {
  background-color: var(--main-dark-color);
  background: linear-gradient(0deg, rgb(6, 70, 90) 0%, rgb(0, 48, 63) 100%);
  color: var(--font-light-color);
}

.zpm-footer__top {
  padding: var(--pad-y) 0px;
}

.zpm-footer__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 25%;
  gap: var(--pad-gap) var(--pad-inner);
  align-items: start;
  margin-top: -5px;
}

.zpm-footer__col--brand {
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  height: 100%;
}

.zpm-footer__logo {
  display: inline-flex;
  align-items: center;
}

.zpm-footer__logo-box {
  display: block;
  max-width: 320px;
  width: 320px;
  padding-top: 5px;
}

.zpm-footer__title {
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
  margin-bottom: var(--pad-gap);
}

.zpm-footer__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--pad-gap-line);
}

.zpm-footer__link {
  display: inline-flex;
}

.zpm-footer__social {
  margin-top: var(--pad-inner);
}

.zpm-footer__social-title {
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
  margin-bottom: var(--pad-gap-line);
}

.zpm-footer__social-list {
  display: flex;
  gap: var(--pad-gap-line);
  flex-wrap: wrap;
}

.zpm-footer__social-btn {
  width: 78px;
  height: 78px;
  border-radius: var(--radius-full);
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.zpm-footer__social-ico {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 8px;
  display: block;
}

.zpm-footer__policy {
  margin-top: var(--pad-inner);
  display: grid;
  gap: var(--pad-gap-line);
}

.zpm-footer__policy-title {
  font-size: var(--large-Font-size);
  line-height: var(--large-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-footer__policy > div {
  display: grid;
  gap: 3px;
}

.zpm-footer__policy-link {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  transition: all 0.3s ease;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

.zpm-footer__policy-link .zpm-icon {
  width: 10px;
  height: 12px;
  color: var(--font-light-color);
  transition: all 0.3s ease;
  margin-left: -3px;
  margin-top: 1px;
}

.zpm-footer__policy-link .zpm-help_ico {
  border-color: var(--font-light-color);
  width: 20px;
  height: 20px;
  color: var(--font-light-color);
  min-width: 20px;
  font-size: 14px;
  line-height: 14px;
  transition: all 0.3s ease;
}

.zpm-footer__policy-link:hover .zpm-icon {
  color: var(--accent-color-01);
}

.zpm-footer__policy-link:hover .zpm-help_ico {
  border-color: var(--accent-color-01);
  color: var(--accent-color-01);
}

.zpm-footer__policy {
  margin-top: var(--pad-inner);
  display: grid;
  gap: var(--pad-gap-line);
}

.zpm-footer__kv--wrap {
  display: grid;
  gap: var(--pad-gap);
}

.zpm-footer__kv {
  display: grid;
  gap: 10px;
}

.zpm-footer__k {
  font-weight: var(--large-Font-weight);
}

.zpm-footer__bottom {
  padding: var(--pad-gap-line) 0;
  background-color: var(--main-dark-color);
}

.zpm-footer__bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.zpm-footer__copy {
  opacity: 0.9;
}

.pws_copyright__wrap {
  position: relative;
}

.pws_copyright {
  position: relative;
  color: #878f9c !important;
  text-decoration: none !important;
}

.pws_copyright:hover {
  position: relative;
  color: #00bdf0 !important;
  text-decoration: none !important;
}

.zpm-footer__offer {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-line);
  margin-top: var(--pad-y);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  max-width: 1040px;
}

.grecaptcha-badge {
  display: none !important;
  opacity: 0 !important;
}

/* ================================
   Scroll next button fade
================================ */
[data-scroll-next] {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

[data-scroll-next].is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

[data-scroll-next][hidden] {
  display: block !important;
}

.zpm-header__sticky-wrap {
  position: relative;
  z-index: 300;
  height: 140px;
  width: 100%;
}

.zpm-header__sticky {
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background-color: transparent;
  border-bottom: 1px solid transparent;
  box-shadow: none;
  transition: background-color 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, border-radius 0.28s ease;
  will-change: background-color, border-color, box-shadow;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* Состояние "прилип" */
.zpm-header__sticky.sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background-color: var(--main-light-color);
  border-bottom: 1px solid var(--border-color);
  border-bottom-left-radius: var(--radius-main);
  border-bottom-right-radius: var(--radius-main);
  box-shadow: 0px 0px 20px 5px var(--main-light-color);
}

.zpm-header__sticky.sticky .zpm-header__Pad-btn {
  width: 50px;
  min-width: 50px;
  height: 50px;
}

/* Mobile sticky bar */
@media (max-width: 1024px) {
  .zpm-header__sticky-wrap {
    display: none;
  }
  .zpm-header {
    --mobilebar-sticky-height: 90px;
  }
  .zpm-header.is-mobilebar-sticky {
    padding-top: var(--mobilebar-sticky-height);
  }
  .zpm-header__mobilebar {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 90px;
    background-color: transparent;
    border-bottom: 1px solid transparent;
    box-shadow: none;
    transition: background-color 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, border-radius 0.28s ease, transform 0.28s ease;
    will-change: transform, background-color, border-color, box-shadow;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
    z-index: 1000;
  }
  .zpm-header__mobilebar.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: var(--main-light-color);
    border-bottom: 1px solid var(--border-color);
    border-bottom-left-radius: var(--radius-main);
    border-bottom-right-radius: var(--radius-main);
    box-shadow: 0px 0px 20px 5px var(--main-light-color);
    transform: translate3d(0, 0, 0);
  }
}
.zpm-header__sticky.sticky .zpm-header__top {
  padding: 20px 0 0px;
}

.zpm-header__sticky.sticky .zpm-header__main {
  padding: 20px 0 20px;
}

.zpm-header__sticky.sticky .zpm-header__logo-box > img,
.zpm-header__sticky.sticky .zpm-header__badge-box > img {
  max-height: 50px;
}

.zpm-header__sticky.sticky .btn {
  line-height: 50px;
  height: 50px;
}

.zpm-header__sticky.sticky .zpm-header__search-form {
  height: 50px;
  border-color: var(--second-light-color);
}

.zpm-header__sticky.sticky .zpm-header__search-form:hover .zpm-header__search-btn,
.zpm-header__sticky.sticky .zpm-header__search-form:hover {
  border-color: var(--main-dark-color);
}

.zpm-header__sticky.sticky .zpm-header__search-form:hover .zpm-header__search-btn {
  border-color: var(--main-dark-color);
  background-color: var(--main-dark-color);
  color: var(--font-light-color);
}

.zpm-header__sticky.sticky .zpm-header__search-form:hover .zpm-header__search-btn .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.zpm-header__sticky.sticky .zpm-header__search-form.open .zpm-header__search-btn,
.zpm-header__sticky.sticky .zpm-header__search-form.open {
  border-color: var(--main-dark-color);
}

.zpm-header__sticky.sticky .zpm-header__search-form .zpm-header__search-btn:hover {
  border-color: var(--accent-color-01);
  background-color: var(--accent-color-01);
}

.zpm-header__sticky.sticky .zpm-header__search {
  max-width: none;
}

.zpm-header__sticky.sticky .zpm-header__search-btn {
  width: 30px;
  height: 30px;
}

.zpm-header__sticky.sticky .zpm-icon {
  width: 18px;
  height: 18px;
}

.zpm-header__sticky.sticky .zpm-header__action {
  width: 50px;
  height: 50px;
  border-color: var(--border-color);
}

.zpm-header__place-text--wrapper {
  display: flex;
  flex-flow: row;
  gap: 7px;
}

.zpm-social__link {
  width: 70px;
  height: 70px;
}

.zpm-footer__social .zpm-icon {
  width: 30px;
  height: 30px;
}

.zpm-cart-page__aside {
  position: sticky;
  top: 150px;
  align-self: start;
}

.zpm-stack-vertical {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

@media (max-width: 1024px) {
  .zpm-cart-page__aside {
    position: static;
    top: auto;
    max-width: none;
  }
}
.zpm-checkout-page__layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
  align-items: start;
}

.zpm-checkout-page__box {
  background: #fff;
  border-radius: 20px;
  padding: 24px;
  border: 1px solid #e5e5e5;
}

.zpm-checkout-type {
  margin-bottom: 20px;
}

.zpm-checkout-type__title {
  font-weight: 600;
  margin-bottom: 10px;
}

.zpm-checkout-type__switch {
  display: flex;
  gap: 8px;
}

.zpm-checkout-type__btn {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid #dcdcdc;
  background: #f7f7f7;
  cursor: pointer;
}

.zpm-checkout-type__btn.is-active {
  background: #0f3b3f;
  color: #fff;
  border-color: #0f3b3f;
}

.zpm-checkout-form__section {
  margin-top: 24px;
}

.zpm-checkout-form__section-title {
  font-weight: 600;
  margin-bottom: 12px;
}

.zpm-checkout-delivery-type {
  display: flex;
  gap: 20px;
}

.zpm-checkout-delivery-type label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.zpm-checkout-form__delivery {
  margin-top: 16px;
}

.zpm-checkout-success {
  padding: 12px 16px;
  background: #e6f5ec;
  border-radius: 12px;
  margin-bottom: 16px;
}

.page--checkout .zpm-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.zpm-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.zpm-form__input,
.zpm-form__textarea {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid #ddd;
  background: #fafafa;
}

.zpm-form__textarea {
  min-height: 100px;
}

.zpm-form__actions {
  margin-top: 20px;
}

.zpm-form__submit {
  width: 100%;
  border-radius: 999px;
}

.zpm-checkout-total__item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 14px;
}

.zpm-checkout-total__row {
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  margin-top: 12px;
}

.zpm-cart-help {
  background: #fff;
  border-radius: 20px;
  padding: 16px;
  border: 1px solid #e5e5e5;
}

.zpm-cart-help__phone {
  font-weight: 600;
  display: block;
  margin-top: 6px;
}

@media (max-width: 1024px) {
  .zpm-checkout-page__layout {
    grid-template-columns: 1fr;
  }
  .page--checkout .zpm-form__grid {
    grid-template-columns: 1fr;
  }
}
[data-checkout-panel],
[data-delivery-block],
[data-delivery-details] {
  opacity: 0;
  transition: all 0.3s ease;
  pointer-events: none;
}

.is-active {
  opacity: 1;
  pointer-events: auto;
}

.zpm-form__error {
  color: var(--accent-color-02);
  font-size: 12px;
  margin-top: 6px;
}

.zpm-form__field.has-error input,
.zpm-form__agree.has-error {
  border-color: var(--accent-color-02);
}

.zpm-checkout-login-note {
  margin-bottom: 16px;
  font-size: 16px;
  line-height: 1.4;
  color: #00303f;
}

.zpm-checkout-login-alert {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid #f0b8b8;
  border-radius: 16px;
  background: #fff4f4;
  color: #99303d;
}

.zpm-checkout-login-alert__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.zpm-checkout-login-alert__text {
  font-size: 14px;
  line-height: 1.45;
  font-weight: 500;
}

.zpm-form__field.has-error .zpm-form__input,
.zpm-form__field.has-error .zpm-form-field__input {
  border-color: #d95c5c;
  background: #fffafa;
}

.zpm-form__field.has-error .zpm-form__label,
.zpm-form__field.has-error .zpm-form__label em {
  color: #99303d;
}

@media (max-width: 1560px) {
  .hero__bg-media img {
    -o-object-position: 50%;
    object-position: 50%;
  }
  .hero__catalog-btn > span {
    font-size: 24px;
  }
  .hero__catalog-btn:hover > span {
    font-size: 26px;
  }
  .zpm-header__account {
    width: auto;
    min-width: auto;
  }
  .zpm-header__account .btn {
    padding: 0px;
    width: 60px;
    background-color: rgba(var(--main-light-color-opcity));
    border-color: transparent;
  }
  .zpm-header__account .btn:hover {
    background-color: var(--main-dark-color);
    color: var(--font-light-color);
  }
  .zpm-header__account-text {
    display: none;
  }
  .zpm-header__phone {
    justify-content: flex-end;
    min-width: auto;
    width: auto;
  }
  .zpm-header__top-inner {
    gap: var(--pad-gap-line) var(--pad-inner);
  }
  .zpm-header__phone {
    font-size: 20px;
  }
  .zpm-header__top-inner {
    gap: var(--pad-gap-line) var(--pad-gap);
  }
  .p-card__title {
    font-size: 18px;
    line-height: 24px;
    height: 75px;
  }
  .zpm-cart-page__sum,
  .zpm-account-orders__sum,
  .p-card__price {
    font-size: 18px;
    line-height: 24px;
  }
  .p-card__buy-ok {
    font-size: 18px;
    line-height: 24px;
  }
  .p-card__old-price {
    font-size: 16px;
    line-height: 16px;
  }
  .p-card__discount {
    font-size: 14px;
    line-height: 26px;
    height: 26px;
    padding: 0px 5px;
  }
  .zpm-catalog__grid {
    gap: 10px;
  }
  .zpm-catalog__wrapp,
  .zpm-catalog__tile {
    border-radius: var(--radius-internal);
  }
  .zpm-catalog__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1440px) {
  .zpm-header__place-label {
    display: none;
  }
  .category__layout {
    grid-template-columns: 290px 1fr;
  }
  .p-card__footer {
    gap: 10px;
  }
  .contacts-block--item {
    padding: 30px;
    min-height: 260px;
  }
  .blog-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .blog-list__item {
    flex-flow: column;
  }
  .user-account-Menu-wrapper {
    flex-wrap: wrap;
  }
  .user-account-Menu--item {
    flex: 1 1 calc(33.333% - 20px);
  }
  .back-btn {
    max-width: 115px !important;
  }
  .zpm-cart-page__layout {
    grid-template-columns: 1fr;
  }
  .zpm-cart-page__item {
    display: grid;
    /* 5 равных колонок для второй строки */
    grid-template-columns: repeat(5, 1fr);
    /* отступы */
    gap: 10px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
  /* 1-й блок на всю ширину */
  .zpm-cart-page__col--product {
    grid-column: 1/-1; /* растянуть на все колонки */
  }
  /* Остальные автоматически встанут во вторую строку */
}
@media (max-width: 1310px) {
  .zpm-header__main-inner {
    grid-template-columns: auto auto 1fr auto;
  }
  .category__layout {
    grid-template-columns: 320px 1fr;
  }
  .category__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .category-list .category__grid,
  .page--account-order .category__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .message-if-empty .img-decor {
    padding: 0;
  }
}
@media (max-width: 1199px) {
  .zpm-footer__grid {
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
  }
  .zpm-footer__grid > :first-child {
    grid-column: 1/-1;
  }
  .zpm-footer__col--brand {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--pad-inner);
  }
  .zpm-footer__col--brand > .zpm-footer__first-block {
    grid-column: span 2;
  }
  .zpm-footer__col--brand > .zpm-footer__policy {
    grid-column: span 1;
  }
  .zpm-footer__policy {
    display: flex;
    flex-flow: column;
    margin: 0px;
    gap: 0;
  }
  .zpm-footer__policy-title {
    font-size: var(--Title-h3-Font-size);
    line-height: var(--Title-h3-Line-height);
    font-weight: var(--large-Font-weight);
    margin-bottom: var(--pad-gap);
  }
  .zpm-footer__policy > div {
    gap: var(--pad-gap-line);
  }
  .category__layout {
    grid-template-columns: 290px 1fr;
  }
  .zpm-about .zpm-universal__grid {
    grid-template-columns: 1fr;
  }
  .zpm-catalog__tile-block::before,
  .zpm-catalog__tile-img {
    display: none;
  }
  .zpm-catalog__tile {
    padding: 10px 15px;
  }
  .zpm-catalog__tile-block {
    padding-left: 0;
    gap: 2px;
  }
  .zpm-catalog__megamenu {
    width: 300px;
    min-width: 300px;
  }
  .zpm-catalog__megamenu.zpm-catalog__wrapp-blur-box {
    width: 100%;
    min-width: 300px;
  }
  .zpm-catalog__cats-btn {
    padding: 10px 15px;
  }
}
@media (max-width: 1024px) {
  .hero__bg-media img {
    -o-object-position: 40%;
    object-position: 40%;
  }
  :root {
    --big-Cat-btn--size: 160px;
  }
  .hero__navigation {
    left: 20px;
    right: 20px;
    bottom: 20px;
  }
  .zpm-slider__btn_wrap {
    margin-bottom: 0px;
    gap: 10px;
  }
  .zpm-slider__btn_wrap > .hero-sliders-counet {
    order: 3;
  }
  .zpm-slider__btn_wrap > .hero__btn--prev {
    order: 1;
  }
  .zpm-slider__btn_wrap > .hero__btn--next {
    order: 2;
  }
  .hero__btn-wrap {
    z-index: 1;
  }
  .hero__catalog-btn {
    z-index: 2;
    right: 10px;
  }
  .breadcrumbs {
    padding: 20px 0px 0px;
  }
  .page-intro {
    padding: 30px 0px 0px;
  }
  .zpm-about__text, .zpm-adv-top__text, .zpm-dealers__text {
    max-width: 740px;
  }
  .header_wrap .zpm-header__action,
  .page--home .zpm-header__action,
  .zpm-header__action {
    background-color: var(--main-dark-color);
    border-color: var(--main-dark-color);
  }
  .zpm-header__action:hover {
    border-color: var(--main-dark-color);
  }
  .zpm-minicart__body {
    max-height: calc(100vh - 490px);
  }
  .zpm-minicart__panel {
    overflow: hidden;
    width: calc(100% - 40px);
  }
  .zpm-mmenu__phone {
    font-size: 20px;
    line-height: 50px;
    white-space: nowrap;
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    background: var(--main-light-color);
    border-radius: var(--radius-full);
    padding: 0px 20px;
    margin-right: 0;
    font-weight: var(--large-Font-weight);
  }
  .zpm-slider__btn, .btn-no-text {
    width: 50px;
    min-width: 50px;
    height: 50px;
    padding: 0;
  }
  .zpm-qty__btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  .btn {
    line-height: 46px;
    height: 50px;
  }
  .blog-list__item__ico_arrow {
    width: 50px;
    height: 50px;
    min-width: 50px;
  }
  .blog-list__item__ico_arrow::before,
  .blog-list__item__ico_arrow::after {
    width: 50px;
    height: 50px;
  }
  .blog-list__item:hover .blog-list__item__ico_arrow::after {
    border-width: 50px;
  }
  input[type=password], input[type=text], input[type=email], input[type=tel] {
    line-height: 48px;
    padding: 0px 15px;
  }
  .zpm-icon {
    width: 16px;
    height: 16px;
  }
  .btn {
    font-size: 16px;
    padding: 0 15px;
  }
  .zpm-header__m-btn .zpm-icon {
    width: 18px;
    height: 18px;
  }
  .hero__catalog-btn > div {
    width: calc(20px + var(--big-Cat-btn--size));
    height: calc(20px + var(--big-Cat-btn--size));
  }
  .hero__catalog-btn > div::before {
    width: calc(20px + var(--big-Cat-btn--size));
    height: calc(20px + var(--big-Cat-btn--size));
  }
  .hero__catalog-btn:hover > div::before {
    width: calc(20px + var(--big-Cat-btn--size));
    height: calc(20px + var(--big-Cat-btn--size));
  }
  .zpm-slider__btn_wrap .hero-sliders-counet,
  .hero-sliders-counet {
    opacity: 0.95;
  }
  .hero-slide {
    grid-template-columns: minmax(320px, 720px) minmax(240px, 1fr);
  }
  .hero-slide__info-wrap {
    display: flex;
    flex-flow: column;
    gap: var(--pad-y);
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    padding: 50px;
    border-radius: var(--radius-main);
    background-color: rgba(255, 255, 255, 0.5);
  }
  .hero-slide__title {
    max-width: 390px;
  }
  .category__layout {
    grid-template-columns: 1fr;
  }
  .category__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .p-card__buy-ok {
    padding: 13px 20px;
  }
  .zpm-dealers .zpm-universal__grid {
    grid-template-columns: 1fr 1fr;
  }
  .zpm-dealers .zpm-universal__grid {
    grid-template-columns: 1fr 1fr;
  }
  .p-card__status {
    font-size: 14px;
    line-height: 14px;
  }
  .p-card__status-Yes,
  .p-card__status-None {
    gap: 5px;
  }
  .p-card__status-Yes::before,
  .p-card__status-None::before {
    width: 6px;
    height: 6px;
    margin-top: 1px;
  }
  .p-card__top {
    top: 15px;
    left: 15px;
  }
  .p-card__actions {
    margin-top: -5px;
  }
  .about-page--main-wrap {
    flex-flow: column;
  }
  .zpm-account-orders__link {
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
  }
  .user-account-Menu-back-btn--share-menu .user-account-Menu--item > span > span {
    font-size: 16px;
  }
}
@media (max-width: 830px) {
  .zpm-mmenu__phone {
    font-size: 16px;
  }
  .zpm-header__mobilebar-brand,
  .zpm-header__mobilebar-inner {
    gap: 10px;
  }
  .category__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .category-list .category__grid,
  .page--account-order .category__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .user-account-Menu-back-btn--share-menu > .user-account-Menu--item {
    flex: 1 1 calc(50% - 10px);
    padding: 7px 15px;
  }
  .back-btn {
    max-width: 140px !important;
  }
  .user-account-Menu--item.back-btn {
    align-items: center;
  }
  .user-account-Menu--item > span > span {
    font-size: 18px;
  }
  .user-account-Menu-back-btn .user-account-Menu--item > span > div > .zpm-icon {
    width: 14px;
    height: 14px;
  }
}
@media (max-width: 767px) {
  .user-account-Menu-back-btn {
    gap: 10px;
  }
  .hero-slide__title {
    margin-bottom: 20px;
    max-width: 320px;
  }
  .zpm-mmenu__phone {
    font-size: 18px;
    font-weight: 500;
  }
  .zpm-header__badge {
    display: none;
  }
  .zpm-footer__col--brand {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--pad-y);
  }
  .zpm-footer__grid {
    grid-template-columns: repeat(1, 1fr);
    gap: var(--pad-y);
  }
  .zpm-footer__kv--wrap {
    gap: var(--pad-gap-line);
  }
  .hero-slide {
    grid-template-columns: minmax(320px, 530px) minmax(100px, 1fr);
  }
  .hero-slide__title {
    margin-bottom: 0px;
    max-width: 320px;
  }
  .hero-slide {
    grid-template-columns: minmax(270px, auto);
    gap: 0px;
  }
  .hero-slide__description {
    padding-right: 10%;
  }
  .zpm-dealers .zpm-universal__grid {
    grid-template-columns: 1fr;
  }
  .category__grid {
    gap: 10px;
  }
  .zpm-cat-card__ico_arrow::after,
  .zpm-cat-card__ico_arrow::before,
  .zpm-cat-card__ico_arrow {
    width: 50px;
    height: 50px;
  }
  .zpm-cat-card__ico_arrow > .zpm-icon {
    width: 20px;
    height: 20px;
  }
  .zpm-cat-card:hover .zpm-cat-card__ico_arrow::after {
    border-width: 50px;
  }
  .zpm-cat-sections__grid {
    gap: 10px;
  }
  .zpm-rel-articles-card__ico_arrow::after,
  .zpm-rel-articles-card__ico_arrow::before,
  .zpm-rel-articles-card__ico_arrow {
    width: 50px;
    height: 50px;
  }
  .zpm-rel-articles-card:hover .zpm-rel-articles-card__ico_arrow::after {
    border-width: 50px;
  }
  .contacts-blocks {
    gap: 10px;
  }
  .contacts-block--item {
    padding: 20px;
  }
  .zpm-universal__grid {
    grid-template-columns: 1fr;
  }
  .category-list .category__grid,
  .page--account-order .category__grid,
  .zpm-adv-cards__grid {
    gap: 10px;
  }
  .blog-list {
    gap: 10px;
  }
  .blog-list__item {
    padding: 10px;
    gap: 10px;
  }
  .user-account-Menu--item > span > div > .zpm-icon {
    width: 30px;
    height: 30px;
  }
  .user-account-Menu--item {
    flex: 1 1 calc(50% - 20px);
  }
  .message-if-empty {
    flex-flow: column;
  }
  .message-if-empty .img-decor {
    display: none;
  }
}
@media (max-width: 610px) {
  .zpm-mmenu__phone {
    display: none;
  }
  .p-card__title {
    font-size: 16px;
    line-height: 22px;
    height: 65px;
  }
  .p-card__buy-ok {
    font-size: 16px;
    line-height: 22px;
  }
  .p-card__price {
    width: 100%;
  }
  .p-card__prices {
    gap: 0px var(--pad-gap-mini);
    flex-wrap: wrap;
  }
  .p-card__price {
    order: 3;
  }
  .p-card__old-price {
    order: 1;
  }
  .p-card__discount {
    order: 2;
  }
  .p-card__article {
    font-size: 14px;
    line-height: 18px;
  }
  .zpm-cat-card__title {
    font-size: 16px;
    line-height: 22px;
  }
  .zpm-cat-card {
    min-height: 240px;
    padding: 10px;
    border-radius: 20px;
  }
}
@media (max-width: 580px) {
  .zpm-header__m-logo {
    height: 48px;
  }
  .zpm-header__mobilebar-inner {
    gap: 10px;
  }
  .zpm-footer__bottom-inner {
    align-items: flex-start;
    flex-flow: column;
    gap: 10px;
  }
  :root {
    --big-Cat-btn--size: 140px;
  }
  .hero__catalog-btn:hover > span,
  .hero__catalog-btn > span {
    font-size: 20px;
  }
  .contacts-block--item {
    min-height: auto;
    gap: 10px;
  }
  .user-account-Menu--item {
    gap: 10px;
    padding: 20px 20px;
  }
  .user-account-Menu--item {
    flex: 1 100%;
  }
  .user-account-Menu--item > span {
    flex-flow: revert;
    justify-content: flex-start;
    gap: 10px;
  }
  .user-account-Menu--item-descr {
    padding-right: 20%;
    text-align: left;
  }
  .user-account-Menu--item > span {
    text-align: left;
  }
}
@media (max-width: 530px) {
  .category__topbar--mobile {
    flex-flow: column-reverse;
    align-items: flex-end;
  }
  .category__filters-btn {
    width: 100%;
  }
}
.p-card__body .p-card__status {
  display: none;
}

@media (max-width: 490px) {
  :root {
    --big-Cat-btn--size: 120px;
  }
  .hero__catalog-btn:hover > span,
  .hero__catalog-btn > span {
    font-size: 18px;
  }
  .zpm-slider__btn_wrap > .hero-sliders-counet {
    font-size: 16px;
  }
  .hero__navigation .zpm-slider__btn_wrap {
    width: 185px;
  }
  .hero-slide__info-wrap {
    padding: 30px;
  }
  .p-card__footer .btn-no-text {
    width: 40px;
    min-width: 40px;
    height: 40px;
    display: none;
  }
  .p-card__body .p-card__status {
    display: flex;
  }
  .p-card__footer {
    flex-flow: column;
    align-items: flex-start;
  }
  .p-card__footer .btn {
    line-height: 36px;
    height: 40px;
  }
  .p-card__footer .zpm-qty__btn {
    width: 30px;
    height: 30px;
    min-width: 30px;
  }
  .p-card__footer > a,
  .btn-qty--toogle {
    width: 140px;
  }
  .p-card__buy-ok {
    font-size: 14px;
    line-height: 14px;
  }
  .p-card__buy-ok > span {
    min-width: 30px;
  }
  .p-card__top .p-card__status {
    display: none;
  }
  .p-card__actions {
    margin-top: 0px;
    flex-flow: row;
  }
  .p-card__top {
    top: 10px;
    left: 10px;
  }
  .p-card .zpm-tip__popup {
    display: none;
  }
  .zpm-cat-card__img img {
    max-height: 100px;
  }
  .zpm-cat-card__img {
    padding: 10px;
  }
}
@media (max-width: 470px) {
  .zpm-cat-sections__grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .rel-articles .zpm-slider__head {
    gap: 20px;
    flex-flow: column;
  }
  .rel-articles .zpm-slider__head {
    gap: 20px;
    flex-flow: column;
    margin-bottom: var(--pad-gap);
  }
  section.rel-articles .section-title__like-h2 {
    margin-bottom: 0px;
  }
  .rel-articles .zpm-slider__btn_wrap {
    width: 100%;
  }
  .rel-articles .zpm-slider__btn_wrap > div {
    width: 100%;
    display: flex;
    justify-content: flex-end;
  }
}
@media (max-width: 410px) {
  .zpm-header__m-btn .zpm-icon {
    width: 18px;
    height: 18px;
  }
  .zpm-header__m-logo {
    height: 46px;
  }
  .zpm-header__m-btn,
  .zpm-header__m-cart.zpm-header__action {
    width: 46px;
    height: 46px;
    min-width: 46px;
  }
  .zpm-header__m-actions .zpm-icon {
    width: 16px;
    height: 16px;
  }
  .zpm-btn__mobile-ico-burger {
    width: 14px;
    height: 14px;
  }
  .hero__catalog-btn {
    right: 5px;
  }
  .hero-slide__info-wrap {
    padding: 20px;
  }
  .hero-slide__title {
    max-width: 250px;
  }
  .p-card__title {
    font-size: 16px;
    line-height: 22px;
    height: 90px;
  }
  .zpm-cart-page__sum,
  .zpm-account-orders__sum,
  .p-card__price {
    font-size: 16px;
    line-height: 20px;
  }
  .zpm-slider__btn, .btn-no-text {
    width: 46px;
    min-width: 46px;
    height: 46px;
    padding: 0;
  }
  .zpm-qty__btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
  input[type=password], input[type=text], input[type=email], input[type=tel] {
    line-height: 44px;
  }
  .btn {
    line-height: 42px;
    height: 46px;
  }
  .zpm-icon {
    width: 14px;
    height: 14px;
  }
  .zpm-header__m-btn .zpm-icon {
    width: 16px;
    height: 16px;
  }
  .hero__catalog-btn > div {
    width: calc(10px + var(--big-Cat-btn--size));
    height: calc(10px + var(--big-Cat-btn--size));
  }
  .hero__catalog-btn > div::before {
    width: calc(10px + var(--big-Cat-btn--size));
    height: calc(10px + var(--big-Cat-btn--size));
  }
  .hero__catalog-btn:hover > div::before {
    width: calc(10px + var(--big-Cat-btn--size));
    height: calc(10px + var(--big-Cat-btn--size));
  }
}
@media (max-width: 390px) {
  .zpm-adv-cards__grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .p-card__title {
    font-size: 14px;
    line-height: 18px;
    height: 75px;
  }
  .zpm-cart-page__sum,
  .zpm-account-orders__sum,
  .p-card__price {
    font-size: 14px;
    line-height: 18px;
  }
  .p-card__article {
    font-size: 12px;
    line-height: 14px;
  }
  .p-card__old-price {
    font-size: 14px;
    line-height: 14px;
  }
  .p-card__discount {
    font-size: 12px;
    line-height: 20px;
    height: 20px;
  }
  .zpm-cat-card__title {
    font-size: 14px;
    line-height: 20px;
  }
}
@media (max-width: 370px) {
  .zpm-header__m-logo {
    height: 40px;
  }
  .zpm-header__m-btn,
  .zpm-header__m-cart.zpm-header__action {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  :root {
    --big-Cat-btn--size: 100px;
  }
  .hero__catalog-btn:hover > span, .hero__catalog-btn > span {
    font-size: 16px;
  }
  .zpm-slider__btn, .btn-no-text {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }
  .zpm-qty__btn {
    width: 30px;
    height: 30px;
    min-width: 30px;
  }
  input[type=password], input[type=text], input[type=email], input[type=tel] {
    line-height: 40px;
  }
  .btn {
    line-height: 38px;
    height: 40px;
  }
  .zpm-slider__btn_wrap > .hero-sliders-counet {
    font-size: 14px;
  }
  .hero-sliders-counet {
    width: 60px;
  }
  .category__grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .category-list .category__grid,
  .page--account-order .category__grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .user-account-Menu-back-btn--share-menu .user-account-Menu--item > span > div {
    display: none;
  }
}
/* CART REWORK */
.zpm-cart-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.zpm-cart-item {
  display: flex;
  gap: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
}
.zpm-cart-item__img {
  max-width: 300px;
  flex-shrink: 0;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--radius-internal);
  overflow: hidden;
}
.zpm-cart-item__img img {
  width: 100%;
  height: auto;
}
.zpm-cart-item__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.zpm-cart-item__top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.zpm-cart-item__title {
  height: auto;
}
.zpm-cart-item__remove {
  background: none;
  border: none;
  cursor: pointer;
}
.zpm-cart-item__bottom {
  display: flex;
  align-items: flex-end;
  gap: var(--pad-gap);
  height: 100%;
}
@media (max-width: 767px) {
  .zpm-cart-item__bottom {
    flex-wrap: wrap;
  }
}
.zpm-cart-item__price {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  min-width: 120px;
}

.zpm-cart-item__bottom-inner {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  width: 100%;
  margin-top: var(--pad-gap);
}

.zpm-cart-item__second-line {
  display: flex;
  flex-flow: wrap;
  gap: 10px;
}

.zpm-cart-item__status {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pad-gap-mini);
  white-space: nowrap;
}

.zpm-cart-item__status::before {
  position: relative;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background-color: var(--accent-color-01);
  border-radius: var(--radius-full);
}

.zpm-cart-item__status > span {
  display: flex;
}

.zpm-cart-item__price > div {
  font-size: 20px;
  line-height: 24px;
  font-weight: var(--large-Font-weight);
  white-space: nowrap;
}

.zpm-cart-item__price > span {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  white-space: nowrap;
}

.zpm-cart-item__sum {
  margin-left: auto;
  font-size: 20px;
  line-height: 24px;
  font-weight: var(--large-Font-weight);
  border-radius: var(--radius-internal);
  border-width: 1px;
  border-style: solid;
  display: flex;
  /* flex-flow: row; */
  height: 60px;
  align-content: center;
  align-items: center;
  padding: 0px 30px;
  background: var(--main-light-color);
  border-color: var(--border-color);
  white-space: nowrap;
  min-width: 200px;
  justify-content: center;
}

.zpm-cart-page__layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
  align-items: start;
}

.zpm-cart-page__main {
  min-width: 0;
}

.zpm-cart-page__table {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

.zpm-cart-page__head {
  display: none;
}

.zpm-cart-page__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.zpm-cart-page__item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding: 22px 24px;
  border: 1px solid #dbe3ef;
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(16, 40, 72, 0.06);
}

.zpm-cart-page__col {
  min-width: 0;
}

.zpm-cart-page__col--product {
  display: contents;
}

.zpm-cart-page__product {
  display: contents;
}

.zpm-cart-page__product-img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  padding: 8px;
  border: 1px solid #edf2f8;
  border-radius: 18px;
  background: #ffffff;
}

.zpm-cart-page__product-img img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.zpm-cart-page__product-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 20px;
  align-items: start;
}

.zpm-cart-page__product-title {
  grid-column: 1/2;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
  color: #0b3558;
}

.zpm-cart-page__product-title a {
  color: inherit;
  text-decoration: none;
}

.zpm-cart-page__product-title a:hover {
  text-decoration: underline;
}

.zpm-cart-page__product-art {
  grid-column: 1/2;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 14px;
  line-height: 1.35;
  color: #5c7189;
}

.zpm-cart-page__product-art b {
  color: #0b3558;
}

.zpm-cart-page__col--price {
  grid-column: 2/3;
}

.zpm-cart-page__price {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.zpm-cart-page__price strong {
  font-size: 26px;
  line-height: 1;
  font-weight: 800;
  color: #0b3558;
}

.zpm-cart-page__price span {
  font-size: 15px;
  line-height: 1.2;
  color: #98a7b8;
  text-decoration: line-through;
}

.zpm-cart-page__col--status {
  grid-column: 2/3;
}

.zpm-cart-page__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  background: #eef9f1;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
  color: #1e8e4a;
}

.zpm-cart-page__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.zpm-cart-page__col--qty {
  grid-column: 2/3;
}

.zpm-cart-page__qty-wrap {
  display: inline-flex;
  align-items: center;
}

.zpm-cart-page__col--sum {
  grid-column: 2/3;
}

.zpm-cart-page__sum {
  font-size: 28px;
  line-height: 1;
  font-weight: 800;
  color: #0b3558;
}

.zpm-cart-page__col--remove {
  grid-column: 2/3;
  grid-row: 1/2;
  justify-self: end;
}

.zpm-cart_item_delete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  border: 1px solid #dbe3ef;
  border-radius: 50%;
  background: #f7f9fc;
  color: #6e8197;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.zpm-cart_item_delete:hover {
  background: #eef3f8;
  border-color: #c9d6e6;
  color: #0b3558;
}

.zpm-cart_item_delete .zpm-icon {
  width: 14px;
  height: 14px;
}

.zpm-cart-aside-sticky {
  position: sticky;
  top: 120px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.zpm-cart-total {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  background-color: var(--main-light-color);
}

.zpm-cart-total__intro {
  display: flex;
  flex-flow: row;
  gap: 10px;
  align-items: flex-start;
  font-weight: 500;
}

.zpm-cart-total__intro .zpm-help_ico {
  position: relative;
}

.zpm-cart-total__intro > span {
  width: 100%;
  line-height: 20px;
  font-size: 16px;
  max-width: 240px;
}

.zpm-cart-total__intro > span > b {
  color: var(--accent-color-02);
}

.zpm-cart-total__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.zpm-cart-total__title {
  font-size: 16px;
  line-height: 20px;
}

.zpm-cart-total__count {
  font-size: 16px;
  line-height: 20px;
}

.zpm-cart-total__rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.zpm-cart-total__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.zpm-cart-total__row strong {
  flex-shrink: 0;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
  text-align: right;
}

.zpm-cart-total__row--final {
  position: relative;
}

.zpm-cart-total__row--final span {
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-cart-total__row--final strong {
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-cart-total__benefits {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.zpm-cart-total__benefit {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-internal);
  background-color: var(--main-light-color);
}

.zpm-cart-total__benefit--positive {
  background: #eef9f1;
  border-color: var(--accent-color-01);
}

.zpm-cart-total__benefit-label {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--accent-color-01);
}

.zpm-cart-total__benefit-value {
  display: block;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 700;
  color: #0b3558;
}

.zpm-cart-total__benefit--positive .zpm-cart-total__benefit-value {
  color: #1e8e4a;
}

.zpm-cart-total__actions {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
}

.zpm-cart-total__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 58px;
  padding: 14px 24px;
  border-radius: 999px;
  text-align: center;
}

.zpm-cart-total__continue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  padding: 12px 20px;
  border-radius: 999px;
  text-align: center;
}

.zpm-cart-help {
  gap: var(--pad-gap);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
}

.zpm-cart-help__title {
  margin-bottom: 10px;
  font-size: 26px;
  line-height: 1.1;
  font-weight: 800;
  color: #0b3558;
}

.zpm-cart-help__text {
  margin-bottom: 16px;
  font-size: 15px;
  line-height: 1.45;
  color: #4d647d;
}

.zpm-cart-help__phone {
  display: inline-block;
  margin-bottom: 6px;
  font-size: 30px;
  line-height: 1;
  font-weight: 900;
  color: #0b3558;
  text-decoration: none;
}

.zpm-cart-help__phone:hover {
  text-decoration: underline;
}

.zpm-cart-help__note {
  font-size: 13px;
  line-height: 1.35;
  color: #7b8ea5;
}

@media (max-width: 1024px) {
  .zpm-cart-page__layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 767px) {
  .zpm-cart-page__item {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .zpm-cart-page__product-info {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
  }
}
@media (max-width: 560px) {
  .zpm-cart-page__item {
    grid-template-columns: 1fr;
  }
  .zpm-cart-page__col--remove {
    grid-column: auto;
    grid-row: auto;
    justify-self: end;
    margin-top: -48px;
  }
  .zpm-cart-page__product {
    display: flex;
    gap: 12px;
    align-items: flex-start;
  }
  .zpm-cart-page__product-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    min-width: 0;
    padding-right: 42px;
  }
  .zpm-cart-page__col--price {
    grid-column: auto;
  }
  .zpm-cart-page__col--status {
    grid-column: auto;
  }
  .zpm-cart-page__col--qty {
    grid-column: auto;
  }
  .zpm-cart-page__col--sum {
    grid-column: auto;
  }
  .zpm-cart-page__price {
    align-items: flex-start;
  }
}
.lk-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 30px;
}

.lk-sidebar {
  position: sticky;
  top: 120px;
}

.lk-sidebar__inner {
  background: #f7f9fc;
  border-radius: 30px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lk-sidebar__item {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 50px;
  padding: 0 20px;
  border-radius: 999px;
  color: #00303F;
  text-decoration: none;
  border: none;
  background-color: transparent;
  cursor: pointer;
  white-space: nowrap;
}

.lk-sidebar__item > .zpm-help_ico {
  border-color: var(--main-dark-color);
  width: 20px;
  height: 20px;
  color: var(--main-dark-color);
  min-width: 20px;
  font-size: 14px;
  line-height: 14px;
}

.lk-sidebar__item.active > .zpm-icon,
.lk-sidebar__item:hover > .zpm-icon {
  color: var(--font-light-color);
  fill: var(--font-light-color);
}

.lk-sidebar__item.active > .zpm-help_ico,
.lk-sidebar__item:hover > .zpm-help_ico {
  border-color: var(--font-light-color);
  color: var(--font-light-color);
}

.lk-sidebar__item.active,
.lk-sidebar__item:hover {
  background: #00303F;
  color: #fff;
}

.lk-content {
  min-width: 0;
}

.lk-orders {
  display: grid;
  gap: 20px;
}

.lk-order-card {
  display: block;
  background: #f7f9fc;
  border-radius: 30px;
  padding: 24px;
  text-decoration: none;
  color: inherit;
}

.lk-order-card__top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
}

.lk-order-card__number {
  font-weight: 600;
}

.lk-order-card__status {
  padding: 6px 14px;
  border-radius: 999px;
  background: #e6f4ee;
}

.lk-order-card__info {
  display: flex;
  gap: 40px;
}

.lk-order-card__col span {
  display: block;
  font-size: 14px;
  color: #8E8E8E;
}

.lk-order-card__action {
  margin-top: 16px;
  font-weight: 500;
  color: #00303F;
}

.lk-empty {
  background: #f7f9fc;
  border-radius: 30px;
  padding: 40px;
}

.lk-empty__title {
  font-size: 24px;
  margin-bottom: 10px;
}

@media (max-width: 1024px) {
  .lk-sidebar {
    position: relative;
    top: auto;
    overflow-x: auto;
    border-width: 1px;
    border-style: solid;
    border-color: var(--border-color);
    background-color: var(--main-light-color);
    padding: var(--pad-box);
    border-radius: var(--radius-main);
    padding: 0px;
  }
  .lk-layout {
    grid-template-columns: 1fr;
  }
  .lk-sidebar__inner {
    background: transparent;
    border-radius: 30px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    gap: 10px;
  }
  .lk-sidebar {
    position: relative;
    top: auto;
    overflow-x: auto;
  }
}
.lk-order-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.lk-order-header__status {
  margin-top: 10px;
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  background: #e6f4ee;
}

.lk-order-header__back {
  height: 56px;
  padding: 0 24px;
  display: flex;
  align-items: center;
  border-radius: 999px;
  background: #f7f9fc;
  text-decoration: none;
}

.lk-order-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.lk-card {
  background: #f7f9fc;
  border-radius: 30px;
  padding: 24px;
  margin-bottom: 20px;
}

.lk-card__title {
  font-weight: 600;
  margin-bottom: 20px;
}

.lk-order-info__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.lk-order-info__grid span {
  display: block;
  font-size: 14px;
  color: #8E8E8E;
}

.lk-order-addresses {
  display: grid;
  gap: 20px;
}

.lk-order-address {
  margin-top: 6px;
}

.lk-order-total__row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.lk-history__item {
  display: grid;
  grid-template-columns: 160px 200px 1fr;
  gap: 20px;
  padding: 12px 0;
  border-bottom: 1px solid #DCE4F3;
}

.lk-logout__card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  background: #f7f9fc;
  border-radius: 30px;
  padding: 40px;
}

.lk-logout__icon {
  font-size: 40px;
  color: #309971;
  margin-bottom: 20px;
}

.lk-logout__title {
  font-size: 24px;
  margin-bottom: 10px;
}

.lk-logout__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 20px;
}

.product-help {
  margin-top: var(--pad-inner);
}

.product-help__content {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 30px;
  overflow: hidden;
  align-items: center;
}

.product-help__title {
  max-width: 640px;
}

.product-help__text {
  margin-bottom: 30px;
  max-width: 740px;
}

.product-help__visual {
  position: relative;
}

.zpm-qsearch-mobile__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.zpm-qsearch-mobile__list-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 10px;
}

.zpm-qsearch-mobile__list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.zpm-qsearch-mobile__list-title {
  display: flex;
  align-items: center;
  gap: var(--pad-gap-line);
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}

.zpm-qsearch-mobile__item {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: var(--pad-gap-mini);
  align-items: start;
}

.zpm-qsearch-mobile__item:last-child {
  border-bottom: none;
}

.category .zpm-qsearch-mobile__item {
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap-mini);
  align-items: start;
}

.zpm-qsearch-mobile__count {
  display: flex;
  padding: 5px 10px;
  font-size: var(--mini-Font-size);
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background-color: var(--main-light-color);
  border-radius: var(--border-radius-form);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
}

.zpm-qsearch-mobile__result-meta {
  gap: 10px;
  min-width: 0;
  flex-flow: row;
  align-items: center;
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
}

.zpm-qsearch-mobile__result-meta:not([hidden]) {
  display: flex;
}

.zpm-qsearch-mobile__meta {
  display: flex;
  gap: 2px;
  min-width: 0;
  flex-flow: column;
  width: 100%;
}

.zpm-qsearch-mobile__title {
  display: block;
}

.zpm-qsearch-mobile__label {
  display: block;
  color: var(--gray-color);
  font-size: var(--mini-Font-size);
}

.zpm-qsearch-mobile__go-search-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 24px;
  border-radius: var(--radius-full);
  background: var(--main-dark-color);
  color: #fff;
  text-decoration: none;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  margin-top: 6px;
}

.zpm-qsearch-mobile__go-search-page[hidden] {
  display: none !important;
}

.zpm-qsearch-mobile__search {
  position: relative;
  display: flex;
  align-items: center;
}

.zpm-qsearch-mobile__reset {
  flex: 0 0 auto;
}

.zpm-qsearch-mobile__list[hidden],
.zpm-qsearch-mobile__meta[hidden],
.zpm-qsearch-mobile__list-wrapper[hidden],
.zpm-qsearch-mobile__hint[hidden] {
  display: none !important;
}

/* =========================
   SUB CATEGORY CHIPS
========================= */
.zpm-sub-cat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: var(--main-light-color);
  padding: var(--pad-box);
  border-radius: var(--radius-main);
  margin-bottom: 50px;
}

.zpm-sub-cat-chip--title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0px 10px 0px;
  border-radius: var(--radius-full);
  background: transparent;
  border: 1px solid transparent;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  font-weight: var(--large-Font-weight);
  color: var(--main-dark-color);
  text-decoration: none;
}

.zpm-sub-cat-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border-radius: var(--radius-full);
  background: #fff;
  border: 1px solid var(--border-color);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  color: var(--main-dark-color);
  text-decoration: none;
  transition: all 0.2s ease;
}
.zpm-sub-cat-chip:hover {
  border-color: var(--accent-color-01);
  color: var(--accent-color-01);
}

/* иконка (если есть) */
.zpm-sub-cat-chip__icon {
  width: 24px;
  height: 24px;
  display: flex;
  flex-shrink: 0;
  display: none;
}
.zpm-sub-cat-chip__icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

/* текст */
.zpm-sub-cat-chip__text {
  display: inline-block;
  white-space: nowrap;
}

/* мобильная версия */
@media (max-width: 768px) {
  .zpm-sub-cat-chips {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 5px;
    -webkit-overflow-scrolling: touch;
  }
  .zpm-sub-cat-chips::-webkit-scrollbar {
    display: none;
  }
  .zpm-sub-cat-chip {
    flex: 0 0 auto;
  }
}
@media (max-width: 1310px) {
  .zpm-cart-item__bottom-inner {
    flex-wrap: wrap;
  }
  .zpm-cart-item__sum {
    margin-left: 0;
    min-width: auto;
  }
}
@media (max-width: 830px) {
  .zpm-cart-item__img {
    max-width: 160px;
  }
}