@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-SemiBold.woff2") format("woff2"), url("../fonts/Inter-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  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: 220px;

  --pad-x: 30px;

  --pad-y: 30px;

  --pad-inner: 30px;

  --pad-gap: 15px;

  --pad-gap-line: 10px;

  --pad-gap-mini: 10px;

  --pad-box: 15px;

  --pad-btns: 20px;

  /* 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: 10px;

  --radius-full: 999px;

  --radius-internal: 10px;

  --radius-external: 20px;

  --radius-main: 20px;

  /* 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: 16px;

  --base-Line-height: 24px;

  --base-Font-weight: 400;



  --large-Font-size: 16px;

  --large-Line-height: 20px;



  --Heading-Font-size: 20px;

  --Heading-Line-height: 26px;



  --large-Font-weight: 500;



  --mini-Font-size: 14px;

  --mini-Line-height: 20px;



  --Title-h1-Font-size: 40px;

  --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;



  /* Sizes */



  --main-size-btns: 50px;



  --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: 1310px) {

  :root {

    --pad-btns: 15px;

    --pad-gap-mini: 5px;

  }

}



@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 */

    --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: 600px; */

}



.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);



  font-size: 22px;

  line-height: 26px;



}



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);

  margin-bottom: 5px;

}



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;

}





.no_wrap--word {

  font-style: inherit;

  white-space: nowrap;

}











.zpm-decoration-with-logo {

  display: block;

  pointer-events: none;

}









.zpm-commercial-trust__form-wrap .zpm-decoration-with-logo {

  position: absolute;

  z-index: 1;

  width: 250%;

  transform: translate(-50%,-50%);

  top: 50%;

  left: 50%;

}











.zpm-universal__grid-First .zpm-decoration-with-logo {

  position: absolute;

  z-index: 1;

  width: 170%;

  transform: translate(-50%,-50%);

  top: 50%;

  left: 10%;

}































.fancybox__carousel {

  justify-content: center;

}



.fancybox__viewport {

  max-height: 90vh;

}



























/* ================================

   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;

}



.zpm-accent-text {

  color: var(--accent-color-01);

  font-style: inherit;

}



/* ==========================================================

   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-box);

  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: 48px;

}



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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  min-width: var(--main-size-btns);

  height: var(--main-size-btns);

}



.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: var(--main-size-btns);

  height: var(--main-size-btns);

}



.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: 54vh;

}



.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: 54vh;

}



.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) + 240px);

  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-adv-top__text-big {

  max-width: 500px;

}





.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%;

  z-index: 1;

}



.zpm-universal__grid-First > span {

  position: relative;

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap);

  z-index: 2;



}



.zpm-universal__grid-Second {

  position: relative;

  z-index: 2;

}



.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: var(--main-size-btns);

  height: var(--main-size-btns);

}



.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 20px 0px;*/

}



.header_wrap {

  background-image: url(/assets/img/header/header-bg-big.jpg);

  background-position: center bottom;

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;

  background-attachment: fixed;

  border-bottom: 1px solid var(--border-color);

}



.header_wrap::before {

  position: absolute;

  display: block;

  content: '';

  background: rgba(247, 248, 253, 0.3);

  left: 0px;

  right: 0px;

  top: 0px;

  bottom: 0px;

  z-index: 1;

}



.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: 20px 0 0px;

}



.zpm-header__top-inner {

  display: flex;

  align-items: center;

  gap: var(--pad-x) var(--pad-inner);



  font-size: var(--base-Font-size);

  line-height: var(--base-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);
  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: flex;
  align-items: center;
  white-space: nowrap;
  gap: 5px;
}

.zpm-header__top-link > i {
  font-size: 14px;
  margin-top: 2px;
}



/* Кнопки прокрутки */

.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-inner);

}



.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: var(--main-size-btns);

}



/* Логотип и бейдж */

.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: var(--main-size-btns);

  height: var(--main-size-btns);

  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;

  min-width: 170px;

}



.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: var(--main-size-btns);

  padding: 0 30px;

  border-radius: var(--radius-full);

  background-color: var(--main-light-color);

  border-width: 1px;

  border-style: solid;

  border-color: var(--main-dark-color);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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-full);

  border-width: 1px;

  border-style: solid;

  border-color: var(--main-dark-color);

  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: var(--main-size-btns);

    min-width: var(--main-size-btns);

    height: var(--main-size-btns);

  }

}

@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: -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;

}



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: 420px;

}



.zpm-fb__wrap--max {

  max-width: 420px;

}



.zpm-form__agree-text {

  font-size: 12px;

  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;

}



.wrapper_header_wrap {

  display: block;

  padding: var(--pad-gap) 0px;

}



.inner_header_wrap {

  display: flex;

  flex-flow: row-reverse;

  gap: 5px 8px;

  justify-content: space-between;

  align-items: center;

}



.inner_header_wrap .container {

  padding: 0px;

}



.inner_header_wrap .breadcrumbs__list {

  justify-content: flex-end;

  max-width: 610px;

}



/* ==========================================================================

   page-intro

   ========================================================================= */



.page-intro {

  position: relative;

  z-index: 1;

}



.page-intro > .container {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-mini);

}



.page-intro .page-intro__title {

  max-width: 1280px;

}



/* ==========================================================================

   breadcrumbs

   ========================================================================= */

.breadcrumbs {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  position: relative;

  z-index: 1;

}



.breadcrumbs__list {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 5px 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(390px, 1fr) minmax(0, 2fr) 390px;

  gap: var(--pad-gap);

  align-items: stretch;

}

.product-hero {

  /* КРИТИЧНО: чтобы grid-колонки могли сжиматься */

}

.product-hero__col {

  min-width: 0;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  justify-content: space-between;

}

.product-hero__col--media,

.product-hero__col--info,

.product-hero__col--commerce {

  height: 100%;

}







.product-hero__media,

.product-hero__identity,

.product-hero__specs,

.product-hero__other,

.product-hero__commerce {

  min-width: 0;

}

.product-hero__media {

  overflow: hidden;

  /* height: 100%; */

  display: flex;

}

.product-hero__identity {

  display: grid;

  gap: var(--pad-gap-line);

  grid-template-columns: minmax(0, 1fr) minmax(0, auto);

}

.product-hero__identity > .product-hero__identity--inner {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-line);

}

.product-hero__specs {

  width: 100%;

  max-width: 100%;

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-line);

}

.product-hero__commerce {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-line);

}

.product-hero__title {

  font-size: 26px;

  line-height: 30px;

  /* max-width: 490px; */

}

.product-hero__subtitle {

  padding-right: 10%;

}

.product-hero__status {

  display: inline-flex;

  align-items: center;

  gap: 5px 10px;

  font-weight: 500;

  flex-wrap: wrap;

  font-size: 16px;

  line-height: 18px;

  background: var(--main-light-color);

  border-radius: 10px;

  border-width: 1px;

  border-style: solid;

  border-color: var(--main-light-color);

  padding: 6px 10px;

  box-sizing: border-box;

  display: block;

}



.product-hero__props--primary {

  display: flex;

  gap: 20px;

  /* border-width: 0px; */

  /* border-style: solid; */

  /* border-color: var(--border-color); */

  /* background-color: var(--main-light-color); */

  /* padding: var(--pad-box); */

  /* border-radius: var(--radius-main); */

}



.product-hero__prop--primary {

  gap: 10px;

  display: flex;

  flex-flow: wrap;

  /* width: 100%; */

  align-content: center;

  align-items: center;

}



.product-hero__prop--primary:last-child {

  padding-right: 0px;

  border-right: none;

}



.product-hero__prop--primary > div {

  display: flex;

  flex-flow: column;

  gap: 2px;

}



.product-hero__prop--primary--icons {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 40px;

  height: 40px;

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: var(--main-light-color);

  border-radius: var(--radius-main);

}



.product-hero__prop--primary > div > i {

  font-size: 18px;

}



.product-hero__prop--primary > div > dt,

.product-hero__prop--primary > div > dd {

  margin: 0px;

}



.product-hero__prop--primary > div > dt {

  font-size: 14px;

  line-height: 18px;

  white-space: nowrap;

}



.product-hero__prop--primary > div > dd {

  font-weight: 500;

  white-space: nowrap;

}



.product-hero__props--additional {

  display: grid;

  gap: 5px;

  border-width: 0px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: var(--main-light-color);

  padding: var(--pad-box);

  border-radius: var(--radius-main);

  font-size: 16px;

}



.product-hero__prop {

  display: flex;

  justify-content: space-between;

  gap: var(--pad-gap-line);

}







.product-hero__prop {

  border-bottom: 1px solid var(--border-color);

  padding-bottom: 5px;

}



.product-hero__prop:last-child {

  border-bottom: none;

  padding-bottom: 0px;

}









.product-hero__prop dt {

  margin: 0;

  font-weight: 500;

}

.product-hero__prop dd {

  margin: 0;

}

.product-hero__actions {

  display: flex;

  align-items: flex-start;

  gap: 10px;

  flex-flow: row;

  width: 100%;

}

@media (max-width: 1024px) {

  .product-hero__grid {

    grid-template-columns: 1fr;

    gap: var(--pad-gap);

  }



  .product-hero__col {

    display: contents;

  }



  .product-hero__identity {

    order: 1;

  }



  .product-hero__media {

    order: 2;

  }



  .product-hero__commerce {

    order: 3;

  }



  .product-hero__specs {

    order: 4;

  }



  .product-hero__other {

    order: 5;

  }

}



.product-hero__actions-wrap {

  display: flex;

  flex-flow: wrap;

  gap: var(--pad-gap-line);

}



.product-hero__other {

  display: flex;

  flex-flow: row;

  gap: var(--pad-gap-line);

}



.product-hero {

  padding-top: var(--pad-y);

  padding-bottom: 30px;

}



.product-tabs {

  padding-top: var(--pad-y);

}



.product-hero__commerce-body--top_wrap {

  display: flex;

  flex-wrap: wrap;

  gap: 10px 15px;

}



.product-hero__price {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-mini);

  align-items: center;

}



.product-hero__price > div {

  white-space: nowrap;

}



.product-hero__price-label {

  width: 100%;

}



.product-hero__price-value {

  font-size: 26px;

  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__brand-meta {

  display: flex;

  flex-flow: wrap;

  gap: 15px;

}



.product-hero__brand {

  display: flex;

  align-content: center;

  align-items: center;

  justify-content: center;

}



.product-hero__brand > span, .product-hero__brand > a {

  display: flex;

  align-content: center;

  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);

  white-space: nowrap;

  padding: 0px 6px;

  box-sizing: border-box;

  height: 100%;

}



.product-hero__brand > span > img, .product-hero__brand > a > img {

  width: auto;

  max-height: 16px;

  margin-top: 2px;

}



.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;

  /*transform: scale(1.3);*/

}

.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: var(--main-size-btns);

  height: var(--main-size-btns);

}

.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-box);

  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;

  overflow: hidden;

}



.product-gallery .product-gallery__thumbs .swiper-slide {

  padding: 15px;

}



@media (min-width: 1025px) {

  .product-gallery {

    flex-flow: row-reverse;

    align-items: stretch;

  }



  .product-gallery__main {

    flex: 1 1 auto;

    min-width: 0;

    width: auto;

  }



  .product-gallery__thumbs {

    flex: 0 0 76px;

    width: 76px;

    max-width: 76px;

    min-width: 76px;

    align-self: stretch;

  }



  .product-gallery__thumbs.swiper {

    height: 100%;

  }



  .product-gallery .product-gallery__thumbs .swiper-slide {

    padding: 8px;

    width: 100%;

    height: auto;

    box-sizing: border-box;

  }

}



@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);

  gap: 5px;

  border-width: 0px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: var(--main-light-color);

  padding: var(--pad-box);

  border-radius: var(--radius-main);

}

.spec-table__row {

  display: flex;

  justify-content: space-between;

  gap: 10px;

}



.spec-table__row {

  border-bottom: 1px solid var(--border-color);

  padding-bottom: 5px;

}



.spec-table__row:last-child {

  border-bottom: none;

  padding-bottom: 0px;

}











.spec-table__key {

  margin: 0;

  font-weight: 500;

}



.spec-table__key > span {

  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-box);

  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(0.3);

  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: 50px;

  bottom: 60px;

  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(5, 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: rgba(255, 255, 255, 0.5);

  overflow: hidden;

  transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;

  z-index: 2;

}



/* стеклянный блик */

.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 {

  z-index: 3;

  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: 150px;

  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;

  margin: -50px auto -10px;

}



/* ==========================================================================

   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: 0px var(--pad-gap-mini);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--large-Font-size);

  line-height: var(--large-Line-height);

  padding: var(--pad-box);

}



.category .zpm-popup_manager__head {

  background-color: var(--main-dark-color);

  color: rgb(255, 255, 255);

  -webkit-border-top-left-radius: var(--radius-main);

  -webkit-border-top-right-radius: var(--radius-main);

  -moz-border-radius-topleft: var(--radius-main);

  -moz-border-radius-topright: var(--radius-main);

  border-top-left-radius: var(--radius-main);

  border-top-right-radius: var(--radius-main);

}



/* ==========================================================================

   ADVANTAGES TOP

   ========================================================================= */

.zpm-adv-top {

  position: relative;

  overflow: hidden;

}



.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;

}





/* ==========================================================================

   M9.8.9-03C — PLP commercial trust (approved structure)

   ========================================================================== */

.zpm-commercial-trust {

  position: relative;

  overflow: hidden;

}



.zpm-commercial-trust__wrap {

  display: flex;

  flex-flow: row;

  gap: var(--pad-gap);

}



.zpm-commercial-trust__info {

  display: flex;

  flex-flow: column;

  gap: var(--pad-y);

  width: 100%;

  justify-content: space-between;

  position: relative;

  z-index: 2;

}



.zpm-commercial-trust__form-wrap {

  display: flex;

  flex-flow: column;

  width: 100%;

  max-width: 490px;

  justify-content: flex-end;

  position: relative;

  z-index: 1;

}



.zpm-commercial-trust__card {

  display: flex;

  flex-direction: column;

  gap: var(--pad-y);

}



.zpm-commercial-trust__header {

  display: flex;

  flex-direction: column;

  gap: 10px var(--pad-gap);

}



.zpm-commercial-trust__label {

  margin: 0;

  font-size: 14px;

  line-height: 18px;

  font-weight: 500;

  text-transform: uppercase;

  color: var(--accent-color-01);

}



.zpm-commercial-trust__title {

  margin: 0;

  font-size: var(--Title-h2-Font-size);

  line-height: var(--Title-h2-Line-height);

  font-weight: var(--large-Font-weight);

  max-width: 430px;

}



.zpm-commercial-trust__lead {

  margin: 0;

  max-width: 730px;

}



.zpm-commercial-trust__main {

  display: flex;

  gap: var(--pad-y);

  flex-flow: row;

}



.zpm-commercial-trust__cert-col {

  position: relative;

  display: flex;

  flex-direction: column;

  align-items: center;

  width: 100%;

  padding: 80px var(--pad-inner) 130px;

  border: 1px solid var(--border-color, #e5e5e5);

  border-radius: var(--radius-main, 12px);

  background-color: #fff;

  overflow: hidden;

  max-width: 490px;

}



.zpm-commercial-trust__cert-card--base {

  display: flex;

  position: absolute;

  z-index: 1;

  bottom: 0;

  left: var(--pad-inner);

  right: var(--pad-inner);

}



.zpm-commercial-trust__cert-card {

  display: flex;

  position: relative;

  z-index: 2;

  max-width: 250px;

  box-shadow: 0px 3px 9px -3px rgba(45, 51, 59, 0.3);

  border-radius: var(--radius-main);

}



.zpm-commercial-trust__cert-link {

  display: block;

  border-radius: 6px;

  overflow: hidden;

  transition: box-shadow 0.2s ease, transform 0.2s ease;

  transition: all 0.3s ease;

}



.zpm-commercial-trust__cert-link:hover,

.zpm-commercial-trust__cert-link:focus-visible {

  box-shadow: 0px 3px 9px -3px rgba(0, 0, 0, 0.1);

}



.zpm-commercial-trust__cert-img {

  display: block;

  width: 100%;

  height: auto;

}



.zpm-commercial-trust__cert-all {

  font-size: 14px;

  line-height: 20px;

  /*font-weight: 500;*/

  /* color: var(--accent-color-02, #99303d); */

  text-decoration: underline;

  text-underline-offset: 4px;

  display: inline-flex;

  align-items: center;

  justify-content: flex-start;

}



.zpm-commercial-trust__cert-all:hover,

.zpm-commercial-trust__cert-all:focus-visible {

  text-decoration-thickness: 2px;

}



.zpm-commercial-trust__cert-hidden {

  position: absolute;

  width: 1px;

  height: 1px;

  padding: 0;

  margin: -1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

  white-space: nowrap;

  border: 0;

}



.zpm-commercial-trust__benefits {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  width: 100%;

  justify-content: center;

}



.zpm-commercial-trust__benefits-grid {

  margin: 0;

  padding: 0;

  list-style: none;

  display: flex;

  flex-flow: column;

  gap: var(--pad-y);

}



.zpm-commercial-trust__benefit {

  display: flex;

  align-items: center;

  gap: var(--pad-gap);

}



.zpm-commercial-trust__benefit-icon {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 110px;

  height: 110px;

  min-width: 110px;

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: #fff;

  border-radius: 100%;

  /*color: var(--accent-color-01);*/

  font-size: 50px;

}



.zpm-commercial-trust__benefit-body {

  display: flex;

  flex-direction: column;

  gap: 5px;

  min-width: 0;

}



.zpm-commercial-trust__benefit-title {

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  margin-top: -2px;

}



.zpm-commercial-trust__benefit-text {

  max-width: 410px;

}



.zpm-commercial-trust__form-col {

  position: relative;

  z-index: 2;

}



.zpm-commercial-trust__form-card {

  padding: var(--pad-inner);

  border: 1px solid var(--border-color, #e5e5e5);

  border-radius: var(--radius-main);

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap);



  background-color: rgba(255, 255, 255, 1);

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);



  box-shadow: 0px 0px 20px 5px var(--main-light-color);

}



.zpm-commercial-trust__form-title {

  font-size: var(--Title-h2-Font-size);

  line-height: var(--Title-h2-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-commercial-trust__services--like-FAQ {

  display: flex;

  flex-flow: wrap;

  gap: var(--pad-gap);

}



section .zpm-commercial-trust__services--like-FAQ .section-title__like-h2 {

  margin-bottom: 0px;

}



.zpm-commercial-trust__services--like-FAQ > .section-title__like-h2 {

  width: 100%;

}



.zpm-commercial-trust__form-note {

  font-size: 14px;

  line-height: 18px;

}



.zpm-commercial-trust__services {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: var(--pad-gap);

}



.zpm-commercial-trust__service {

  position: relative;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main, 12px);

  background-color: #fff;

  transition: all 0.3s ease;

}



.zpm-commercial-trust__service:hover {

  border: 1px solid var(--accent-color-01);

}



.zpm-commercial-trust__service-icon {

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 50px;

  position: absolute;

  right: 0px;

  top: 0px;

  /* background-color: var(--main-light-color); */

  padding: var(--pad-inner);

  box-sizing: border-box;

  -webkit-border-bottom-left-radius: var(--pad-inner);

  -moz-border-radius-bottomleft: var(--pad-inner);

  border-bottom-left-radius: var(--pad-inner);

  z-index: 1;

  transition: all 0.3s ease;

}



.zpm-commercial-trust__service-icon > i {

  opacity: 0.5;

  transition: all 0.3s ease;

}



.zpm-commercial-trust__service:hover .zpm-commercial-trust__service-icon {

  color:var(--accent-color-01);

}



.zpm-commercial-trust__service:hover .zpm-commercial-trust__service-icon > i {

  opacity: 1;

}



.zpm-commercial-trust__service-title {

  display: block;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  max-width: 250px;

  position: relative;

  z-index: 2;

}



.zpm-commercial-trust__service-text {

  display: block;

  position: relative;

  z-index: 2;

}



@media (max-width: 1024px) {

  .zpm-commercial-trust__services {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }

}



/* ==========================================================================

   DEALERS + FORM

   ========================================================================= */

.zpm-dealers {

  position: relative;

}



.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-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 {

  position: relative;

}



.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: var(--main-size-btns);

  width: var(--main-size-btns);

  min-width: var(--main-size-btns);

}



.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: var(--main-size-btns);

  height: var(--main-size-btns);

  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-icon {

  width: 18px;

  height: 18px;

}



.p-card__buy-ok {

  font-size: 16px;

  line-height: 20px;

}





.zpm-copy__value,

.p-card__title {

  font-size: 14px;

  line-height: 20px;

}



.inner_header_wrap {

  flex-flow: column;

  align-items: flex-start;

}



.inner_header_wrap .breadcrumbs__list {

  justify-content: flex-start;

  max-width: none;

}























  .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: 270px 1fr;

  gap: var(--pad-gap);

  align-items: start;

}

.category--hub .category__layout {

  grid-template-columns: auto;

}

.category__sidebar {

  /* на десктопе показываем сайдбар */

  position: relative;

}

.category__content {

  min-width: 0;

}

.category__topbar {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: var(--pad-gap-line);

  margin-bottom: var(--pad-gap-line);

}



.category__topbar__wrap-left {

  display: flex;

  width: 100%;

  align-items: center;

  justify-content: flex-start;

  gap: calc(var(--pad-inner) + var(--pad-inner));

  background-color: var(--main-light-color);

  padding: 0px var(--pad-box);

  border-radius: var(--radius-main);

  border: 1px solid var(--border-color);

}





.category__sort,

.category__limit {

  position: relative;

  display: flex;

  align-items: center;

  gap: var(--pad-box);

}

.category__sort-btn {

  border-color: var(--border-color);

  background: #fff;

  padding: 0px var(--pad-box);

  height: 50px;

  border-width: 1px;

  border-style: solid;

  cursor: pointer;

  border-top: none;

  border-bottom: none;

  transition: all 0.3s ease;

}

.category__sort-btn:hover {

  border-color: var(--accent-color-01);

  color: var(--accent-color-01);

}

.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;

  color: inherit;

  text-decoration: none;

  font: inherit;

}

.category__sort-item.is-active {

  font-weight: 600;

}

.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(5, 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);

  gap: 10px;

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  padding-top: calc(var(--pad-box) * 3);

  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);

  overflow: hidden;

  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__primary-specs {

  display: none;

}

.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 {

  position: relative;

  z-index: 2;

  display: flex;

  flex-flow: column;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  gap: 5px;

}



.p-card__status > span,

.p-card__status > div {

  position: relative;

  z-index: 3;

}



.p-card__status::before {

  position: absolute;

  display: block;

  content: '';

  z-index: 2;

  background: rgba(255, 255, 255, 0);

  width: 100%;

  height: 100%;

  padding: 15px;

  box-sizing: content-box;

  left: -20px;

  top: -20px;

  border-radius: var(--radius-main);

  transition: all 0.3s ease;

  pointer-events: none;

}



.p-card:hover .p-card__status::before {

  background: rgba(255, 255, 255, 0.7);

}



@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);

}



.p-card .p-card__delivery {

  max-width: 120px;

}



.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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  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: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: 40px;

  min-width: 40px;

  height: 40px;

  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: 5px 15px;

  box-sizing: border-box;

  flex-flow: row;

  justify-content: center;

  position: absolute;

  width: 100%;

  bottom: 10px;

  /* font-size: 20px; */

  text-align: center;

  min-height: 30px;

  align-items: 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__commerce button.btn-qty--toogle {

  width: 100%;

  max-width: 170px;

}



/* ==========================================================================

   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: var(--main-size-btns);

  height: var(--main-size-btns);

  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__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-box);

    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 .fancybox-image,

.fancybox__container.is-product-fancybox .fancybox__content img,

.fancybox__container.is-product-fancybox img.f-panzoom__content,

.fancybox__container.is-product-fancybox .f-panzoom__content,

.fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox-image,

.fancybox__container.is-product-fancybox .zpm-fb-product__stage img {

  max-width: 80vw;

  max-height: 80vh;

  width: auto;

  height: auto;

  -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 .fancybox-image,

  .fancybox__container.is-product-fancybox .fancybox__content img,

  .fancybox__container.is-product-fancybox img.f-panzoom__content,

  .fancybox__container.is-product-fancybox .f-panzoom__content,

  .fancybox__container.is-product-fancybox .zpm-fb-product__stage .fancybox-image,

  .fancybox__container.is-product-fancybox .zpm-fb-product__stage img {

    max-width: 95vw;

    max-height: 90vh;

  }

  .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);

}



.flt__form {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-line);

  padding-top: var(--pad-gap-line);

}



.flt__group {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-line);

  padding-top: 0px;

  transition: all 0.3s ease;

  background: rgba(0, 48, 63, 1);

  background: linear-gradient(0deg, rgba(0, 48, 63, 0) 0%, rgba(255, 255, 255, 0) 50%);

  box-shadow: 0px 0px 0px 0px rgba(0, 48, 63, 0) inset;

    transition: all 0.3s ease;

}



.flt__group:hover .flt__group-title {

  color: var(--accent-color-01);

}



.flt__group:hover .flt__group-head .flt__group-title {

  color: var(--font-dark-color);

}



.flt__group .flt__group-head:hover .flt__group-title {

  color: var(--accent-color-01);

}



.flt__check:hover .flt__check-text {

  color: var(--accent-color-01);

  transition: all 0.3s ease;

}





.flt__group.is-open {

  padding-top: 10px;

  background: rgba(0, 48, 63, 1);

  background: linear-gradient(0deg, rgba(0, 48, 63, 0) 0%, rgba(255, 255, 255, 1) 50%);

  transition: all 0.3s ease;

  box-shadow: 0px 0px 10px 0px rgba(0, 48, 63, 0.2) inset;

}



/* accordion head */

.flt__group-head {

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: var(--pad-gap-line);

  padding: 0;

  border: 0;

  background: transparent;

  cursor: pointer;

  text-align: left;

  min-height: 30px;

  padding: 0px var(--pad-box);

}

/* M9.8.9-08A — attribute filter group reset (body placement) */

.flt__group-reset {

  display: block;

  margin: var(--pad-gap-mini, 8px) 0 0;

  padding: 0;

  border: 0;

  background: transparent;

  color: var(--text-muted, #9a9a9a);

  font: inherit;

  font-size: 12px;

  line-height: 1.2;

  cursor: not-allowed;

  white-space: nowrap;

  text-align: left;

}



.flt__group-reset:disabled {

  color: var(--text-muted, #9a9a9a);

  cursor: not-allowed;

  opacity: 0.65;

}



.flt__group-reset.is-active,

.flt__group-reset:not(:disabled) {

  color: var(--accent-color-02);

  cursor: pointer;

  opacity: 1;

}



.flt__group-reset.is-active:hover,

.flt__group-reset.is-active:focus-visible,

.flt__group-reset:not(:disabled):hover,

.flt__group-reset:not(:disabled):focus-visible {

  text-decoration: underline;

}





.flt__group-title {

  font-weight: var(--large-Font-weight);

  transition: all 0.3s ease;

}









.flt__group.is-open .flt__group .flt__chev {

  transform: rotate(45deg) scaleY(1);

}



.flt__group .flt__group.is-open .flt__chev {

  transform: rotate(315deg) scaleY(-1);

  margin-top: 10px;

}









.flt__group-body .flt__group {

  gap: 5px;

  padding-top: 5px;

  background: transparent;

  box-shadow: 0px 0px 0px 0px rgba(0, 48, 63, 0) inset !important;

}





.flt__group-body .flt__group .flt__group-head {

  padding: 0px;

}



.flt__group-body .flt__group .flt__group-title {

  font-weight: 400;

  font-size: 14px;

  line-height: 18px;

  max-width: 200px;

}



.flt__group-body .flt__group .flt__chev {

  width: 10px;

  height: 10px;

  margin-top: 2px;

}



.flt__group-body .flt__group.flt__chev::after {

  top: -1px;

  left: -1px;

}



.flt__group-body .flt__group-body {

  padding: 0px 0px var(--pad-box);

}



















/* 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__group.is-open .flt__chev::after {

  background: var(--font-light-color);

}



.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: 48px;

  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: 5px var(--pad-box);

  border-radius: var(--radius-main);

  flex-flow: column;

  margin: 0px var(--pad-box);

}



.flt__switches:hover {

  border-color: var(--accent-color-01);

}



.flt__switch {

  position: relative;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;

  padding: 5px 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: 42px;

  height: 20px;

  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: 12px;

  height: 12px;

  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(--accent-color-01);

}



.flt__group-body {

  gap: var(--pad-gap-mini);

  /* border-top: 1px solid var(--border-color); */

  /* border-bottom: 1px solid var(--border-color); */

  /* background-color: rgba(var(--White-color-opcity)); */

  padding: 0px var(--pad-box) var(--pad-box);

  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;

  padding: var(--pad-box);

}



.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: var(--main-size-btns);

  height: var(--main-size-btns);

  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: var(--main-size-btns);

  height: var(--main-size-btns);

}

.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);

  align-items: center;

  flex-wrap: wrap;

}



.zpm-cart-page__sum,

.zpm-account-orders__sum,

.p-card__price {

  font-size: 20px;

  line-height: 20px;

  font-weight: 500;

  white-space: nowrap;

}



.p-card__old-price {

  text-decoration: line-through;

  color: var(--gray-color);

  white-space: nowrap;

  font-size: 14px;

  line-height: 20px;

}



.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-box);

  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 {

  position: relative;

  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: calc(var(--pad-y) + var(--pad-y)) 0px var(--pad-y);

}



.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: flex;

  gap: 7px;

  align-items: baseline;

}



.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);



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 {

  display: grid;

  gap: var(--pad-gap-line);

}



.zpm-footer__policy-link {

  display: flex;

  gap: 7px;

  align-items: baseline;

  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-y);

}



.zpm-address.zpm-footer__kv {

  gap: 10px;

}



.zpm-footer__kv {

  gap: 5px;

  display: flex;

  flex-flow: column;

}



.zpm-footer__kv > div {

  display: flex;

  flex-flow: row;

  gap: 7px;

  align-items: baseline;

}



.zpm-footer__k {

  font-weight: var(--large-Font-weight);

}





















.zpm-footer__v {

  font-size: 20px;

  line-height: 26px;

}





































.zpm-footer__bottom {

  padding: var(--pad-y) 0px;

  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: 40px;

  min-width: 40px;

  height: 40px;

}



/* 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: 5px;

}

/*

.zpm-form__input,

.zpm-form__textarea {

  padding: 12px;

  border-radius: 12px;

  border: 1px solid #ddd;

  background: #fafafa;

}

*/



.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;

}







  .zpm-header__account .btn {

    background-color: rgba(var(--main-light-color-opcity));

  }

  .zpm-header__account .btn:hover {

    background-color: var(--main-dark-color);

    color: var(--font-light-color);

  }











@media (max-width: 1560px) {



  .zpm-commercial-trust__cert-card {

    max-width: 170px;

  }



  .zpm-commercial-trust__cert-col {

    padding: 60px var(--pad-inner) 100px;

    max-width: 320px;

  }



  .zpm-commercial-trust__cert-card--base {

    bottom: 10px;

    left: 10px;

    right: 10px;

  }



  .zpm-commercial-trust__form-wrap {

    max-width: 420px;

  }



  .zpm-commercial-trust__info {

    justify-content: flex-start;

  }



.zpm-commercial-trust__benefit {

  align-items: flex-start;

}



.zpm-commercial-trust__benefit-icon {

  width: 70px;

  height: 70px;

  min-width: 70px;

  font-size: 30px;

}



.zpm-commercial-trust__benefit-text {

  max-width: 320px;

}



.zpm-commercial-trust__form-wrap {

  max-width: 550px;

}













  .category__grid {

    grid-template-columns: repeat(4, 1fr);

  }

  .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: var(--main-size-btns);

  }

  .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);

  }

  .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;

  }

  .p-card__price {

    width: 100%;

  }



  .p-card__footer {

    gap: 5px;

  }

  .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; /* растянуть на все колонки */

  }

  /* Остальные автоматически встанут во вторую строку */























.home_h1 h1 {

  max-width: 600px;

}























}



































@media (max-width: 1310px) {

  .zpm-header__main-inner {

    grid-template-columns: auto auto 1fr auto;

  }

  .category__grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .category-list .category__grid,

  .page--account-order .category__grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .message-if-empty .img-decor {

    padding: 0;

  }

  .zpm-commercial-trust__main {

    flex-flow: column;

  }









}













@media (max-width: 1290px) {



  .zpm-universal__grid-First .zpm-decoration-with-logo {

    width: 180%;

  }







}





















@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;

  width: 100%;

}







  .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;

  }

  .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);

  }

  .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;

  }





.zpm-universal__grid-First .zpm-decoration-with-logo {

  width: 200%;

  left: -10%;

}

































}























@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: 10px 0px 0px;

  }

  .page-intro {

    padding: 10px 0px 0px;

  }



  .zpm-about__text {

    max-width: none;

  }



  .zpm-dealers__text {

    max-width: 300px;

  }





  .zpm-adv-top__text {

    max-width: 350px;

  }



  .zpm-adv-top__text-big {

    max-width: 290px;

  }



  .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);

  }



  .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-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: 690px) {



.category__grid {

  grid-template-columns: repeat(2, 1fr);

}



.category__topbar__wrap-left {

  display: flex;

  width: 100%;

  align-items: flex-start;

  justify-content: flex-start;

  gap: 0px;

  background-color: transparent;

  padding: 0px;

  border-radius: 0px;

  border: none;

  flex-flow: column;

}



.category__topbar {

  align-items: flex-end;

}



.category__sort-btn {

  padding: 0px;

  height: 30px;

  border: none;

  text-decoration: underline;

}



.category__sort, .category__limit {

  gap: 5px;

}

















}





@media (max-width: 610px) {

  .zpm-mmenu__phone {

    display: none;

  }

  .p-card__title {

    font-size: 16px;

    line-height: 22px;

  }

  .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;

  }

}



.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;

  }



.p-card .p-card__status::before,

.p-card:hover .p-card__status::before {

  display: none;

}















}

@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;

  }

  .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;

  }

  .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: var(--main-size-btns);

  }

  .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: var(--main-size-btns);

  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: 48px;

  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: 20px;

  line-height: 24px;

  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;

  }

}



/* ==========================================================================

   SITE-002 — product hero commerce card (right column)

   ========================================================================= */

.product-hero__col--commerce .product-hero__commerce {

  gap: var(--pad-gap-line);

  gap: 20px;

}



.product-hero__commerce-card {

  display: flex;

  flex-flow: column;

}



.product-hero__commerce-head {

  padding: 0px var(--pad-box);

  background-color: var(--main-dark-color);

  color: #fff;

  font-weight: 500;

  -webkit-border-top-left-radius: var(--radius-main);

  -webkit-border-top-right-radius: var(--radius-main);

  -moz-border-radius-topleft: var(--radius-main);

  -moz-border-radius-topright: var(--radius-main);

  border-top-left-radius: var(--radius-main);

  border-top-right-radius: var(--radius-main);

  height: var(--main-size-btns);

  display: flex;

  align-items: center;

}



.product-hero__commerce-body {

  display: flex;

  flex-flow: column;

  gap: 30px;

  padding: var(--pad-box);

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: transparent;

  -webkit-border-bottom-right-radius: var(--radius-main);

  -webkit-border-bottom-left-radius: var(--radius-main);

  -moz-border-radius-bottomright: var(--radius-main);

  -moz-border-radius-bottomleft: var(--radius-main);

  border-bottom-right-radius: var(--radius-main);

  border-bottom-left-radius: var(--radius-main);

}



.product-hero__service-card {

  display: flex;

  flex-flow: column;

  /* border-radius: var(--radius-main); */

  gap: var(--pad-gap-line);

  /* padding: var(--pad-box); */

  /* border-width: 1px; */

  /* border-style: solid; */

  /* border-color: var(--border-color); */

}



.btn-Question {

  width: 210px;

}



.product-hero__service-card > .section-title__like-h3 {

  margin: 0;

}



.product-hero__service-list {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-mini);

  margin: 0;

  padding: 0;

  list-style: none;

}



.product-hero__service-item {

  display: flex;

  align-items: flex-start;

  gap: 10px;

}



.product-hero__service-item > a > i {

  flex-shrink: 0;

  width: 40px;

  margin-top: 5px;

  color: var(--main-dark-color);

  font-size: 40px;

  text-align: center;

}



.product-hero__service-item > i {

  flex-shrink: 0;

  width: 30px;

  margin-top: 5px;

  color: var(--main-dark-color);

  font-size: 30px;

  text-align: center;

}



.product-hero__service-item > a {

  display: flex;

  flex-flow: row;

  gap: 15px;

}



.product-hero__service-item > a > div {

  display: flex;

  flex-flow: column;

  gap: 5px;

}



.product-hero__service-item strong {

  font-weight: 500;

}



.product-hero__service-item span {

  color: var(--gray-color);

  /* font-size: 16px; */

  /* line-height: 20px; */

  /* max-width: 310px; */

}









.product-hero__service-item > a:hover > i,

.product-hero__service-item > a:hover > div > span {

  color: var(--accent-color-01);

}























.product-hero__service-actions {

  display: flex;

  flex-flow: column;

  gap: var(--pad-gap-mini);

}



.product-hero__service-actions .btn {

  width: 100%;

  justify-content: center;

}



@media (max-width: 1024px) {

  .product-hero__col--commerce .product-hero__commerce {

    gap: var(--pad-gap-mini);

  }

}



/* ==========================================================================

   SITE-002 — PDP product-content layout

   ========================================================================= */

.product-content {

  padding-top: var(--pad-y);

  background-color: #fff !important;

  padding-top: 0px !important;

  padding-bottom: 0px !important;

}



.product-content__grid {

  display: grid;

  gap: var(--pad-gap);

}



.product-content__grid--with-side {

  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);

  align-items: start;

}



.product-content__main {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  min-width: 0;

}



.product-content__side {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  min-width: 0;

}



.product-content .product-help {

  grid-column: 1 / -1;

  margin-top: 0;

  background-color: var(--main-light-color);

  border-radius: var(--radius-main);

  padding: var(--pad-box);

}



.product-content__card {

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: #fff !important;

  border-radius: var(--radius-main);

  padding: var(--pad-box);

  width: 100%;

}



.product-content__specifications .spec-table {

  background-color: transparent;

  padding: 0;

}



.product-content__specifications.is-collapsible .spec-table {

  overflow: hidden;

  transition: max-height 0.3s ease;

  border-radius: 0px;

  position: relative;

  z-index: 2;

}



.product-content__specs-toggle-wrap {

  margin-top: -3px;

  background-color: #fff;

  display: block;

  padding-top: 10px;

  position: relative;

  z-index: 3;

}



.product-content__specs-toggle-wrap[hidden] {

  display: none;

}



.product-content__specs-toggle {

  display: inline-flex;

  align-items: center;

  gap: var(--pad-gap-mini);

  margin: 0;

  padding: var(--pad-gap-mini) var(--pad-gap-line);

  border: 1px solid var(--border-color);

  border-radius: var(--border-radius-form);

  background-color: transparent;

  color: var(--accent-color-01);

  cursor: pointer;

}



.product-content__specs-toggle:hover,

.product-content__specs-toggle:focus-visible {

  border-color: var(--accent-color-01);

  color: var(--accent-color-01);

}



.product-content__specs-toggle [data-product-specs-toggle-icon] {

  transition: transform 0.3s ease;

}



.product-content__specifications.is-expanded [data-product-specs-toggle-icon] {

  transform: rotate(180deg);

}



@media (prefers-reduced-motion: reduce) {

  .product-content__specifications.is-collapsible .spec-table,

  .product-content__specs-toggle [data-product-specs-toggle-icon] {

    transition: none;

  }

}



.product-content__documents h2 {

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  margin: 0 0 var(--pad-box);

}



.product-content__documents .docs-list {

  display: flex;

  flex-direction: column;

  flex-wrap: nowrap;

  gap: var(--pad-gap-mini);

  padding: 0;

  margin: 0;

  width: 100%;

  list-style: none;

}



.product-content__documents .docs-list__item {

  display: block;

  width: 100%;

}



.product-content__documents .docs-list__link {

  display: flex;

  flex-direction: row;

  align-items: center;

  gap: 20px;

  width: 100%;

  min-height: 0;

  padding: var(--pad-box);

  border-radius: var(--radius-main);

  border-width: 0px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: var(--main-light-color);

  text-align: left;

  font-size: inherit;

  line-height: inherit;

  color: inherit;

  text-decoration: none;

  overflow: visible;

  transition: border-color 0.3s ease;

}



.product-content__documents .docs-list__link:hover {

  border-color: var(--accent-color-01);

}



.product-content__documents .docs-list__link::before {

  content: "";

  display: block;

  width: 50px;

  height: 50px;

  flex-shrink: 0;

  filter: grayscale(0.3);

  transition: filter 0.3s ease;

  margin-top: 2px;

}



.product-content__documents .docs-list__link:hover::before {

  filter: grayscale(0);

}



.product-content__documents .docs-list__link.pdf::before {

  background: url("../img/pdf_ico.png") center/contain no-repeat;

}



.product-content__documents .docs-list__link.word::before {

  background: url("../img/word_ico.png") center/contain no-repeat;

}



.product-content__documents .docs-list__link.excel::before {

  background: url("../img/excel_ico.png") center/contain no-repeat;

}



.product-content__documents .docs-list__link.png::before {

  background: url("../img/png_ico.png") center/contain no-repeat;

}



.product-content__documents .docs-list__link.jpg::before {

  background: url("../img/jpg_ico.png") center/contain no-repeat;

}



.product-content__documents .docs-list__file-main {

  display: flex;

  flex-direction: column;

  flex: 1;

  gap: 2px;

  min-width: 0;

}



.product-content__documents .docs-list__file-title {

  display: block;

}



.product-content__documents .docs-list__file-type {

  display: block;

  color: var(--gray-color);

  font-size: inherit;

  line-height: inherit;

  display: none;

}



.product-content__documents .docs-list__download {

  display: flex;

  flex-shrink: 0;

  align-items: center;

  justify-content: center;

  width: 50px;

  height: 50px;

  color: var(--font-dark-color);

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  background-color: #fff !important;

  border-radius: var(--radius-main);

}



.product-content__documents .docs-list__link:hover .docs-list__download {

  color: var(--accent-color-01);

}



.product-content__documents .product-content__docs-note {

  display: flex;

  gap: var(--pad-gap-mini);

  align-items: flex-start;

  margin-top: 30px;

  /* padding-top: var(--pad-gap-mini); */

  /* border-top-width: 1px; */

  /* border-top-style: solid; */

  /* border-top-color: var(--border-color); */

  color: var(--gray-color);

  /* font-size: inherit; */

  /* line-height: inherit; */

  padding-left: 20px;

}



.product-content__documents .product-content__docs-note > i {

  flex-shrink: 0;

  margin-top: 2px;

  font-size: 20px;

}



.product-content__docs-note > span {

  max-width: 410px;

}



.product-content__documents .product-content__docs-note a {

  color: var(--accent-color-01);

  text-decoration: underline;

}



.product-content__documents .product-content__docs-empty {

  display: flex;

  flex-direction: column;

  align-items: center;

  text-align: center;

  gap: var(--pad-gap-mini);

  padding: var(--pad-box);

  background-color: var(--main-light-color);

  border-radius: var(--radius-main);

}



.product-content__documents .product-content__docs-empty > i {

  font-size: 28px;

  color: var(--gray-color);

}



.product-content__documents .product-content__docs-empty strong {

  display: block;

}



.product-content__documents .product-content__docs-empty > span {

  display: block;

  color: var(--gray-color);

}



.product-content__documents .product-content__docs-empty a {

  display: inline-block;

  margin-top: var(--pad-gap-mini);

  padding: var(--pad-gap-mini) var(--pad-gap-line);

  border-width: 1px;

  border-style: solid;

  border-color: var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  color: var(--font-dark-color);

  text-decoration: none;

  transition: border-color 0.3s ease, color 0.3s ease;

}



.product-content__documents .product-content__docs-empty a:hover {

  border-color: var(--accent-color-01);

  color: var(--accent-color-01);

}



@media (max-width: 1024px) {

  .product-content__grid--with-side {

    grid-template-columns: 1fr;

  }



  .product-content__main {

    order: 1;

  }



  .product-content__side {

    order: 2;

  }



  .product-content .product-help {

    order: 3;

  }

}







.product-content__documents {

  padding: 0;

  background: transparent;

  border: none;

}



/* ==========================================================================

   SITE-002 — PDP MOBILE PASS V1

   Rollback: SITE-002-STABLE-PDP-V4-2026-06-10 (style.css only)

   ========================================================================= */



@media (max-width: 1440px) {



  .product-hero__grid {

    grid-template-columns: minmax(310px, 1fr) minmax(0, 2fr) 370px;

    gap: 20px;

  }



}



@media (max-width: 1310px) {



  .product-hero__props--additional {

    display: none;

  }



}



@media (max-width: 1190px) {



  .product-hero__grid {

    grid-template-columns: 1fr;

  }



}



@media (max-width: 768px) {

  .product-hero__grid {

    gap: var(--pad-gap-line);

  }



  .product-hero__identity {

    grid-template-columns: 1fr;

  }



  .product-hero__other {

    justify-content: flex-start;

  }



  .product-hero__title {

    max-width: 100%;

    font-size: var(--Title-h2-Font-size);

    line-height: var(--Title-h2-Line-height);

  }



  .product-hero__media {

    width: 100%;

  }



  .product-gallery__main {

    min-height: 280px;

  }



  .product-gallery__img {

    width: 100%;

    height: auto;

    min-height: 280px;

    max-height: 420px;

    -o-object-fit: contain;

    object-fit: contain;

  }



  .product-hero__commerce {

    width: 100%;

  }



  .btn-Question {

    width: 100%;

  }



  .product-hero__service-item span {

    max-width: none;

  }



  .product-hero__props--primary {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: var(--pad-gap-mini);

  }



  .product-hero__prop--primary {

    width: auto;

    min-width: 0;

    flex-flow: row;

    align-items: flex-start;

  }



  .product-hero__prop--primary--icons {

    flex-shrink: 0;

  }



  .product-hero__prop--primary > div {

    min-width: 0;

  }



  .product-hero__prop--primary > div > dt,

  .product-hero__prop--primary > div > dd {

    white-space: normal;

    overflow-wrap: anywhere;

  }



  .product-hero__props--additional {

    min-width: 0;

  }



  .product-hero__prop {

    flex-wrap: wrap;

    min-width: 0;

  }



  .product-hero__prop dt,

  .product-hero__prop dd {

    min-width: 0;

    overflow-wrap: anywhere;

  }



  .product-hero__prop dd {

    text-align: right;

    flex: 1 1 40%;

  }



  .product-content__grid,

  .product-content__main,

  .product-content__side {

    min-width: 0;

  }



  .spec-table {

    min-width: 0;

  }



  .spec-table__row {

    flex-wrap: wrap;

    min-width: 0;

  }



  .spec-table__key,

  .spec-table__val {

    min-width: 0;

    overflow-wrap: anywhere;

  }



  .spec-table__val {

    text-align: right;

    flex: 1 1 40%;

  }



  .product-content__documents .docs-list__link {

    padding: var(--pad-box);

    gap: var(--pad-gap-mini);

  }



  .product-content__documents .docs-list__file-title {

    overflow-wrap: anywhere;

  }



  .product-content__documents .product-content__docs-note {

    padding-left: 0;

  }



  .product-content__docs-note > span {

    max-width: none;

  }



  .product-help__content {

    grid-template-columns: 1fr;

    gap: var(--pad-gap);

  }



  .product-help__left {

    order: 1;

  }



  .product-help__right {

    order: 2;

  }



  .product-help__title,

  .product-help__text {

    max-width: none;

  }



  .product-help__visual img {

    display: block;

    width: 100%;

    max-width: 100%;

    height: auto;

  }



  .rel-products__head {

    flex-wrap: wrap;

    gap: var(--pad-gap-line);

  }



  .rel-products__img {

    height: 380px;

  }



  .product-hero,

  .product-content,

  .rel-products,

  .product-help {

    max-width: 100%;

    overflow-x: clip;

  }

}



@media (max-width: 576px) {

  .product-gallery__main {

    min-height: 260px;

  }



  .product-gallery__img {

    min-height: 260px;

    max-height: 360px;

  }



  .rel-products__img {

    height: 340px;

  }



  .product-content__documents .docs-list__link::before,

  .product-content__documents .docs-list__download {

    width: 44px;

    height: 44px;

  }

}



@media (max-width: 390px) {

  .product-gallery__main {

    min-height: 240px;

  }



  .product-gallery__img {

    min-height: 240px;

    max-height: 320px;

  }



  .rel-products__img {

    height: 300px;

  }



  .product-hero__props--primary {

    gap: var(--pad-box);

  }



  .product-hero__prop--primary--icons {

    width: 36px;

    height: 36px;

  }



  .product-hero__prop--primary > div > i {

    font-size: 16px;

  }

}



@media (max-width: 375px) {

  .product-gallery__img {

    min-height: 220px;

    max-height: 300px;

  }



  .rel-products__img {

    height: 280px;

  }

}



@media (max-width: 360px) {

  .product-gallery__img {

    min-height: 210px;

    max-height: 280px;

  }



  .rel-products__img {

    height: 260px;

  }



  .product-hero__commerce-head {

    height: 52px;

  }

}



/* ==========================================================================

   SITE-002 — CATEGORY V2 VIEW SWITCHER PASS

   Rollback: SITE-002-STABLE-CATEGORY-V2-PRE-VIEW-SWITCHER

   Scope: .page--category only

   ========================================================================= */



.page--category .category__view {

  display: flex;

  align-items: center;

  gap: 0;

}



.page--category .category__view-btn {

  border-color: var(--border-color);

  background: transparent;

  padding: 0px 20px 0px 26px;

  height: 50px;

  min-width: 50px;

  border-radius: var(--radius-full);

  border-width: 1px;

  border-style: solid;

  cursor: pointer;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: inherit;

  font-size: 18px;

  line-height: 1;

  transition: all 0.3s ease;

}



.page--category .category__view-btn:hover {

  border-color: var(--accent-color-01);

  background: var(--accent-color-01);

  color: #fff;

}



.page--category .category__view-btn + .category__view-btn {

  margin-left: -1px;

  border-top-left-radius: 0;

  border-bottom-left-radius: 0;

  padding: 0px 26px 0px 20px;

}



.page--category .category__view-btn:first-child:not(:only-child) {

  border-top-right-radius: 0;

  border-bottom-right-radius: 0;

}



.page--category .category__view-btn.is-active {

  border-color: var(--main-dark-color);

  background-color: var(--main-dark-color);

  color: #fff;

  position: relative;

  z-index: 1;

}



.page--category .category__view-btn i {

  pointer-events: none;

}



@media (max-width: 1024px) {

  .page--category .category__view {

    display: none !important;

  }

}











@media (min-width: 1025px) {



  .page--category .category--view-list .category__grid {

    grid-template-columns: 1fr;

    gap: var(--pad-gap-mini);

  }



















}



/* =========================

   CATEGORY V2.3 / V2.3.1 — subcategory chips (compact + collapse)

   Scope: .page--category only

========================= */

.page--category .zpm-sub-cat-chips {

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 15px;

  padding: 0;

  margin-bottom: var(--pad-inner);

  background-color: transparent;

  border: none;

  /* border-bottom: 1px solid var(--border-color); */

  border-radius: 0px;

}



.page--category .zpm-sub-cat-chip--title {

  padding: 0;

  gap: 8px;

}



.page--category .zpm-sub-cat-chip--title .fal {

  color: var(--main-dark-color);

  line-height: 1;

}



.page--category .zpm-sub-cat-chips__list {

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

  width: 100%;

  min-width: 0;

}



.page--category .zpm-sub-cat-chip {

  gap: 10px;

  padding: 4px var(--pad-btns);

}



.page--category .zpm-sub-cat-chips.is-collapsible.is-collapsed .zpm-sub-cat-chips__list {

  overflow: hidden;

  max-height: var(--subcat-chips-max-h, none);

}



.page--category .zpm-sub-cat-chips.is-collapsible.is-expanded .zpm-sub-cat-chips__list {

  overflow: visible;

  max-height: none;

}



.page--category .zpm-sub-cat-chips__toggle {

  display: inline-flex;

  align-items: center;

  gap: 5px;

  padding: 0;

  margin: 0;

  border: 0;

  background: transparent;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-01);

  cursor: pointer;

  text-decoration: none;

}



.page--category .zpm-sub-cat-chips__toggle [data-subcat-chips-toggle-label] {

  text-decoration: underline;

  text-underline-offset: 2px;

}



.page--category .zpm-sub-cat-chips__toggle .fal {

  line-height: 1;

  flex-shrink: 0;

}



.page--category .zpm-sub-cat-chips__toggle:hover {

  color: var(--main-dark-color);

}



.page--category .zpm-sub-cat-chips__toggle[hidden] {

  display: none !important;

}



@media (max-width: 768px) {

  .page--category .zpm-sub-cat-chips {

    overflow: visible;

  }



  .page--category .zpm-sub-cat-chips__list {

    flex-wrap: wrap;

    overflow-x: visible;

    overflow-y: hidden;

    padding-bottom: 0;

    -webkit-overflow-scrolling: auto;

  }



  .page--category .zpm-sub-cat-chips__toggle {

    align-self: flex-start;

  }

}



/* ==========================================================================

   Contacts page — main content redesign

   ========================================================================== */



.zpm-contact-cards {

  position: relative;

}



.zpm-contact-cards__grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: var(--pad-gap);

}



.zpm-contact-card {

  display: flex;

  flex-direction: column;

  gap: var(--pad-box);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

  position: relative;

}







.zpm-contact-card__icon {

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 50px;

  position: absolute;

  right: 0px;

  top: 0px;

  /* background-color: var(--main-light-color); */

  padding: var(--pad-inner);

  box-sizing: border-box;

  -webkit-border-bottom-left-radius: var(--pad-inner);

  -moz-border-radius-bottomleft: var(--pad-inner);

  border-bottom-left-radius: var(--pad-inner);

  z-index: 1;

  transition: all 0.3s ease;

}



.zpm-contact-card__icon > i {

  opacity: 0.5;

  transition: all 0.3s ease;

}



.zpm-contact-card:hover .zpm-contact-card__icon {

  color:var(--accent-color-01);

}



.zpm-contact-card:hover .zpm-contact-card__icon > i {

  opacity: 1;

}













.zpm-contact-card__body,

.zpm-contact-card__body > div {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

}



.zpm-contact-card__title {

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-contact-card__value {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  color: var(--font-dark-color);

  max-width: 400px;

}



.zpm-contact-card__value--link {

  display: inline-block;

  font-size: var(--Heading-Font-size);

  line-height: var(--Heading-Line-height);

  color: inherit;

  text-decoration: none;

}



.zpm-contact-card__value--link:hover,

.zpm-contact-card__value--link:focus-visible {

  color: var(--accent-color-01);

}



.zpm-contact-card__hint {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  margin-top: auto;

}



.zpm-contact-card__action {

  align-self: flex-start;

  margin-top: auto;

  padding: 0;

  border: 0;

  background: transparent;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-01);

  text-decoration: underline;

  text-underline-offset: 2px;

  cursor: pointer;

}



.zpm-contact-card__action--btn {

  font-family: inherit;

}



.zpm-contact-card__action:hover,

.zpm-contact-card__action:focus-visible {

  color: var(--main-dark-color);

}



.zpm-contact-summary {

  padding-top: var(--pad-y);

}



.zpm-contact-summary__card {

  display: grid;

  grid-template-columns: minmax(240px, 340px) 1fr;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  overflow: hidden;

}



.zpm-contact-summary__visual {

  display: flex;

  align-items: center;

  justify-content: center;

  min-height: 220px;

  border-radius: calc(var(--radius-main) - 4px);

  background: var(--second-light-color);

  border: 1px solid var(--border-color);

}



.zpm-contact-summary__visual-inner {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  text-align: center;

}



.zpm-contact-summary__logo {

  display: block;

  width: auto;

  max-width: 180px;

  height: auto;

  opacity: 0.85;

}



.zpm-contact-summary__visual-caption {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--main-dark-color);

  max-width: 220px;

}



.zpm-contact-summary__content {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  justify-content: center;

  min-width: 0;

}



.zpm-contact-summary__title {

  margin: 0;

}



.zpm-contact-summary__facts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-mini) var(--pad-gap);

  margin: 0;

  padding: 0;

  list-style: none;

}



.zpm-contact-summary__fact {

  position: relative;

  padding-left: 14px;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-contact-summary__fact::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0.55em;

  width: 6px;

  height: 6px;

  border-radius: 50%;

  background-color: var(--accent-color-01);

}



.zpm-contact-summary__text {

  margin: 0;

  max-width: 760px;

}



.zpm-contact-details {

  padding: var(--pad-y) 0;

}



.zpm-contact-details .section-title__like-h3 {

  margin: 0px;

}



.zpm-contact-details__grid {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: var(--pad-gap);

  align-items: stretch;

}



.zpm-contact-panel {

  display: flex;

  flex-direction: column;

  gap: var(--pad-x);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-contact-panel__title {

  margin: 0;

}



.zpm-contact-panel__lead {

  margin: 0;

}



.zpm-contact-panel__body {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

}



.zpm-contact-panel--form .zpm-form {

  margin-top: auto;

}



.zpm-contact-panel--form .zpm-form__grid {

  gap: var(--pad-gap);

}



.zpm-contact-requisites__line {

  margin: 0;

}



.zpm-contact-directions {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin: 0;

  padding: 0;

  list-style: none;

}



.zpm-contact-directions__item {

  display: flex;

  gap: var(--pad-gap);

  align-items: center;

}



.zpm-contact-directions__icon {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border: 1px solid var(--border-color);

  border-radius: 50%;

  /* color: var(--accent-color-01); */

  font-size: 30px;

  flex-shrink: 0;

  width: 70px;

  height: 70px;

  min-width: 70px;

}



.zpm-contact-directions__body {

  display: flex;

  flex-direction: column;

  gap: 5px;

  min-width: 0;

}



.zpm-contact-directions__label {

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  margin-top: -2px;

}



.zpm-contact-directions__text {

  /*max-width: 410px;*/

}



.zpm-contact-directions__btn {

  align-self: flex-start;

  margin-top: auto;

}



@media (max-width: 1024px) {

  .zpm-contact-cards__grid {

    grid-template-columns: repeat(2, 1fr);

  }



  .zpm-contact-summary__card {

    grid-template-columns: 1fr;

  }



  .zpm-contact-summary__visual {

    min-height: 180px;

  }



  .zpm-contact-details__grid {

    grid-template-columns: 1fr;

  }

}



@media (max-width: 580px) {

  .zpm-contact-cards__grid {

    grid-template-columns: 1fr;

  }

}



/* ==========================================================================

   Contacts page — polish v1

   ========================================================================== */



.zpm-contact-cards--messengers {

  position: relative;

}



.zpm-contact-cards__grid--messengers {

  grid-template-columns: repeat(3, 1fr);

}



.zpm-contact-card--static {

  cursor: default;

}



.zpm-contact-summary__fact--icon {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding-left: 0;

}



.zpm-contact-summary__fact--icon::before {

  content: none;

}



.zpm-contact-summary__fact-icon {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 28px;

  height: 28px;

  min-width: 28px;

  font-size: 16px;

  color: var(--accent-color-01);

}



.zpm-contact-requisites__line + .zpm-contact-requisites__line {

  margin-top: 4px;

}



@media (max-width: 1024px) {

  .zpm-contact-cards__grid--messengers {

    grid-template-columns: repeat(2, 1fr);

  }

}



@media (max-width: 580px) {

  .zpm-contact-cards__grid--messengers {

    grid-template-columns: 1fr;

  }

}



/* ==========================================================================

   M9.14 — Delivery page — process-first redesign

   ========================================================================== */



.zpm-delivery-page {

  display: flex;

  flex-direction: column;

  gap: var(--pad-y);

  padding-bottom: var(--pad-y);

}



/* §01 Hero — 60/40 */

.zpm-delivery-hero {

  padding-top: var(--pad-y);

}



.zpm-delivery-hero__grid {

  display: grid;

  grid-template-columns: minmax(0, 3fr) minmax(280px, 2fr);

  gap: var(--pad-gap);

  align-items: center;

}



.zpm-delivery-hero__content {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  min-width: 0;

}



.zpm-delivery-hero__lead,

.zpm-delivery-hero__support {

  margin: 0;

  max-width: 720px;

  font-size: var(--Heading-Font-size);

  line-height: var(--Heading-Line-height);

}



.zpm-delivery-hero__support {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-delivery-hero__trust {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-mini) var(--pad-gap);

  margin: 0;

  padding: 0;

  list-style: none;

}



.zpm-delivery-hero__trust-item {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  min-width: 0;

}



.zpm-delivery-hero__trust-icon {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 28px;

  height: 28px;

  min-width: 28px;

  font-size: 16px;

  color: var(--accent-color-01);

  flex-shrink: 0;

}



.zpm-delivery-hero__trust-text {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

}



.zpm-delivery-hero__media {

  margin: 0;

  border-radius: var(--radius-main);

  overflow: hidden;

  border: 1px solid var(--border-color);

  background-color: #fff;

}



.zpm-delivery-hero__media img {

  display: block;

  width: 100%;

  height: auto;

  object-fit: cover;

}



/* §02 Methods */

.zpm-delivery-methods__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-delivery-methods__intro {

  margin: 0 0 var(--pad-gap);

  max-width: 900px;

}



.zpm-contact-cards__grid--methods {

  grid-template-columns: repeat(2, minmax(0, 1fr));

}



.zpm-delivery-methods .zpm-contact-card__body p {

  margin: 0;

}



/* §03 Process — centerpiece band */

.zpm-delivery-process {

  position: relative;

  padding: calc(var(--pad-y) * 1.15) 0;

  background: linear-gradient(180deg, var(--main-light-color, #f4f8fa) 0%, #fff 100%);

  border-block: 1px solid var(--border-color);

}



.zpm-delivery-process__head {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin-bottom: calc(var(--pad-gap) * 1.25);

  max-width: 900px;

}



.zpm-delivery-process__title {

  margin: 0;

}



.zpm-delivery-process__intro,

.zpm-delivery-process__note {

  margin: 0;

}



.zpm-delivery-process__note {

  margin-top: calc(var(--pad-gap) * 1.1);

  max-width: 900px;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



.zpm-delivery-timeline {

  display: flex;

  flex-direction: column;

  gap: 0;

  margin: 0;

  padding: 0;

  list-style: none;

  position: relative;

}



.zpm-delivery-timeline::before {

  content: "";

  position: absolute;

  top: 18px;

  bottom: 18px;

  left: 23px;

  width: 2px;

  background: var(--accent-color-01);

  opacity: 0.35;

}



.zpm-delivery-timeline__item {

  display: grid;

  grid-template-columns: 48px minmax(0, 1fr);

  gap: var(--pad-gap);

  align-items: start;

  padding: 0 0 var(--pad-gap);

}



.zpm-delivery-timeline__item:last-child {

  padding-bottom: 0;

}



.zpm-delivery-timeline__node {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 48px;

  height: 48px;

  border-radius: 50%;

  background: var(--accent-color-01);

  color: #fff;

  font-size: var(--Title-h3-Font-size);

  line-height: 1;

  font-weight: var(--large-Font-weight);

  position: relative;

  z-index: 1;

  flex-shrink: 0;

}



.zpm-delivery-timeline__card {

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background: #fff;

  box-shadow: 0 8px 24px rgba(0, 48, 63, 0.06);

  min-width: 0;

}



.zpm-delivery-timeline__card-title {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-delivery-timeline__card-text {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* §04 Documents — proof cards */

.zpm-delivery-documents__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-delivery-documents__intro {

  margin: 0 0 var(--pad-gap);

  max-width: 900px;

}



.zpm-delivery-proof__grid {

  display: grid;

  grid-template-columns: repeat(5, minmax(0, 1fr));

  gap: var(--pad-gap);

}



.zpm-delivery-proof-card {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-delivery-proof-card__icon {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 64px;

  height: 64px;

  border: 1px solid var(--border-color);

  border-radius: 50%;

  font-size: 28px;

  color: var(--accent-color-01);

  flex-shrink: 0;

}



.zpm-delivery-proof-card__body {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  min-width: 0;

}



.zpm-delivery-proof-card__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-delivery-proof-card__text {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

}



/* §05 Carriers — compact secondary */

.zpm-delivery-carriers {

  padding: var(--pad-gap) 0;

}



.zpm-delivery-carriers__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-delivery-carriers__text,

.zpm-delivery-carriers__note {

  margin: 0;

  max-width: 900px;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-delivery-carriers__note {

  margin-top: var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



/* §06 FAQ */

.zpm-delivery-faq__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-delivery-faq__list {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-delivery-faq__item {

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background: #fff;

  overflow: hidden;

}



.zpm-delivery-faq__button {

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 0;

  background: transparent;

  text-align: left;

  cursor: pointer;

  font: inherit;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  color: inherit;

}



.zpm-delivery-faq__button::after {

  content: "+";

  flex-shrink: 0;

  font-size: 24px;

  line-height: 1;

  color: var(--accent-color-01);

  transition: transform 0.2s ease;

}



.zpm-delivery-faq__button[aria-expanded="true"]::after {

  content: "−";

}



.zpm-delivery-faq__button:hover,

.zpm-delivery-faq__button:focus-visible {

  color: var(--accent-color-01);

}



.zpm-delivery-faq__panel {

  padding: 0 var(--pad-inner) var(--pad-inner);

}



.zpm-delivery-faq__panel p {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* §07 CTA */

.zpm-delivery-cta__benefits {

  margin-top: var(--pad-gap);

}



.zpm-delivery-cta__links {

  margin: var(--pad-gap) 0 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

}



.zpm-delivery-cta__links a {

  color: inherit;

  text-decoration: none;

}



.zpm-delivery-cta__links a:hover,

.zpm-delivery-cta__links a:focus-visible {

  color: var(--accent-color-01);

}



.zpm-delivery-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



@media (max-width: 1310px) {

  .zpm-delivery-proof__grid {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-delivery-hero__grid {

    grid-template-columns: 1fr;

  }



  .zpm-contact-cards__grid--methods {

    grid-template-columns: 1fr;

  }



  .zpm-delivery-proof__grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-delivery-cta .zpm-commercial-trust__wrap {

    grid-template-columns: 1fr;

  }

}



@media (max-width: 767px) {

  .zpm-delivery-timeline::before {

    left: 19px;

  }



  .zpm-delivery-timeline__item {

    grid-template-columns: 40px minmax(0, 1fr);

    gap: var(--pad-gap-mini);

  }



  .zpm-delivery-timeline__node {

    width: 40px;

    height: 40px;

    font-size: var(--base-Font-size);

  }



  .zpm-delivery-proof__grid {

    grid-template-columns: 1fr;

  }

}



@media (max-width: 390px) {

  .zpm-delivery-hero__trust {

    flex-direction: column;

    align-items: flex-start;

  }

}



@media (prefers-reduced-motion: reduce) {

  .zpm-delivery-faq__button::after {

    transition: none;

  }

}



/* ==========================================================================

   M9.14 — Delivery page — corporate logistics

   ========================================================================== */



.zpm-delivery-page {

  padding-bottom: var(--pad-y);

}



/* VP11: top padding from main > section */



.zpm-delivery-section__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-delivery-section__intro,

.zpm-delivery-section__body,

.zpm-delivery-section__note,

.zpm-delivery-section__helper,

.zpm-delivery-section__disclaimer {

  margin: 0 0 var(--pad-gap);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-delivery-section__note,

.zpm-delivery-section__helper,

.zpm-delivery-section__disclaimer {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



.zpm-delivery-section__intro:last-child,

.zpm-delivery-section__note:last-child,

.zpm-delivery-section__helper:last-child,

.zpm-delivery-section__disclaimer:last-child {

  margin-bottom: 0;

}



/* Shipment points — SC-05 */

.zpm-delivery-points__grid {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: var(--pad-gap) 0;

}



.zpm-delivery-point-card {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-delivery-point-card__icon {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border: 1px solid var(--border-color);

  border-radius: 50%;

  color: var(--accent-color-01);

}



.zpm-delivery-point-card__caption {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-delivery-point-card__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-delivery-point-card__role,

.zpm-delivery-point-card__address {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-delivery-point-card__address {

  font-weight: var(--large-Font-weight);

}



.zpm-delivery-points__body {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  margin-bottom: var(--pad-gap);

  max-width: 1070px;

}



.zpm-delivery-points__body p {

  margin: 0;

}



/* Organization — BLOCK 01 */

.zpm-delivery-org__body {

  max-width: 1070px;

  margin-bottom: var(--pad-gap);

}



.zpm-delivery-org__body p {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-delivery-org__list {

  margin: 0 0 var(--pad-gap-mini);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

}



.zpm-delivery-summary {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: 0 0 var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: var(--main-light-color, #f8f8f8);

}



.zpm-delivery-summary__item {

  margin: 0;

  min-width: 0;

}



.zpm-delivery-summary__label {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-delivery-summary__value {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* Methods */

.zpm-delivery-methods__stack {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

}



.zpm-delivery-method__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-delivery-method p {

  margin: 0 0 var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-delivery-method p:last-child {

  margin-bottom: 0;

}



/* Timeline — SC-04 */

.zpm-delivery-timeline-section {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-corp-timeline {

  list-style: none;

  margin: var(--pad-gap) 0;

  padding: 0;

  display: grid;

  grid-template-columns: repeat(7, minmax(0, 1fr));

  gap: var(--pad-gap);

  counter-reset: delivery-step;

}



.zpm-corp-timeline__step {

  position: relative;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-corp-timeline__badge {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 36px;

  height: 36px;

  border-radius: 50%;

  background-color: var(--accent-color-01);

  color: #fff;

  font-size: var(--Heading-Font-size);

  line-height: 1;

  font-weight: var(--large-Font-weight);

  flex-shrink: 0;

}



.zpm-corp-timeline__badge-label {

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-corp-timeline__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-corp-timeline__text {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

}



.zpm-delivery-timeline__handoff {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--base-Font-size);

}



.zpm-delivery-timeline__handoff a {

  font-weight: var(--large-Font-weight);

}



/* Packaging */

.zpm-delivery-packaging__stack {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: var(--pad-gap);

}



.zpm-delivery-packaging__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-delivery-packaging__item p {

  margin: 0 0 var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-delivery-packaging__list {

  margin: 0 0 var(--pad-gap-mini);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

}



/* Coverage */

.zpm-delivery-coverage__body {

  max-width: 1070px;

  margin-bottom: var(--pad-gap);

}



.zpm-delivery-coverage__body p {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-delivery-coverage__factors {

  margin: 0 0 var(--pad-gap-mini);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

}



.zpm-delivery-coverage__crosslink {

  margin: var(--pad-gap-mini) 0 0;

}



/* Outcomes */

.zpm-delivery-outcomes__list {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-delivery-outcome {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-delivery-outcome__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-delivery-outcome__text {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* Carriers table — supporting tier */

.zpm-delivery-carriers__caption {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



.zpm-delivery-carriers__table-wrap {

  overflow-x: auto;

  margin-bottom: var(--pad-gap);

  -webkit-overflow-scrolling: touch;

}



.zpm-delivery-carriers__table {

  width: 100%;

  border-collapse: collapse;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-delivery-carriers__table th,

.zpm-delivery-carriers__table td {

  padding: 12px 16px;

  border: 1px solid var(--border-color);

  text-align: left;

  vertical-align: top;

}



.zpm-delivery-carriers__table thead th {

  background-color: var(--main-light-color, #f8f8f8);

  font-weight: var(--large-Font-weight);

}



.zpm-delivery-carriers__table tbody tr:nth-child(even) td {

  background-color: rgba(248, 248, 248, 0.5);

}



/* FAQ — SC-08 */

.zpm-corp-faq__list {

  gap: var(--pad-gap);

  display: flex;

  flex-flow: column;

}



.zpm-corp-faq__item {

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  overflow: hidden;

}



.zpm-corp-faq__heading {

  margin: 0;

}



.zpm-corp-faq__button {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: var(--pad-gap-mini);

  width: 100%;

  padding: var(--pad-inner);

  border: 0;

  background: transparent;

  font: inherit;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

  text-align: left;

  color: inherit;

  cursor: pointer;

}



.zpm-corp-faq__button::after {

  content: "+";

  flex-shrink: 0;

  font-size: 22px;

  line-height: 1;

  color: var(--accent-color-01);

  transition: transform 0.2s ease;

}



.zpm-corp-faq__item.is-open .zpm-corp-faq__button::after {

  content: "−";

}



.zpm-corp-faq__button:hover,

.zpm-corp-faq__button:focus-visible {

  color: var(--accent-color-01);

  outline: none;

}



.zpm-corp-faq__panel {

  padding: 0 var(--pad-inner) var(--pad-inner);

}



.zpm-corp-faq__panel[hidden] {

  display: none;

}



.zpm-corp-faq__panel p {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* CTA — Commercial Trust reuse */

/* VP11: top padding from main > section */



.zpm-delivery-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



.zpm-delivery-cta__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap);

}



.zpm-delivery-cta__link {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  color: var(--accent-color-01);

  text-decoration: underline;

  text-underline-offset: 2px;

}



.zpm-delivery-cta__link:hover,

.zpm-delivery-cta__link:focus-visible {

  color: var(--main-dark-color);

}



.zpm-delivery-cta__contacts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap-mini);

  font-size: var(--base-Font-size);

}



.zpm-delivery-cta__phone,

.zpm-delivery-cta__email {

  color: inherit;

  text-decoration: none;

  font-weight: var(--large-Font-weight);

}



.zpm-delivery-cta__phone:hover,

.zpm-delivery-cta__phone:focus-visible,

.zpm-delivery-cta__email:hover,

.zpm-delivery-cta__email:focus-visible {

  color: var(--accent-color-01);

}



.zpm-delivery-cta__payment-note {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



@media (prefers-reduced-motion: reduce) {

  .zpm-corp-faq__button::after {

    transition: none;

  }

}



/* Responsive */

@media (max-width: 1310px) {

  .zpm-corp-timeline {

    grid-template-columns: repeat(4, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-delivery-points__grid,

  .zpm-delivery-summary,

  .zpm-delivery-packaging__stack,

  .zpm-delivery-outcomes__list {

    grid-template-columns: 1fr;

  }



  .zpm-delivery-summary {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-corp-timeline {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-delivery-cta .zpm-commercial-trust__wrap {

    flex-direction: column;

  }



  .zpm-delivery-cta .zpm-commercial-trust__form-wrap {

    max-width: none;

    width: 100%;

  }

}



@media (max-width: 767px) {

  .zpm-delivery-summary {

    grid-template-columns: 1fr;

  }



  .zpm-corp-timeline {

    grid-template-columns: 1fr;

  }



  .zpm-delivery-carriers__table thead {

    display: none;

  }



  .zpm-delivery-carriers__table tr {

    display: block;

    margin-bottom: var(--pad-gap-mini);

    border: 1px solid var(--border-color);

    border-radius: var(--radius-main);

    overflow: hidden;

  }



  .zpm-delivery-carriers__table td {

    display: block;

    border: 0;

    border-bottom: 1px solid var(--border-color);

    padding: 10px 14px;

  }



  .zpm-delivery-carriers__table td:last-child {

    border-bottom: 0;

  }



  .zpm-delivery-carriers__table td::before {

    content: attr(data-label) ": ";

    font-weight: var(--large-Font-weight);

  }

}



@media (max-width: 390px) {

  .zpm-delivery-cta__actions {

    flex-direction: column;

    align-items: flex-start;

  }



  .zpm-delivery-cta__primary {

    width: 100%;

    text-align: center;

  }

}



/* ==========================================================================

   M9.15 — Payment page — corporate settlement

   ========================================================================== */



.zpm-payment-page {

  padding-bottom: var(--pad-y);

}



/* VP11: top padding from main > section */



.zpm-payment-section__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-payment-section__intro,

.zpm-payment-documents__body,

.zpm-payment-legal__body {

  margin: 0 0 var(--pad-gap);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-payment-section__note,

.zpm-payment-section__helper,

.zpm-payment-legal__helper,

.zpm-payment-legal__link,

.zpm-payment-cta__pointers {

  margin: 0 0 var(--pad-gap);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  max-width: 1070px;

}



.zpm-payment-section__note:last-child,

.zpm-payment-section__helper:last-child,

.zpm-payment-legal__helper:last-child,

.zpm-payment-legal__link:last-child {

  margin-bottom: 0;

}



/* Timeline — SC-04 (6 steps) */

.zpm-payment-timeline-section {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-payment-timeline.zpm-corp-timeline {

  grid-template-columns: repeat(6, minmax(0, 1fr));

}



.zpm-payment-timeline__handoff {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--base-Font-size);

}



.zpm-payment-timeline__handoff a {

  font-weight: var(--large-Font-weight);

}



/* Methods — BLOCK 02 */

.zpm-payment-methods__stack {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-payment-method__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-payment-method p {

  margin: 0 0 var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-payment-method p:last-child {

  margin-bottom: 0;

}



.zpm-payment-method__list {

  margin: 0 0 var(--pad-gap-mini);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-payment-methods__table-wrap {

  overflow-x: auto;

  margin: var(--pad-gap) 0;

  -webkit-overflow-scrolling: touch;

}



.zpm-payment-methods__table {

  width: 100%;

  border-collapse: collapse;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-payment-methods__table th,

.zpm-payment-methods__table td {

  padding: 12px 16px;

  border: 1px solid var(--border-color);

  text-align: left;

  vertical-align: top;

}



.zpm-payment-methods__table thead th {

  background-color: var(--main-light-color, #f8f8f8);

  font-weight: var(--large-Font-weight);

}



.zpm-payment-methods__table tbody tr:nth-child(even) td {

  background-color: rgba(248, 248, 248, 0.5);

}



/* Documents — proof cards SC-06 */

.zpm-payment-proof__grid {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-payment-proof-card {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-payment-proof-card__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-payment-proof-card__text {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

}



/* Legal entity strip */

.zpm-payment-legal__facts {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: 0 0 var(--pad-gap);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: var(--main-light-color, #f8f8f8);

}



.zpm-payment-legal__fact {

  margin: 0;

  min-width: 0;

}



.zpm-payment-legal__label {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-payment-legal__value {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* CTA — Commercial Trust reuse */

/* VP11: top padding from main > section */



.zpm-payment-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



.zpm-payment-cta__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap);

}



.zpm-payment-cta__link {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  color: var(--accent-color-01);

  text-decoration: underline;

  text-underline-offset: 2px;

}



.zpm-payment-cta__link:hover,

.zpm-payment-cta__link:focus-visible {

  color: var(--main-dark-color);

}



.zpm-payment-cta__contacts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap-mini);

  font-size: var(--base-Font-size);

}



.zpm-payment-cta__phone,

.zpm-payment-cta__email {

  color: inherit;

  text-decoration: none;

  font-weight: var(--large-Font-weight);

}



.zpm-payment-cta__phone:hover,

.zpm-payment-cta__phone:focus-visible,

.zpm-payment-cta__email:hover,

.zpm-payment-cta__email:focus-visible {

  color: var(--accent-color-01);

}



@media (max-width: 1310px) {

  .zpm-payment-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }



  .zpm-payment-proof__grid {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-payment-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-payment-proof__grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-payment-legal__facts {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-payment-cta .zpm-commercial-trust__wrap {

    flex-direction: column;

  }



  .zpm-payment-cta .zpm-commercial-trust__form-wrap {

    max-width: none;

    width: 100%;

  }

}



@media (max-width: 767px) {

  .zpm-payment-timeline.zpm-corp-timeline {

    grid-template-columns: 1fr;

  }



  .zpm-payment-proof__grid {

    grid-template-columns: 1fr;

  }



  .zpm-payment-legal__facts {

    grid-template-columns: 1fr;

  }



  .zpm-payment-methods__table thead {

    display: none;

  }



  .zpm-payment-methods__table tr {

    display: block;

    margin-bottom: var(--pad-gap-mini);

    border: 1px solid var(--border-color);

    border-radius: var(--radius-main);

    overflow: hidden;

  }



  .zpm-payment-methods__table td {

    display: block;

    border: 0;

    border-bottom: 1px solid var(--border-color);

    padding: 10px 14px;

  }



  .zpm-payment-methods__table td:last-child {

    border-bottom: 0;

  }



  .zpm-payment-methods__table td::before {

    content: attr(data-label) ": ";

    font-weight: var(--large-Font-weight);

  }

}



@media (max-width: 390px) {

  .zpm-payment-cta__actions {

    flex-direction: column;

    align-items: stretch;

  }



  .zpm-payment-cta__primary {

    width: 100%;

    text-align: center;

  }

}



/* ==========================================================================

   M9.17 — Warranty page — manufacturer service reassurance

   ========================================================================== */



.zpm-warranty-page {

  padding-bottom: var(--pad-y);

}



/* VP11: top padding from main > section */



.zpm-warranty-section__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-warranty-section__intro,

.zpm-warranty-principles__body,

.zpm-warranty-docs__body,

.zpm-warranty-outcomes__body {

  margin: 0 0 var(--pad-gap);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-warranty-section__note,

.zpm-warranty-section__helper,

.zpm-warranty-section__pointer,

.zpm-warranty-process__pointer,

.zpm-warranty-cta__pointers,

.zpm-warranty-cta__schedule {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  max-width: 1070px;

}



.zpm-warranty-section__note:last-child,

.zpm-warranty-section__helper:last-child,

.zpm-warranty-section__pointer:last-child {

  margin-bottom: 0;

}



/* BLOCK 01 — coverage table + summary row */

.zpm-warranty-coverage__table-wrap,

.zpm-warranty-docs__table-wrap {

  overflow-x: auto;

  margin: var(--pad-gap) 0;

  -webkit-overflow-scrolling: touch;

}



.zpm-warranty-coverage__table,

.zpm-warranty-docs__table {

  width: 100%;

  border-collapse: collapse;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-warranty-coverage__table th,

.zpm-warranty-coverage__table td,

.zpm-warranty-docs__table th,

.zpm-warranty-docs__table td {

  padding: 12px 16px;

  border: 1px solid var(--border-color);

  text-align: left;

  vertical-align: top;

}



.zpm-warranty-coverage__table thead th,

.zpm-warranty-docs__table thead th {

  background-color: var(--main-light-color, #f8f8f8);

  font-weight: var(--large-Font-weight);

}



.zpm-warranty-coverage__table tbody tr:nth-child(even) td,

.zpm-warranty-docs__table tbody tr:nth-child(even) td {

  background-color: rgba(248, 248, 248, 0.5);

}



.zpm-warranty-summary {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: var(--pad-gap) 0;

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: var(--main-light-color, #f8f8f8);

}



.zpm-warranty-summary__item {

  margin: 0;

  min-width: 0;

}



.zpm-warranty-summary__label {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-warranty-summary__value {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* BLOCK 03 — claim procedure timeline (page spine) */

.zpm-warranty-process {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-warranty-timeline.zpm-corp-timeline {

  grid-template-columns: repeat(5, minmax(0, 1fr));

}



.zpm-warranty-process__pointer {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--base-Font-size);

}



.zpm-warranty-process__pointer a {

  font-weight: var(--large-Font-weight);

}



/* BLOCK 04 — verification (subordinate weight) */

.zpm-warranty-verification .zpm-warranty-section__title {

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-warranty-verification__lead {

  margin: 0 0 var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-warranty-verification__list {

  margin: 0 0 var(--pad-gap);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  max-width: 1070px;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* BLOCK 05 — service outcomes */

.zpm-warranty-outcomes__list {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-warranty-outcome {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  min-width: 0;

}



.zpm-warranty-outcome__title {

  margin: 0;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-warranty-outcome__text {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* CTA — Commercial Trust reuse */

/* VP11: top padding from main > section */



.zpm-warranty-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



.zpm-warranty-cta__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap);

}



.zpm-warranty-cta__link {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  color: var(--accent-color-01);

  text-decoration: underline;

  text-underline-offset: 2px;

}



.zpm-warranty-cta__link:hover,

.zpm-warranty-cta__link:focus-visible {

  color: var(--main-dark-color);

}



.zpm-warranty-cta__contacts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap-mini);

  font-size: var(--base-Font-size);

}



.zpm-warranty-cta__phone,

.zpm-warranty-cta__email {

  color: inherit;

  text-decoration: none;

  font-weight: var(--large-Font-weight);

}



.zpm-warranty-cta__phone:hover,

.zpm-warranty-cta__phone:focus-visible,

.zpm-warranty-cta__email:hover,

.zpm-warranty-cta__email:focus-visible {

  color: var(--accent-color-01);

}



.zpm-warranty-form__helper {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



@media (max-width: 1310px) {

  .zpm-warranty-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-warranty-summary {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-warranty-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-warranty-outcomes__list {

    grid-template-columns: 1fr;

  }



  .zpm-warranty-cta .zpm-commercial-trust__wrap {

    flex-direction: column;

  }



  .zpm-warranty-cta .zpm-commercial-trust__form-wrap {

    max-width: none;

    width: 100%;

  }

}



@media (max-width: 767px) {

  .zpm-warranty-summary {

    grid-template-columns: 1fr;

  }



  .zpm-warranty-timeline.zpm-corp-timeline {

    grid-template-columns: 1fr;

  }



  .zpm-warranty-coverage__table thead,

  .zpm-warranty-docs__table thead {

    display: none;

  }



  .zpm-warranty-coverage__table tr,

  .zpm-warranty-docs__table tr {

    display: block;

    margin-bottom: var(--pad-gap-mini);

    border: 1px solid var(--border-color);

    border-radius: var(--radius-main);

    overflow: hidden;

  }



  .zpm-warranty-coverage__table td,

  .zpm-warranty-docs__table td {

    display: block;

    border: 0;

    border-bottom: 1px solid var(--border-color);

    padding: 10px 14px;

  }



  .zpm-warranty-coverage__table td:last-child,

  .zpm-warranty-docs__table td:last-child {

    border-bottom: 0;

  }



  .zpm-warranty-coverage__table td::before,

  .zpm-warranty-docs__table td::before {

    content: attr(data-label) ": ";

    font-weight: var(--large-Font-weight);

  }

}



@media (max-width: 390px) {

  .zpm-warranty-cta__actions {

    flex-direction: column;

    align-items: stretch;

  }



  .zpm-warranty-cta__primary {

    width: 100%;

    text-align: center;

  }

}



@media (prefers-reduced-motion: reduce) {

  .zpm-corp-faq__panel {

    transition: none;

  }

}



/* ==========================================================================

   M9.16 — Dealers page — manufacturer partnership

   ========================================================================== */



.zpm-dealers-page {

  padding-bottom: var(--pad-y);

}



/* VP11: top padding from main > section */



.zpm-dealers-section__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-dealers-section__intro,

.zpm-dealers-section__body {

  margin: 0 0 var(--pad-x);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-dealers-section__note,

.zpm-dealers-section__helper,

.zpm-dealers-section__pointer,

.zpm-dealers-cta__pointers {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  max-width: 1070px;

}



.zpm-dealers-section__note:last-child,

.zpm-dealers-section__helper:last-child,

.zpm-dealers-section__pointer:last-child {

  margin-bottom: 0;

}



/* BLOCK 01 — partner matrix (SC-13) */

.zpm-dealers-matrix__table-wrap,

.zpm-dealers-outcomes__table-wrap,

.zpm-dealers-crosslinks__table-wrap {

  overflow-x: auto;

  margin: var(--pad-gap) 0;

  -webkit-overflow-scrolling: touch;

}



.zpm-dealers-matrix__table,

.zpm-dealers-outcomes__table,

.zpm-dealers-crosslinks__table {

  width: 100%;

  border-collapse: collapse;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-dealers-matrix__table th,

.zpm-dealers-matrix__table td,

.zpm-dealers-outcomes__table th,

.zpm-dealers-outcomes__table td,

.zpm-dealers-crosslinks__table th,

.zpm-dealers-crosslinks__table td {

  padding: 12px 16px;

  border: 1px solid var(--border-color);

  text-align: left;

  vertical-align: top;

}



.zpm-dealers-matrix__table thead th,

.zpm-dealers-outcomes__table thead th,

.zpm-dealers-crosslinks__table thead th {

  background-color: var(--main-light-color, #f8f8f8);

  font-weight: var(--large-Font-weight);

}



.zpm-dealers-matrix__table tbody tr:nth-child(even) td,

.zpm-dealers-outcomes__table tbody tr:nth-child(even) td,

.zpm-dealers-crosslinks__table tbody tr:nth-child(even) td {

  background-color: rgba(248, 248, 248, 0.5);

}



.zpm-dealers-matrix__tag {

  display: inline-flex;

  align-items: center;

  gap: var(--pad-gap-mini);

  margin-bottom: var(--pad-gap-mini);

  font-size: 16px;

  line-height: 22px;

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

}



.zpm-dealers-matrix__table td strong {

  display: block;

}



/* BLOCK 02 — OEM proof (dominant block) */

.zpm-dealers-proof {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-dealers-proof__stack {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-dealers-proof__item {

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

}



.zpm-dealers-proof__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-dealers-proof__text {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



/* OEM trust row */

/* VP11: OEM row uses main > section vertical rhythm */



.zpm-dealers-oem-row__grid {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: 0;

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: var(--main-light-color, #f8f8f8);

}



.zpm-dealers-oem-row__item {

  margin: 0;

  min-width: 0;

}



.zpm-dealers-oem-row__label {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-dealers-oem-row__value {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* BLOCK 04 — process timeline */

.zpm-dealers-process {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-dealers-timeline.zpm-corp-timeline {

  grid-template-columns: repeat(5, minmax(0, 1fr));

}



/* BLOCK 05 — supply chain diagram */

.zpm-dealers-chain__diagram {

  margin: var(--pad-gap) 0;

  padding: 0;

}



.zpm-dealers-chain__nodes {

  list-style: none;

  margin: 0;

  padding: 0;

  display: flex;

  flex-direction: column;

  gap: 0;

  max-width: 590px;

}



.zpm-dealers-chain__node {

  position: relative;

  display: flex;

  align-items: center;

  gap: var(--pad-gap-line);

  padding: var(--pad-x);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-dealers-chain__node:not(:last-child)::after {

  content: "";

  position: absolute;

  left: 28px;

  bottom: calc(var(--pad-gap-line) * -1);

  width: 2px;

  height: var(--pad-gap-line);

  background-color: var(--accent-color-01, #c4a35a);

  z-index: 1;

}



.zpm-dealers-chain__node + .zpm-dealers-chain__node {

  margin-top: var(--pad-gap-line);

}



.zpm-dealers-chain__node i {

  flex-shrink: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 70px;

  /* height: 110px; */

  min-width: 70px;

  color: var(--accent-color-01);

  font-size: 40px;

}



.zpm-dealers-chain__caption {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



/* BLOCK 06 — FAQ */

.zpm-dealers-faq__accordion {

  margin-top: var(--pad-gap);

  gap: var(--pad-gap);

  display: flex;

  flex-flow: column;

}



/* BLOCK 07 — CTA (subordinate visual weight) */

/* VP11: top padding from main > section */



.zpm-dealers-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



.zpm-dealers-cta__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap);

  margin-bottom: 0;

}



.zpm-dealers-cta__link {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  text-decoration: underline;

  text-underline-offset: 3px;

}



.zpm-dealers-cta__contacts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-line) var(--pad-gap);

  margin-top: var(--pad-gap-mini);

  margin-bottom: 0;

}



.zpm-dealers-cta__phone,

.zpm-dealers-cta__email {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-dealers-form__helper {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



/* Responsive */

@media (max-width: 1199px) {

  .zpm-dealers-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }



  .zpm-dealers-oem-row__grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-dealers-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-dealers-matrix__table thead,

  .zpm-dealers-outcomes__table thead,

  .zpm-dealers-crosslinks__table thead {

    display: none;

  }



  .zpm-dealers-matrix__table tr,

  .zpm-dealers-outcomes__table tr,

  .zpm-dealers-crosslinks__table tr {

    display: block;

    margin-bottom: var(--pad-gap-mini);

    border: 1px solid var(--border-color);

    border-radius: var(--radius-main);

    overflow: hidden;

  }



  .zpm-dealers-matrix__table td,

  .zpm-dealers-outcomes__table td,

  .zpm-dealers-crosslinks__table td {

    display: block;

    border: none;

    border-bottom: 1px solid var(--border-color);

  }



  .zpm-dealers-matrix__table td:last-child,

  .zpm-dealers-outcomes__table td:last-child,

  .zpm-dealers-crosslinks__table td:last-child {

    border-bottom: none;

  }



  .zpm-dealers-matrix__table td::before,

  .zpm-dealers-outcomes__table td::before,

  .zpm-dealers-crosslinks__table td::before {

    content: attr(data-label);

    display: block;

    margin-bottom: 6px;

    font-size: var(--mini-Font-size);

    font-weight: var(--large-Font-weight);

    color: var(--accent-color-02, #99303d);

    text-transform: uppercase;

    

  }

}



@media (max-width: 767px) {

  .zpm-dealers-timeline.zpm-corp-timeline {

    grid-template-columns: 1fr;

  }



  .zpm-dealers-oem-row__grid {

    grid-template-columns: 1fr;

  }

}



@media (prefers-reduced-motion: reduce) {

  .zpm-corp-faq__panel {

    transition: none;

  }

}



/* ==========================================================================

   M9.18 — Custom Manufacturing page — manufacturer capability

   ========================================================================== */



.zpm-custom-page {

  padding-bottom: var(--pad-y);

}



/* VP11: top padding from main > section */



.zpm-custom-section__title {

  margin: 0 0 var(--pad-gap);

}



.zpm-custom-section__intro,

.zpm-custom-section__body {

  margin: 0 0 var(--pad-gap);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-custom-materials__stack {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

}



.zpm-custom-process__approval {

  display: flex;

  flex-direction: row;

  gap: var(--pad-gap);

  align-items: center;

}



.zpm-custom-section__note,

.zpm-custom-section__helper,

.zpm-custom-section__pointer,

.zpm-custom-cta__pointers {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  max-width: 1070px;

}



.zpm-custom-section__note:last-child,

.zpm-custom-section__helper:last-child,

.zpm-custom-section__pointer:last-child {

  margin-bottom: 0;

}



.zpm-custom-section__body p {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-custom-section__body p:last-child {

  margin-bottom: 0;

}



/* Shared responsive tables — SC-07 */

.zpm-custom-tasks__table-wrap,

.zpm-custom-scope__table-wrap,

.zpm-custom-requirements__table-wrap,

.zpm-custom-outcomes__table-wrap {

  overflow-x: auto;

  margin: var(--pad-gap) 0;

  -webkit-overflow-scrolling: touch;

}



.zpm-custom-tasks__table,

.zpm-custom-scope__table,

.zpm-custom-requirements__table,

.zpm-custom-outcomes__table {

  width: 100%;

  border-collapse: collapse;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-tasks__table th,

.zpm-custom-tasks__table td,

.zpm-custom-scope__table th,

.zpm-custom-scope__table td,

.zpm-custom-requirements__table th,

.zpm-custom-requirements__table td,

.zpm-custom-outcomes__table th,

.zpm-custom-outcomes__table td {

  padding: 12px 16px;

  border: 1px solid var(--border-color);

  text-align: left;

  vertical-align: top;

}



.zpm-custom-tasks__table thead th,

.zpm-custom-scope__table thead th,

.zpm-custom-requirements__table thead th,

.zpm-custom-outcomes__table thead th {

  background-color: var(--main-light-color, #f8f8f8);

  font-weight: var(--large-Font-weight);

}



.zpm-custom-tasks__table tbody tr:nth-child(even) td,

.zpm-custom-scope__table tbody tr:nth-child(even) td,

.zpm-custom-requirements__table tbody tr:nth-child(even) td,

.zpm-custom-outcomes__table tbody tr:nth-child(even) td {

  background-color: rgba(248, 248, 248, 0.5);

}



.zpm-custom-tasks__table td strong,

.zpm-custom-scope__table td strong,

.zpm-custom-requirements__table td strong,

.zpm-custom-outcomes__table td strong {

  display: block;

}



.zpm-custom-tasks__tag {

  display: inline-flex;

  align-items: center;

  gap: var(--pad-gap-mini);

  margin-bottom: var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



/* BLOCK 01 — triggers */

.zpm-custom-triggers__list {

  margin: 0 0 var(--pad-gap);

  padding-left: 1.25em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  max-width: 1070px;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-triggers__list li::marker {

  color: var(--accent-color-02, #99303d);

}



/* BLOCK 03 — scope prose groups */

.zpm-custom-scope__groups {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin: var(--pad-gap) 0;

  max-width: 1070px;

}



.zpm-custom-scope__group-title {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--Title-h3-Font-size);

  line-height: var(--Title-h3-Line-height);

}



.zpm-custom-scope__group p {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-scope__group p:last-child {

  margin-bottom: 0;

}



.zpm-custom-scope__group ul {

  margin: 0 0 var(--pad-gap-mini);

  padding-left: 1.2em;

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-scope__group ul:last-child {

  margin-bottom: 0;

}



/* BLOCK 04 — OEM proof */

.zpm-custom-oem {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

}



.zpm-custom-oem__stack {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-custom-oem__item {

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

}



.zpm-custom-oem__title {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-custom-oem__text {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-custom-oem__proof-strip {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: var(--pad-gap);

  margin: var(--pad-gap) 0;

  padding: var(--pad-inner);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

}



.zpm-custom-oem__strip-item {

  margin: 0;

  min-width: 0;

}



.zpm-custom-oem__strip-label {

  margin: 0 0 var(--pad-gap-mini);

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  color: var(--accent-color-02, #99303d);

  text-transform: uppercase;

  

}



.zpm-custom-oem__strip-value {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-oem__production {

  margin: var(--pad-gap) 0;

  max-width: 1070px;

}



.zpm-custom-oem__production-image {

  display: block;

  width: 100%;

  height: auto;

  aspect-ratio: 16 / 9;

  object-fit: cover;

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: var(--main-light-color, #f8f8f8);

}



.zpm-custom-oem__production.is-empty,

.zpm-custom-oem__production[hidden] {

  display: none;

}



.zpm-custom-oem__badge {

  display: inline-flex;

  align-items: center;

  gap: var(--pad-gap-mini);

  margin: var(--pad-gap-mini) 0 var(--pad-gap);

  padding: var(--pad-gap-mini) var(--pad-gap-line);

  border: 1px solid var(--border-color);

  border-radius: var(--radius-main);

  background-color: #fff;

  text-decoration: none;

  color: inherit;

  transition: border-color 0.2s ease, box-shadow 0.2s ease;

}



.zpm-custom-oem__badge:hover,

.zpm-custom-oem__badge:focus-visible {

  border-color: var(--accent-color-01, #c4a35a);

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);

  outline: none;

}



.zpm-custom-oem__badge-img {

  display: block;

  width: 48px;

  height: auto;

  flex-shrink: 0;

}



.zpm-custom-oem__badge-text {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

}



/* BLOCK 05 — process timeline (dominant spine) */

.zpm-custom-process {

  background-color: var(--main-light-color, #f8f8f8);

  padding-bottom: var(--pad-y);

  border-top: 1px solid var(--border-color);

  border-bottom: 1px solid var(--border-color);

}



.zpm-custom-timeline.zpm-corp-timeline {

  grid-template-columns: repeat(4, minmax(0, 1fr));

  margin-top: var(--pad-gap);

  margin-bottom: var(--pad-gap);

}



.zpm-custom-process .zpm-corp-timeline__step {

  border-width: 1px;

  box-shadow: none;

}



.zpm-custom-process .zpm-corp-timeline__badge {

  width: 44px;

  height: 44px;

  font-size: calc(var(--Heading-Font-size) * 1.08);

}



.zpm-custom-process__approval-gate {

  display: flex;

  flex-wrap: wrap;

  align-items: flex-start;

  gap: var(--pad-gap-mini) var(--pad-gap-line);

  margin: 0 0 var(--pad-gap);

  padding: var(--pad-inner);

  border: 2px solid var(--accent-color-02, #99303d);

  border-radius: var(--radius-main);

  background-color: #fff;

  max-width: 1070px;

}



.zpm-custom-process__approval-badge {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 8px 14px;

  border-radius: var(--radius-main);

  background-color: var(--accent-color-02, #99303d);

  color: #fff;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  font-weight: var(--large-Font-weight);

  text-transform: uppercase;

  

  flex-shrink: 0;

}



.zpm-custom-process__approval-text {

  margin: 0;

  flex: 1 1 220px;

  min-width: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 700px;

}



.zpm-custom-process__pointer {

  margin: var(--pad-gap-mini) 0 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  max-width: 1070px;

}



.zpm-custom-process__pointer a {

  font-weight: var(--large-Font-weight);

}



/* BLOCK 07 — materials (supporting prose) */

.zpm-custom-materials__body {

  margin: 0 0 var(--pad-gap);

  max-width: 1070px;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



.zpm-custom-materials__body p {

  margin: 0 0 var(--pad-gap-mini);

}



.zpm-custom-materials__body p:last-child {

  margin-bottom: 0;

}



.zpm-custom-materials__disclaimer {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

  max-width: 1070px;

}



/* BLOCK 08 — outcomes (second emphasis) */

.zpm-custom-outcomes {

  border-top: 1px solid var(--border-color);

}



.zpm-custom-outcomes__table thead th {

  padding-top: 14px;

  padding-bottom: 14px;

  font-size: var(--base-Font-size);

  border-bottom: 1px solid var(--border-color);

}



/* BLOCK 09 — FAQ (page scope; accordion base elsewhere) */

.zpm-custom-faq__accordion {

  margin-top: var(--pad-gap);

  gap: var(--pad-gap);

  display: flex;

  flex-flow: column;

}



/* BLOCK 10 — CTA + form */

/* VP11: top padding from main > section */



.zpm-custom-cta .zpm-commercial-trust__wrap {

  align-items: stretch;

}



.zpm-custom-cta__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--pad-gap-line);

  margin-top: var(--pad-gap);

  margin-bottom: 0;

}



.zpm-custom-cta__link {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  text-decoration: underline;

  text-underline-offset: 3px;

}



.zpm-custom-cta__contacts {

  display: flex;

  flex-wrap: wrap;

  gap: var(--pad-gap-line) var(--pad-gap);

  margin-top: var(--pad-gap-mini);

  margin-bottom: 0;

}



.zpm-custom-cta__phone,

.zpm-custom-cta__email {

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

  font-weight: var(--large-Font-weight);

}



.zpm-custom-form__helper {

  margin: 0;

  font-size: var(--mini-Font-size);

  line-height: var(--mini-Line-height);

  color: var(--font-grey-color, #6b7a8c);

}



/* Responsive */

@media (max-width: 1440px) {

  .zpm-custom-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(4, minmax(0, 1fr));

  }

}



@media (max-width: 1199px) {

  .zpm-custom-oem__proof-strip {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }

}



@media (max-width: 1024px) {

  .zpm-custom-timeline.zpm-corp-timeline {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .zpm-custom-tasks__table thead,

  .zpm-custom-scope__table thead,

  .zpm-custom-requirements__table thead,

  .zpm-custom-outcomes__table thead {

    display: none;

  }



  .zpm-custom-tasks__table tr,

  .zpm-custom-scope__table tr,

  .zpm-custom-requirements__table tr,

  .zpm-custom-outcomes__table tr {

    display: block;

    margin-bottom: var(--pad-gap-mini);

    border: 1px solid var(--border-color);

    border-radius: var(--radius-main);

    overflow: hidden;

  }



  .zpm-custom-tasks__table td,

  .zpm-custom-scope__table td,

  .zpm-custom-requirements__table td,

  .zpm-custom-outcomes__table td {

    display: block;

    border: none;

    border-bottom: 1px solid var(--border-color);

  }



  .zpm-custom-tasks__table td:last-child,

  .zpm-custom-scope__table td:last-child,

  .zpm-custom-requirements__table td:last-child,

  .zpm-custom-outcomes__table td:last-child {

    border-bottom: none;

  }



  .zpm-custom-tasks__table td::before,

  .zpm-custom-scope__table td::before,

  .zpm-custom-requirements__table td::before,

  .zpm-custom-outcomes__table td::before {

    content: attr(data-label);

    display: block;

    margin-bottom: 6px;

    font-size: var(--mini-Font-size);

    font-weight: var(--large-Font-weight);

    color: var(--accent-color-02, #99303d);

    text-transform: uppercase;

    

  }



  .zpm-custom-cta .zpm-commercial-trust__wrap {

    flex-direction: column;

  }



  .zpm-custom-cta .zpm-commercial-trust__form-wrap {

    max-width: none;

    width: 100%;

  }

}



@media (max-width: 767px) {

  .zpm-custom-timeline.zpm-corp-timeline {

    grid-template-columns: 1fr;

  }



  .zpm-custom-oem__proof-strip {

    grid-template-columns: 1fr;

  }



  .zpm-custom-process__approval-gate {

    flex-direction: column;

    align-items: stretch;

  }



  .zpm-custom-process .zpm-corp-timeline__badge {

    width: 40px;

    height: 40px;

  }

}



@media (max-width: 390px) {

  .zpm-custom-cta__actions {

    flex-direction: column;

    align-items: stretch;

  }



  .zpm-custom-cta__primary {

    width: 100%;

    text-align: center;

  }

}



@media (prefers-reduced-motion: reduce) {

  .zpm-custom-oem__badge {

    transition: none;

  }



  .zpm-custom-faq .zpm-corp-faq__panel,

  .zpm-custom-faq .zpm-corp-faq__button::after {

    transition: none;

  }

}

/* ==========================================================================

   SITE-002 — Corporate Pages Visual Polish Pass 1.1 (VP11-01+)

   Authority: Home page rhythm — no global padding-top:0 resets

   ========================================================================== */



/* VP11-01 — page lead inside main (replaces page-intro__description) */

.zpm-corp-page-lead__body {

  display: flex;

  flex-direction: column;

  gap: var(--pad-gap-mini);

  max-width: 1070px;

}



.zpm-corp-page-lead__body p {

  margin: 0;

  font-size: var(--base-Font-size);

  line-height: var(--base-Line-height);

}



/* VP11-02 — delivery point icons aligned with home mini asset scale */

.zpm-delivery-point-card__icon {

  width: var(--img-mini-width);

  height: var(--img-mini-width);

  font-size: 28px;

}



/* VP11-03 — corp FAQ list gap (catalog-faq / commercial-trust card rhythm) */

.zpm-delivery-page .zpm-corp-faq__list,

.zpm-warranty-page .zpm-corp-faq__list,

.zpm-dealers-page .zpm-corp-faq__list,

.zpm-custom-page .zpm-corp-faq__list {

  gap: var(--pad-gap);

}



/* VP11-04 — payment proof cards: home adv-cards density (4-col desktop) */

@media (min-width: 1025px) {

  .zpm-payment-proof__grid {

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: var(--pad-gap);

  }



  .zpm-delivery-summary,

  .zpm-warranty-summary,

  .zpm-payment-legal__facts {

    gap: var(--pad-gap);

  }

}



/* VP11-05 — custom timeline desktop cap (home row4 pattern) */

.zpm-custom-timeline.zpm-corp-timeline {

  grid-template-columns: repeat(4, minmax(0, 1fr));

}

/* ==========================================================================

   SITE-002 — Corporate Pages Visual Polish Pass 1.2 (VP12-01+)

   Authority: Home page rhythm — no global padding-top:0 resets

   ========================================================================== */



/* VP12-01 — H1-only page intro air (home hero title→lead gap token) */

.page-intro > .container:not(:has(.page-intro__description)) {

  gap: var(--pad-gap);

}



/* VP12-02 — corp lead paragraph rhythm (home dealers text stack) */

.zpm-corp-page-lead__body {

  gap: var(--pad-gap);

}



/* VP12-03 — corp table cell breathing */

.zpm-delivery-carriers__table th,

.zpm-delivery-carriers__table td,

.zpm-payment-methods__table th,

.zpm-payment-methods__table td,

.zpm-warranty-coverage__table th,

.zpm-warranty-coverage__table td,

.zpm-warranty-docs__table th,

.zpm-warranty-docs__table td,

.zpm-dealers-matrix__table th,

.zpm-dealers-matrix__table td,

.zpm-dealers-outcomes__table th,

.zpm-dealers-outcomes__table td,

.zpm-dealers-crosslinks__table th,

.zpm-dealers-crosslinks__table td,

.zpm-custom-tasks__table th,

.zpm-custom-tasks__table td,

.zpm-custom-scope__table th,

.zpm-custom-scope__table td,

.zpm-custom-requirements__table th,

.zpm-custom-requirements__table td,

.zpm-custom-outcomes__table th,

.zpm-custom-outcomes__table td {

  padding: var(--pad-gap) var(--pad-gap);

}



/* VP12-04 — payment proof card internal air (home adv-card text stack) */

.zpm-payment-proof-card {

  gap: var(--pad-gap);

}

/* ==========================================================================
   M9.13 — About Company page — compact redesign
   M9.13 polish pass v1 — trust row, spacing, cert balance, geo photo
   ========================================================================== */

.zpm-about-page {
  display: flex;
  flex-direction: column;
  /* gap: var(--pad-y); */
  padding-bottom: var(--pad-y);
}

/* §01 Hero */
.zpm-about-hero {
  padding-top: var(--pad-y);
}

.zpm-about-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
  gap: var(--pad-gap);
  align-items: center;
}

.zpm-about-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
  min-width: 0;
}

.zpm-about-hero__lead {
  margin: 0;
  max-width: 720px;
  font-size: var(--Heading-Font-size);
  line-height: var(--Heading-Line-height);
}

.zpm-about-hero__trust {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  gap: var(--pad-gap-mini) var(--pad-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}

.zpm-about-hero__trust-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.zpm-about-hero__trust-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  font-size: 26px;
  color: var(--accent-color-01);
  flex-shrink: 0;
}

/* .zpm-about-hero__trust-text {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
} */

.zpm-about-hero__media {
  margin: 0;
  border-radius: var(--radius-main);
  overflow: hidden;
  border: 1px solid var(--border-color);
  background-color: #fff;
}

.zpm-about-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.zpm-about-hero__caption {
  padding: var(--pad-gap-mini) var(--pad-inner);
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  color: var(--font-grey-color, #6b7a8c);
  display: none;
}

/* §02 About company */
.zpm-about-company__head {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
  margin-bottom: var(--pad-gap);
  max-width: 900px;
}

.zpm-about-company__title {
  margin: 0;
}

.zpm-about-company__text {
  margin: 0;
}

.zpm-about-proof__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--pad-gap);
}

.zpm-about-proof-card {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
  padding: var(--pad-inner);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  background-color: #fff;
  min-width: 0;
}

.zpm-about-proof-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  font-size: 28px;
  color: var(--accent-color-01);
  flex-shrink: 0;
}

.zpm-about-proof-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-mini);
  min-width: 0;
}

.zpm-about-proof-card__title {
  margin: 0;
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-about-proof-card__text {
  margin: 0;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

/* §03 Advantages */
.zpm-about-advantages__title {
  margin: 0 0 var(--pad-y);
}

.zpm-about-advantages .zpm-adv-bottom {
  padding: 0;
}

/* §04 Certificates */
.zpm-about-certs__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 460px);
  gap: var(--pad-gap);
  align-items: center;
}

.zpm-about-certs__content {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
  min-width: 0;
  max-width: 700px;
}

.zpm-about-certs__title {
  margin: 0;
}

.zpm-about-certs__text,
.zpm-about-certs__meta,
.zpm-about-certs__note {
  margin: 0;
}

.zpm-about-certs__note {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  color: var(--font-grey-color, #6b7a8c);
}

.zpm-about-certs__cert {
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.zpm-about-certs .zpm-commercial-trust__cert-col {
  max-width: none;
  width: 100%;
  padding: 72px var(--pad-inner) 118px;
}

.zpm-about-certs .zpm-commercial-trust__cert-card {
  max-width: 280px;
}

.zpm-about-certs .zpm-commercial-trust__cert-card--base {
  bottom: 12px;
}

/* §05 Geography */
.zpm-about-geo__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pad-gap);
  align-items: center;
}

.zpm-about-geo__media {
  margin: 0;
  display: flex;
  align-items: stretch;
  justify-content: center;
  min-height: 280px;
  padding: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  background-color: #fff;
  overflow: hidden;
}

.zpm-about-geo__media img {
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 280px;
  object-fit: cover;
  object-position: center;
}

.zpm-about-geo__content {
  display: flex;
  flex-direction: column;
  gap: calc(var(--pad-gap) * 0.85);
  min-width: 0;
}

.zpm-about-geo__title {
  margin: 0;
}

.zpm-about-geo__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.zpm-about-geo__list li {
  position: relative;
  padding-left: 14px;
  font-size: var(--base-Font-size);
  line-height: var(--base-Line-height);
}

.zpm-about-geo__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--accent-color-01);
}

.zpm-about-geo__link {
  align-self: flex-start;
}

/* §06 CTA */
.zpm-about-cta {
  padding-top: var(--pad-y);
}

.zpm-about-cta .zpm-commercial-trust__wrap {
  align-items: stretch;
}

.zpm-about-cta__benefits {
  margin-top: var(--pad-gap);
}

/* Responsive */
@media (max-width: 1199px) {
  .zpm-about-proof__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {
  .zpm-about-hero__grid,
  .zpm-about-certs__grid,
  .zpm-about-geo__grid {
    grid-template-columns: 1fr;
  }

  .zpm-about-hero__media {
    order: -1;
  }

  .zpm-about-certs .zpm-commercial-trust__cert-col {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }

  .zpm-about-certs .zpm-commercial-trust__cert-card {
    max-width: 240px;
  }

  .zpm-about-cta .zpm-commercial-trust__wrap {
    flex-direction: column;
  }

  .zpm-about-cta .zpm-commercial-trust__form-wrap {
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 580px) {
  .zpm-about-proof__grid {
    grid-template-columns: 1fr;
  }

  .zpm-about-hero__trust {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--pad-gap-mini);
  }

  .zpm-about-geo__media {
    min-height: 220px;
  }

  .zpm-about-geo__media img {
    min-height: 220px;
  }

  .zpm-about-certs .zpm-commercial-trust__cert-card {
    max-width: 220px;
  }
}

/* ==========================================================================
   SITE-002 — Universal Corporate CTA v2 (zpm-corp-cta)
   Independent from .zpm-commercial-trust — values mirrored from PLP block
   ========================================================================== */

.zpm-corp-cta__form-wrap .zpm-decoration-with-logo {
  position: absolute;
  z-index: 1;
  width: 250%;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}

.zpm-corp-cta {
  position: relative;
  overflow: hidden;
}

.zpm-corp-cta__wrap {
  display: flex;
  flex-flow: row;
  gap: var(--pad-gap);
  align-items: stretch;
}

.zpm-corp-cta__info {
  display: flex;
  flex-flow: column;
  gap: var(--pad-y);
  width: 100%;
  justify-content: space-between;
  position: relative;
  z-index: 2;
}

.zpm-corp-cta__form-wrap {
  display: flex;
  flex-flow: column;
  width: 100%;
  max-width: 490px;
  justify-content: flex-end;
  position: relative;
  z-index: 1;
}

.zpm-corp-cta__card {
  display: flex;
  flex-direction: column;
  gap: var(--pad-y);
}

.zpm-corp-cta__header {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-line) var(--pad-gap);
}

.zpm-corp-cta__label {
  margin: 0;
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
  font-weight: var(--large-Font-weight);
  text-transform: uppercase;
  color: var(--accent-color-01);
}

.zpm-corp-cta__title {
  margin: 0;
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
  font-weight: var(--large-Font-weight);
  max-width: 430px;
}

.zpm-corp-cta__lead {
  margin: 0;
  max-width: 730px;
}

.zpm-corp-cta__main {
  display: flex;
  gap: var(--pad-y);
  flex-flow: row;
}

.zpm-corp-cta__cert-col {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 80px var(--pad-inner) 130px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  background-color: #fff;
  overflow: hidden;
  max-width: 490px;
}

.zpm-corp-cta__cert-card--base {
  display: flex;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: var(--pad-inner);
  right: var(--pad-inner);
}

.zpm-corp-cta__cert-card {
  display: flex;
  position: relative;
  z-index: 2;
  max-width: 250px;
  box-shadow: 0px 3px 9px -3px rgba(45, 51, 59, 0.3);
  border-radius: var(--radius-main);
}

.zpm-corp-cta__cert-link {
  display: block;
  border-radius: var(--radius-internal);
  overflow: hidden;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.zpm-corp-cta__cert-link:hover,
.zpm-corp-cta__cert-link:focus-visible {
  box-shadow: 0px 3px 9px -3px rgba(0, 0, 0, 0.1);
}

.zpm-corp-cta__cert-img {
  display: block;
  width: 100%;
  height: auto;
}

.zpm-corp-cta__benefits {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap);
  width: 100%;
  justify-content: center;
}

.zpm-corp-cta__benefits-grid {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-flow: column;
  gap: var(--pad-y);
}

.zpm-corp-cta__benefit {
  display: flex;
  align-items: center;
  gap: var(--pad-gap);
}

.zpm-corp-cta__benefit-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 110px;
  height: 110px;
  min-width: 110px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  background-color: #fff;
  border-radius: 100%;
  font-size: 50px;
}

.zpm-corp-cta__benefit-body {
  display: flex;
  flex-direction: column;
  gap: var(--pad-gap-line);
  min-width: 0;
}

.zpm-corp-cta__benefit-title {
  font-size: var(--Title-h3-Font-size);
  line-height: var(--Title-h3-Line-height);
  font-weight: var(--large-Font-weight);
  margin-top: -2px;
}

.zpm-corp-cta__benefit-text {
  max-width: 410px;
}

.zpm-corp-cta__form-col {
  position: relative;
  z-index: 2;
}

.zpm-corp-cta__form-card {
  padding: var(--pad-inner);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-main);
  display: flex;
  flex-flow: column;
  gap: var(--pad-gap);
  background-color: rgba(255, 255, 255, 1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  box-shadow: 0px 0px var(--radius-external) var(--pad-gap-line) var(--main-light-color);
}

.zpm-corp-cta__form-title {
  font-size: var(--Title-h2-Font-size);
  line-height: var(--Title-h2-Line-height);
  font-weight: var(--large-Font-weight);
}

.zpm-corp-cta__form-note {
  font-size: var(--mini-Font-size);
  line-height: var(--mini-Line-height);
}

@media (max-width: 1560px) {
  .zpm-corp-cta__cert-card {
    max-width: 170px;
  }

  .zpm-corp-cta__cert-col {
    padding: 60px var(--pad-inner) 100px;
    max-width: 320px;
  }

  .zpm-corp-cta__cert-card--base {
    bottom: var(--pad-gap-line);
    left: var(--pad-gap-line);
    right: var(--pad-gap-line);
  }

  .zpm-corp-cta__form-wrap {
    max-width: 420px;
  }

  .zpm-corp-cta__info {
    justify-content: flex-start;
  }

  .zpm-corp-cta__benefit {
    align-items: flex-start;
  }

  .zpm-corp-cta__benefit-icon {
    width: 70px;
    height: 70px;
    min-width: 70px;
    font-size: 30px;
  }

  .zpm-corp-cta__benefit-text {
    max-width: 320px;
  }

  .zpm-corp-cta__form-wrap {
    max-width: 550px;
  }
}

@media (max-width: 1024px) {
  .zpm-corp-cta__wrap {
    flex-direction: column;
  }

  .zpm-corp-cta__main {
    flex-flow: column;
  }

  .zpm-corp-cta__cert-col {
    max-width: none;
  }

  .zpm-corp-cta__form-wrap {
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .zpm-corp-cta__cert-col {
    padding: var(--pad-y) var(--pad-inner) 100px;
  }

  .zpm-corp-cta__benefit-icon {
    width: 60px;
    height: 60px;
    min-width: 60px;
    font-size: 24px;
  }
}

/* ==========================================================================
   SITE-002 — Corporate intro image blocks (zpm-corp-intro)
   Desktop: image 1/3 · text 2/3 · Mobile: stacked (image above text)
   ========================================================================== */

.zpm-corp-intro__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: var(--pad-gap);
  align-items: start;
}

.zpm-corp-intro__media {
  min-height: clamp(180px, 28vw, 320px);
  overflow: hidden;
  border-radius: var(--radius-main);
}

.zpm-corp-intro__media img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  border-radius: var(--radius-main);
}

.zpm-corp-intro__body.zpm-corp-page-lead__body {
  max-width: none;
}

@media (max-width: 1024px) {
  .zpm-corp-intro__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .zpm-corp-intro__media {
    min-height: clamp(160px, 45vw, 280px);
  }
}

/* ==========================================================================
   SITE-002 — Custom OEM proof strip → commercial trust services reuse
   Authority: .zpm-commercial-trust__services card pattern (Home / catalog FAQ)
   Scope: wrapper + 3-column grid override only — no new card system
   ========================================================================== */

.zpm-custom-oem__proof-strip {
  display: block;
  margin: var(--pad-gap) 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}

.zpm-custom-oem__proof-strip .zpm-commercial-trust__services {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1024px) {
  .zpm-custom-oem__proof-strip .zpm-commercial-trust__services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 660px) {
  .zpm-custom-oem__proof-strip .zpm-commercial-trust__services {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   SITE-002 — Delivery summary → commercial trust services reuse
   Authority: .zpm-commercial-trust__services card pattern (Home / catalog FAQ)
   Scope: wrapper reset + 4-column grid override only — no new card system
   ========================================================================== */

.zpm-delivery-summary {
  display: block;
  margin: var(--pad-gap) 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}

.zpm-delivery-summary .zpm-commercial-trust__services {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1024px) {
  .zpm-delivery-summary .zpm-commercial-trust__services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 660px) {
  .zpm-delivery-summary .zpm-commercial-trust__services {
    grid-template-columns: 1fr;
  }
}
















.zpm-about-certs,
.zpm-corp-page-lead.zpm-corp-intro,
.category__view {
  display: none !important;
}


