/**
 * Главная (ПК): визуал ближе к референсу — светлая шапка, золотые CTA,
 * герой в две колонки, блоки «направления» и «три колонки», волны на тёмных секциях.
 * Сетка контента: max-width 1440px (--content-max), эталоны ПК 1440 / mobile 360 (zerkalo-breakpoints.css).
 * Подключается только на index.html (body.home-layout-ref).
 */
:root {
  --zp-gold: #e5b95f;
  --zp-gold-hover: #f2c66b;
  --zp-header-bg: rgba(255, 255, 255, 0.96);
  --zp-wave-purple: #1a1433;
  /* Figma tokens */
  --zp-figma-text: #414544;
  --zp-figma-purple: #3b135c;
  --zp-figma-btn-text: #311d65;
  --zp-figma-faq-open: #e6eaff;
  --zp-figma-faq-closed: #f0f2f5;
  --zp-font-ui: 'Nunito', system-ui, sans-serif;
  --zp-font-unchanged: 'Manrope', 'Inter', system-ui, sans-serif;
  /* Макет шапки */
  --zp-nav-text: #3b135c;
  --zp-brand-muted: #3b135c;
  --zp-btn-text: #311d65;
  --zp-mock-gold-a: #e5b95f;
  --zp-mock-gold-b: #f2c66b;
  /* Переключатель pillars — референс #products-menu (фиолетовая pill) */
  --zp-segment-accent: #886cce;
  --zp-segment-accent-hover: #7659b8;
  --zp-segment-track: #f0f2f5;
  /* Hero CTA — layout _2zPZiS (белая, фиолетовый текст) */
  --zp-hero-cta-bg: #ffffff;
  --zp-hero-cta-color: #6440bf;
  --zp-hero-cta-radius: 12px;
  --zp-hero-cta-font: 'Roboto', system-ui, sans-serif;
  --zp-hero-cta-fw: 500;
}

body.home-layout-ref {
  font-family: var(--zp-font-ui);
  color: var(--zp-figma-text);
  background: #ffffff;
  --page-gutter: var(--grid-padding);
  /* Единая колонка контента главной — как .nav в шапке */
  --zp-home-col-w: min(100%, var(--content-max, 1440px));
  --wrap: min(var(--content-max), calc(100vw - 2 * var(--grid-padding)));
  --gold: var(--zp-gold);
  --gold-2: var(--zp-gold-hover);
  --text: var(--zp-figma-text);
  /* Высота фиксированной шапки + отступ до контента (JS уточняет --zp-fixed-header-h) */
  --zp-fixed-header-h: 92px;
  --zp-site-header-gap: 24px;
  --zp-site-content-offset: calc(
    env(safe-area-inset-top, 0px) + var(--zp-fixed-header-h) + var(--zp-site-header-gap)
  );
  --zp-hero-peek-pad: clamp(12px, 2vw, 20px);
  --zp-hero-below-header-pad: max(
    var(--hero-pad-top),
    calc(env(safe-area-inset-top, 0px) + var(--zp-fixed-header-h) + 12px)
  );
  --zp-hero-fixed-spacer-h: calc(
    var(--zp-hero-peek-pad) + clamp(460px, 56vh, 820px) + clamp(72px, 9vw, 140px)
  );
}

/* Главная: отступ модуля героя = только высота фиксированной шапки */
body.home-layout-ref:has(.home-first-module) {
  --zp-site-header-gap: 0;
  --zp-hero-header-gap: 10px;
  --zp-hero-copy-drop: 0px;
  --zp-hero-under-header: calc(
    env(safe-area-inset-top, 0px) + var(--zp-fixed-header-h) + var(--zp-hero-header-gap, 10px)
  );
}

/* --- Шапка: светлая полоса как на макете --- */
body.home-layout-ref header#header.header {
  width: 100%;
  max-width: none;
  left: 0;
  right: 0;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

body.home-layout-ref .header {
  background: var(--zp-header-bg);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(72, 42, 131, 0.1);
  box-shadow: 0 4px 24px rgba(35, 18, 77, 0.06);
  overflow: visible;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
  will-change: transform;
  z-index: 1100;
}

body.home-layout-ref:has(.home-first-module) .nav-tray,
body.home-layout-ref:has(.home-first-module) .nav-toggle {
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

body.home-layout-ref:has(.home-first-module) #navMobile[hidden] {
  pointer-events: none !important;
  visibility: hidden !important;
}

body.home-layout-ref .header.header--collapsed {
  transform: translateY(calc(-100% - env(safe-area-inset-top, 0px)));
}

body.home-layout-ref .header.scrolled {
  box-shadow: 0 8px 32px rgba(35, 18, 77, 0.1);
}

@media (max-width: 1319px) {
  body.home-layout-ref .header.scrolled {
    box-shadow: 0 4px 24px rgba(35, 18, 77, 0.06);
  }
}

/* Контент не заходит под position:fixed #header (все внутренние страницы) */
body.home-layout-ref:not(:has(.home-first-module)) #navMobile + .usluga-page-shell,
body.home-layout-ref:not(:has(.home-first-module)) #navMobile + main,
body.home-layout-ref:not(:has(.home-first-module)) #navMobile + section,
/* Устойчиво к лишним узлам между navMobile и main (meta/script inject) */
body.home-layout-ref:not(:has(.home-first-module)) main#main,
body.home-layout-ref:not(:has(.home-first-module)) main.usluga-page-shell {
  padding-top: var(--zp-site-content-offset);
  box-sizing: border-box;
}

body.home-layout-ref:not(:has(.home-first-module)) #navMobile + .usluga-page-shell,
body.home-layout-ref:not(:has(.home-first-module)) #navMobile + main,
body.home-layout-ref:not(:has(.home-first-module)) #navMobile + section,
body.home-layout-ref:not(:has(.home-first-module)) .usluga-page-shell,
body.home-layout-ref:not(:has(.home-first-module)) main,
body.home-layout-ref:not(:has(.home-first-module)) section[id] {
  scroll-margin-top: var(--zp-site-content-offset);
}

body.home-layout-ref .nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  /* Ближе к лого; телефон/tray справа не наезжают на «Ещё» */
  gap: clamp(12px, 2vw, 36px);
  align-self: stretch;
  width: min(100%, var(--content-max, 1440px));
  max-width: 1440px;
  margin: 0 auto;
  padding: 14px max(0px, env(safe-area-inset-right, 0px)) 14px
    max(0px, env(safe-area-inset-left, 0px));
  min-height: 0;
  overflow: visible;
  box-sizing: border-box;
}

@media (max-width: 1319px) {
  body.home-layout-ref .nav {
    gap: clamp(20px, 3.5vw, 40px);
  }
}

body.home-layout-ref .brand {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  text-decoration: none;
}

body.home-layout-ref .brand--mock-header .brand-full-logo__img {
  display: block;
  width: auto;
  max-width: min(282.25px, 42vw);
  height: 70.4px;
  flex-shrink: 0;
  object-fit: contain;
  object-position: left center;
}

body.home-layout-ref .brand-wordmark {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
  gap: 2px;
}

body.home-layout-ref .brand-wordmark__line1 {
  font-family: var(--zp-font-ui);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--zp-nav-text);
  opacity: 0.92;
}

body.home-layout-ref .brand-wordmark__line2 {
  font-family: var(--zp-font-ui);
  font-size: clamp(17px, 1.9vw, 20px);
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--zp-nav-text);
}

body.home-layout-ref .brand-logo {
  height: 36px;
  width: auto;
}

body.home-layout-ref .brand-tagline {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--violet);
  max-width: 140px;
}

body.home-layout-ref .nav-links {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 0;
  flex: 1 1 auto;
  min-width: 0;
  overflow: visible;
  align-self: stretch;
}

body.home-layout-ref .nav-links__mega-wrap,
body.home-layout-ref .nav-links > a {
  flex-shrink: 0;
}

body.home-layout-ref .nav-links__mega-wrap {
  position: relative;
}

body.home-layout-ref .nav-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 40px;
  padding: 0 clamp(8px, 1.1vw, 24px);
  border-radius: 7px;
  font-family: var(--zp-font-ui);
  font-weight: 600;
  font-size: clamp(13px, 0.28vw + 12px, 16px);
  line-height: 22px;
  color: #3b135c;
  text-decoration: none;
  border-bottom: none;
  white-space: nowrap;
  transition:
    background-color 0.18s ease,
    color 0.18s ease;
}

body.home-layout-ref .nav-links a:hover {
  color: #3b135c;
  background: rgba(59, 19, 92, 0.06);
}

body.home-layout-ref .nav-links__item--services {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

body.home-layout-ref .nav-links__chev {
  display: inline-block;
  width: 0;
  height: 0;
  margin-top: 1px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #3b135c;
  opacity: 0.92;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

body.home-layout-ref .nav-links__mega-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 40px;
  padding: 0 clamp(8px, 1.1vw, 24px);
  margin: 0;
  border-radius: 7px;
  font-family: var(--zp-font-ui);
  font-weight: 600;
  font-size: clamp(13px, 0.28vw + 12px, 16px);
  line-height: 22px;
  color: #3b135c;
  opacity: 0.9;
  background: transparent;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background-color 0.18s ease,
    color 0.18s ease;
}

/* layout bundles set * { font-family: Roboto; line-height: 150% } — reset label spans */
body.home-layout-ref .nav-links__mega-trigger > span:not(.nav-links__chev) {
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  opacity: 1;
}

body.home-layout-ref .nav-links__mega-trigger:hover {
  color: #3b135c;
  background: rgba(59, 19, 92, 0.06);
}

body.home-layout-ref .nav-links__mega-trigger:focus-visible {
  outline: 2px solid var(--zp-mock-gold-b);
  outline-offset: 2px;
}

body.home-layout-ref .nav-links__mega-wrap.is-open .nav-links__mega-trigger {
  background: rgba(59, 19, 92, 0.08);
}

body.home-layout-ref .nav-links__mega-wrap.is-open .nav-links__chev {
  transform: rotate(180deg);
}

body.home-layout-ref .nav-megamenu {
  position: absolute;
  left: 0;
  top: calc(100% - 1px);
  z-index: 400;
  padding-top: 10px;
  width: max-content;
  min-width: min(760px, calc(100vw - 96px));
  max-width: min(920px, calc(100vw - 48px));
  pointer-events: none;
}

/* «Еще» у правого края; «Услуги» — fluid ширина и плитки */
body.home-layout-ref .nav-megamenu--more {
  left: auto;
  right: 0;
  width: min(680px, calc(100vw - 24px));
  min-width: 0;
  max-width: calc(100vw - 24px);
}

body.home-layout-ref .nav-megamenu__cols--more {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.home-layout-ref .nav-megamenu--services {
  left: 0;
  width: min(1080px, calc(100vw - 24px));
  min-width: 0;
  max-width: calc(100vw - 24px);
}

body.home-layout-ref .nav-megamenu--services .nav-megamenu__cols--bank {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.home-layout-ref .nav-megamenu__panel--bank {
  padding: clamp(12px, 1.5vw, 16px);
  border-radius: 20px;
  max-height: min(calc(100dvh - 96px), 78vh);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

body.home-layout-ref .nav-megamenu__cols--bank {
  gap: 8px 20px;
}

body.home-layout-ref .nav-megamenu--services .nav-megamenu__col {
  padding: 0 4px;
}

body.home-layout-ref .nav-megamenu--services .nav-megamenu__col + .nav-megamenu__col {
  border-left: 1px solid rgba(59, 19, 92, 0.12);
  padding-left: 16px;
}

body.home-layout-ref .nav-megamenu__group-title--bank {
  margin: 10px 0 4px;
  padding: 0 12px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(59, 19, 92, 0.55);
}

body.home-layout-ref .nav-megamenu__group-title--bank:first-of-type {
  margin-top: 0;
}

body.home-layout-ref .nav-megamenu__title-link--bank {
  color: inherit;
  text-decoration: none;
}

body.home-layout-ref .nav-megamenu__title-link--bank:hover {
  color: #3b135c;
}

body.home-layout-ref .nav-megamenu__title--bank.nav-megamenu__title--spacer {
  visibility: hidden;
  min-height: 16px;
  margin-bottom: 4px;
}

body.home-layout-ref .nav-megamenu__foot--bank {
  margin-top: 12px;
  padding: 12px 12px 0;
  border-top: 1px solid rgba(59, 19, 92, 0.12);
}

body.home-layout-ref .nav-megamenu__list--bank a.nav-megamenu__tile {
  display: flex;
  align-items: flex-start;
  gap: clamp(6px, 0.8vw, 8px);
  min-height: 48px;
  height: auto;
  padding: clamp(6px, 0.8vw, 10px) clamp(8px, 1vw, 12px);
  font-size: clamp(13px, 0.42rem + 0.55vw, 16px);
  font-weight: 500;
  line-height: 1.35;
  color: #1c1f23;
  border-radius: 12px;
}

body.home-layout-ref .nav-megamenu--more .nav-megamenu__col {
  padding: 0 4px;
}

body.home-layout-ref .nav-megamenu--more .nav-megamenu__col + .nav-megamenu__col {
  border-left: 1px solid rgba(59, 19, 92, 0.12);
  padding-left: 16px;
}

body.home-layout-ref .nav-megamenu__title--bank {
  margin: 0 0 4px;
  padding: 0 12px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(59, 19, 92, 0.55);
}

body.home-layout-ref .nav-megamenu__list--bank {
  gap: 4px;
}

body.home-layout-ref .nav-megamenu__tile {
  display: flex;
  align-items: flex-start;
  gap: clamp(6px, 0.8vw, 8px);
  box-sizing: border-box;
  width: 100%;
  min-height: 48px;
  height: auto;
  padding: clamp(6px, 0.8vw, 10px) clamp(8px, 1vw, 12px);
  border-radius: 12px;
  font-family: var(--zp-font-ui);
  font-size: clamp(13px, 0.42rem + 0.55vw, 16px);
  font-weight: 500;
  line-height: 1.35;
  color: #1c1f23;
  text-decoration: none;
  border-bottom: none !important;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}

body.home-layout-ref .nav-megamenu__tile-icon {
  display: inline-flex;
  flex: 0 0 clamp(28px, 2.2vw, 32px);
  align-items: center;
  justify-content: center;
  width: clamp(28px, 2.2vw, 32px);
  height: clamp(28px, 2.2vw, 32px);
  margin-top: 1px;
  color: #3b135c;
}

body.home-layout-ref .nav-megamenu__tile-svg {
  display: block;
  width: 100%;
  height: 100%;
}

body.home-layout-ref .nav-megamenu__tile-text {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

body.home-layout-ref .nav-megamenu__tile:hover {
  background: rgba(59, 19, 92, 0.06);
  color: #1c1f23;
}

body.home-layout-ref .nav-megamenu__tile:focus-visible {
  outline: 2px solid var(--zp-mock-gold-b);
  outline-offset: 0;
}

body.home-layout-ref .nav-megamenu--more .nav-megamenu__list a.nav-megamenu__tile {
  display: flex;
  align-items: flex-start;
  gap: clamp(6px, 0.8vw, 8px);
  min-height: 48px;
  height: auto;
  padding: clamp(6px, 0.8vw, 10px) clamp(8px, 1vw, 12px);
  font-size: clamp(13px, 0.42rem + 0.55vw, 16px);
  font-weight: 500;
  line-height: 1.35;
  color: #1c1f23;
  border-radius: 12px;
}

body.home-layout-ref .nav-megamenu:not([hidden]) {
  display: block;
  pointer-events: auto;
}

body.home-layout-ref .nav-megamenu[hidden] {
  display: none !important;
}

html.nav--measure body.home-layout-ref .nav-megamenu {
  display: none !important;
  pointer-events: none !important;
}

body.home-layout-ref .nav-megamenu__panel {
  background: #ffffff;
  border: 1px solid rgba(59, 19, 92, 0.14);
  border-radius: 16px;
  box-shadow:
    0 18px 48px rgba(25, 10, 55, 0.12),
    0 2px 8px rgba(25, 10, 55, 0.06);
  padding: 12px 14px 14px;
}

body.home-layout-ref .nav-megamenu__cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(200px, 1fr));
}

body.home-layout-ref .nav-megamenu__col {
  padding: 0 12px;
}

body.home-layout-ref .nav-megamenu__col + .nav-megamenu__col {
  border-left: 1px solid rgba(59, 19, 92, 0.14);
}

body.home-layout-ref .nav-megamenu__title {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  color: rgba(59, 19, 92, 0.72);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

body.home-layout-ref .nav-megamenu__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

body.home-layout-ref .nav-megamenu__list a {
  display: block;
  padding: 7px 8px;
  font-size: 13px;
  font-weight: 600;
  color: #3b135c;
  border-radius: 8px;
  text-decoration: none;
  border-bottom: none !important;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

body.home-layout-ref .nav-megamenu__list a:hover {
  background: rgba(59, 19, 92, 0.07);
  color: #2a0f42;
}

body.home-layout-ref .nav-megamenu__list a:focus-visible {
  outline: 2px solid var(--zp-mock-gold-b);
  outline-offset: 0;
}

body.home-layout-ref .nav-megamenu__title-link {
  color: inherit;
  text-decoration: none;
}

body.home-layout-ref .nav-megamenu__title-link:hover {
  color: #3b135c;
}

body.home-layout-ref .nav-megamenu__group-title {
  margin: 10px 0 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(59, 19, 92, 0.55);
}

body.home-layout-ref .nav-megamenu__group-title:first-of-type {
  margin-top: 0;
}

body.home-layout-ref .nav-megamenu__col--continued .nav-megamenu__title--spacer {
  visibility: hidden;
  min-height: 1.25em;
  margin-bottom: 8px;
}

body.home-layout-ref .nav-mobile-services__label {
  display: block;
  margin: 14px 0 4px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(65, 69, 68, 0.62);
}

body.home-layout-ref .nav-mobile-services__sub {
  padding-left: 14px;
  font-size: 15px;
}

body.home-layout-ref .service-page-hub {
  padding: clamp(24px, 4vw, 32px) 0 clamp(48px, 8vw, 64px);
  box-sizing: border-box;
  max-width: var(--wrap);
  width: min(100%, var(--wrap));
  margin-inline: auto;
}

body.home-layout-ref .service-hub {
  max-width: min(var(--content-max, 1440px), 100%);
  margin-inline: auto;
}

body.home-layout-ref .service-page-empty {
  padding: clamp(24px, 4vw, 32px) 0 clamp(48px, 8vw, 64px);
  box-sizing: border-box;
  max-width: var(--wrap);
  width: min(100%, var(--wrap));
  margin-inline: auto;
  min-height: min(50vh, 480px);
}

body.home-layout-ref .service-page-empty__inner {
  max-width: min(var(--content-max, 1440px), 100%);
  margin-inline: auto;
}

body.home-layout-ref .service-hub__title {
  margin: 0 0 24px;
  font-size: clamp(28px, 4vw, 36px);
  font-weight: 700;
  line-height: 1.2;
  color: #3b135c;
}

body.home-layout-ref .service-hub__nav {
  display: grid;
  gap: 28px;
}

@media (min-width: 721px) {
  body.home-layout-ref .service-hub__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 48px;
  }
}

body.home-layout-ref .service-hub__subtitle {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(59, 19, 92, 0.65);
}

body.home-layout-ref .service-hub__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.home-layout-ref .service-hub__list a {
  display: block;
  padding: 6px 0;
  color: #3b135c;
  text-decoration: none;
}

body.home-layout-ref .service-hub__list a:hover {
  text-decoration: underline;
}

body.home-layout-ref .service-page-empty__title {
  margin: 0;
  font-size: clamp(28px, 4vw, 36px);
  font-weight: 700;
  line-height: 1.2;
  color: #3b135c;
}

body.home-layout-ref .nav-megamenu__foot {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(59, 19, 92, 0.1);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 20px;
}

body.home-layout-ref .nav-megamenu__all {
  font-weight: 700;
  font-size: 14px;
  color: #9a6b1a;
  text-decoration: none;
  border-bottom: none !important;
}

body.home-layout-ref .nav-megamenu__all:hover {
  color: #7a5512;
  text-decoration: underline;
}

body.home-layout-ref .nav-megamenu__vk {
  font-size: 13px;
  font-weight: 600;
  color: #2563eb;
  text-decoration: none;
  border-bottom: none !important;
}

body.home-layout-ref .nav-megamenu__vk:hover {
  text-decoration: underline;
}

@media (max-width: 1319px) {
  body.home-layout-ref .nav-megamenu__cols:not(.nav-megamenu__cols--bank) {
    grid-template-columns: 1fr;
  }

  body.home-layout-ref .nav-megamenu__cols--bank {
    gap: 8px clamp(12px, 2vw, 20px);
  }

  body.home-layout-ref .nav-megamenu--services .nav-megamenu__cols--bank {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-layout-ref .nav-megamenu--services .nav-megamenu__col + .nav-megamenu__col {
    border-left: 1px solid rgba(59, 19, 92, 0.12);
    border-top: none;
    margin-top: 0;
    padding-top: 0;
    padding-left: clamp(10px, 1.5vw, 16px);
  }

  body.home-layout-ref .nav-megamenu--services .nav-megamenu__col:nth-child(3) {
    grid-column: 1 / -1;
    border-left: none;
    border-top: 1px solid rgba(59, 19, 92, 0.12);
    margin-top: 8px;
    padding-top: 12px;
    padding-left: 4px;
  }

  body.home-layout-ref .nav-megamenu__col {
    padding: 0;
  }

  body.home-layout-ref .nav-megamenu__cols:not(.nav-megamenu__cols--bank) .nav-megamenu__col + .nav-megamenu__col {
    border-left: none;
    border-top: 1px solid rgba(59, 19, 92, 0.14);
    margin-top: 10px;
    padding-top: 10px;
  }

  body.home-layout-ref .nav-megamenu__cols--more {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-layout-ref .nav-megamenu--more .nav-megamenu__col + .nav-megamenu__col {
    border-left: 1px solid rgba(59, 19, 92, 0.12);
    border-top: none;
    margin-top: 0;
    padding-top: 0;
    padding-left: clamp(10px, 1.5vw, 16px);
  }
}

@media (min-width: 1320px) and (max-width: 1599px) {
  body.home-layout-ref .nav-megamenu--services {
    width: min(980px, calc(100vw - 20px));
    max-width: calc(100vw - 20px);
  }

  body.home-layout-ref .nav-megamenu__cols--bank {
    gap: 6px clamp(10px, 1.5vw, 16px);
  }
}

body.home-layout-ref .nav-mobile-links:not(.nav-mobile-links--bank) .nav-mobile-services {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: -2px 0 14px;
  padding: 8px 0 8px 14px;
  border-left: 2px solid rgba(212, 168, 83, 0.45);
}

body.home-layout-ref .nav-mobile-links:not(.nav-mobile-links--bank) .nav-mobile-services a {
  font-size: 14px;
  font-weight: 600;
  padding: 4px 0;
}

body.home-layout-ref .nav-mobile-services__vk {
  margin-top: 6px;
  padding-top: 8px !important;
  border-top: 1px solid rgba(72, 42, 131, 0.12);
}

body.home-layout-ref .nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: clamp(4px, 1vw, 8px);
  min-height: clamp(44px, 8vw, 60px);
  padding: clamp(6px, 1.2vw, 8px) clamp(12px, 3vw, 36px);
  border-radius: 15px;
  font-family: var(--zp-font-ui);
  font-weight: 600;
  font-size: clamp(12px, 2.5vw, 18px);
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  background: linear-gradient(90deg, var(--zp-mock-gold-a) 0%, var(--zp-mock-gold-b) 100%);
  color: #311d65 !important;
  box-shadow: none;
  border: none;
  white-space: normal;
  text-wrap: balance;
  max-width: min(42vw, 280px);
  box-sizing: border-box;
  transition: filter 0.2s ease;
}

body.home-layout-ref .nav-cta:hover {
  filter: brightness(1.03);
  box-shadow: none;
  transform: none;
}

/* Legacy bank-ref block in header — removed from HTML; hide if cached */
body.home-layout-ref .nav-mobile-sidebar-extra {
  display: none !important;
}

body.home-layout-ref .nav-tray {
  display: flex;
  align-items: center;
  gap: clamp(8px, 2vw, 24px);
  flex: 0 0 auto;
  flex-shrink: 0;
  margin-left: auto;
  min-width: 0;
}

body.home-layout-ref .nav-tray__login--mobile {
  display: none;
}

/* Мобильный toggler на белой шапке: явный контраст */
body.home-layout-ref .nav-toggle {
  background: #ffffff;
  border: 1px solid rgba(59, 19, 92, 0.28);
  box-shadow: 0 4px 14px rgba(59, 19, 92, 0.12);
}

body.home-layout-ref .nav-toggle span {
  background: #3b135c;
}

body.home-layout-ref .nav-toggle:hover,
body.home-layout-ref .nav-toggle:focus-visible {
  border-color: rgba(59, 19, 92, 0.5);
  box-shadow: 0 6px 16px rgba(59, 19, 92, 0.16);
}

/* JS: измерение — десктоп-ряд без мигания */
html.nav--measure body.home-layout-ref .nav-links {
  display: flex !important;
  flex: 0 0 auto !important;
  width: max-content !important;
  max-width: none !important;
  visibility: hidden;
  pointer-events: none;
}

/* Не форсировать «Войти», если уже виден виджет бонусов — иначе measure ломает десктоп-меню */
html.nav--measure body.home-layout-ref .nav-tray__login--desktop:not(.is-zp-bonus-hidden) {
  display: inline-flex !important;
}

html.nav--measure body.home-layout-ref .nav-tray__login--desktop.is-zp-bonus-hidden {
  display: none !important;
}

html.nav--measure body.home-layout-ref .nav-toggle {
  display: none !important;
}

/* JS: nav--compact — бургер вместо горизонтального меню (любая ширина) */
html.nav--compact body.home-layout-ref {
  --zp-fixed-header-h: 47px;
}

html.nav--compact body.home-layout-ref.page-usluga-holst {
  --zp-fixed-header-h: 114px;
}

html.nav--compact body.home-layout-ref .nav-links {
  display: none !important;
}

html.nav--compact body.home-layout-ref .nav-tray__login--desktop {
  display: none !important;
}

html.nav--compact body.home-layout-ref .nav-tray__login--mobile {
  display: inline-flex !important;
}

html.nav--compact body.home-layout-ref .nav-tray__login--mobile.is-zp-bonus-hidden {
  display: none !important;
}

html.nav--compact body.home-layout-ref .nav-toggle {
  display: inline-flex !important;
}

html.nav--compact body.home-layout-ref .nav-tray {
  display: contents;
}

/* Телефон шапки: не мигать при measure/до compact (city-picker CSS грузится async) */
html.nav--compact body.home-layout-ref .nav-tray__phone,
html.nav--measure body.home-layout-ref .nav-tray__phone {
  display: none !important;
}

@media (max-width: 1319px) {
  body.home-layout-ref .nav-tray__phone {
    display: none !important;
  }
}

html.nav--compact body.home-layout-ref .city-strip--header {
  display: none !important;
}

html.nav--compact body.home-layout-ref .nav {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 8px 12px;
  padding: 5px 16px;
  min-height: calc(10px + clamp(24px, calc(37 / 714 * 100vw), 37px));
}

html.nav--compact body.home-layout-ref .nav-toggle {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
}

html.nav--compact body.home-layout-ref .brand {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  min-width: 0;
}

html.nav--compact body.home-layout-ref .brand-full-logo__img {
  height: clamp(26.4px, calc(40.7 / 714 * 100vw), 40.7px);
  object-position: center center;
}

html.nav--compact body.home-layout-ref .nav-tray__login--mobile {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 68px;
  height: 28px;
  padding: 0 14px;
  border: 1px solid #e3e8ed;
  border-radius: 8px;
  background: #ffffff;
  font-family: var(--zp-font-ui);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
  color: #1c1f23;
  text-decoration: none;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}

html.nav--compact body.home-layout-ref .nav-tray__login--mobile:hover,
html.nav--compact body.home-layout-ref .nav-tray__login--mobile:focus-visible {
  background: #f4f6f9;
  color: #1c1f23;
  border-color: #e3e8ed;
}

html.nav--compact body.home-layout-ref .header {
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: 0;
}

@media (max-width: 1319px) {
  body.home-layout-ref .header-context-strip {
    display: none;
    width: 100%;
    margin: 0;
    padding: 0;
    border-top: 1px solid #e3e8ed;
    background: #ffffff;
  }

  body.home-layout-ref.page-usluga-holst .header-context-strip {
    display: block;
  }

  body.home-layout-ref .header-context-strip__inner {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    height: 38px;
    min-height: 38px;
    max-height: 38px;
    padding: 0 16px;
    font-family: var(--zp-font-ui);
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #1c1f23;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
  }

  body.home-layout-ref .header-context-strip__inner:hover,
  body.home-layout-ref .header-context-strip__inner:focus-visible {
    color: #1c1f23;
    text-decoration: none;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref .header-context-strip,
  body.home-layout-ref.page-usluga-holst .header-context-strip {
    display: none;
  }

  /* ПК: лого −10% (мобильные clamp не трогаем) */
  html:not(.nav--compact) body.home-layout-ref .brand--mock-header .brand-full-logo__img {
    height: 63.36px;
    max-width: min(254px, 38vw);
  }

  /* Меню пакуется у лого; tray (телефон/город/вход) — справа, без наезда на «Ещё» */
  html:not(.nav--compact) body.home-layout-ref .nav-links {
    flex: 0 1 auto;
    margin-right: 12px;
  }

  html:not(.nav--compact) body.home-layout-ref .nav-links a,
  html:not(.nav--compact) body.home-layout-ref .nav-links__mega-trigger {
    padding: 0 clamp(6px, 0.75vw, 14px);
  }

  /* На ПК: «Войти» справа; бургер — только в nav--compact */
  body.home-layout-ref .nav-tray {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;
    /* Резерв под телефон + город + вход — «Ещё» не заходит на номер */
    min-width: min(300px, 32vw);
  }

  html:not(.nav--compact) body.home-layout-ref .nav-toggle {
    display: none;
  }

  body.home-layout-ref .nav-tray__login--desktop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    max-width: min(300px, clamp(160px, 22vw, 300px));
    min-height: 40px;
    height: auto;
    padding: clamp(6px, 0.8vw, 8px) clamp(10px, 1.1vw, 16px);
    border: 1px solid rgba(59, 19, 92, 0.28);
    border-radius: 8px;
    background: #ffffff;
    font-family: var(--zp-font-ui);
    font-size: clamp(12px, 0.25vw + 11px, 14px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    text-align: center;
    color: #3b135c;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 4px 14px rgba(59, 19, 92, 0.08);
  }

  body.home-layout-ref .nav-tray__login--desktop:hover,
  body.home-layout-ref .nav-tray__login--desktop:focus-visible {
    border-color: rgba(59, 19, 92, 0.5);
    background: #faf8fc;
    color: #3b135c;
  }

  body.home-layout-ref .nav-megamenu__cols--more {
    gap: 24px;
  }

  /* Шапка = только .nav (без лишних 16px padding сверху/снизу из zerkalo-main.css) */
  body.home-layout-ref .header {
    padding: env(safe-area-inset-top, 0px) 0 0;
    box-sizing: border-box;
  }
}

@media (max-width: 1319px) {
  body.home-layout-ref {
    --zp-fixed-header-h: 47px;
    --zp-mobile-nav-pad-y: 5px;
    --zp-mobile-logo-h: clamp(24px, calc(37 / 714 * 100vw), 37px);
  }

  body.home-layout-ref.page-usluga-holst {
    --zp-fixed-header-h: 114px;
  }

  body.home-layout-ref .header {
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: 0;
  }

  body.home-layout-ref .nav {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    align-items: center;
    gap: 8px 12px;
    padding: var(--zp-mobile-nav-pad-y, 5px) 16px;
    min-height: calc(2 * var(--zp-mobile-nav-pad-y, 5px) + var(--zp-mobile-logo-h, 37px));
  }
  body.home-layout-ref .home-first-module {
    width: 100%;
    max-width: 100%;
    padding-left: var(--page-gutter);
    padding-right: var(--page-gutter);
    gap: 0;
  }
  body.home-layout-ref .nav-links {
    display: none;
  }
  body.home-layout-ref .brand-tagline {
    display: none;
  }
  body.home-layout-ref .nav-tray {
    display: contents;
  }
  body.home-layout-ref .nav-toggle {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }
  body.home-layout-ref .brand {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    min-width: 0;
  }
  body.home-layout-ref .brand-full-logo__img {
    height: var(--zp-mobile-logo-h, clamp(26.4px, calc(40.7 / 714 * 100vw), 40.7px));
    object-position: center center;
  }
  body.home-layout-ref .nav-tray__login--desktop {
    display: none;
  }
  body.home-layout-ref .nav-tray__login--mobile {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 68px;
    height: 28px;
    padding: 0 14px;
    border: 1px solid var(--zp-drawer-border);
    border-radius: 8px;
    background: #ffffff;
    font-family: var(--zp-font-ui);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: var(--zp-drawer-text);
    text-decoration: none;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
  }
  body.home-layout-ref .nav-tray__login--mobile:hover,
  body.home-layout-ref .nav-tray__login--mobile:focus-visible {
    background: var(--zp-drawer-hover);
    color: var(--zp-drawer-text);
    border-color: var(--zp-drawer-border);
  }

  body.home-layout-ref .nav-cta {
    min-height: clamp(38px, 10vw, 48px);
    padding: 6px clamp(8px, 2.5vw, 14px);
    font-size: clamp(10px, 2.8vw, 13px);
    max-width: min(calc(100vw - 96px), 220px);
  }
}

/*
 * ≤1319: меню только в нижнем таббаре.
 * Скрываем #navToggle / корзину / профиль сразу (не ждать body.has-zp-tabbar
 * и deferred zp-mobile-tabbar.css). Иначе .nav-tray { display:contents } +
 * inject .zp-cart-badge/.zp-nav-profile ломают grid на 2-ю строку при медленной сети.
 */
@media (max-width: 1319px) {
  body.home-layout-ref .nav-toggle,
  html.nav--compact body.home-layout-ref .nav-toggle,
  html.nav--measure body.home-layout-ref .nav-toggle,
  html.nav--compact body.home-layout-ref.has-zp-tabbar .nav-toggle {
    display: none !important;
  }

  /* Корзина и профиль — в таббаре; в шапке прячем до/без has-zp-tabbar */
  body.home-layout-ref .nav-tray > .zp-cart-badge,
  body.home-layout-ref .nav-tray > .zp-nav-profile,
  html.nav--compact body.home-layout-ref .nav-tray > .zp-cart-badge,
  html.nav--compact body.home-layout-ref .nav-tray > .zp-nav-profile,
  html.nav--measure body.home-layout-ref .nav-tray > .zp-cart-badge,
  html.nav--measure body.home-layout-ref .nav-tray > .zp-nav-profile {
    display: none !important;
  }

  body.home-layout-ref .nav,
  html.nav--compact body.home-layout-ref .nav {
    grid-template-columns: 1fr auto !important;
  }

  body.home-layout-ref .brand,
  html.nav--compact body.home-layout-ref .brand {
    grid-column: 1 !important;
    grid-row: 1;
    justify-self: start !important;
    min-width: 0;
  }

  body.home-layout-ref .brand-full-logo__img,
  html.nav--compact body.home-layout-ref .brand-full-logo__img {
    object-position: left center !important;
  }

  body.home-layout-ref .nav-tray__login--mobile,
  html.nav--compact body.home-layout-ref .nav-tray__login--mobile {
    grid-column: 2 !important;
    justify-self: end !important;
  }
}

@media (min-width: 1320px) and (max-width: 1599px) {
  body.home-layout-ref .nav {
    gap: clamp(8px, 1.2vw, 16px);
  }

  html:not(.nav--compact) body.home-layout-ref .nav-links a,
  html:not(.nav--compact) body.home-layout-ref .nav-links__mega-trigger {
    padding: 0 clamp(5px, 0.55vw, 10px);
  }

  html:not(.nav--compact) body.home-layout-ref .nav-tray {
    min-width: min(280px, 34vw);
    gap: 8px;
  }
}

/* --- Герой: фиолетовый модуль с большим радиусом (макет ПК) --- */
body.home-layout-ref #top.hero {
  background: #ffffff !important;
  background-image: none !important;
  min-height: auto;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: visible;
}

body.home-layout-ref:has(.home-first-module) #top.hero {
  padding-top: var(--zp-hero-under-header);
  box-sizing: border-box;
}

/* zerkalo-main.css: фиолетово-жёлтые блики у .hero — на главной не нужны */
body.home-layout-ref #top.hero::before,
body.home-layout-ref #top.hero::after {
  display: none !important;
  content: none !important;
}

/* 1-й модуль: герой + 6 направлений (как Figma 1-1903), без фиксации при скролле */
body.home-layout-ref .home-first-module {
  display: flex;
  width: 100%;
  max-width: var(--wrap);
  margin-top: 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
  padding: 0 0 40px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 24px;
  overflow: visible;
  position: static;
  transform: none;
  z-index: auto;
  box-sizing: border-box;
  background: #ffffff;
}

body.home-layout-ref .zp-hero-fixed-spacer {
  width: 100%;
  flex-shrink: 0;
  pointer-events: none;
}

@media (min-width: 1320px) {
  body.home-layout-ref .home-first-module {
    width: 100%;
    max-width: none;
    align-items: center;
  }

  body.home-layout-ref .zp-hero-fixed-spacer {
    display: none;
    height: 0;
  }

  body.home-layout-ref .home-first-module {
    position: static;
    transform: none;
    left: auto;
    top: auto;
    z-index: auto;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-wrap.wrap {
    display: flex;
    justify-content: center;
    width: 100%;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .zp-hero-fixed-spacer {
    display: none;
    height: 0;
  }

  body.home-layout-ref .home-first-module {
    position: static;
    transform: none;
    left: auto;
    top: auto;
    z-index: auto;
  }
}

body.home-layout-ref #top .zp-hero-wrap {
  width: 100%;
  overflow: visible;
}

body.home-layout-ref #top .zp-hero-wrap.wrap {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  body.home-layout-ref #top .zp-hero-panel {
    padding-left: 0;
    padding-right: 0;
  }
}

body.home-layout-ref #top .zp-hero-panel {
  --zp-hero-banner-ratio: 16 / 9;
  --zp-hero-panel-h: calc(100cqi * 9 / 16);
  --zp-hero-copy-top: 109px;
  --zp-hero-panel-pad-left: 70px;
  --zp-hero-panel-pad-x: 72px;
  --zp-hero-copy-inset-x: 70px;
  --zp-hero-copy-left: 0px;
  --zp-hero-copy-photo-gap: clamp(20px, 2.5vw, 40px);
  --zp-hero-copy-max-w: max(
    220px,
    calc(var(--zp-hero-photo-inset-x) - var(--zp-hero-copy-inset-x) - var(--zp-hero-copy-photo-gap))
  );
  --zp-hero-copy-text-gap: 16px;
  --zp-hero-copy-actions-gap: 56px;
  --zp-hero-photo-inset-x: 730px;
  --zp-hero-photo-inset-design: 730px;
  --zp-hero-photo-pad-v: 16px;
  --zp-hero-photo-radius: clamp(6px, 4.098cqi, 14px);
  --zp-hero-ui-scale: 1;
  --zp-hero-photo-fit-scale: 0.92;
  --zp-hero-photo-size-scale: 0.64;
  /* Эталон: 366×159×197 → 1440×547×680; масштаб фото на слайдах (−36% от эталона) */
  --zp-hero-photo-w: calc(clamp(159px, calc(159px + (100vw - 366px) * 388 / 1074), 547px) * var(--zp-hero-photo-size-scale));
  --zp-hero-photo-h: calc(clamp(197px, calc(197px + (100vw - 366px) * 483 / 1074), 680px) * var(--zp-hero-photo-size-scale));
  --zp-hero-slide1-photo-w: var(--zp-hero-photo-w);
  --zp-hero-slide1-photo-h: var(--zp-hero-photo-h);
  position: relative;
  isolation: isolate;
  border-radius: 40px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  background-color: #1a0a36;
  background-image: url("/images/zerkalo-proart/hero/zp-hero-panel-bg.jpg?v=2026-05-14.12");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 0;
  height: auto;
  padding: 0 var(--zp-hero-panel-pad-x, 72px) 0 var(--zp-hero-panel-pad-left, 70px);
  box-shadow: none;
  box-sizing: border-box;
}

@media (min-width: 1320px) {
  body.home-layout-ref:has(.home-first-module) {
    --zp-hero-header-gap: 0px;
    /* layout _1MrDST.PkeTrg: overlap −96px при 1648px */
    --zp-hero-pc-pillars-overlap: clamp(72px, calc(100vw * 96 / 1648), 96px);
    --zp-hero-pc-extra-bottom: var(--zp-hero-pc-pillars-overlap);
  }

  body.home-layout-ref #top.hero {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  body.home-layout-ref #top .zp-hero-wrap.wrap {
    width: 100%;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  body.home-layout-ref #top .zp-hero-panel {
    /* ПК: фиолетовая полоса на всю ширину viewport; контент слайда — в .hero-copy__top 1440 */
    --zp-hero-design-w: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    --zp-hero-design-h: calc(var(--zp-hero-design-w) * 487 / 1344);
    --zp-hero-banner-ratio: 1344 / 487;
    --zp-hero-ui-scale: 1;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    --zp-hero-copy-top: 109px;
    --zp-hero-panel-pad-left: 70px;
    --zp-hero-panel-pad-x: 72px;
    --zp-hero-copy-inset-x: var(--zp-hero-panel-pad-left);
    --zp-hero-copy-photo-gap: 40px;
    --zp-hero-photo-inset-x: var(--zp-hero-photo-inset-design, 730px);
    --zp-hero-photo-inset-design: 730px;
    --zp-hero-copy-text-gap: 16px;
    --zp-hero-copy-actions-gap: 56px;
    --zp-hero-photo-pad-v: 16px;
    --zp-hero-slide1-photo-w: var(--zp-hero-photo-w);
    --zp-hero-slide1-photo-h: var(--zp-hero-photo-h);
    --zp-hero-copy-max-w: max(220px, calc(730px - 70px - 40px));
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: var(--zp-hero-pc-extra-bottom);
    background: linear-gradient(180deg, #2a075b 0%, #580fc1 100%);
    overflow: hidden;
  }
}

/* SVG-волны отключены — линии уже в фоновой картинке */
body.home-layout-ref #top .zp-hero-panel__decor {
  display: none;
}

/* SVG-линии (полосы/glow) на слайдах героя отключены */
body.home-layout-ref #top .hero-copy__bg-decor,
body.home-layout-ref #top .hero-copy__bg-layer {
  display: none !important;
}

body.home-layout-ref #top .zp-hero-carousel::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

body.home-layout-ref #top .zp-hero-panel__waves {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 1;
}

/* Герой: 6 слайдов (текст + фото), точки по центру внизу панели (Figma CarouselMiscSlick) */
body.home-layout-ref #top .zp-hero-carousel {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  padding-bottom: 0;
  box-sizing: border-box;
  z-index: 1;
  touch-action: pan-y;
}

body.home-layout-ref #top .zp-hero-carousel__stage {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
  box-sizing: border-box;
  overflow: hidden;
}

body.home-layout-ref #top .zp-hero-slide {
  width: 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.5s var(--reveal-ease, ease),
    visibility 0.5s;
}

body.home-layout-ref #top .hero-static-photo {
  border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px));
  overflow: hidden;
}

body.home-layout-ref #top .hero-static-photo img,
body.home-layout-ref #top .zp-hero-slide1-banner-img {
  border-radius: inherit;
}

body.home-layout-ref #top .zp-hero-slide.is-active {
  position: relative;
  width: 100%;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 2;
  overflow: visible;
  transition:
    opacity 0.5s var(--reveal-ease, ease),
    visibility 0s linear 0s;
}

body.home-layout-ref #top .zp-hero-slide:not(.is-active) {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  z-index: 0;
  overflow: hidden;
  clip-path: inset(0);
  transform: translateY(-50%);
  transition:
    opacity 0.5s var(--reveal-ease, ease),
    visibility 0s linear 0.5s;
}

@media (prefers-reduced-motion: reduce) {
  body.home-layout-ref #top .zp-hero-slide {
    transition: none;
  }
}

body.home-layout-ref #top .zp-hero-carousel__controls {
  /* layout KyxKKv / _3JTf2G / _2anr5z */
  --zp-hero-ctrl-glass: rgba(255, 255, 255, 0.15);
  --zp-hero-dot-idle: rgba(255, 255, 255, 0.3);
  --zp-hero-dot-active-border: #6440bf;
  --zp-hero-dot-active-fill: #6440bf;
  --zp-hero-ctrl-arrow: 32px;
  --zp-hero-ctrl-arrow-icon: 20px;
  --zp-hero-ctrl-gap: 16px;
  --zp-hero-ctrl-h: 32px;
  --zp-hero-ctrl-pill-pad-y: 6px;
  --zp-hero-ctrl-pill-pad-x: 8px;
  --zp-hero-ctrl-dot-gap: 12px;
  --zp-hero-ctrl-dot: 16px;
  position: absolute;
  left: 50%;
  bottom: calc(28px * var(--zp-hero-ui-scale, 1));
  transform: translateX(-50%);
  z-index: 40;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: var(--zp-hero-ctrl-gap);
  width: auto;
  min-width: 0;
  max-width: calc(100% - 24px);
  height: var(--zp-hero-ctrl-h);
  margin: 0;
  padding: 0;
  pointer-events: none;
  box-sizing: border-box;
}

body.home-layout-ref #top .zp-hero-carousel__controls > * {
  pointer-events: auto;
  flex-shrink: 0;
}

body.home-layout-ref #top .zp-hero-carousel__arrow {
  display: inline-flex;
  flex: 0 0 var(--zp-hero-ctrl-arrow);
  align-items: center;
  justify-content: center;
  width: var(--zp-hero-ctrl-arrow);
  height: var(--zp-hero-ctrl-arrow);
  margin: 0;
  padding: 4px;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  color: #ffffff;
  background: var(--zp-hero-ctrl-glass);
  box-sizing: border-box;
  transition: background 0.2s ease;
}

body.home-layout-ref #top .zp-hero-carousel__arrow svg {
  display: block;
  width: var(--zp-hero-ctrl-arrow-icon);
  height: var(--zp-hero-ctrl-arrow-icon);
  flex-shrink: 0;
}

body.home-layout-ref #top .zp-hero-carousel__arrow:hover {
  background: rgba(255, 255, 255, 0.24);
}

body.home-layout-ref #top .zp-hero-carousel__arrow:focus-visible {
  outline: 2px solid rgba(233, 196, 106, 0.95);
  outline-offset: 2px;
}

/* layout KyxKKv: стрелки + таблетка с точками (6 слайдов) */
body.home-layout-ref #top .zp-hero-carousel__dots {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: var(--zp-hero-ctrl-dot-gap);
  width: auto;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: var(--zp-hero-ctrl-pill-pad-y) var(--zp-hero-ctrl-pill-pad-x);
  border: none;
  border-radius: 500px;
  background: var(--zp-hero-ctrl-glass);
  box-sizing: border-box;
}

body.home-layout-ref #top .zp-hero-carousel__dot {
  display: inline-flex;
  flex: 0 0 var(--zp-hero-ctrl-dot);
  align-items: center;
  justify-content: center;
  align-self: center;
  width: var(--zp-hero-ctrl-dot);
  height: var(--zp-hero-ctrl-dot);
  min-width: var(--zp-hero-ctrl-dot);
  min-height: var(--zp-hero-ctrl-dot);
  max-width: var(--zp-hero-ctrl-dot);
  max-height: var(--zp-hero-ctrl-dot);
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 500px;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background: #ffffff;
  opacity: 0.3;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  transition: opacity 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

body.home-layout-ref #top .zp-hero-carousel__dot.is-active {
  opacity: 1;
  border: 1px solid var(--zp-hero-dot-active-border);
  background: #ffffff;
}

body.home-layout-ref #top .zp-hero-carousel__dot.is-active::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--zp-hero-dot-active-fill);
  border-radius: inherit;
  transition: width 0.2s linear;
}

body.home-layout-ref #top .zp-hero-carousel__dot:focus-visible {
  outline: 2px solid rgba(233, 196, 106, 0.95);
  outline-offset: 2px;
}

body.home-layout-ref #top .hero-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  min-height: 0;
  box-sizing: border-box;
}

body.home-layout-ref #top.hero {
  --zp-hero-banner-max-w: 100%;
  --zp-hero-banner-max-h: none;
}

body.home-layout-ref #top .hero-copy__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: center;
  aspect-ratio: 16 / 9;
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  margin-inline: 0;
  margin-top: 0;
  padding: 0;
  overflow: visible;
  box-sizing: border-box;
}

body.home-layout-ref #top .hero-copy__intro {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 0;
  width: var(--zp-hero-copy-max-w, 640px);
  max-width: var(--zp-hero-copy-max-w, 640px);
  min-width: 0;
  min-height: 0;
  align-self: center;
  padding-top: 0;
  box-sizing: border-box;
  position: relative;
  z-index: 6;
  flex: 0 1 auto;
}

body.home-layout-ref #top .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
body.home-layout-ref #top .hero-copy__intro .lead,
body.home-layout-ref #top .hero-copy__intro [data-i18n='hero.lead'] {
  overflow-wrap: normal;
  word-wrap: normal;
  hyphens: manual;
  -webkit-hyphens: manual;
}

body.home-layout-ref #top .hero-copy__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--zp-hero-copy-text-gap, 16px);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
}

body.home-layout-ref #top .hero-copy__text h1, .hero-copy__text h2.hero-slide-title,
body.home-layout-ref #top .hero-copy__text p {
  margin: 0;
  max-width: 100%;
  white-space: normal;
  text-wrap: wrap;
}

body.home-layout-ref #top .hero-copy__text .hero-copy__micro {
  font-size: calc(17px * var(--zp-hero-ui-scale, 1)) !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  opacity: 0.94 !important;
}

/* layout bigCard / WfkaRpkU: Roboto 400, 24→32→40px, line-height 120%, слева. */
body.home-layout-ref #top .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
body.home-layout-ref #top .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
  font-family: 'Roboto', system-ui, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
  text-align: left;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: manual;
  -webkit-hyphens: manual;
}

@media (min-width: 768px) {
  body.home-layout-ref #top .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    font-size: 32px;
  }
}

body.home-layout-ref #top .hero-copy__cta {
  display: flex;
  flex-direction: column;
  gap: calc(16px * var(--zp-hero-ui-scale, 1));
}

/* ===== Слайд 1 «Подарок по фото» — базовые стили ===== */
body.home-layout-ref #top .hero-occasion-badge {
  display: none;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: auto;
  max-width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 8px 18px;
  box-sizing: border-box;
  border-radius: 999px;
  border: 1.5px solid #e6c866;
  background: rgba(35, 8, 90, 0.28);
  flex-shrink: 0;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge__icon {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  object-fit: contain;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge__text {
  font-family: var(--zp-font-ui);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 600;
  color: #e6c866;
}

body.home-layout-ref #top .hero-text-pills {
  display: none;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.home-layout-ref #top .hero-features-board {
  display: none;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pills {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1 {
  margin: 0;
  font-weight: 400;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__line {
  display: block;
  color: #fff;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__gold {
  display: block;
  color: #f5cc57;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__cta--gift {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__note--gift {
  margin: 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: 14px;
  line-height: 1.35;
  font-weight: 400;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions .btn.primary.hero-btn--gift {
  width: 65%;
  max-width: 65%;
  min-height: 52px;
  padding: 12px 24px;
  border: none;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffe992 0%, #f5c84a 52%, #e8b83a 100%);
  color: #261548;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions .btn.primary.hero-btn--gift:hover {
  filter: brightness(1.04);
  color: #261548;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill {
  display: flex;
  flex: 1 1 0;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  min-height: 52px;
  padding: 8px 10px;
  box-sizing: border-box;
  border-radius: 26px;
  border: 1.5px solid rgba(230, 200, 102, 0.75);
  background: rgba(35, 8, 90, 0.22);
  text-align: left;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill__icon {
  display: block;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  object-fit: contain;
}

body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill__label {
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 600;
  color: #ebe0ff;
  text-align: left;
}

@media (max-width: 1319px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pills {
    display: none;
  }
}

body.home-layout-ref #top .hero-copy__note {
  margin: 0;
  color: #d7a7ff;
  font-size: calc(16px * var(--zp-hero-ui-scale, 1));
  line-height: 1.625;
  font-weight: 700;
}

body.home-layout-ref #top .hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  max-width: 100%;
  min-width: 0;
}

/* До 1320px — белая оболочка модуля; holst-баннер cqi только ≤767px; планшет 768–1319 — отдельный блок ниже. */
@media (max-width: 1319px) {
  body.home-layout-ref #top.hero {
    --zp-hero-banner-max-w: 100%;
    --zp-hero-banner-max-h: none;
  }

  body.home-layout-ref #top .hero-copy__note {
    display: none;
  }

  body.home-layout-ref {
    --zp-site-header-gap: 8px;
    --zp-hero-peek-pad: clamp(8px, 2vw, 12px);
    --zp-hero-below-header-pad: calc(
      env(safe-area-inset-top, 0px) + var(--zp-fixed-header-h, 76px) + var(--zp-site-header-gap)
    );
    background: #ffffff;
  }

  body.home-layout-ref:has(.home-first-module) {
    --zp-site-header-gap: 0;
  }

  body.home-layout-ref .home-first-module {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: clamp(16px, 4vw, 28px);
    gap: clamp(10px, 2.5vw, 16px);
    position: relative;
    z-index: 0;
    isolation: isolate;
    background: #ffffff;
  }

  body.home-layout-ref #top.hero {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 0 !important;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow-x: clip;
    overflow-y: visible;
    position: relative;
    z-index: 1;
    background: #ffffff !important;
    background-image: none !important;
  }

  body.home-layout-ref:has(.home-first-module) #top.hero {
    padding-top: var(--zp-hero-under-header);
  }

  body.home-layout-ref #top .zp-hero-panel {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-radius: 0;
    min-height: 0 !important;
    height: auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    overflow: visible;
    box-shadow: none;
  }

  body.home-layout-ref #top .zp-hero-wrap.wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    overflow-x: clip;
  }

  body.home-layout-ref .home-first-module {
    max-width: 100%;
    width: 100%;
    min-width: 0;
    overflow-x: clip;
    gap: clamp(12px, 3.5vw, 20px);
  }

  body.home-layout-ref #top .zp-hero-carousel {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-top: 0;
    margin-bottom: 0;
    overflow-x: clip;
  }

  body.home-layout-ref #top .zp-hero-carousel__stage {
    order: 1;
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow-x: clip;
    overflow-y: visible;
    align-items: stretch;
    padding-top: 0;
    padding-inline: 0;
    box-sizing: border-box;
    touch-action: pan-y;
  }

  body.home-layout-ref #top .hero-copy {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
  }

  body.home-layout-ref #top .zp-hero-slide.is-active {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.is-active) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    transform: none;
  }

  /* ≤1319px: баннер 16:9, cqi от ширины контейнера */
  body.home-layout-ref #top .hero-copy__top {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    aspect-ratio: 16 / 9;
    height: auto;
    min-height: 0;
    max-height: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
    border-radius: clamp(14px, 4.76vw, 16px);
    background: #ffffff;
    box-sizing: border-box;
    touch-action: pan-y;
    container-type: inline-size;
    container-name: zp-holst-hero-banner;
    --zp-hero-photo-size-scale: 0.84;
    --zp-hero-m-title: 4.79cqi;
    --zp-hero-m-title-lh: 1.2;
    --zp-hero-m-lead: 2.732cqi;
    --zp-hero-m-lead-lh: 1;
    --zp-hero-m-btn-fs: 3.279cqi;
    --zp-hero-m-btn-lh: 1.2;
    --zp-hero-m-btn-pad-y: 1.366cqi;
    --zp-hero-m-btn-pad-x: 2.186cqi;
    --zp-hero-m-btn-r: 1.913cqi;
    --zp-hero-m-btn-min-h: 7.65cqi;
    --zp-hero-m-gap: 0;
    --zp-hero-m-copy-pad-x: 3.825cqi;
    --zp-hero-m-copy-w: 48.21cqi;
    --zp-hero-m-photo-right: 3.825cqi;
    --zp-hero-m-photo-ref: 176;
    --zp-hero-m-banner-ref: 360;
    --zp-hero-m-h1-top: calc(11.5 / 124 * 100%);
    --zp-hero-m-lead-top: calc(40 / 124 * 100%);
    --zp-hero-m-cta-top: calc(82 / 124 * 100%);
    --zp-hero-m-cta-left: 3.552cqi;
    --zp-hero-photo-radius: clamp(6px, 4.098cqi, 14px);
  }

  body.home-layout-ref #top .hero-copy__top::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1.613%;
    width: 100%;
    height: 98.387%;
    min-height: 0;
    max-height: none;
    border-radius: clamp(12px, 3.87vw, 13px);
    overflow: hidden;
    background: linear-gradient(180deg, #2a075b 0%, #580fc1 100%);
    z-index: 0;
    pointer-events: none;
  }

  body.home-layout-ref #top .hero-copy__top::after {
    content: none;
    display: none;
  }

  body.home-layout-ref #top .hero-copy__bg-decor {
    position: absolute;
    left: 0;
    top: 2px;
    width: 100%;
    height: calc(100% - 2px);
    border-radius: clamp(12px, 3.87vw, 13px);
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
  }

  body.home-layout-ref #top .hero-copy__bg-layer {
    position: absolute;
    display: block;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    pointer-events: none;
    object-fit: fill;
  }

  /* Figma 447:1131 glow right — размеры относительно .hero-copy__bg-decor, не px из SVG */
  body.home-layout-ref #top .hero-copy__bg-layer--glow-r {
    top: -20%;
    left: 48%;
    width: 79%;
    height: 82%;
    right: auto;
    bottom: auto;
    object-fit: fill;
  }

  /* Figma 447:1132 glow left */
  body.home-layout-ref #top .hero-copy__bg-layer--glow-l {
    top: -88%;
    left: -42%;
    width: 169%;
    height: 190%;
    right: auto;
    bottom: auto;
    object-fit: fill;
  }

  /* Figma 447:1133 stripes top */
  body.home-layout-ref #top .hero-copy__bg-layer--stripes-t {
    top: 0;
    left: -7%;
    width: 128%;
    height: 30%;
    right: auto;
    bottom: auto;
    object-fit: fill;
  }

  /* Figma 447:1134 stripes bottom (mirrored in Figma) */
  body.home-layout-ref #top .hero-copy__bg-layer--stripes-b {
    top: 66%;
    left: -6%;
    width: 147%;
    height: 35%;
    right: auto;
    bottom: auto;
    object-fit: fill;
    transform: scaleX(-1) rotate(180deg);
    transform-origin: center center;
  }

  /* Текст + CTA: как zp-service-hero__banner на usluga-holst (не stack-мобилка) */
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__intro {
    display: contents;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__text {
    display: contents;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    position: absolute;
    top: var(--zp-hero-m-h1-top);
    left: var(--zp-hero-m-copy-pad-x);
    width: var(--zp-hero-m-copy-w);
    max-width: var(--zp-hero-m-copy-w);
    max-height: none;
    margin: 0;
    padding: 0;
    z-index: 4;
    font-family: 'Roboto', system-ui, sans-serif;
    font-size: clamp(24px, var(--zp-hero-m-title), 32px);
    line-height: var(--zp-hero-m-title-lh);
    font-weight: 400;
    color: #ffffff !important;
    text-align: left !important;
    text-wrap: wrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
    -webkit-hyphens: manual;
    display: block;
    overflow: visible;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__intro [data-i18n='hero.lead'],
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__text .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__text [data-i18n='hero.lead'],
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__text p {
    position: absolute;
    top: var(--zp-hero-m-lead-top);
    left: var(--zp-hero-m-copy-pad-x);
    width: var(--zp-hero-m-copy-w);
    max-width: var(--zp-hero-m-copy-w);
    max-height: none;
    margin: 0;
    padding: 0;
    z-index: 4;
    font-family: var(--zp-font-ui);
    font-size: var(--zp-hero-m-lead);
    line-height: var(--zp-hero-m-lead-lh);
    font-weight: 700;
    color: #ffffff !important;
    opacity: 1;
    text-align: left !important;
    text-wrap: balance;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    display: block;
    overflow: visible;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-actions {
    position: absolute;
    top: var(--zp-hero-m-cta-top);
    left: var(--zp-hero-m-cta-left);
    right: auto;
    bottom: auto;
    margin: 0;
    padding: 0;
    z-index: 5;
    width: auto;
    max-width: none;
    height: auto;
    transform: none;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-actions a.btn.primary:not(.hero-btn--gift) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    max-width: none;
    min-height: 46px !important;
    height: auto !important;
    padding: 12px 20px !important;
    border-radius: var(--zp-hero-cta-radius, 12px) !important;
    font-family: var(--zp-hero-cta-font) !important;
    font-size: clamp(14px, var(--zp-hero-m-btn-fs, 3.279cqi), 16px) !important;
    line-height: 20px !important;
    font-weight: var(--zp-hero-cta-fw, 500) !important;
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    box-shadow: none !important;
    white-space: nowrap;
    box-sizing: border-box;
    margin: 0;
    letter-spacing: 0;
    border: 0;
  }

  body.home-layout-ref #top .hero-btn__label--short {
    display: inline;
  }

  body.home-layout-ref #top .hero-btn__label--full {
    display: none !important;
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    pointer-events: none;
  }

  /* Фото: как zp-service-hero__photo на usluga-holst */
  body.home-layout-ref #top .hero-quick-gallery {
    --zp-hero-m-text-end: calc(var(--zp-hero-m-copy-pad-x) + var(--zp-hero-m-copy-w) + 2cqi);
    position: absolute;
    top: 50%;
    left: auto;
    right: var(--zp-hero-m-photo-right);
    bottom: auto;
    width: min(
      calc(var(--zp-hero-m-photo-ref) / var(--zp-hero-m-banner-ref) * 100cqi * var(--zp-hero-photo-size-scale, 0.84)),
      calc(100cqi - var(--zp-hero-m-text-end) - var(--zp-hero-m-photo-right))
    );
    height: auto;
    aspect-ratio: 1 / 1;
    min-width: 0;
    min-height: 0;
    max-width: calc((100cqi - var(--zp-hero-m-text-end) - var(--zp-hero-m-photo-right)) * var(--zp-hero-photo-size-scale, 0.84));
    max-height: none;
    margin: 0;
    z-index: 3;
    pointer-events: none;
    perspective: none;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transform: translateY(-50%);
    max-height: 94%;
  }

  body.home-layout-ref #top .hero-static-photo {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    min-height: 0;
    max-width: 100%;
    max-height: none;
    margin: 0;
    flex: 0 0 auto;
    transform: none;
    transform-origin: center center;
    filter: none;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px));
    overflow: hidden;
  }

  body.home-layout-ref #top .hero-static-photo img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center center;
    border-radius: inherit;
    filter: drop-shadow(-6.831cqi 2.732cqi 8.197cqi rgba(0, 0, 0, 0.35));
  }

  /* Слайд 1: PNG с прозрачностью, без зеркала */
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    overflow: hidden;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-static-photo {
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    background: transparent !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: hidden;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-static-photo img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    min-height: 0;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover;
    object-position: center center;
    background: transparent !important;
    transform: none;
    border-radius: inherit;
    filter: drop-shadow(-6.831cqi 2.732cqi 8.197cqi rgba(0, 0, 0, 0.35));
  }

  /* Мобильная база 360px: у слайдов разные размеры фото (как в макете), без потери адаптива. */
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__top {
    --zp-hero-m-photo-ref: 188;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__top {
    --zp-hero-m-photo-ref: 176;
    --zp-hero-m-lead: calc(2.732cqi * 0.9);
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-copy__top {
    --zp-hero-m-photo-ref: 184;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-copy__top {
    --zp-hero-m-photo-ref: 168;
    overflow: hidden;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-quick-gallery {
    max-height: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo img {
    aspect-ratio: 4 / 3 !important;
    max-height: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-copy__top {
    --zp-hero-m-photo-ref: 170;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__top {
    --zp-hero-m-photo-ref: 156;
    --zp-hero-m-lead: calc(2.732cqi * 0.9);
  }

  body.home-layout-ref #top .zp-hero-carousel__stage {
    padding-top: 0;
    margin-top: 0;
  }

  /* Слайд 1-баннер: фото на всю высоту модуля, вплотную к правому краю */
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__top {
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-quick-gallery {
    --zp-hero-photo-inset-y: 0;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: auto !important;
    width: auto !important;
    height: 100% !important;
    max-width: min(58cqi, 64%) !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide--banner-img .zp-hero-slide1-banner-img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: right center !important;
    border-radius: 0 !important;
  }

  /* Пагинация: tablet — как ПК (28px от низа карусели; overlap в padding-bottom panel) */
  @media (min-width: 768px) and (max-width: 1319px) {
    body.home-layout-ref #top .zp-hero-carousel__controls {
      bottom: clamp(16px, 2.6vw, 28px) !important;
      z-index: 30 !important;
      --zp-hero-ctrl-arrow: 32px;
      --zp-hero-ctrl-arrow-icon: 20px;
      --zp-hero-ctrl-gap: 16px;
      --zp-hero-ctrl-h: 32px;
      --zp-hero-ctrl-pill-pad-y: 6px;
      --zp-hero-ctrl-pill-pad-x: 8px;
      --zp-hero-ctrl-dot-gap: 12px;
      --zp-hero-ctrl-dot: 16px;
    }
  }
}

@media (max-width: 767px) {
  body.home-layout-ref #top .zp-hero-carousel {
    --zp-hero-m-module-h: 636px;
    --zp-hero-m-pad-x: 16px;
    --zp-hero-m-stack-gap: 12px;
    --zp-hero-m-text-gap: 8px;
    --zp-hero-m-pillars-overlap: 36px;
    --zp-hero-m-controls-lift: 0px;
    --zp-hero-m-controls-space: calc(var(--zp-hero-m-pillars-overlap) + 32px);
    --zp-hero-m-title-fs: clamp(22px, 6.4vw, 28px);
    --zp-hero-m-lead-fs: clamp(15px, 4.1vw, 17px);
    --zp-hero-m-photo-ratio: 4 / 3;
    --zp-hero-m-photo-controls-gap: 8px;
    --zp-hero-usib-brand: #6440bf;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    height: var(--zp-hero-m-module-h);
    min-height: var(--zp-hero-m-module-h);
    max-height: var(--zp-hero-m-module-h);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background: linear-gradient(180deg, #2a075b 0%, #580fc1 100%);
    border-radius: 0;
    overflow: hidden;
    isolation: isolate;
    z-index: 2;
  }

  body.home-layout-ref #top .zp-hero-carousel .hero-copy__top::before,
  body.home-layout-ref #top .zp-hero-carousel .hero-copy__top::after {
    display: none !important;
    content: none !important;
  }

  body.home-layout-ref #top .zp-hero-carousel::before {
    content: "";
    position: absolute;
    left: -6%;
    bottom: 0;
    width: 147%;
    height: 35%;
    max-height: 185px;
    background: url("/images/zerkalo-proart/hero/mobile-banner/hero-m-stripes-bottom.svg?v=2026-05-28")
      no-repeat center bottom / 100% 100%;
    transform: scaleX(-1);
    transform-origin: center bottom;
    pointer-events: none;
    z-index: 0;
  }

  body.home-layout-ref #top .zp-hero-carousel__stage {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(var(--zp-hero-m-module-h) - var(--zp-hero-m-controls-space)) !important;
    margin-top: 0 !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: transparent;
  }

  body.home-layout-ref #top .zp-hero-carousel__controls {
    position: absolute;
    left: 50%;
    top: auto !important;
    /* layout KyxKKv: bottom calc(36px + 16px) над overlap pillars */
    bottom: calc(var(--zp-hero-m-pillars-overlap, 36px) + 16px) !important;
    transform: translateX(-50%);
    z-index: 30 !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 24px) !important;
    height: 32px !important;
    gap: 16px !important;
    --zp-hero-ctrl-glass: rgba(255, 255, 255, 0.15);
    --zp-hero-ctrl-arrow: 32px;
    --zp-hero-ctrl-arrow-icon: 20px;
    --zp-hero-ctrl-gap: 16px;
    --zp-hero-ctrl-h: 32px;
    --zp-hero-ctrl-pill-pad-y: 6px;
    --zp-hero-ctrl-pill-pad-x: 8px;
    --zp-hero-ctrl-dot-gap: 12px;
    --zp-hero-ctrl-dot: 16px;
    pointer-events: none;
  }

  body.home-layout-ref #top .zp-hero-carousel__arrow {
    width: var(--zp-hero-ctrl-arrow, 32px) !important;
    height: var(--zp-hero-ctrl-arrow, 32px) !important;
    flex: 0 0 var(--zp-hero-ctrl-arrow, 32px) !important;
    padding: 4px !important;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.15) !important;
  }

  body.home-layout-ref #top .zp-hero-carousel__arrow svg {
    width: var(--zp-hero-ctrl-arrow-icon, 20px) !important;
    height: var(--zp-hero-ctrl-arrow-icon, 20px) !important;
  }

  body.home-layout-ref #top .zp-hero-carousel__dots {
    height: auto !important;
    padding: var(--zp-hero-ctrl-pill-pad-y, 6px) var(--zp-hero-ctrl-pill-pad-x, 8px) !important;
    border-radius: 500px !important;
    background: rgba(255, 255, 255, 0.15) !important;
    gap: var(--zp-hero-ctrl-dot-gap, 12px) !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-carousel__dot {
    width: var(--zp-hero-ctrl-dot, 16px) !important;
    height: var(--zp-hero-ctrl-dot, 16px) !important;
    min-width: var(--zp-hero-ctrl-dot, 16px) !important;
    min-height: var(--zp-hero-ctrl-dot, 16px) !important;
    max-width: var(--zp-hero-ctrl-dot, 16px) !important;
    max-height: var(--zp-hero-ctrl-dot, 16px) !important;
    flex: 0 0 var(--zp-hero-ctrl-dot, 16px) !important;
    background: #ffffff !important;
    opacity: 0.3;
  }

  body.home-layout-ref #top .zp-hero-carousel__dot.is-active {
    opacity: 1 !important;
    border: 1px solid #6440bf !important;
    background: #ffffff !important;
  }

  body.home-layout-ref #top .zp-hero-carousel__dot.is-active::after {
    display: block !important;
    width: 100% !important;
    background: #6440bf !important;
  }

  body.home-layout-ref #top .zp-hero-carousel__arrow:hover {
    background: rgba(255, 255, 255, 0.24) !important;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-carousel__controls {
    bottom: calc(28px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-arrow: calc(32px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-arrow-icon: calc(20px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-gap: calc(16px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-h: calc(32px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-pill-pad-y: calc(6px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-pill-pad-x: calc(8px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-dot-gap: calc(12px * var(--zp-hero-ui-scale, 1));
    --zp-hero-ctrl-dot: calc(16px * var(--zp-hero-ui-scale, 1));
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .hero-btn__label--short {
    display: none;
  }

  body.home-layout-ref #top .hero-btn__label--full {
    display: inline;
  }

  body.home-layout-ref #top .hero-copy__bg-decor {
    display: none;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    font-family: 'Roboto', system-ui, sans-serif;
    font-size: calc(46px * var(--zp-hero-ui-scale, 1));
    line-height: 1.2;
    color: #ffffff !important;
    font-weight: 400;
    margin: 0;
    text-align: left;
    text-wrap: wrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }

  body.home-layout-ref #top .hero-copy__intro .lead,
  body.home-layout-ref #top .hero-copy__intro [data-i18n='hero.lead'],
  body.home-layout-ref #top .hero-copy__intro p,
  body.home-layout-ref #top .hero-copy__text .lead,
  body.home-layout-ref #top .hero-copy__text [data-i18n='hero.lead'],
  body.home-layout-ref #top .hero-copy__text p {
    font-size: calc(22px * var(--zp-hero-ui-scale, 1));
    font-weight: 400;
    line-height: 1.35;
    color: #ffffff !important;
    opacity: 1;
    margin: 0;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__text p {
    font-size: calc(20px * var(--zp-hero-ui-scale, 1));
  }

  body.home-layout-ref #top .hero-actions {
    margin-top: 0;
  }

  body.home-layout-ref #top .hero-copy__intro {
    gap: var(--zp-hero-copy-actions-gap, 56px);
  }

  body.home-layout-ref #top .hero-actions .btn.primary {
    max-width: 100%;
    font-size: calc(18px * var(--zp-hero-ui-scale, 1));
    line-height: 1.22;
    padding: calc(8px * var(--zp-hero-ui-scale, 1)) calc(36px * var(--zp-hero-ui-scale, 1));
    min-height: calc(60px * var(--zp-hero-ui-scale, 1));
    white-space: normal;
    text-wrap: balance;
    border-radius: calc(15px * var(--zp-hero-ui-scale, 1));
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-carousel__stage {
    padding-top: 0;
  }

  body.home-layout-ref #top .hero-quick-gallery {
    perspective: calc(1400px * var(--zp-hero-ui-scale, 1));
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    overflow: visible;
    width: auto;
    max-width: calc(100cqi - var(--zp-hero-photo-inset-x, 730px) - var(--zp-hero-panel-pad-x, 72px));
    position: absolute;
    left: var(--zp-hero-photo-inset-x, 730px);
    top: 0;
    bottom: 0;
    transform: none;
    z-index: 5;
    align-self: auto;
    justify-self: auto;
    margin: 0;
  }

  body.home-layout-ref #top .hero-static-photo {
    margin: 0;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    flex-shrink: 1;
    min-width: 0;
    min-height: 0;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px));
    overflow: visible;
    transform-origin: left center;
    transform: none;
    border: 0;
    outline: none;
    box-shadow: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background: transparent;
  }

  body.home-layout-ref #top .hero-static-photo img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(
      calc(var(--zp-hero-photo-w) * var(--zp-hero-photo-fit-scale, 0.92)),
      calc(100cqi - var(--zp-hero-photo-inset-x, 730px) - var(--zp-hero-panel-pad-x, 72px))
    );
    max-height: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * var(--zp-hero-photo-fit-scale, 0.92));
    object-fit: contain;
    object-position: center center;
    border-radius: inherit;
    border: 0;
    outline: none;
    box-shadow: none;
    background: transparent;
  }

  body.home-layout-ref #top .zp-hero-slide.is-active .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide.is-active .hero-static-photo {
    overflow: visible;
    z-index: 12;
  }

  /* Слайд 1: левый край img = 730px от левого края панели */
  body.home-layout-ref #top .zp-hero-slide.is-active {
    position: relative;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    left: var(--zp-hero-photo-inset-x, 730px);
    max-width: none;
    width: auto;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo {
    max-height: none;
    flex-shrink: 0;
    transform: none !important;
    transform-origin: center center;
    background: transparent !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo img {
    width: auto;
    height: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344));
    max-width: min(520px, calc(100cqi - var(--zp-hero-photo-inset-x, 730px) - 48px));
    max-height: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344));
    object-fit: contain;
    object-position: left center;
    transform: none;
    filter: drop-shadow(-8px 4px 16px rgba(0, 0, 0, 0.35));
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .hero-copy {
    justify-content: center;
  }

  body.home-layout-ref #top .hero-actions .btn.secondary {
    border: 1px solid rgba(255, 255, 255, 0.38);
    color: #fff !important;
    background: rgba(255, 255, 255, 0.1);
  }

  body.home-layout-ref #top .hero-actions .btn.secondary:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.52);
  }

  body.home-layout-ref #top .hero-copy__intro {
    transform: none;
    align-self: center;
    padding-top: 0;
    padding-left: var(--zp-hero-panel-pad-left, 70px);
    padding-right: var(--zp-hero-panel-pad-x, 72px);
    gap: var(--zp-hero-copy-actions-gap, 56px);
  }

  body.home-layout-ref #top .hero-copy__top {
    container-type: inline-size;
    container-name: zp-hero-panel;
    --zp-hero-panel-h: calc(100cqi * 487 / 1344);
    aspect-ratio: 1344 / 487;
    width: 100%;
    max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    height: auto;
    min-height: 0;
    max-height: none;
    margin-inline: auto;
    flex: 0 1 auto;
    align-items: center;
    padding-left: 0;
    position: relative;
    overflow: visible;
  }

  body.home-layout-ref #top .hero-copy__bg-decor {
    display: none !important;
  }

  body.home-layout-ref #top .hero-quick-gallery {
    position: absolute;
    /* левый край img = 730px от левого края .zp-hero-panel (× scale) */
    left: var(--zp-hero-photo-inset-x, 730px);
    top: 0;
    bottom: 0;
    height: 100%;
    align-items: center;
    justify-content: flex-start;
    width: auto;
    max-width: calc(100cqi - var(--zp-hero-photo-inset-x, 730px) - var(--zp-hero-panel-pad-x, 72px));
    margin: 0;
    transform: none;
    overflow: visible;
  }

  body.home-layout-ref #top .hero-static-photo {
    width: auto;
    max-height: 100%;
    justify-content: flex-start;
  }

  /* Hero CTA — масштаб от эталона 1440; цвет layout _2zPZiS */
  body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift) {
    border-radius: var(--zp-hero-cta-radius, 12px);
    padding: 12px calc(24px * var(--zp-hero-ui-scale, 1));
    min-height: calc(56px * var(--zp-hero-ui-scale, 1));
    min-width: 224px;
    font-size: calc(16px * var(--zp-hero-ui-scale, 1));
    line-height: 1.25;
    font-weight: var(--zp-hero-cta-fw, 500);
    font-family: var(--zp-hero-cta-font);
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    box-shadow: none;
    white-space: nowrap;
    text-wrap: nowrap;
  }

  body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift):hover {
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    filter: brightness(0.97);
    box-shadow: none;
  }
}

@media (min-width: 1320px) {
  /* layout #main-slider + #products-menu: pillars наезжают на нижнюю полосу героя */
  body.home-layout-ref .home-first-module {
    gap: 0;
  }

  body.home-layout-ref #top.hero {
    position: relative;
    z-index: 1;
  }

  body.home-layout-ref .home-first-module .zp-pillars__title {
    font-size: 28px;
    line-height: 28px;
    font-weight: 700;
  }

  body.home-layout-ref .section--contacts-cta .final-cta {
    border-radius: 40px;
    min-height: 261px;
    padding: 24px 32px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  body.home-layout-ref .section--contacts-cta .final-cta > h3 {
    font-size: 24px;
    line-height: 28px;
    font-weight: 700;
  }

  body.home-layout-ref .section--contacts-cta .contacts-subtitle {
    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
    margin-top: 8px;
  }

  body.home-layout-ref .section--contacts-cta .drawer__social-link {
    min-width: 80px;
  }

  body.home-layout-ref .section--contacts-cta .drawer__social-link img {
    width: 80px;
    height: 80px;
  }
}



body.home-layout-ref #top .quick-gallery__shell {
  transform: rotateY(-9deg) rotateX(3deg);
  transform-origin: center center;
  transition: transform 0.35s ease;
}

@media (max-width: 767px) {
  body.home-layout-ref #top .quick-gallery__shell {
    transform: none;
  }
}

body.home-layout-ref #top .quick-slide__media {
  border-radius: 14px;
  overflow: hidden;
  box-shadow:
    0 28px 50px rgba(0, 0, 0, 0.35),
    0 4px 0 rgba(255, 255, 255, 0.06) inset;
}

body.home-layout-ref #top .quick-slide__media img {
  display: block;
  width: 100%;
  height: 380px;
  object-fit: cover;
  border-radius: inherit;
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .quick-gallery__arrow {
    display: none !important;
  }
}

/* Figma CarouselMiscSlick: полоски px-2 / px-3, gap 1.5 (6px), radius 1px */
body.home-layout-ref #top .quick-gallery {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

body.home-layout-ref #top .quick-gallery__dots:not(.zp-hero-carousel__dots),
body.home-layout-ref #top .carousel-pagination:not(.zp-hero-carousel__dots) {
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  gap: 6px;
  margin-top: 0;
  flex-wrap: nowrap;
  padding: 0;
}

body.home-layout-ref #top .quick-gallery__dot:not(.zp-hero-carousel__dot) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  padding: 1.5px 8px;
  margin: 0;
  border: none;
  border-radius: 1px;
  cursor: pointer;
  background: #ffffff;
  width: auto;
  height: 3px;
  min-width: 0;
  transition:
    padding 0.25s ease,
    background 0.25s ease;
  font-size: 0;
  line-height: 0;
}

body.home-layout-ref #top .quick-gallery__dot:not(.zp-hero-carousel__dot)::before {
  content: '';
  display: block;
  width: 0;
  height: 0;
}

body.home-layout-ref #top .quick-gallery__dot:not(.zp-hero-carousel__dot).is-active {
  padding: 1.5px 12px;
  background: #8c8c8c;
}

body.home-layout-ref #top .quick-gallery__dot:not(.zp-hero-carousel__dot):focus-visible {
  outline: 2px solid rgba(233, 196, 106, 0.95);
  outline-offset: 3px;
}

body.home-layout-ref #top .quick-gallery[hidden] {
  display: none !important;
}

body.home-layout-ref #top .hero-actions .btn.secondary {
  display: none !important;
}

@media (min-width: 1320px) {
  body.home-layout-ref #top .hero-actions .btn.primary {
    margin-top: 0;
  }
}

body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift):hover,
body.home-layout-ref #top .hero-actions a.btn.primary:not(.hero-btn--gift):hover {
  background: var(--zp-hero-cta-bg, #ffffff) !important;
  background-image: none !important;
  color: var(--zp-hero-cta-color, #6440bf) !important;
  filter: brightness(0.97);
  box-shadow: none !important;
}

body.home-layout-ref #top .btn.primary:hover:not(.hero-btn--gift) {
  background: linear-gradient(90deg, #f0cf7a 0%, #f7ae72 100%);
}

body.home-layout-ref .zp-pillars__title {
  color: var(--zp-nav-text);
}

body.home-layout-ref .home-first-module .zp-pillars {
  width: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  background: #fff;
}

body.home-layout-ref .home-first-module .zp-pillars > .wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
  margin: 12px auto 0;
  padding: 0;
  box-sizing: border-box;
}

/* --- Блок 6 направлений --- */
body.home-layout-ref .home-first-module .zp-pillars {
  background: #fff;
}

@media (min-width: 1320px) {
  /* layout #main-slider + #products-menu: pillars наезжают на нижнюю полосу героя */
  body.home-layout-ref .home-first-module .zp-pillars {
    position: relative;
    z-index: 2;
    width: 100vw;
    max-width: 100vw;
    margin-top: calc(-1 * var(--zp-hero-pc-pillars-overlap, 84px));
    margin-right: calc(50% - 50vw);
    margin-bottom: 0;
    margin-left: calc(50% - 50vw);
    border-radius: 60px 60px 28px 28px;
    overflow: hidden;
    isolation: isolate;
  }

  body.home-layout-ref .home-first-module .zp-pillars > .wrap {
    margin-top: 0;
    padding-top: 32px;
  }
}

/* Планшет 768–1319: герой + pillars — тот же характер, что на ПК (≥1320) */
@media (min-width: 768px) and (max-width: 1319px) {
  body.home-layout-ref:has(.home-first-module) {
    --zp-hero-pc-pillars-overlap: clamp(72px, calc(100vw * 96 / 1648), 96px);
    --zp-hero-pc-extra-bottom: var(--zp-hero-pc-pillars-overlap);
  }

  body.home-layout-ref .home-first-module {
    gap: 0;
    /* без overflow-x: clip — иначе срезается наезд pillars с border-radius */
  }

  body.home-layout-ref #top.hero {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: transparent !important;
    background-image: none !important;
    overflow-x: clip;
  }

  body.home-layout-ref #top .zp-hero-wrap.wrap {
    width: 100%;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  body.home-layout-ref #top .zp-hero-panel {
    width: 100%;
    max-width: none;
    min-height: 0 !important;
    height: auto;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: var(--zp-hero-pc-extra-bottom, var(--zp-hero-pc-pillars-overlap, 72px));
    background: linear-gradient(180deg, #2a075b 0%, #580fc1 100%) !important;
    background-color: transparent !important;
    background-image: linear-gradient(180deg, #2a075b 0%, #580fc1 100%) !important;
    overflow: hidden;
    box-shadow: none;
  }

  /* ПК: без скругления карточки — full-bleed градиент на panel */
  body.home-layout-ref #top .hero-copy__top {
    aspect-ratio: 1344 / 487;
    width: 100%;
    max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    height: auto;
    min-height: 0;
    max-height: none;
    margin-inline: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
    container-type: inline-size;
    container-name: zp-hero-banner;
  }

  body.home-layout-ref #top .hero-copy__top::before {
    content: none;
    display: none;
  }

  body.home-layout-ref #top .hero-copy__bg-decor {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
  }

  body.home-layout-ref .home-first-module .zp-pillars {
    position: relative;
    z-index: 2;
    width: 100vw;
    max-width: 100vw;
    margin-top: calc(-1 * var(--zp-hero-pc-pillars-overlap, 84px));
    margin-right: calc(50% - 50vw);
    margin-bottom: 0;
    margin-left: calc(50% - 50vw);
    border-radius: 60px 60px 28px 28px;
    overflow: hidden;
    isolation: isolate;
    background: #fff;
  }

  body.home-layout-ref .home-first-module .zp-pillars > .wrap {
    margin-top: 0;
    padding-top: 32px;
  }
}

body.home-layout-ref .home-first-module .zp-pillars__head {
  text-align: center;
  width: 100%;
  max-width: 40rem;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body.home-layout-ref .home-first-module .zp-pillars__head .zp-pillars__title {
  text-align: center;
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 4vw, 28px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0 0 0.5rem;
  max-width: 100%;
  padding: 0;
  box-sizing: border-box;
  color: var(--zp-figma-text);
  white-space: normal;
}

body.home-layout-ref .home-first-module .zp-pillars__lead {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(14px, 2vw, 16px);
  line-height: 1.5;
  font-weight: 400;
  color: var(--muted, #4f4763);
}

/* Переключатель — референс #products-menu: фиолетовая pill / прозрачная + фиолетовый текст */
body.home-layout-ref .home-first-module .zp-pillars__segment {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

body.home-layout-ref .home-first-module .zp-pillars__segment-track {
  position: relative;
  display: flex;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 0;
  padding: 8px;
  border-radius: 500px;
  background-color: #f6f4fb;
  border: 0;
  box-sizing: border-box;
}

body.home-layout-ref .home-first-module .zp-pillars__segment-pill {
  display: none;
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  margin: 0;
  padding: 12px 16px;
  height: auto;
  min-height: 0;
  border: 0;
  border-radius: 500px;
  background: transparent;
  background-color: transparent;
  cursor: pointer;
  font-family: 'Roboto', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: var(--zp-segment-accent);
  text-align: center;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  transition: color 0.22s ease, background-color 0.22s ease;
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab.is-active {
  color: #ffffff;
  font-weight: 700;
  background: var(--zp-segment-accent);
  background-color: var(--zp-segment-accent);
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab:not(.is-active):hover {
  color: var(--zp-segment-accent-hover);
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab:not(.is-active) {
  color: var(--zp-segment-accent);
  background-color: transparent;
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab.is-active:hover {
  background-color: var(--zp-segment-accent-hover);
}

body.home-layout-ref .home-first-module .zp-pillars__segment-tab:focus-visible {
  outline: 2px solid rgba(136, 108, 206, 0.55);
  outline-offset: 2px;
}

body.home-layout-ref .home-first-module .zp-pillars__panels {
  width: 100%;
  container-type: inline-size;
  container-name: zp-pillars-panels;
}

body.home-layout-ref .home-first-module .zp-pillars__panel[hidden] {
  display: none !important;
}

/* ПК: заголовок слева, переключатель справа в одной строке */
@media (min-width: 1320px) {
  body.home-layout-ref .home-first-module .zp-pillars > .wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 20px 32px;
    padding-top: 32px;
  }

  body.home-layout-ref .home-first-module .zp-pillars__head {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    text-align: left;
    max-width: none;
  }

  body.home-layout-ref .home-first-module .zp-pillars__head .zp-pillars__title {
    text-align: left;
  }

  body.home-layout-ref .home-first-module .zp-pillars__lead {
    text-align: left;
    max-width: 36rem;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    justify-content: flex-end;
    width: auto;
    min-width: min(100%, 420px);
    flex-shrink: 0;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment-track {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment-tab {
    flex: 1 1 0;
    min-width: 0;
  }

  body.home-layout-ref .home-first-module .zp-pillars__panels {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
  }
}

body.home-layout-ref .home-first-module .zp-pillars__grid {
  --zp-pillar-card-w: 222px;
  --zp-pillar-card-h: 121px;
  --zp-pillar-img-w: 104px;
  --zp-pillar-img-h: 100px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px 8px;
  align-items: stretch;
  width: 100%;
  max-width: min(100%, calc(6 * var(--zp-pillar-card-w) + 5 * 8px));
  margin: 0 auto;
  box-sizing: border-box;
}

/* Панель "Печать по фото": 7 карточек в ряд */
body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px 10px;
  max-width: 100%;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__label {
  font-size: 16px;
  line-height: 21px;
  padding-bottom: 10px;
}

/* Панель "Фотообработка": тот же габарит сетки */
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px 10px;
  max-width: 100%;
  overflow: visible;
  padding-bottom: 0;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__label {
  font-size: 16px;
  line-height: 21px;
  padding-bottom: 10px;
}

@container zp-pillars-panels (max-width: 1199px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@container zp-pillars-panels (max-width: 620px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container zp-pillars-panels (max-width: 366px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 1399px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 1199px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 366px) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 6 в ряд только если помещаются карточки 222px; иначе ровные 3×2, 2×3, 1×6 */
@container zp-pillars-panels (max-width: 1599px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 100%;
  }
}

@container zp-pillars-panels (max-width: 620px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container zp-pillars-panels (max-width: 366px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: var(--zp-pillar-card-w);
  }
}

/* Fallback без container queries */
@media (max-width: 1599px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 100%;
  }
}

@media (max-width: 620px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 366px) {
  body.home-layout-ref .home-first-module .zp-pillars__grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: var(--zp-pillar-card-w);
  }
}

@container zp-pillars-panels (max-width: 1599px) {
  body.home-layout-ref .zp-pillars .zp-pillar {
    width: 100%;
    max-width: none;
    height: auto;
    min-height: var(--zp-pillar-card-h);
    margin: 0;
  }

  body.home-layout-ref .zp-pillars .zp-pillar--tall {
    height: auto;
    min-height: var(--zp-pillar-card-h);
  }

  body.home-layout-ref .zp-pillars .zp-pillar__label {
    font-size: clamp(13px, 3.4vw, 16px);
    line-height: 21px;
    padding-bottom: clamp(4px, 1.2vw, 8px);
  }
}

@media (max-width: 1599px) {
  body.home-layout-ref .zp-pillars .zp-pillar {
    width: 100%;
    max-width: none;
    height: auto;
    min-height: var(--zp-pillar-card-h);
    margin: 0;
  }

  body.home-layout-ref .zp-pillars .zp-pillar--tall {
    height: auto;
    min-height: var(--zp-pillar-card-h);
  }

  body.home-layout-ref .zp-pillars .zp-pillar__label {
    font-size: clamp(13px, 3.4vw, 16px);
    line-height: 21px;
    padding-bottom: clamp(4px, 1.2vw, 8px);
  }
}

/* Карточки направлений — как layout #products-menu (222×121 min, img contain, фон #f0f2f5) */
body.home-layout-ref .zp-pillars .zp-pillar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: var(--zp-pillar-card-h);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 16px;
  background: var(--zp-segment-track, #f0f2f5);
  text-align: center;
  text-decoration: none;
  color: inherit;
  box-sizing: border-box;
  overflow: hidden;
  transition: background-color 0.18s ease, box-shadow 0.18s ease;
}

body.home-layout-ref .zp-pillars .zp-pillar--tall {
  min-height: var(--zp-pillar-card-h);
  height: auto;
}

body.home-layout-ref .zp-pillars .zp-pillar:hover {
  background: #e8eaee;
  transform: none;
  box-shadow: 0 2px 8px rgba(28, 31, 35, 0.06);
}

body.home-layout-ref .zp-pillars .zp-pillar__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 var(--zp-pillar-img-h);
  width: 100%;
  height: var(--zp-pillar-img-h);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

body.home-layout-ref .zp-pillars .zp-pillar--scratch .zp-pillar__circle,
body.home-layout-ref .zp-pillars .zp-pillar--retouch .zp-pillar__circle,
body.home-layout-ref .zp-pillars .zp-pillar--docs .zp-pillar__circle {
  background: transparent;
  box-shadow: none;
}

body.home-layout-ref .zp-pillars .zp-pillar__circle img {
  display: block;
  width: var(--zp-pillar-img-w);
  height: var(--zp-pillar-img-h);
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  object-fit: contain;
  object-position: center center;
  border-radius: 0;
}

body.home-layout-ref .zp-pillars .zp-pillar--retouch .zp-pillar__circle img {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0 auto;
  object-fit: contain;
}

/* Главная: pillars «Печать» / «Фотообработка» — слот 3:4 на всю ширину карточки */
body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
  --zp-pillar-card-h: auto;
  --zp-pillar-img-w: 100%;
  --zp-pillar-img-h: auto;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar {
  align-items: stretch;
  gap: 0;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__circle,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__circle {
  flex: 0 0 auto;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  margin: 0;
  padding: 0;
  align-items: stretch;
  justify-content: flex-start;
  align-self: stretch;
  line-height: 0;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__circle img,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__circle img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  object-fit: cover;
  object-position: top center;
}

/* Pillars slideshow: zerkalo-site-chrome.js toggles .is-active every data-pillar-interval ms */
@keyframes zp-pillar-slideshow-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

body.home-layout-ref .zp-pillars .zp-pillar__circle--slideshow {
  position: relative;
}

/* Compact before/after scrubber inside pillar card (Фотообработка) */
body.home-layout-ref .zp-pillars .zp-pillar__circle--ba {
  position: relative;
  overflow: hidden;
  -webkit-user-drag: none;
  user-select: none;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  aspect-ratio: unset;
  margin: 0;
  border-radius: inherit;
  touch-action: none;
  cursor: ew-resize;
  -webkit-user-drag: none;
  user-select: none;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-before,
body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-after {
  pointer-events: none;
  -webkit-user-drag: none;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-handle {
  width: 44px;
  pointer-events: auto;
  cursor: ew-resize;
  touch-action: none;
  -webkit-user-drag: none;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-handle:before {
  width: 2px;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-grip {
  width: 28px;
  height: 28px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28);
  pointer-events: none;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-grip::before,
body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-grip::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid #4e2a96;
  border-right: 2px solid #4e2a96;
  transform: translateY(-50%) rotate(45deg);
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-grip::before {
  left: 7px;
  transform: translateY(-50%) rotate(-135deg);
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-grip::after {
  right: 7px;
}

body.home-layout-ref .zp-pillars .ba.ba--pillar .ba-labels {
  display: none;
}

body.home-layout-ref .zp-pillars a.zp-pillar:has(.ba--pillar) {
  -webkit-user-drag: none;
}

body.home-layout-ref .zp-pillars .zp-pillar__slideshow {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__circle--slideshow .zp-pillar__slideshow img,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__circle--slideshow .zp-pillar__slideshow img,
body.home-layout-ref .zp-pillars .zp-pillar__slideshow img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
  margin: 0;
  opacity: 0;
  transition: none;
  animation: none;
}

body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__circle--slideshow .zp-pillar__slideshow img.is-active,
body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__circle--slideshow .zp-pillar__slideshow img.is-active,
body.home-layout-ref .zp-pillars .zp-pillar__slideshow img.is-active {
  opacity: 1;
  animation: zp-pillar-slideshow-in 0.42s ease both;
}

@media (prefers-reduced-motion: reduce) {
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__circle--slideshow .zp-pillar__slideshow img.is-active,
  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__circle--slideshow .zp-pillar__slideshow img.is-active,
  body.home-layout-ref .zp-pillars .zp-pillar__slideshow img.is-active {
    animation: none;
  }
}

body.home-layout-ref .zp-pillars .zp-pillar__label {
  display: block;
  flex: 0 1 auto;
  width: 100%;
  min-height: 21px;
  margin: 0;
  padding: 0 8px 8px;
  box-sizing: border-box;
  font-family: 'Roboto', var(--zp-font-ui), system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0;
  color: #1c1f23;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

body.home-layout-ref .zp-pillars .zp-pillar__label--wide {
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}

@media (max-width: 767px) {
  body.home-layout-ref .home-first-module .zp-pillars__head {
    display: none !important;
  }

  /* layout #products-menu / g5dKHI: белая карточка с закруглением, наезд на герой */
  body.home-layout-ref .home-first-module {
    --zp-hero-m-pillars-overlap: 36px;
    gap: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.home-layout-ref .home-first-module .zp-pillars {
    position: relative;
    z-index: 2;
    width: calc(100% - 16px);
    max-width: calc(100% - 16px);
    /* Наезд на герой у самой карточки: иначе #top overflow клипит фиолетовый
       фон карусели при margin-bottom:-overlap — скругление белое-на-белом */
    margin: calc(-1 * var(--zp-hero-m-pillars-overlap, 36px)) auto 0;
    padding: 0;
    box-sizing: border-box;
    background: #fff;
    border-radius: 28px;
    overflow: hidden;
    isolation: isolate;
  }

  body.home-layout-ref .home-first-module .zp-pillars > .wrap {
    margin: 0 auto;
    padding: clamp(16px, 4.5vw, 20px) 16px 0;
    gap: 16px;
    max-width: 100%;
  }

  /* Мобильная база 366px: слот фото 3:4 на всю ширину ячейки. */
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillars__grid {
    --zp-pillar-img-w: 100%;
  }

  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillars__grid {
    --zp-pillar-img-w: 100%;
  }

  /* Небольшой стандартный зазор между фото и подписью в печатных карточках. */
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__label {
    margin-top: 6px;
  }

  /* Мобильная читаемость подписей карточек: меньше переносов, без слишком мелкого текста. */
  body.home-layout-ref .home-first-module #zp-pillars-panel-print .zp-pillar__label,
  body.home-layout-ref .home-first-module #zp-pillars-panel-processing .zp-pillar__label {
    font-size: clamp(13px, 3.7vw, 14px);
    line-height: 1.3;
    padding: 0 6px 6px;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    -webkit-hyphens: none;
    text-wrap: balance;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment {
    max-width: 100%;
    width: 100%;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment-track {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0;
    padding: 8px;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment-tab {
    flex: 1 1 0;
    min-width: 0;
    font-family: 'Roboto', system-ui, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    padding: 12px 16px;
    height: auto;
    min-height: 0;
  }

  body.home-layout-ref .home-first-module .zp-pillars__segment-tab.is-active {
    font-weight: 700;
  }
}

/* Внутренние страницы (ПК): общая ширина контента — var(--wrap), max 1440px */
@media (min-width: 1320px) {
  body.home-layout-ref .about-page-hero .wrap {
    max-width: var(--wrap);
  }

  body.home-layout-ref .about-page-body > .wrap,
  body.home-layout-ref .policy-page > .wrap {
    max-width: var(--wrap);
  }

  body.home-layout-ref .policy-doc {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  body.home-layout-ref .policy-doc.about-article {
    max-width: 100%;
  }
}

/* =============================
   Подробные страницы услуг
   Единый новый дизайн контента
   ============================= */
body.home-layout-ref.page-usluga-detail .about-page-hero {
  padding-top: var(--zp-site-content-offset);
  padding-bottom: 18px;
  background:
    radial-gradient(900px 320px at 0% -20%, rgba(143, 100, 224, 0.18), transparent 60%),
    radial-gradient(900px 320px at 100% -20%, rgba(217, 180, 96, 0.16), transparent 60%),
    #f7f3ff;
}

body.home-layout-ref.page-usluga-detail .about-page-hero .wrap {
  max-width: var(--wrap);
}

body.home-layout-ref.page-usluga-detail .about-page-hero .about-muted:first-child,
body.home-layout-ref.page-usluga-detail .about-page-hero .kicker {
  display: none;
}

body.home-layout-ref.page-usluga-detail .about-page-hero .wrap > h1,
body.home-layout-ref.page-usluga-detail .about-page-hero .wrap > .about-page-hero__lead {
  position: relative;
  z-index: 1;
}

body.home-layout-ref.page-usluga-detail .about-page-hero .wrap {
  background: #ffffff;
  border: 1px solid rgba(78, 42, 150, 0.16);
  border-radius: 22px;
  box-shadow: 0 14px 42px rgba(53, 31, 104, 0.1);
  padding: clamp(16px, 2.8vw, 30px);
}

body.home-layout-ref.page-usluga-detail .about-page-hero h1 {
  margin: 0 0 12px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.1;
  color: #20133b;
}

body.home-layout-ref.page-usluga-detail .about-page-hero .about-page-hero__lead {
  margin: 0;
  max-width: 980px;
  font-size: clamp(16px, 1.45vw, 21px);
  line-height: 1.45;
  color: #463a60;
}

body.home-layout-ref.page-usluga-detail .about-page-body {
  background: linear-gradient(180deg, #f7f3ff 0%, #fdfcff 22%, #ffffff 100%);
  padding: 10px 0 48px;
}

body.home-layout-ref.page-usluga-detail .about-page-body > .wrap {
  max-width: var(--wrap);
}

body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h2,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h3,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > p,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ul,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ol {
  background: #ffffff;
  border: 1px solid rgba(72, 42, 131, 0.14);
  border-radius: 16px;
  margin: 0;
  padding: 16px 18px;
}

body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h2,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h3 {
  color: #241646;
}

body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > p,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > li,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ul,
body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ol {
  color: #3e3359;
}

body.home-layout-ref.page-usluga-detail .about-page-body .about-cta-band {
  margin-top: 8px;
  border-radius: 18px;
  border: 1px solid rgba(78, 42, 150, 0.24);
  background: linear-gradient(135deg, #f2ecff 0%, #fff7ed 100%);
}

body.home-layout-ref.page-usluga-detail .about-page-body .about-cta-band .btn {
  min-height: 50px;
  font-weight: 700;
}

body.home-layout-ref .about-cta-band .btn.secondary {
  background: #ffffff;
  color: #2c1c53;
  border: 1px solid rgba(78, 42, 150, 0.35);
}

body.home-layout-ref .about-cta-band .btn.secondary:hover,
body.home-layout-ref .about-cta-band .btn.secondary:focus-visible {
  background: #f2ecff;
  color: #231244;
  border-color: rgba(78, 42, 150, 0.55);
}

@media (max-width: 767px) {
  body.home-layout-ref.page-usluga-detail .about-page-hero {
    padding-bottom: 12px;
  }

  body.home-layout-ref.page-usluga-detail .about-page-hero .wrap {
    border-radius: 16px;
    padding: 14px;
  }

  body.home-layout-ref.page-usluga-detail .about-page-body {
    padding-bottom: 34px;
  }

  body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h2,
  body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > h3,
  body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > p,
  body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ul,
  body.home-layout-ref.page-usluga-detail .about-page-body .policy-doc.about-article > ol {
    padding: 14px;
  }
}

/* --- zp-showcase: Figma 487:3822 --- */
body.home-layout-ref section.zp-showcase {
  margin: 0;
  padding: 24px 0 0;
  background: #ffffff;
}

body.home-layout-ref section.zp-showcase .reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

body.home-layout-ref section.zp-showcase > .wrap {
  max-width: var(--wrap);
  margin: 0 auto;
  border-radius: 40px;
  padding-top: 24px;
  padding-bottom: 24px;
  box-sizing: border-box;
}

body.home-layout-ref .zp-showcase__title {
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  line-height: 28px;
  margin: 0 auto 24px;
  color: #3b135c;
}

body.home-layout-ref .zp-showcase__grid {
  width: min(1296px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 24px;
  align-items: start;
}

body.home-layout-ref .zp-showcase-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 240px;
  min-height: 344px;
  background: #f0f2f5;
  border-radius: 20px;
  overflow: hidden;
  padding: 24px;
  box-sizing: border-box;
}

body.home-layout-ref .zp-showcase-card--featured {
  position: relative;
  min-height: 344px;
  transition: min-height 0.22s ease, box-shadow 0.22s ease;
}

body.home-layout-ref .zp-showcase-card--featured:hover,
body.home-layout-ref .zp-showcase-card--featured:focus-within {
  min-height: 451px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
}

body.home-layout-ref .zp-showcase-card__body {
  padding: 0;
  order: 2;
}

body.home-layout-ref .zp-showcase-card__body h3 {
  margin: 0;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  color: #3b135c;
}

body.home-layout-ref .zp-showcase-card__heading-link,
body.home-layout-ref .zp-showcase-card__desc-link {
  color: inherit;
  text-decoration: none;
}

body.home-layout-ref .zp-showcase-card__heading-link:hover,
body.home-layout-ref .zp-showcase-card__heading-link:focus-visible,
body.home-layout-ref .zp-showcase-card__desc-link:hover,
body.home-layout-ref .zp-showcase-card__desc-link:focus-visible {
  color: var(--zp-figma-purple, #3b135c);
  text-decoration: underline;
}

body.home-layout-ref .zp-showcase-card--ba .zp-showcase-card__body h3 {
  line-height: 22px;
  font-weight: 600;
}

body.home-layout-ref .zp-showcase-card__desc {
  margin: 0;
  color: #414544;
  line-height: 22px;
  font-size: 15px;
  font-weight: 500;
  order: 3;
}

body.home-layout-ref .zp-showcase-card__media {
  margin: 0;
  padding: 0;
  width: 192px;
  height: 244px;
  border-radius: 20px;
  overflow: hidden;
  order: 1;
}

body.home-layout-ref .zp-showcase-card__shot.product-shot {
  margin: 0;
  border-radius: 20px;
  overflow: hidden;
  width: 192px;
  height: 244px;
}

body.home-layout-ref .zp-showcase-card__shot.product-shot .ba {
  width: 100%;
  height: 100%;
}

body.home-layout-ref .zp-showcase-card .ba-labels,
body.home-layout-ref .zp-showcase-card .ba-grip {
  display: none;
}

body.home-layout-ref .zp-showcase-card .ba-handle {
  width: 1px;
  height: 100%;
  background: #ffffff;
  border-radius: 0;
  box-shadow: none;
}

body.home-layout-ref .zp-showcase-card .ba-handle::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ffffff;
}

body.home-layout-ref .zp-showcase-card__img {
  display: block;
  width: 192px;
  height: 244px;
  border-radius: 20px;
  object-fit: cover;
}

body.home-layout-ref .zp-showcase-card--featured .zp-showcase-card__desc {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transition: max-height 0.22s ease, opacity 0.22s ease;
}

body.home-layout-ref .zp-showcase-card--featured:hover .zp-showcase-card__desc,
body.home-layout-ref .zp-showcase-card--featured:focus-within .zp-showcase-card__desc {
  max-height: 132px;
  opacity: 1;
  pointer-events: auto;
}

/* --- zp-process: layout-карточки (референс usluga-holst #how) --- */
body.home-layout-ref section.zp-process {
  margin: 24px auto 0;
  padding: 0;
}

body.home-layout-ref section.zp-process > .wrap {
  max-width: var(--wrap);
  margin: 0 auto;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  background: transparent;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 16px;
  background: transparent;
  border-radius: 0;
  padding: 0;
  box-sizing: border-box;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 0;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__title,
body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__title,
body.home-layout-ref section.zp-process.zp-order-steps--scroll #zp-process-title {
  align-self: stretch;
  width: 100%;
  max-width: none;
  margin: 0 0 8px;
  padding: 0;
  text-align: left;
  font-family: var(--zp-font-ui, Nunito, sans-serif);
  font-size: clamp(20px, 2.2vw, 24px);
  font-weight: 700;
  line-height: 1.25;
  color: #1c1f23;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__head .zp-process__title,
body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__head #zp-process-title {
  margin-bottom: 0;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__lead {
  margin: 0;
  padding: 0;
  text-align: left;
  font-family: var(--zp-font-ui, Nunito, sans-serif);
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.4;
  font-weight: 500;
  color: #414544;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__scroll {
  width: 100%;
  max-width: 100%;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__track {
  --zp-order-step-gap: 16px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: var(--zp-order-step-gap);
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: visible;
  box-sizing: border-box;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: 8px;
  width: auto;
  min-width: 0;
  max-width: none;
  min-height: 158px;
  height: auto;
  margin: 0;
  padding: 24px;
  background: #f6f4fb;
  border: none;
  border-radius: 16px;
  text-align: left;
  box-sizing: border-box;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__head {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__accent {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: #6440bf;
  color: #ffffff;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__accent--arrow {
  color: #ffffff;
  background: #6440bf;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__accent--check {
  color: #ffffff;
  background: #22c55e;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__accent-icon {
  display: block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__heading {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--zp-font-ui, Nunito, sans-serif);
  font-size: clamp(17px, 1.6vw, 20px);
  font-weight: 700;
  line-height: 1.25;
  color: #1c1f23;
}

body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step__text {
  margin: 0;
  width: 100%;
  font-family: var(--zp-font-ui, Nunito, sans-serif);
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 500;
  line-height: 1.4;
  color: #414544;
}

@media (max-width: 1319px) {
  /* Планшет/мобила: заголовок «Как заказать» вровень с текстом в карточках (padding 24px) */
  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__head {
    padding-left: 24px;
    padding-right: 24px;
    box-sizing: border-box;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__scroll {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__track {
    --zp-order-step-w: 285px;
    --zp-order-step-gap: 16px;
    gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__track::-webkit-scrollbar {
    display: none;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step {
    flex: 0 0 var(--zp-order-step-w);
    width: var(--zp-order-step-w);
    min-width: var(--zp-order-step-w);
    max-width: var(--zp-order-step-w);
    min-height: 145px;
    margin-right: var(--zp-order-step-gap);
    scroll-snap-align: start;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step:last-child {
    margin-right: 0;
  }
}

@media (min-width: 768px) and (max-width: 1319px) {
  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__track {
    --zp-order-step-w: min(320px, calc((100% - 32px) / 2));
    --zp-order-step-gap: 16px;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-process__inner {
    gap: 24px;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-steps__track {
    gap: 24px;
    overflow: visible;
    scroll-snap-type: none;
  }

  body.home-layout-ref section.zp-process.zp-order-steps--scroll .zp-order-step {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none;
    min-height: 158px;
    margin-right: 0;
  }
}

body.home-layout-ref .zp-process__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
}

/* Desktop cap: карточки не больше 408px, но колонки сжимаются, когда
   доступной ширины меньше 1296px — иначе сетка вылезает за пределы
   модуля при окне 1320–1432px. */
@media (min-width: 1320px) {
  body.home-layout-ref .zp-process__grid {
    grid-template-columns: repeat(3, minmax(0, 408px));
    max-width: 1296px;
    justify-content: flex-start;
  }

  body.home-layout-ref .zp-process-step {
    width: 100%;
    max-width: 408px;
  }
}

body.home-layout-ref .zp-process-step {
  background: #ffffff;
  border-radius: 20px;
  min-height: 131px;
  padding: 32px 24px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  box-sizing: border-box;
}

body.home-layout-ref .zp-process-step__num {
  color: #414544;
  font-size: 32px;
  line-height: 28px;
  font-weight: 700;
  flex: 0 0 auto;
}

body.home-layout-ref .zp-process-step__copy {
  margin: 0;
  color: #414544;
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
}

body.home-layout-ref .zp-process-step__copy strong {
  font-size: 18px;
  line-height: 22px;
  font-weight: 700;
}

/* Примеры работ — под «Как заказать», перед мини-FAQ. */
body.home-layout-ref section.zp-home-cases {
  margin: 0 auto;
  padding: clamp(28px, 4vw, 40px) 0 clamp(32px, 5vw, 48px);
  overflow: visible;
  /* Фон только на карточках; поля секции — белые (не .section.soft) */
  background: #ffffff;
}

/* Один модуль 1440px — как .nav в шапке */
body.home-layout-ref section.zp-home-cases > .wrap,
body.home-layout-ref section.zp-home-cases > .zp-home-cases__wrap {
  width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
  max-width: var(--content-max, 1440px);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
  overflow: visible;
}

body.home-layout-ref .zp-home-cases__module {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

body.home-layout-ref .zp-home-cases__head {
  text-align: center;
  max-width: 40rem;
  margin: 0 auto 1.25rem;
}

body.home-layout-ref .zp-home-cases__title {
  margin: 0 0 0.5rem;
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 4vw, 28px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--zp-figma-text, #414544);
}

body.home-layout-ref .zp-home-cases__lead {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(14px, 2vw, 16px);
  line-height: 1.5;
  color: var(--muted, #4f4763);
}

body.home-layout-ref .zp-home-cases__scroller {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.home-layout-ref .zp-home-cases__scroll-hint {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: clamp(52px, 15vw, 76px);
  margin: 0;
  padding: 0 max(2px, env(safe-area-inset-right, 0px)) 0 0;
  border: none;
  font: inherit;
  cursor: pointer;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
  background: transparent;
}

body.home-layout-ref .zp-home-cases__scroller.is-scrollable:not(.is-at-end) .zp-home-cases__scroll-hint {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

body.home-layout-ref .zp-home-cases__scroll-hint:focus {
  outline: none;
}

body.home-layout-ref .zp-home-cases__scroll-hint:focus-visible .zp-home-cases__scroll-hint-arrow {
  outline: 2px solid rgba(233, 196, 106, 0.95);
  outline-offset: 2px;
}

body.home-layout-ref .zp-home-cases__scroll-hint:hover .zp-home-cases__scroll-hint-arrow {
  background: #ffffff;
  border-color: rgba(100, 64, 191, 0.45);
  box-shadow: 0 6px 20px rgba(59, 19, 92, 0.16);
}

body.home-layout-ref .zp-home-cases__scroller:has(.zp-home-cases__grid.is-drag-scroll--dragging) .zp-home-cases__scroll-hint {
  opacity: 0;
  visibility: hidden;
}

body.home-layout-ref .zp-home-cases__scroll-hint-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: var(--zp-hero-cta-color, #6440bf);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(100, 64, 191, 0.28);
  box-shadow: 0 4px 16px rgba(59, 19, 92, 0.1);
  animation: zp-home-cases-scroll-hint-nudge 1.65s ease-in-out infinite;
}

body.home-layout-ref .zp-home-cases__scroll-hint-arrow svg {
  display: block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

@keyframes zp-home-cases-scroll-hint-nudge {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(5px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-layout-ref .zp-home-cases__scroll-hint-arrow {
    animation: none;
  }
}

/* Референс layout #interesting: горизонтальный скролл, карточка ~356×457. */
body.home-layout-ref .zp-home-cases__grid {
  --zp-home-case-w: 356px;
  --zp-home-case-gap: 12px;
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: auto;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  -webkit-overflow-scrolling: touch;
  /* pan-y нужен: иначе на смартфоне жест вверх/вниз «залипает» на ленте */
  touch-action: pan-x pan-y;
  cursor: grab;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

body.home-layout-ref .zp-home-cases__grid.is-drag-scroll--dragging {
  cursor: grabbing;
  scroll-snap-type: none;
  scroll-behavior: auto;
  user-select: none;
}

body.home-layout-ref .zp-home-cases__grid.is-drag-scroll--dragging a,
body.home-layout-ref .zp-home-cases__grid.is-drag-scroll--dragging button {
  pointer-events: none;
}

body.home-layout-ref .zp-home-cases__grid::-webkit-scrollbar {
  display: none;
}

@media (min-width: 768px) {
  body.home-layout-ref .zp-home-cases__grid {
    --zp-home-case-gap: 16px;
    /* На ПК snap + smooth ломают drag и колёсико — «залипание» между карточками */
    scroll-snap-type: none;
    scroll-behavior: auto;
  }

  body.home-layout-ref section.zp-home-cases .zp-home-case-card {
    scroll-snap-align: none;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref .zp-home-cases__grid {
    --zp-home-case-gap: 20px;
  }
}

body.home-layout-ref section.zp-home-cases .v2-case,
body.home-layout-ref section.zp-home-cases .zp-home-case-card {
  background: #eef2f9;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #dde6f2;
  box-shadow: none;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0;
  flex: 0 0 var(--zp-home-case-w);
  width: var(--zp-home-case-w);
  min-width: var(--zp-home-case-w);
  max-width: var(--zp-home-case-w);
  min-height: 408px;
  margin-right: var(--zp-home-case-gap);
  padding: 24px;
  box-sizing: border-box;
  scroll-snap-align: start;
  color: inherit;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card:last-child {
  margin-right: 0;
}

@media (min-width: 1320px) {
  body.home-layout-ref section.zp-home-cases .zp-home-case-card {
    min-height: 454px;
    padding: 32px;
  }
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card:hover,
body.home-layout-ref section.zp-home-cases .zp-home-case-card:focus-within {
  transform: translateY(-2px);
  border-color: #dde6f2;
  box-shadow: 0 8px 24px rgba(28, 31, 35, 0.08);
}

body.home-layout-ref section.zp-home-cases .v2-case__body {
  order: 1;
  flex: 0 0 auto;
  padding: 0;
  margin: 0;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card__foot {
  order: 2;
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  margin-top: 12px;
}

body.home-layout-ref section.zp-home-cases .v2-case__media {
  display: block;
  width: 100%;
  flex: 0 0 auto;
  overflow: hidden;
  line-height: 0;
  border-radius: 20px;
  text-decoration: none;
  color: inherit;
}

body.home-layout-ref section.zp-home-cases .v2-case img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 20px;
  -webkit-user-drag: none;
  user-select: none;
}

body.home-layout-ref section.zp-home-cases .v2-case__media:focus-visible {
  outline: 2px solid var(--zp-gold);
  outline-offset: 2px;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta {
  flex: 0 0 auto;
  display: block;
  width: 100%;
  margin: 16px 0 0;
  text-decoration: none;
  color: inherit;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0;
  padding: 12px 18px;
  box-sizing: border-box;
  border-radius: 8px;
  border: 1px solid #6440bf;
  background: #fff;
  color: #6440bf;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
  transition: all 0.1s ease;
  appearance: none;
  -webkit-appearance: none;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta:hover .zp-home-case-card__cta-btn,
body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta:focus-visible .zp-home-case-card__cta-btn {
  border-color: #4c3191;
  background-color: #4c3191;
  color: #fff;
}

body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta:focus-visible {
  outline: 2px solid var(--zp-gold);
  outline-offset: 2px;
  border-radius: 10px;
}

body.home-layout-ref section.zp-home-cases .v2-case__body h3 {
  margin: 0 0 4px;
  font-family: 'Roboto', system-ui, sans-serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 400;
  color: #212121;
}

body.home-layout-ref section.zp-home-cases .v2-case__body p {
  margin: 0;
  font-family: 'Roboto', system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 400;
  color: #6b6b6b;
}

@media (min-width: 1320px) {
  body.home-layout-ref section.zp-home-cases .v2-case__body h3 {
    margin-bottom: 8px;
    font-size: 28px;
  }

  body.home-layout-ref section.zp-home-cases .v2-case__body p {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .zp-home-cases__grid {
    --zp-home-case-w: min(356px, calc(100vw - 32px));
  }

  body.home-layout-ref section.zp-home-cases .zp-home-case-card {
    min-height: 408px;
    padding: 20px;
  }

  body.home-layout-ref section.zp-home-cases .v2-case__body {
    padding: 0;
  }

  body.home-layout-ref section.zp-home-cases .zp-home-case-card__cta-btn {
    margin-top: 0;
    padding: 12px 18px;
    font-size: 16px;
    line-height: 22px;
  }
}

body.home-layout-ref .zp-home-cases__more {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px 16px;
  margin: 1.5rem 0 0;
  text-align: center;
}

body.home-layout-ref .zp-home-cases__more .btn.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 52px;
  padding: 10px 24px;
  border-radius: 15px;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  text-decoration: none;
  background: linear-gradient(135deg, #f3ecff 0%, #faf6ff 52%, #fff8ef 100%);
  color: #3b2468 !important;
  border: 1.5px solid rgba(78, 42, 150, 0.32);
  box-shadow: 0 4px 16px rgba(59, 19, 92, 0.08);
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

body.home-layout-ref .zp-home-cases__more .btn.secondary:hover,
body.home-layout-ref .zp-home-cases__more .btn.secondary:focus-visible {
  background: linear-gradient(135deg, #e8deff 0%, #f2ebff 55%, #fff3e0 100%);
  border-color: rgba(78, 42, 150, 0.48);
  color: #2a1852 !important;
  box-shadow: 0 6px 20px rgba(59, 19, 92, 0.12);
}

/* Мини-FAQ — отдельная секция под «Примеры работ». */
body.home-layout-ref section.zp-home-mini-faq {
  margin: 0 auto;
  padding: clamp(32px, 5vw, 48px) 0;
}

body.home-layout-ref section.zp-home-mini-faq > .wrap {
  max-width: var(--wrap);
  margin: 0 auto;
}

body.home-layout-ref .zp-home-mini-faq__head {
  text-align: center;
  max-width: 40rem;
  margin: 0 auto 1.25rem;
}

body.home-layout-ref .zp-home-mini-faq__title {
  margin: 0 0 0.5rem;
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 4vw, 28px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--zp-figma-text, #414544);
}

body.home-layout-ref .zp-home-mini-faq__lead {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(14px, 2vw, 16px);
  line-height: 1.5;
  color: var(--muted, #4f4763);
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq {
  max-width: 720px;
  margin: 0 auto;
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq details {
  background: #fff;
  border: 1px solid rgba(72, 42, 131, 0.12);
  border-radius: 14px;
  margin-bottom: 0.65rem;
  overflow: hidden;
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq summary {
  padding: 1rem 1.15rem;
  font-family: var(--zp-font-ui);
  font-weight: 600;
  font-size: 16px;
  line-height: 1.35;
  color: #414544;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq summary::-webkit-details-marker {
  display: none;
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq summary::after {
  content: "+";
  font-size: 1.25rem;
  color: var(--violet, #4e2a96);
  flex-shrink: 0;
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq details[open] summary::after {
  content: "−";
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq__answer {
  padding: 0 1.15rem 1rem;
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: 15px;
  line-height: 1.5;
  color: var(--muted, #4f4763);
}

body.home-layout-ref section.zp-home-mini-faq .v2-faq__answer a {
  color: var(--violet, #4e2a96);
}

body.home-layout-ref .zp-home-mini-faq__more {
  text-align: center;
  margin: 1.25rem 0 0;
}

body.home-layout-ref .zp-home-mini-faq__more .btn.secondary,
body.home-layout-ref #reviews.zp-reviews-static--figma .zp-reviews-static__cta .btn.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: min(300px, 100%);
  min-height: 56px;
  padding: 10px 32px;
  border-radius: 15px;
  font-family: var(--zp-font-ui);
  font-size: 17px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0;
  text-decoration: none;
  background: linear-gradient(135deg, #f3ecff 0%, #faf6ff 52%, #fff8ef 100%);
  color: #3b2468 !important;
  border: 1.5px solid rgba(78, 42, 150, 0.32);
  box-shadow: 0 4px 16px rgba(59, 19, 92, 0.08);
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    color 0.2s ease;
}

body.home-layout-ref .zp-home-mini-faq__more .btn.secondary:hover,
body.home-layout-ref .zp-home-mini-faq__more .btn.secondary:focus-visible,
body.home-layout-ref #reviews.zp-reviews-static--figma .zp-reviews-static__cta .btn.secondary:hover,
body.home-layout-ref #reviews.zp-reviews-static--figma .zp-reviews-static__cta .btn.secondary:focus-visible {
  background: linear-gradient(135deg, #e8deff 0%, #f2ebff 55%, #fff3e0 100%);
  border-color: rgba(78, 42, 150, 0.48);
  color: #2a1852 !important;
  box-shadow: 0 6px 20px rgba(59, 19, 92, 0.12);
}

body.home-layout-ref #reviews.zp-reviews-static--figma .zp-reviews-static__cta {
  position: relative;
  left: auto;
  top: auto;
  width: 100%;
  margin: 1.25rem 0 0;
  padding: 0;
  text-align: center;
  pointer-events: none;
}

body.home-layout-ref #reviews.zp-reviews-static--figma .zp-reviews-static__cta .btn.secondary {
  pointer-events: auto;
  height: auto;
  white-space: normal;
}

/* Отзывы VK (figma layout-ref) — главная: в общую сетку, как FAQ и категории */
body.home-layout-ref #reviews.zp-reviews-static.zp-reviews-static--figma {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 40px) 0;
  box-sizing: border-box;
  overflow-x: clip;
}

body.home-layout-ref #reviews.zp-reviews-static.zp-reviews-static--figma > .zp-reviews-static__shell {
  width: min(100%, var(--wrap));
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

body.home-layout-ref section.zp-process > .zp-process__cta {
  text-align: center;
  margin: 24px auto;
  max-width: var(--wrap);
  padding: 0 clamp(16px, 4vw, 24px);
  box-sizing: border-box;
}

body.home-layout-ref .zp-process__cta {
  text-align: center;
}

body.home-layout-ref .zp-process__cta .btn {
  width: 300px;
  min-width: 300px;
  min-height: 60px;
  border-radius: 15px;
  background: #e5b95f;
  color: #311d65;
  font-size: 18px;
  line-height: 22px;
  font-weight: 600;
}

body.home-layout-ref .zp-showcase-card__more {
  display: none;
}

@media (max-width: 1319px) {
  body.home-layout-ref .zp-showcase__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: center;
  }

  body.home-layout-ref .zp-process__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .zp-showcase__grid {
    grid-template-columns: 1fr;
  }
}

/* --- Промо-блок #partner-promo (pre-Figma variant) --- */
body.home-layout-ref #partner-promo.section.soft {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 24px;
  margin-bottom: 24px;
  /* Фон только на карточке (.zp-promo-card__panel), поля секции — белые */
  background: #ffffff;
}

body.home-layout-ref #partner-promo > .wrap.zp-promo-stack {
  display: block;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}

body.home-layout-ref .zp-promo-stack__grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.home-layout-ref .zp-promo-card {
  border-radius: 16px;
  overflow: hidden;
  box-sizing: border-box;
}

body.home-layout-ref .zp-promo-card--lead {
  position: relative;
  padding: 20px;
  color: #fff;
  background: transparent;
  min-height: 380px;
  isolation: isolate;
}

body.home-layout-ref .zp-promo-card__panel {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  overflow: hidden;
  background: #38199d;
  pointer-events: none;
}

body.home-layout-ref .zp-promo-card__radial {
  position: absolute;
  display: block;
  border-radius: 50%;
}

body.home-layout-ref .zp-promo-card__radial--right {
  inset: -20.12% -27.01% -96.92% 48.36%;
  background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(124, 77, 255, 0.55) 0%, rgba(124, 77, 255, 0) 100%);
}

body.home-layout-ref .zp-promo-card__radial--left {
  inset: -201.13% 25.74% -165.61% -94.87%;
  background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(91, 47, 196, 0.5) 0%, rgba(91, 47, 196, 0) 100%);
}

body.home-layout-ref .zp-promo-card__line {
  position: absolute;
  display: block;
  max-width: none;
  pointer-events: none;
}

body.home-layout-ref .zp-promo-card__line--top {
  top: -3.42%;
  right: -20.91%;
  bottom: calc(64.64% + 1.28%);
  left: calc(-7.07% - 0.32%);
  width: auto;
  height: auto;
  object-fit: fill;
}

body.home-layout-ref .zp-promo-card__line-flip {
  position: absolute;
  top: 65.5%;
  right: -40.4%;
  bottom: -5.9%;
  left: -5.95%;
  display: block;
  pointer-events: none;
}

body.home-layout-ref .zp-promo-card__line-flip .zp-promo-card__line--bottom {
  position: absolute;
  top: -2.99%;
  right: 0;
  bottom: -2.99%;
  left: -0.28%;
  width: auto;
  height: auto;
  transform: rotate(180deg) scaleX(-1);
  object-fit: fill;
}

body.home-layout-ref .zp-promo-card--lead > :not(.zp-promo-card__panel) {
  position: relative;
  z-index: 1;
}

body.home-layout-ref #partner-promo .zp-promo-card__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 540px);
  align-items: center;
  gap: 24px;
}

body.home-layout-ref #partner-promo .zp-promo-card__content {
  min-width: 0;
  align-self: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

body.home-layout-ref .zp-promo-card__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
}

body.home-layout-ref .zp-promo-card__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 21px;
  padding: 0 8px;
  border-radius: 12px;
  font-family: 'Roboto', var(--zp-font-ui), system-ui, sans-serif;
  font-size: 14px;
  line-height: 21px;
  font-weight: 500;
  letter-spacing: 0;
  white-space: nowrap;
  box-sizing: border-box;
}

body.home-layout-ref .zp-promo-card__tag--pink {
  background: #ff0066;
  color: #fff;
}

/* layout TfYt9Z4c / Sd9yEvdx — «Доставим сегодня»: жёлтый бейдж */
body.home-layout-ref .zp-promo-card__tag--lilu {
  background: #f5d78e;
  color: #3b135c;
}

body.home-layout-ref .zp-promo-card__tag--green {
  background: #3fda84;
  color: #fff;
}

body.home-layout-ref .zp-promo-card__tag--ghost {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

body.home-layout-ref .zp-promo-card__title {
  margin: 0 0 16px;
  font-family: var(--zp-font-ui);
  font-size: 22px;
  line-height: 28px;
  font-weight: 600;
  color: #fff;
  text-align: left;
}

body.home-layout-ref .zp-promo-card__offer {
  margin: 0 0 20px;
}

body.home-layout-ref .zp-promo-card__stats {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px 32px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

body.home-layout-ref .zp-promo-card__stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 0 1 auto;
}

body.home-layout-ref .zp-promo-card__stat-val {
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
  color: #fff;
}

body.home-layout-ref .zp-promo-card__stat-lbl {
  font-family: var(--zp-font-ui);
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.82);
}

body.home-layout-ref .zp-promo-card__more {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 21px;
  font-weight: 500;
  color: #fff;
  text-decoration: none;
}

body.home-layout-ref .zp-promo-card__more:hover,
body.home-layout-ref .zp-promo-card__more:focus-visible {
  color: var(--zp-gold);
}

body.home-layout-ref .zp-promo-card__more-icon {
  flex-shrink: 0;
}

body.home-layout-ref .zp-promo-card__form {
  margin: 0;
}

body.home-layout-ref .zp-promo-card__field-row {
  position: relative;
  margin: 0 0 12px;
}

body.home-layout-ref .zp-promo-card__field {
  display: block;
  position: relative;
  background: #fff;
  border-radius: 12px;
  min-height: 60px;
  padding: 8px 52px 8px 16px;
  box-sizing: border-box;
}

body.home-layout-ref .zp-promo-card__field-label {
  display: block;
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  color: rgba(65, 69, 68, 0.72);
}

body.home-layout-ref .zp-promo-card__input {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
  color: var(--zp-figma-text);
  outline: none;
}

body.home-layout-ref .zp-promo-card__input::placeholder {
  color: rgba(65, 69, 68, 0.45);
}

body.home-layout-ref .zp-promo-card__info {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--zp-figma-purple);
  cursor: pointer;
}

body.home-layout-ref .zp-promo-card__info:focus-visible {
  outline: 2px solid var(--zp-gold);
  outline-offset: 2px;
  border-radius: 4px;
}

body.home-layout-ref .zp-promo-card__hint {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: calc(100% + 8px);
  width: min(360px, calc(100vw - 48px));
  max-width: 360px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff;
  color: var(--zp-figma-text);
  font-family: var(--zp-font-ui);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  box-shadow: 0 8px 24px rgba(26, 20, 51, 0.18);
}

body.home-layout-ref .zp-promo-card__hint[hidden] {
  display: none;
}

body.home-layout-ref .zp-promo-card__submit-wrap {
  margin: 0;
}

body.home-layout-ref .zp-promo-card__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  min-width: 0;
  padding: 0 28px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--zp-gold) 0%, var(--zp-gold-hover) 100%);
  color: var(--zp-btn-text);
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
  cursor: pointer;
  transition: filter 0.15s ease;
  box-sizing: border-box;
  text-decoration: none;
}

body.home-layout-ref a.zp-promo-card__submit {
  appearance: none;
  -webkit-appearance: none;
}

body.home-layout-ref .zp-promo-card__submit:hover,
body.home-layout-ref .zp-promo-card__submit:focus-visible {
  filter: brightness(1.05);
}

body.home-layout-ref #partner-promo .zp-promo-card__visual {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  overflow: hidden;
  margin: 0;
  width: min(100%, 378px);
  max-width: 378px;
  min-height: 0;
  padding-top: 16px;
  border-radius: 0 24px 24px 0;
  background: transparent;
  box-shadow: none;
}

body.home-layout-ref #partner-promo .zp-promo-card__visual picture {
  display: block;
  width: 100%;
  height: 100%;
}

body.home-layout-ref #partner-promo .zp-promo-card__visual img,
body.home-layout-ref #partner-promo .zp-promo-card__visual-img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 540 / 550;
  object-fit: cover;
  object-position: center top;
  border-radius: 0 0 24px 0;
}

body.home-layout-ref #partner-promo .zp-promo-card__visual-img.is-fadein {
  opacity: 0;
  animation: zp-promo-visual-fadein 0.55s ease forwards;
}

@keyframes zp-promo-visual-fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-layout-ref #partner-promo .zp-promo-card__visual-img.is-fadein {
    opacity: 1;
    animation: none;
  }
}

@media (min-width: 768px) {
  body.home-layout-ref #partner-promo .zp-promo-stack__grid {
    gap: 16px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card--lead {
    padding: 28px 32px;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit-wrap {
    width: auto;
    max-width: none;
    align-self: flex-start;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit {
    width: auto;
    max-width: none;
    align-self: flex-start;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__title {
    font-size: 28px;
    line-height: 34px;
    max-width: 720px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stats {
    gap: 16px 48px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stat-val,
  body.home-layout-ref #partner-promo .zp-promo-card__stat-lbl {
    white-space: nowrap;
    flex: 0 0 auto;
    width: auto;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__field-row {
    max-width: 640px;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #partner-promo .zp-promo-card__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(200px, 378px);
    align-items: stretch;
    gap: 24px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__content {
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual {
    position: static;
    box-sizing: border-box;
    width: min(100%, 378px);
    max-width: 378px;
    height: auto;
    min-height: 0;
    max-height: 100%;
    justify-self: end;
    align-self: stretch;
    padding-top: 0;
    border-radius: 0 24px 24px 0;
    overflow: hidden;
    background: transparent;
    box-shadow: none;
    display: flex;
    align-items: stretch;
    justify-content: center;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual picture {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual picture,
  body.home-layout-ref #partner-promo .zp-promo-card__visual img {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: none;
    max-height: 100%;
    margin: 0;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center top;
    border-radius: 0 0 24px 0;
    clip-path: none;
    transform: none;
  }
}

@media (min-width: 768px) and (max-width: 1319px) {
  body.home-layout-ref #partner-promo .zp-promo-card--lead {
    position: relative;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(200px, 36%);
    align-items: stretch;
    gap: 20px;
    width: 100%;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__content {
    width: auto;
    max-width: none;
    align-self: stretch;
    justify-content: center;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual {
    position: static;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    min-height: 0;
    margin: 0;
    padding-top: 0;
    justify-self: end;
    align-self: stretch;
    border-radius: 0 20px 20px 0;
    overflow: hidden;
    background: transparent;
    box-shadow: none;
    display: flex;
    align-items: stretch;
    justify-content: center;
    pointer-events: auto;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual picture {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__visual picture,
  body.home-layout-ref #partner-promo .zp-promo-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center top;
    border-radius: 0 0 20px 0;
    clip-path: none;
    transform: none;
  }
}

/* #partner-promo ≤767px: без фото — только текст и кнопка */
@media (max-width: 767px) {
  body.home-layout-ref #partner-promo .zp-promo-card__visual {
    display: none;
  }
}

@media (max-width: 480px) {
  body.home-layout-ref #partner-promo .zp-promo-card--lead {
    padding: 16px;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__title {
    font-size: 20px;
    line-height: 26px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stats {
    gap: 12px 20px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__content {
    width: 100%;
    max-width: 100%;
    padding-right: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__tags,
  body.home-layout-ref #partner-promo .zp-promo-card__title,
  body.home-layout-ref #partner-promo .zp-promo-card__offer {
    padding-right: 0;
    box-sizing: border-box;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit-wrap {
    width: auto;
    max-width: none;
    align-self: flex-start;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    max-width: none;
    min-width: 0;
    min-height: 48px;
    height: auto;
    padding: 0 28px;
    font-size: clamp(13px, 3.65vw, 16px);
    line-height: 18px;
    font-weight: 600;
    white-space: nowrap;
    box-sizing: border-box;
  }
}

/* #partner-promo ≤767px: мобильная раскладка контента */
@media (max-width: 767px) {
  body.home-layout-ref .zp-universal-categories.section.soft {
    margin-top: 16px;
  }

  body.home-layout-ref #partner-promo.section.soft {
    margin-top: 16px;
    margin-bottom: 16px;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    background: #ffffff;
    box-sizing: border-box;
  }

  body.home-layout-ref #partner-promo > .wrap.zp-promo-stack {
    width: 100%;
    max-width: 100%;
    padding: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-stack__grid {
    width: 100%;
  }

  body.home-layout-ref #partner-promo .zp-promo-card.zp-promo-card--lead,
  body.home-layout-ref #partner-promo .zp-promo-card--lead {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    border-radius: 15px;
    padding: 20px 16px 16px;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__panel {
    border-radius: 15px;
    overflow: hidden;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__layout {
    display: block;
    position: static;
    min-height: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__content {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    align-self: center;
    padding-bottom: 0;
    box-sizing: border-box;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__tags,
  body.home-layout-ref #partner-promo .zp-promo-card__title,
  body.home-layout-ref #partner-promo .zp-promo-card__offer {
    padding-right: 0;
    box-sizing: border-box;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__tags {
    order: 1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    max-width: 100%;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__title {
    order: 2;
    margin: 0;
    max-width: 100%;
    font-size: 22px;
    line-height: 28px;
    font-weight: 600;
    text-wrap: balance;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__tag {
    min-height: 21px;
    padding: 0 8px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 21px;
    font-weight: 500;
    flex: 0 0 auto;
    white-space: nowrap;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__offer {
    order: 3;
    margin: 0;
    max-width: 100%;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stats {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    max-width: 100%;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stat {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 6px;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    list-style: none;
    flex: 0 0 auto;
    min-width: 0;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stat-val {
    display: inline;
    margin: 0;
    font-size: 16px;
    line-height: 22px;
    font-weight: 700;
    color: #fff;
    white-space: normal;
    flex: 0 1 auto;
    min-width: 0;
    overflow: visible;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__stat-lbl {
    display: inline;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.82);
    white-space: normal;
    flex: 0 1 auto;
    min-width: 0;
    overflow: visible;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__more,
  body.home-layout-ref #partner-promo .zp-promo-card__field-row,
  body.home-layout-ref #partner-promo .zp-promo-card__form {
    display: none;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit-wrap {
    order: 4;
    margin: 4px 0 0;
    width: auto;
    max-width: none;
    align-self: flex-start;
  }

  body.home-layout-ref #partner-promo .zp-promo-card__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    max-width: none;
    min-width: 0;
    min-height: 52px;
    padding: 0 28px;
    border-radius: 12px;
    font-size: clamp(13px, 3.65vw, 16px);
    line-height: 18px;
    font-weight: 600;
    white-space: nowrap;
    box-sizing: border-box;
    background: linear-gradient(135deg, var(--zp-gold) 0%, var(--zp-gold-hover) 100%);
    color: var(--zp-btn-text);
  }
}

/* --- Universal categories template block (after partner promo) --- */
body.home-layout-ref .zp-universal-categories.section.soft {
  margin-top: 24px;
  padding-top: 0;
  padding-bottom: 0;
  /* Фон только на .zp-universal-categories__shape; поля секции — белые */
  background: #ffffff;
}

body.home-layout-ref .zp-universal-categories > .wrap {
  width: min(100%, var(--wrap));
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

body.home-layout-ref .zp-universal-categories__section {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

body.home-layout-ref .zp-universal-categories__shape {
  border-radius: 40px;
  background: #f4f6fb;
  border: 1px solid #e1e6f2;
  min-height: 412px;
  overflow: hidden;
}

body.home-layout-ref .zp-universal-categories__content {
  width: 100%;
  min-height: 412px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 18px;
  padding: 28px 28px 28px 32px;
  box-sizing: border-box;
}

body.home-layout-ref .zp-universal-categories__left {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

body.home-layout-ref .zp-universal-categories__right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  justify-self: end;
}

body.home-layout-ref .zp-universal-categories__right--future {
  width: min(100%, 297px);
  padding: 22px 24px;
  border-radius: 28px;
  box-sizing: border-box;
  text-decoration: none;
  background: linear-gradient(152deg, #f8f6fc 0%, #ece8f6 52%, #f1f3f9 100%);
  border: 1px solid #e2dcef;
  box-shadow: 0 8px 22px rgba(59, 19, 92, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

body.home-layout-ref .zp-universal-categories__right--future:hover {
  transform: translateY(-2px);
  border-color: #d4caeb;
  box-shadow: 0 14px 32px rgba(59, 19, 92, 0.12);
}

body.home-layout-ref .zp-universal-categories__right--future:focus-visible {
  outline: 2px solid var(--zp-segment-accent);
  outline-offset: 2px;
}

body.home-layout-ref .zp-universal-categories__title {
  margin: 0;
  max-width: 620px;
  font-family: var(--zp-font-ui);
  font-size: 40px;
  line-height: 1.12;
  font-weight: 700;
  color: #273142;
}

body.home-layout-ref .zp-universal-categories__board {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(120px, auto));
  grid-template-areas:
    "portfolio reviews about"
    "portfolio questions career";
  gap: 14px;
  width: 100%;
  max-width: 923px;
}

body.home-layout-ref .zp-universal-categories__subtitle {
  margin: 0;
  text-align: center;
  font-family: var(--zp-font-ui);
  font-size: 28px;
  line-height: 1.15;
  font-weight: 700;
  color: #273142;
}

body.home-layout-ref .zp-universal-categories__item {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  overflow: hidden;
  min-height: 120px;
  padding: 18px 18px 18px 20px;
  border-radius: 24px;
  background: linear-gradient(152deg, #f8f6fc 0%, #ece8f6 52%, #f1f3f9 100%);
  border: 1px solid #e2dcef;
  box-shadow: 0 8px 22px rgba(59, 19, 92, 0.06);
  text-decoration: none;
  box-sizing: border-box;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

body.home-layout-ref .zp-universal-categories__item--portfolio {
  grid-area: portfolio;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 254px;
  padding: 22px 20px 20px 22px;
}

body.home-layout-ref .zp-universal-categories__item--reviews {
  grid-area: reviews;
}

body.home-layout-ref .zp-universal-categories__item--questions {
  grid-area: questions;
}

body.home-layout-ref .zp-universal-categories__item--about {
  grid-area: about;
}

body.home-layout-ref .zp-universal-categories__item--career {
  grid-area: career;
}

body.home-layout-ref .zp-universal-categories__item-label {
  position: relative;
  z-index: 2;
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(18px, 2.2vw, 24px);
  line-height: 1.2;
  font-weight: 700;
  color: #273142;
}

body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-label {
  max-width: 12em;
}

body.home-layout-ref .zp-universal-categories__item-icon {
  position: relative;
  flex: 0 0 auto;
  z-index: 1;
  width: 72px;
  height: 72px;
  margin: 0;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #e7def6;
  box-shadow: 0 8px 20px rgba(59, 19, 92, 0.1);
  pointer-events: none;
  user-select: none;
}

body.home-layout-ref .zp-universal-categories__item-icon-svg {
  display: block;
  width: 40px;
  height: 40px;
  color: #7c52d6;
}

body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon {
  width: 96px;
  height: 96px;
  border-radius: 22px;
  align-self: flex-end;
  margin-top: auto;
}

body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon-svg {
  width: 52px;
  height: 52px;
}

body.home-layout-ref .zp-universal-categories__item:hover,
body.home-layout-ref .zp-universal-categories__item:focus-visible {
  transform: translateY(-2px);
  border-color: #cfc2e8;
  box-shadow: 0 14px 32px rgba(59, 19, 92, 0.12);
}

body.home-layout-ref .zp-universal-categories__item:focus-visible {
  outline: 2px solid var(--zp-segment-accent);
  outline-offset: 2px;
}

body.home-layout-ref img.zp-universal-categories__visual {
  margin: 0;
  width: 268px;
  height: 335px;
  aspect-ratio: 4 / 5;
  max-width: 100%;
  display: block;
  object-fit: contain;
  object-position: center bottom;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

/* Desktop: cap card grid to 1440px baseline (314×254 / 290×120 / 291×120) */
@media (min-width: 1320px) {
  body.home-layout-ref .zp-universal-categories__board {
    --zp-uc-gap: 14px;
    --zp-uc-col-portfolio: 314px;
    --zp-uc-col-standard: 290px;
    --zp-uc-col-end: 291px;
    --zp-uc-row: 120px;
    grid-template-columns: var(--zp-uc-col-portfolio) var(--zp-uc-col-standard) var(--zp-uc-col-end);
    grid-template-rows: var(--zp-uc-row) var(--zp-uc-row);
    width: calc(
      var(--zp-uc-col-portfolio) + var(--zp-uc-col-standard) + var(--zp-uc-col-end) + 2 * var(--zp-uc-gap)
    );
    max-width: 100%;
  }

  body.home-layout-ref .zp-universal-categories__item {
    min-height: 0;
    height: var(--zp-uc-row);
    max-height: var(--zp-uc-row);
    padding: 16px 14px 16px 18px;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio {
    min-height: 0;
    height: auto;
    max-height: calc(2 * var(--zp-uc-row) + var(--zp-uc-gap));
    padding: 20px 18px 18px 20px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon {
    width: 76px;
    height: 76px;
    border-radius: 18px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon-svg {
    width: 42px;
    height: 42px;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon {
    width: 108px;
    height: 108px;
    border-radius: 22px;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon-svg {
    width: 56px;
    height: 56px;
  }

  body.home-layout-ref .zp-universal-categories__item-label {
    font-size: 24px;
  }
}

@media (max-width: 1319px) {
  body.home-layout-ref .zp-universal-categories__shape {
    min-height: 0;
    border-radius: 28px;
  }

  body.home-layout-ref .zp-universal-categories__content {
    grid-template-columns: 1fr;
    padding: 28px;
  }

  body.home-layout-ref .zp-universal-categories__right {
    justify-self: start;
    align-items: flex-start;
  }

  body.home-layout-ref .zp-universal-categories__right--future {
    border-radius: 24px;
  }

  body.home-layout-ref .zp-universal-categories__title {
    max-width: none;
    font-size: clamp(30px, 4.2vw, 42px);
  }

  body.home-layout-ref .zp-universal-categories__subtitle {
    text-align: left;
    font-size: clamp(24px, 3.4vw, 32px);
  }

  body.home-layout-ref .zp-universal-categories__board {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: minmax(112px, auto);
    grid-template-areas: none;
    width: 100%;
    max-width: none;
    gap: 12px;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio,
  body.home-layout-ref .zp-universal-categories__item--reviews,
  body.home-layout-ref .zp-universal-categories__item--questions,
  body.home-layout-ref .zp-universal-categories__item--about,
  body.home-layout-ref .zp-universal-categories__item--career {
    grid-area: auto;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    min-height: 112px;
    height: auto;
    max-height: none;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-label {
    max-width: none;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon {
    width: 72px;
    height: 72px;
    margin-top: 0;
    align-self: center;
  }

  body.home-layout-ref .zp-universal-categories__item--portfolio .zp-universal-categories__item-icon-svg {
    width: 40px;
    height: 40px;
  }

  body.home-layout-ref .zp-universal-categories__item {
    min-height: 112px;
    height: auto;
    max-height: none;
    padding: 16px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon {
    width: 64px;
    height: 64px;
    border-radius: 16px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon-svg {
    width: 36px;
    height: 36px;
  }

  body.home-layout-ref .zp-universal-categories__item-label {
    font-size: clamp(17px, 4.2vw, 22px);
  }

  body.home-layout-ref .zp-universal-categories__right--future {
    width: 100%;
    max-width: none;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
  }

  body.home-layout-ref .zp-universal-categories__right--future .zp-universal-categories__subtitle {
    flex: 1 1 auto;
    text-align: left;
    font-size: clamp(20px, 4.5vw, 26px);
  }

  body.home-layout-ref img.zp-universal-categories__visual {
    flex: 0 0 auto;
    width: min(120px, 32vw);
    height: auto;
    aspect-ratio: 4 / 5;
  }
}

@media (max-width: 479px) {
  body.home-layout-ref .zp-universal-categories__content {
    padding: 20px 16px;
    gap: 14px;
  }

  body.home-layout-ref .zp-universal-categories__title {
    font-size: clamp(24px, 7vw, 30px);
    line-height: 1.15;
  }

  body.home-layout-ref .zp-universal-categories__board {
    grid-template-columns: 1fr;
  }

  body.home-layout-ref .zp-universal-categories__item {
    min-height: 100px;
    padding: 14px 14px 14px 16px;
    gap: 10px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon {
    width: 56px;
    height: 56px;
  }

  body.home-layout-ref .zp-universal-categories__item-icon-svg {
    width: 32px;
    height: 32px;
  }

  body.home-layout-ref .zp-universal-categories__right--future {
    flex-direction: column;
    align-items: flex-start;
  }

  body.home-layout-ref img.zp-universal-categories__visual {
    width: min(200px, 72vw);
    align-self: center;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .zp-universal-categories__shape {
    border-radius: 20px;
  }

  body.home-layout-ref .zp-universal-categories__content {
    padding: 20px 18px;
  }
}

/* --- Тёмные секции с «волнами» --- */
.zp-wave-section {
  position: relative;
  background: linear-gradient(165deg, #1f1738 0%, var(--zp-wave-purple) 45%, #120e22 100%) !important;
  color: #fff !important;
  overflow: hidden;
}

.zp-wave-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='0.04' d='M0 160L48 154.7C96 149 192 139 288 144C384 149 480 171 576 165.3C672 160 768 128 864 122.7C960 117 1056 139 1152 149.3C1248 160 1344 160 1392 160L1440 160L1440 0L1392 0C1344 0 1248 0 1152 0C1056 0 960 0 864 0C768 0 672 0 576 0C480 0 384 0 288 0C192 0 96 0 48 0L0 0Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% 45%;
  pointer-events: none;
  opacity: 1;
}

.zp-wave-section .wrap,
.zp-wave-section .reviews-marquee-outer {
  position: relative;
  z-index: 1;
}

.zp-wave-section .kicker.light,
.zp-wave-section .reviews-eyebrow {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.15);
  color: #f5f0ff;
}

.zp-wave-section .h2,
.zp-wave-section h2,
.zp-wave-section h3 {
  color: #fff !important;
}

.zp-wave-section .lead,
.zp-wave-section .reviews-lead {
  color: rgba(255, 255, 255, 0.82) !important;
}

.zp-wave-section .btn.btn--vk,
.zp-wave-section .btn.primary {
  border: none;
}

/* Отзывы: карточки чуть контрастнее на фиолетовом */
body.home-layout-ref #reviews.tinted {
  background: transparent;
}

body.home-layout-ref #reviews .reviews-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

body.home-layout-ref #reviews .reviews-eyebrow {
  margin-inline: auto;
  text-transform: uppercase;
}

/* Отзывы: та же колонка и боковые поля, что у zp-showcase (не на всю ширину экрана) */
body.home-layout-ref #reviews.section.zp-wave-section {
  width: min(100%, var(--wrap));
  max-width: var(--wrap);
  margin-top: 24px;
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  padding-top: clamp(20px, 3vw, 32px);
  padding-bottom: clamp(20px, 3vw, 32px);
  box-sizing: border-box;
  border-radius: clamp(22px, 3.5vw, 40px);
  box-shadow: none;
  background-color: #120e22 !important;
  background-image: url("/images/zerkalo-proart/reviews/zp-reviews-section-bg.jpg?v=2026-05-14.89") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
}

body.home-layout-ref #reviews.section.zp-wave-section::before {
  display: none;
}

body.home-layout-ref #reviews.section.zp-wave-section > .wrap {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Лента отзывов: убрать боковые fade (::before/::after из zerkalo-main — «мутят» карточки на тёмном фоне) */
body.home-layout-ref #reviews .reviews-marquee-viewport::before,
body.home-layout-ref #reviews .reviews-marquee-viewport::after {
  display: none;
}

/* Отзывы: mobile — заголовок → лента; в карточке: автор → звёзды → текст */
@media (max-width: 767px) {
  body.home-layout-ref #reviews.section.zp-wave-section {
    background-position: 56% top !important;
    background-size: cover !important;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(12px, 3vw, 20px);
    width: min(100%, var(--wrap));
    max-width: var(--wrap);
    margin-left: auto;
    margin-right: auto;
    padding-top: clamp(24px, 5vw, 36px);
    padding-bottom: clamp(20px, 4vw, 28px);
    padding-left: max(0px, env(safe-area-inset-left, 0px));
    padding-right: max(0px, env(safe-area-inset-right, 0px));
    height: auto;
    min-height: 0;
    overflow: hidden;
  }

  body.home-layout-ref #reviews.section.zp-wave-section > .wrap {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  body.home-layout-ref #reviews .reviews-head {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  body.home-layout-ref #reviews .reviews-head .h2 {
    margin: 0;
    font-size: clamp(22px, 6vw, 28px);
    line-height: 1.15;
  }

  body.home-layout-ref #reviews .reviews-marquee-outer {
    order: unset;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
    overflow: visible;
  }

  body.home-layout-ref #reviews .reviews-marquee-viewport {
    width: 100%;
    max-width: 100%;
    padding: 4px 0 12px;
    margin: 0;
    -webkit-overflow-scrolling: touch;
  }

  body.home-layout-ref #reviews .reviews-marquee-track {
    gap: 14px;
  }

  body.home-layout-ref #reviews .review-card {
    --review-avatar: 56px;
    --review-card-max: min(320px, calc(100vw - 56px));
    --review-pad-y: 18px;
    --review-pad-x: 16px;
    --review-inner-gap: 12px;
    --review-quote-size: clamp(15px, 4vw, 17px);
    --review-stars-size: clamp(15px, 4vw, 17px);
    width: min(var(--review-card-max), calc(100vw - 56px));
    max-width: calc(100vw - 56px);
    padding: var(--review-pad-y) var(--review-pad-x);
    border-radius: 18px;
  }

  body.home-layout-ref #reviews .review-card__top {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
  }

  body.home-layout-ref #reviews .review-card__person {
    width: 100%;
    gap: 12px;
  }

  body.home-layout-ref #reviews .review-card__meta {
    min-width: 0;
    flex: 1 1 auto;
  }

  body.home-layout-ref #reviews .review-card__name,
  body.home-layout-ref #reviews .review-card__role {
    overflow-wrap: anywhere;
  }

  body.home-layout-ref #reviews .review-card__stars {
    align-self: flex-start;
    padding-top: 0;
    letter-spacing: 2px;
  }

  body.home-layout-ref #reviews .review-card__quote {
    line-height: 1.55;
    width: 100%;
  }

  body.home-layout-ref #reviews .reviews-more {
    margin-top: 8px;
    width: 100%;
  }

  body.home-layout-ref #reviews .reviews-more .btn {
    width: 100%;
    max-width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }
}

@media (max-width: 640px) {
  body.home-layout-ref #reviews.section.zp-wave-section {
    border-radius: 18px;
  }

  body.home-layout-ref #reviews .review-card {
    --review-avatar: 48px;
    width: min(300px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
  }
}

/* --- FAQ: Figma 93-162 (иконка + аккордеон) --- */
body.home-layout-ref #faq .kicker.light {
  display: none;
}

body.home-layout-ref #faq.section.soft {
  padding-top: 24px;
  padding-bottom: 24px;
  margin-top: 24px;
}

body.home-layout-ref #faq > .wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
}

body.home-layout-ref .zp-faq-layout {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

body.home-layout-ref .zp-faq-layout__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  color: var(--zp-figma-text, #414544);
}

body.home-layout-ref .zp-faq-layout__icon svg {
  display: block;
  width: 48px;
  height: 48px;
}

body.home-layout-ref .zp-faq-layout__main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 9px;
}

body.home-layout-ref #faq .h2,
body.home-layout-ref .zp-faq-layout__main .h2 {
  margin: 0;
  text-align: left;
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--zp-figma-text, #414544);
}

body.home-layout-ref #faq .faq {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
}

body.home-layout-ref #faq .faq-item {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 9px;
  background: var(--zp-figma-faq-closed, #f0f2f5);
  box-shadow: none;
  overflow: hidden;
}

body.home-layout-ref #faq .faq-item.open {
  background: var(--zp-figma-faq-open, #e6eaff);
  border: none;
  box-shadow: none;
  overflow: visible;
}

body.home-layout-ref #faq .faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  padding: 16px 24px;
  box-sizing: border-box;
  outline: none;
}

body.home-layout-ref #faq .faq-q:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(106, 60, 200, 0.35);
}

body.home-layout-ref #faq .faq-q h3 {
  margin: 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: var(--zp-figma-text, #414544);
  flex: 1;
  min-width: 0;
}

body.home-layout-ref #faq .faq-item.open .faq-q h3 {
  color: var(--zp-figma-text, #414544);
}

body.home-layout-ref #faq .faq-q__icon {
  flex-shrink: 0;
  width: 10px;
  height: 11px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  position: relative;
  display: inline-block;
}

body.home-layout-ref #faq .faq-q__icon::before {
  content: "";
  display: block;
  width: 8px;
  height: 6px;
  margin: 0 auto;
  background: var(--zp-figma-text, #414544);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  transition: transform 0.2s ease;
}

body.home-layout-ref #faq .faq-q__icon::after {
  display: none;
}

body.home-layout-ref #faq .faq-item.open .faq-q__icon::before {
  transform: rotate(180deg);
}

body.home-layout-ref #faq .faq-a {
  color: var(--zp-figma-text, #414544);
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  max-height: 0;
  overflow: hidden;
  padding: 0 24px;
  margin: 0;
  opacity: 0;
  transition:
    max-height 0.35s ease,
    padding 0.35s ease,
    opacity 0.25s ease;
}

body.home-layout-ref #faq .faq-item.open .faq-a {
  max-height: 2400px;
  overflow: visible;
  padding: 0 24px 16px;
  opacity: 1;
}

@media (max-width: 520px) {
  body.home-layout-ref .zp-faq-layout {
    flex-direction: column;
    gap: 12px;
  }

  body.home-layout-ref .zp-faq-layout__main {
    padding-top: 0;
  }

  body.home-layout-ref #faq .faq-q {
    padding: 14px 16px;
    min-height: 52px;
  }
}

/* --- Блок «Мы помогаем» --- */
.zp-we-help {
  padding: clamp(16px, 2.5vw, 24px) 0;
  background: transparent;
}

.zp-we-help__inner {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 12px 24px 12px 54px;
  background: transparent;
  border-radius: 0;
  box-sizing: border-box;
}

body.home-layout-ref .zp-we-help {
  margin: 12px auto 0;
  padding: clamp(16px, 2.5vw, 24px) 0;
  background: transparent;
}

body.home-layout-ref #zp-we-help.section.soft {
  background: linear-gradient(180deg, #fbfafc 0, var(--bg-soft) 100%);
}

body.home-layout-ref .zp-we-help__inner {
  background: transparent;
  border-radius: 0;
}

body.home-layout-ref .zp-we-help h2 {
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  margin: 0;
  text-align: left;
  color: var(--zp-figma-text);
}

body.home-layout-ref .zp-we-help__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 16px;
  width: 100%;
}

body.home-layout-ref .zp-we-help__body {
  width: min(1192px, 100%);
  display: flex;
  flex-direction: column;
  gap: 24px;
}

body.home-layout-ref .zp-we-help__lead,
body.home-layout-ref .zp-we-help__preview {
  width: min(1192px, 100%);
  margin: 0;
  color: #414544;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}

body.home-layout-ref #zp-we-help:not(.is-collapsed) .zp-we-help__preview {
  display: none;
}

body.home-layout-ref .zp-we-help p {
  margin: 0;
  color: #414544;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}

body.home-layout-ref .zp-we-help p strong {
  color: #414544;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
}

body.home-layout-ref .zp-we-help p a {
  color: #3b135c;
  text-decoration: none;
}

body.home-layout-ref .zp-we-help p a:hover {
  text-decoration: underline;
}

body.home-layout-ref .zp-we-help__collapse {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: #3b135c;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  padding: 0;
  cursor: pointer;
  align-self: flex-start;
}

body.home-layout-ref .zp-we-help__collapse-icon {
  display: inline-block;
  width: 10px;
  height: 11px;
  flex-shrink: 0;
  background: #3b135c;
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  transition: transform 0.2s ease;
}

body.home-layout-ref #zp-we-help:not(.is-collapsed) .zp-we-help__collapse-icon {
  transform: rotate(180deg);
}

body.home-layout-ref #zp-we-help.is-collapsed .zp-we-help__body {
  display: none;
}

body.home-layout-ref #zp-we-help.is-collapsed .zp-we-help__content {
  gap: 12px;
  margin-top: 16px;
}

body.home-layout-ref .zp-we-help__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

body.home-layout-ref .zp-we-help__tab {
  flex: 0 0 auto;
  margin: 0;
  padding: 10px 18px;
  border: 1px solid rgba(59, 19, 92, 0.18);
  border-radius: 999px;
  background: #fff;
  color: #3b135c;
  font-family: var(--zp-font-ui);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body.home-layout-ref .zp-we-help__tab.is-active {
  background: #3b135c;
  border-color: #3b135c;
  color: #fff;
}

body.home-layout-ref .zp-we-help__tab:hover:not(.is-active) {
  border-color: rgba(59, 19, 92, 0.35);
  background: rgba(59, 19, 92, 0.06);
}

body.home-layout-ref .zp-we-help__tab:focus-visible {
  outline: 2px solid #7c4ddf;
  outline-offset: 2px;
}

body.home-layout-ref .zp-we-help__panels {
  width: 100%;
}

body.home-layout-ref .zp-we-help__panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: min(1192px, 100%);
}

body.home-layout-ref .zp-we-help__panel[hidden] {
  display: none !important;
}

body.home-layout-ref .zp-we-help__panel-title {
  margin: 0;
  color: var(--zp-figma-text);
  font-family: var(--zp-font-ui);
  font-size: 20px;
  line-height: 1.3;
  font-weight: 700;
}

body.home-layout-ref .zp-we-help__queries-title {
  margin: 0;
  color: #414544;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
}

body.home-layout-ref .zp-we-help__queries-group {
  margin: 12px 0 0;
  color: #3b135c;
  font-family: var(--zp-font-ui);
  font-size: 15px;
  line-height: 1.4;
  font-weight: 700;
}

body.home-layout-ref .zp-we-help__queries-group:first-of-type {
  margin-top: 0;
}

body.home-layout-ref .zp-we-help__queries {
  margin: 0;
  padding-left: 1.25em;
  color: #414544;
  font-size: 15px;
  line-height: 1.65;
  font-weight: 500;
}

body.home-layout-ref .zp-we-help__queries li + li {
  margin-top: 6px;
}

body.home-layout-ref .zp-we-help__footer {
  width: min(1192px, 100%);
  margin: 0;
  padding-top: 8px;
  border-top: 1px solid rgba(59, 19, 92, 0.1);
  color: #414544;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}

/* SEO keywords — блок часто на body (не внутри main); селекторы без main */
.zp-seo-keywords.zp-we-help {
  padding: 0;
  margin: 0 0 8px;
  background: transparent;
}

.zp-seo-keywords .zp-seo-keywords__inner {
  padding: 14px 0 22px;
  gap: 0;
}

.zp-seo-keywords .zp-seo-keywords__teaser-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid rgba(65, 69, 68, 0.12);
  border-radius: 12px;
  background: #f7f6f8;
  box-sizing: border-box;
}

.zp-seo-keywords.is-collapsed .zp-seo-keywords__teaser-row {
  margin: 0;
}

.zp-seo-keywords .zp-seo-keywords__teaser {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #5a5460;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}

.zp-seo-keywords .zp-seo-keywords__teaser-label {
  color: #2f2a35;
  font-weight: 700;
}

.zp-seo-keywords .zp-seo-keywords__teaser-meta {
  color: #7a7388;
  font-weight: 600;
}

.zp-seo-keywords .zp-seo-keywords__collapse {
  flex: 0 0 auto;
  margin: 0;
  padding: 8px 14px;
  min-height: 40px;
  font-size: 15px;
  line-height: 20px;
  font-weight: 700;
}

.zp-seo-keywords.is-collapsed .zp-seo-keywords__expand,
.zp-seo-keywords.is-preview .zp-seo-keywords__expand {
  display: flex !important;
  flex-direction: column;
  /* ~25 строк списка запросов (15px × 1.65) + вкладки/заголовок */
  max-height: calc(1.65em * 25 + 7rem);
  overflow: hidden !important;
  margin-top: 12px;
  position: relative;
  -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
  /* не даём гигантскому .zp-we-help__body раздувать scrollHeight страницы */
  contain: layout paint;
}

.zp-seo-keywords:not(.is-collapsed) .zp-seo-keywords__expand {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  max-height: none;
  overflow: visible;
  contain: none;
  -webkit-mask-image: none;
  mask-image: none;
}

.zp-seo-keywords:not(.is-collapsed) .zp-seo-keywords__teaser {
  white-space: normal;
}

.zp-seo-keywords h2[id$="-title"] {
  display: none;
}

@media (max-width: 767px) {
  .zp-seo-keywords .zp-seo-keywords__teaser-row {
    flex-wrap: wrap;
    min-height: 48px;
    padding: 12px 14px;
  }

  .zp-seo-keywords .zp-seo-keywords__teaser {
    font-size: 15px;
    line-height: 22px;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref .zp-we-help__tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 4px;
  }

  body.home-layout-ref .zp-we-help__tab {
    white-space: nowrap;
    font-size: 13px;
    padding: 9px 14px;
  }

  body.home-layout-ref .zp-we-help__panel-title {
    font-size: 18px;
  }
}

/* --- Контакты / CTA соцсетей --- */
body.home-layout-ref .contact-card__proofs,
body.home-layout-ref .contact-card__cta-messenger {
  display: none !important;
}

body.home-layout-ref .section--contacts-cta.zp-wave-section {
  padding: 0 0 clamp(28px, 4vw, 52px);
  background: #ffffff;
  background-image: none !important;
}

body.home-layout-ref .section--contacts-cta {
  background: #ffffff !important;
}

body.home-layout-ref .section--contacts-cta > .wrap {
  background: transparent !important;
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

body.home-layout-ref .section--contacts-cta.zp-wave-section::before {
  display: none;
}

body.home-layout-ref .section--contacts-cta .final-cta {
  margin: 0;
  border-radius: 30px;
  padding: 24px 32px 18px;
  background-color: #1a0a36;
  background-image: url("/images/zerkalo-proart/contacts/contacts-cta-bg.jpg?v=2026-05-15");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  text-align: center;
}

body.home-layout-ref .section--contacts-cta .kicker {
  display: none !important;
}

body.home-layout-ref .section--contacts-cta .kicker,
body.home-layout-ref .section--contacts-cta .final-cta > h3,
body.home-layout-ref .section--contacts-cta .final-cta > p {
  color: rgba(255, 255, 255, 0.92);
}

body.home-layout-ref .section--contacts-cta .final-cta > h3 {
  font-size: 28px;
  font-weight: 700;
  line-height: 28px;
  margin: 0;
}

body.home-layout-ref .section--contacts-cta .contacts-subtitle,
body.home-layout-ref .section--contacts-cta .final-cta > p {
  display: none !important;
}

body.home-layout-ref .section--contacts-cta .drawer__social-link img {
  width: 80px;
  height: 80px;
}

body.home-layout-ref .section--contacts-cta .drawer__social-list {
  gap: 24px;
}

body.home-layout-ref .section--contacts-cta .contacts-subtitle {
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 20px;
  line-height: 1.3;
  font-weight: 600;
}

body.home-layout-ref .section--contacts-cta .final-cta > p {
  display: none;
}

body.home-layout-ref .section--contacts-cta .contact-grid,
body.home-layout-ref .section--contacts-cta .contact-card {
  display: block;
}

body.home-layout-ref .section--contacts-cta .contact-grid {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

body.home-layout-ref .section--contacts-cta .contact-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0;
  padding: 0;
}

body.home-layout-ref .section--contacts-cta .social-fast {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
}

body.home-layout-ref .section--contacts-cta .social-fast {
  margin-top: 18px !important;
}

body.home-layout-ref .section--contacts-cta .drawer__social-list {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  justify-content: center;
  gap: 14px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
}

body.home-layout-ref .section--contacts-cta .drawer__social-link {
  min-width: 56px;
  padding: 0;
}

body.home-layout-ref .section--contacts-cta .drawer__social-link img {
  width: 56px;
  height: 56px;
}

body.home-layout-ref .section--contacts-cta .drawer__social-caption {
  display: none;
}

body.home-layout-ref .contact-card__cta-messenger .btn.primary {
  background: linear-gradient(180deg, var(--zp-gold) 0%, #d4b045 100%);
  color: #1a1433 !important;
}

/* --- После CTA контактов: два акцента (структура как «две колонки» премиум-блока) --- */
body.home-layout-ref .section--value-pair {
  display: none !important;
  background: #eef1f5;
  padding: clamp(28px, 4vw, 48px) 0 clamp(36px, 5vw, 56px);
  color: #18152a;
}

body.home-layout-ref .section--value-pair > .wrap {
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

body.home-layout-ref .value-pair-section__title {
  font-size: clamp(22px, 1.8vw, 28px);
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 clamp(16px, 2.2vw, 22px);
  color: #1a1433;
  text-align: center;
}

body.home-layout-ref .value-pair-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.5vw, 28px);
  align-items: stretch;
}

body.home-layout-ref .value-pair-card {
  background: #ffffff;
  border-radius: clamp(20px, 2.5vw, 28px);
  padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 32px);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
}

body.home-layout-ref .value-pair-card__eyebrow {
  margin: 0 0 10px;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--violet-2);
}

body.home-layout-ref .value-pair-card__title {
  margin: 0 0 12px;
  font-size: clamp(20px, 1.5vw, 26px);
  font-weight: 800;
  line-height: 1.2;
  color: #1a1433;
}

body.home-layout-ref .value-pair-card__text {
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.55;
  color: #5c5470;
  flex: 1 1 auto;
}

body.home-layout-ref .value-pair-card__btn {
  margin-top: auto;
}

@media (max-width: 720px) {
  body.home-layout-ref .value-pair-grid {
    grid-template-columns: 1fr;
  }
}

/* --- Футер: Figma 1:2529 (light) ---
   Фоновая лента футера тянется на всю ширину экрана, контент центрируется
   внутренней сеткой .footer-grid (колонка 1440px — как .nav). */
body.home-layout-ref footer#contacts.footer {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

body.home-layout-ref .footer {
  background: #f0f2f5;
  padding: 32px 0 48px;
}

body.home-layout-ref .footer-grid {
  width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
  max-width: var(--content-max, 1440px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(240px, 288px) minmax(0, 1fr);
  gap: 20px 28px;
  align-items: start;
  box-sizing: border-box;
}

body.home-layout-ref .footer-nav-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

body.home-layout-ref .footer-nav__columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 224px));
  gap: 28px 32px;
  align-items: start;
}

body.home-layout-ref .footer-nav__col {
  min-width: 0;
}

body.home-layout-ref .footer-nav__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: default;
  box-sizing: border-box;
}

body.home-layout-ref .footer-nav__title {
  margin: 0;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 700;
  color: #414544;
}

body.home-layout-ref .footer-nav__chev {
  display: none;
  flex-shrink: 0;
  color: #3b135c;
  transition: transform 0.2s ease;
}

body.home-layout-ref .footer-nav__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.home-layout-ref .footer-nav__panel {
  margin-top: 12px;
}

body.home-layout-ref .footer-nav__link {
  display: inline-block;
  color: #3b135c !important;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

body.home-layout-ref .footer-nav__link:hover {
  color: #2a0d42 !important;
  text-decoration: underline !important;
}

body.home-layout-ref .footer-nav__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}

body.home-layout-ref .footer-nav__meta .city-strip--footer {
  margin-top: 0;
  margin-bottom: 0;
}

body.home-layout-ref .footer-nav__lang-row {
  margin: 0;
}

body.home-layout-ref .footer-grid > div:first-child .brand {
  margin-bottom: 0;
}

body.home-layout-ref .footer-grid > div:first-child .brand-logo {
  width: 257px;
  height: 64px;
}

body.home-layout-ref .footer-social-row {
  margin-top: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}

body.home-layout-ref .footer-social-row__link {
  display: inline-flex;
  width: 36px;
  height: 36px;
}

body.home-layout-ref .footer-social-row__link img {
  width: 36px;
  height: 36px;
  display: block;
}

/* Держим этот длинный пункт футера в одну строку */
body.home-layout-ref .footer-nav__link[href="/pages/usluga-pechat-kartiny-na-metalle-4k.html"] {
  white-space: nowrap;
}

body.home-layout-ref .footer-grid > div:first-child small {
  display: none;
}

body.home-layout-ref .footer-grid > div:first-child small.footer-legal__copy--left {
  display: block;
  margin-top: 8px;
  color: #5f6070;
  font-size: 14px;
  line-height: 20px;
}

body.home-layout-ref .footer-contact-lines {
  margin-top: 16px;
}

body.home-layout-ref .footer-phone {
  color: #3b135c !important;
  font-weight: 700;
  font-size: clamp(19px, 2vw, 22px);
  line-height: 1.35;
}

body.home-layout-ref .footer-hours {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 6px 0 10px;
  color: #5f6070;
  font-size: 14px;
  line-height: 1.35;
  font-weight: 600;
}

body.home-layout-ref .footer-hours__title {
  color: #414544;
  font-weight: 700;
}

body.home-layout-ref .footer-hours__text {
  font-weight: 600;
}

body.home-layout-ref .footer-phone-note {
  color: #5f6070;
  font-weight: 700;
}

body.home-layout-ref .footer-grid strong,
body.home-layout-ref .footer-legal__title {
  color: #414544 !important;
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  margin-bottom: 20px !important;
}

body.home-layout-ref .footer-grid a,
body.home-layout-ref .footer-legal__link {
  color: #3b135c !important;
  font-size: 16px;
  line-height: 28px;
  text-decoration: none;
}

body.home-layout-ref .footer-grid a:hover,
body.home-layout-ref .footer-legal__link:hover {
  text-decoration: underline;
}

body.home-layout-ref .footer-legal {
  border-left: none;
  padding-left: 24px;
}

body.home-layout-ref .footer-legal .city-strip--footer {
  margin-top: 14px;
  margin-bottom: 0;
  width: fit-content;
  max-width: 100%;
}

body.home-layout-ref .footer-legal .city-strip--footer .city-strip__btn {
  width: fit-content;
  max-width: 100%;
}

body.home-layout-ref .footer-legal__line {
  color: #414544;
  font-size: 14px;
  line-height: 22px;
  margin: 0;
}

body.home-layout-ref .footer-legal__copy {
  color: #5f6070;
}

/* Подвал: как только десктопный ряд (бренд + 4 колонки меню) перестаёт
   помещаться в одну строку (≤1319px), сразу переключаемся на мобильную
   версию — аккордеон в одну колонку. Единое условие для всех подвалов сайта. */
@media (max-width: 1319px) {
  body.home-layout-ref {
    --zp-footer-mobile-pad-x: clamp(16px, 4vw, 24px);
  }

  body.home-layout-ref .footer-grid {
    display: flex;
    flex-direction: column;
    gap: 24px 20px;
    padding-left: max(var(--zp-footer-mobile-pad-x), env(safe-area-inset-left, 0px));
    padding-right: max(var(--zp-footer-mobile-pad-x), env(safe-area-inset-right, 0px));
    box-sizing: border-box;
  }

  /* Левая колонка: лого скрыто; навигация → соцсети → контакты */
  body.home-layout-ref .footer-grid > div:first-child {
    display: contents;
  }

  body.home-layout-ref .footer-grid > div:first-child .brand {
    display: none;
  }

  body.home-layout-ref .footer-nav-col {
    order: 1;
    width: 100%;
  }

  body.home-layout-ref .footer-social-row {
    order: 2;
    margin-top: 16px;
    margin-bottom: -10px;
  }

  body.home-layout-ref .footer-contact-lines {
    order: 3;
    margin-top: 0;
  }

  body.home-layout-ref .footer-legal {
    padding-left: 0;
    min-width: 0;
  }

  body.home-layout-ref .footer-nav__columns {
    grid-template-columns: 1fr;
    gap: 0;
  }

  body.home-layout-ref .footer-nav__col {
    border-bottom: 1px solid rgba(59, 19, 92, 0.12);
  }

  body.home-layout-ref .footer-nav__col:first-child {
    border-top: 1px solid rgba(59, 19, 92, 0.12);
  }

  body.home-layout-ref .footer-nav__toggle {
    min-height: 56px;
    padding: 12px 0;
    cursor: pointer;
  }

  body.home-layout-ref .footer-nav__chev {
    display: block;
  }

  body.home-layout-ref .footer-nav__col.is-open .footer-nav__chev {
    transform: rotate(180deg);
  }

  body.home-layout-ref .footer-nav__panel {
    margin-top: 0;
    padding-bottom: 8px;
  }

  body.home-layout-ref .footer-nav__col:not(.is-open) .footer-nav__panel {
    display: none;
  }

  body.home-layout-ref .footer-nav__list {
    gap: 0;
  }

  body.home-layout-ref .footer-nav__link {
    display: flex;
    align-items: center;
    min-height: 41px;
    width: 100%;
    line-height: 1.35;
    font-size: 15px;
  }

  body.home-layout-ref .footer-social-row {
    flex-wrap: wrap;
  }

  body.home-layout-ref .footer-legal .city-strip--footer {
    width: 100%;
    max-width: 100%;
  }

  body.home-layout-ref .footer-legal .city-strip--footer .city-strip__btn {
    width: 100%;
    max-width: 100%;
  }

  body.home-layout-ref .footer-legal__row--sitemap-lang {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 14px;
  }

  body.home-layout-ref .footer-legal__row--sitemap-lang .footer-legal__link {
    margin-bottom: 0;
  }

  body.home-layout-ref .footer-legal .lang-switch--footer {
    margin-left: auto;
    flex-shrink: 0;
  }
}

/* Узкие экраны: чуть больше гаттеров и место под нижнюю мобильную панель */
@media (max-width: 767px) {
  body.home-layout-ref {
    --zp-footer-mobile-pad-x: clamp(20px, 6vw, 28px);
  }

  body.home-layout-ref .footer-grid {
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
  }

  body.home-layout-ref .footer {
    padding-bottom: var(--safe-bottom);
  }

}

/* --- Homepage: одна колонка контента на всех ширинах (как .nav), без скачка --wrap на 1320px --- */
body.home-layout-ref section.zp-process > .wrap,
body.home-layout-ref section.zp-home-mini-faq > .wrap,
body.home-layout-ref section.zp-showcase > .wrap,
body.home-layout-ref #partner-promo > .wrap.zp-promo-stack,
body.home-layout-ref #zp-universal-categories-template > .wrap,
body.home-layout-ref .zp-universal-categories > .wrap,
body.home-layout-ref #zp-we-help > .wrap.zp-we-help__inner,
body.home-layout-ref section.zp-process > .zp-process__cta {
  width: min(100%, var(--zp-home-col-w, min(100%, var(--content-max, 1440px))));
  max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* --- Homepage desktop ≥1320: герой (геометрия только на широком десктопе) --- */
@media (min-width: 1320px) {
  body.home-layout-ref #top.hero {
    --zp-hero-banner-max-w: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    --zp-hero-banner-max-h: none;
  }

  body.home-layout-ref #top .zp-hero-panel {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }

  body.home-layout-ref #top .hero-copy__top {
    width: 100%;
    max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }
}

@media (min-width: 1320px) {
  body.home-layout-ref #faq > .wrap > .zp-faq-layout {
    width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    max-width: var(--content-max, 1440px);
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }
}

/* === Figma: Nunito, кнопки, типографика (телефоны и city-picker без изменений) === */
body.home-layout-ref .city-strip,
body.home-layout-ref .city-strip *:not(svg):not(path):not(circle),
body.home-layout-ref #city-picker-dialog,
body.home-layout-ref #city-picker-dialog *:not(svg):not(path):not(circle),
body.home-layout-ref a.footer-phone,
body.home-layout-ref .footer-phone,
body.home-layout-ref #footerPhoneMobile,
body.home-layout-ref .nav-mobile-phone__tel,
body.home-layout-ref .nav-mobile-phone__free {
  font-family: var(--zp-font-unchanged) !important;
}

body.home-layout-ref .btn.primary,
body.home-layout-ref a.btn.primary,
body.home-layout-ref button.btn.primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  padding: 8px 36px;
  min-height: 60px;
  border: none;
  border-radius: 15px;
  font-family: var(--zp-font-ui);
  font-size: 18px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  background: linear-gradient(90deg, var(--zp-mock-gold-a) 0%, var(--zp-mock-gold-b) 100%);
  color: var(--zp-figma-btn-text) !important;
  box-shadow: none;
  transition: filter 0.2s ease;
}

body.home-layout-ref .btn.primary:hover {
  filter: brightness(1.03);
  box-shadow: none;
  transform: none;
}

body.home-layout-ref .btn.secondary {
  font-family: var(--zp-font-ui);
  font-weight: 600;
  border-radius: 15px;
}

body.home-layout-ref .h2,
body.home-layout-ref h2.h2 {
  font-family: var(--zp-font-ui);
  font-weight: 700;
  color: var(--zp-figma-text);
}

body.home-layout-ref .lead,
body.home-layout-ref p.lead {
  font-family: var(--zp-font-ui);
  font-weight: 500;
  color: var(--zp-figma-text);
}

body.home-layout-ref .zp-showcase__title {
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 4vw, 28px);
  line-height: 1.15;
  font-weight: 700;
  color: var(--zp-figma-purple);
}

body.home-layout-ref .zp-showcase-card__body h3 {
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  color: var(--zp-figma-text);
}

body.home-layout-ref .zp-showcase-card__desc {
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
  color: var(--zp-figma-text);
}

body.home-layout-ref .zp-showcase-card__body,
body.home-layout-ref .zp-showcase-card__media {
  padding-left: 0;
  padding-right: 0;
}

body.home-layout-ref .zp-showcase-card__shot.product-shot,
body.home-layout-ref .zp-showcase-card__img,
body.home-layout-ref .zp-showcase-card .ba {
  border-radius: 20px;
}

body.home-layout-ref .zp-showcase-card__more {
  font-size: 20px;
  line-height: 28px;
  font-weight: 400;
}

body.home-layout-ref .value-pair-section__title {
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  color: var(--zp-figma-text);
}

body.home-layout-ref .value-pair-card__title {
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
}

body.home-layout-ref .value-pair-card__text {
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
}

body.home-layout-ref .section--contacts-cta .final-cta > h3,
body.home-layout-ref .section--contacts-cta .contacts-subtitle {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .nav-links a,
body.home-layout-ref .nav-links__mega-trigger {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .brand-wordmark__line1,
body.home-layout-ref .brand-wordmark__line2 {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .footer-legal__title,
body.home-layout-ref .footer-legal__link,
body.home-layout-ref .footer-legal__line,
body.home-layout-ref .footer-legal__copy {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .footer h4,
body.home-layout-ref .footer a:not(.footer-phone) {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .nav-mobile-panel.font-display,
body.home-layout-ref .nav-mobile-panel.font-display a:not(.nav-mobile-phone__tel):not(.nav-mobile-phone__free) {
  font-family: var(--zp-font-ui);
}

body.home-layout-ref .reviews-card,
body.home-layout-ref .reviews-card__name,
body.home-layout-ref .reviews-card__text {
  font-family: var(--zp-font-ui);
}

/* --- PDF-макет: блоки вне потока главной скрыты классом .zp-mockup-hide --- */
body.home-layout-ref .zp-mockup-hide {
  display: none !important;
}

body.home-layout-ref .zp-mockup-hide-rev-lead {
  display: none !important;
}

body.home-layout-ref .footer-legal > .footer-legal__link {
  display: block;
  margin-bottom: 10px;
}

/* --- Спокойный UI: без пульсации/перелива, без крупных теней, Nunito в интерфейсе --- */
body.home-layout-ref .btn.primary,
body.home-layout-ref a.btn.primary,
body.home-layout-ref button.btn.primary,
body.home-layout-ref .nav-cta {
  animation: none !important;
  overflow: visible;
  isolation: auto;
  box-shadow: none !important;
  transform: none !important;
}

body.home-layout-ref .btn.primary::before,
body.home-layout-ref .btn.primary::after,
body.home-layout-ref a.btn.primary::before,
body.home-layout-ref a.btn.primary::after,
body.home-layout-ref button.btn.primary::before,
body.home-layout-ref button.btn.primary::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

body.home-layout-ref .btn.primary:hover,
body.home-layout-ref .btn.primary:focus-visible,
body.home-layout-ref a.btn.primary:hover,
body.home-layout-ref button.btn.primary:hover,
body.home-layout-ref .nav-cta:hover {
  animation: none !important;
  transform: none !important;
  box-shadow: none !important;
}

body.home-layout-ref .nav-scroll-discount__pulse,
body.home-layout-ref .nav-scroll-discount__cta {
  animation: none !important;
}

body.home-layout-ref .drawer__social-link.drawer__social-link--img,
body.home-layout-ref .section--contacts-cta .drawer__social-link.drawer__social-link--img {
  animation: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  overflow: visible !important;
  isolation: auto !important;
}

body.home-layout-ref .drawer__social-link.drawer__social-link--img::before,
body.home-layout-ref .drawer__social-link.drawer__social-link--img::after,
body.home-layout-ref .section--contacts-cta .drawer__social-link.drawer__social-link--img::before,
body.home-layout-ref .section--contacts-cta .drawer__social-link.drawer__social-link--img::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

body.home-layout-ref .drawer__social-link.drawer__social-link--img:hover,
body.home-layout-ref .section--contacts-cta .drawer__social-link.drawer__social-link--img:hover {
  transform: none !important;
  animation: none !important;
}

body.home-layout-ref .drawer__social-link.drawer__social-link--img img {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

body.home-layout-ref #top .zp-hero-panel,
body.home-layout-ref #reviews.section.zp-wave-section,
body.home-layout-ref #faq > .wrap,
body.home-layout-ref .value-pair-card,
body.home-layout-ref .section--contacts-cta .final-cta {
  box-shadow: none !important;
}

body.home-layout-ref .font-display,
body.home-layout-ref .nav-mobile-panel.font-display {
  font-family: var(--zp-font-ui) !important;
}

/* === Внутренние страницы: общий адаптивный baseline (2026-05-28) === */
body.home-layout-ref:not(.page-usluga-interior) {
  overflow-x: clip;
}

body.home-layout-ref.page-service-empty,
body.home-layout-ref.page-kontakty {
  overflow-x: clip;
}

body.home-layout-ref #navMobile + section.about-page-hero,
body.home-layout-ref #navMobile + section.section,
body.home-layout-ref #navMobile + section.policy-page {
  padding-top: var(--zp-site-content-offset);
  box-sizing: border-box;
}

body.home-layout-ref .about-page-hero .wrap,
body.home-layout-ref .about-page-body > .wrap,
body.home-layout-ref .policy-page > .wrap {
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

body.home-layout-ref .blog-list,
body.home-layout-ref .blog-article {
  width: min(100%, var(--wrap));
  max-width: var(--wrap);
  margin-inline: auto;
  padding-left: max(0px, env(safe-area-inset-left, 0px));
  padding-right: max(0px, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

@media (max-width: 720px) {
  body.home-layout-ref .service-hub__nav {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  body.home-layout-ref .service-page-empty,
  body.home-layout-ref .service-page-hub {
    padding-left: 0;
    padding-right: 0;
    min-height: 36vh;
  }

  body.home-layout-ref .service-hub__list a {
    padding: 8px 0;
    font-size: 15px;
    line-height: 1.35;
  }
}

@media (max-width: 480px) {
  body.home-layout-ref .service-page-empty__title,
  body.home-layout-ref .service-hub__title {
    font-size: clamp(22px, 6.5vw, 28px);
  }
}

/* Mobile/tablet hero ≤1319px — holst-баннер (не перебивать display:contents и absolute CTA) */
@media (max-width: 1319px) {
  body.home-layout-ref #top .hero-copy {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__intro {
    display: contents !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__text {
    display: contents !important;
    position: static !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    position: absolute !important;
    top: var(--zp-hero-m-h1-top) !important;
    left: var(--zp-hero-m-copy-pad-x) !important;
    width: var(--zp-hero-m-copy-w) !important;
    max-width: var(--zp-hero-m-copy-w) !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__intro [data-i18n='hero.lead'],
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__text .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-copy__text [data-i18n='hero.lead'] {
    position: absolute !important;
    top: var(--zp-hero-m-lead-top) !important;
    left: var(--zp-hero-m-copy-pad-x) !important;
    width: var(--zp-hero-m-copy-w) !important;
    max-width: var(--zp-hero-m-copy-w) !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='3']):not([data-hero-mobile-layout='stack']) .hero-actions {
    position: absolute !important;
    top: var(--zp-hero-m-cta-top) !important;
    left: var(--zp-hero-m-cta-left) !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    transform: none !important;
    z-index: 5 !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-quick-gallery {
    position: absolute !important;
    top: 50% !important;
    left: auto !important;
    right: var(--zp-hero-m-photo-right) !important;
    transform: translateY(-50%) !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-actions a.btn.primary:not(.hero-btn--gift) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: max-content !important;
    height: auto !important;
    min-height: 46px !important;
    padding: 12px 20px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: var(--zp-hero-cta-radius, 12px) !important;
    font-family: var(--zp-hero-cta-font, 'Roboto', system-ui, sans-serif) !important;
    font-size: clamp(14px, var(--zp-hero-m-btn-fs, 3.279cqi), 16px) !important;
    font-weight: var(--zp-hero-cta-fw, 500) !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    gap: 0 !important;
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    filter: none !important;
    transform: none !important;
  }

  body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift):hover,
  body.home-layout-ref #top .hero-actions a.btn.primary:not(.hero-btn--gift):hover {
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    filter: brightness(0.97) !important;
    transform: none !important;
    box-shadow: none !important;
  }
}

/* === Mobile drawer: bank-style sidebar (full height from top, flat list) === */
@media (max-width: 1319px) {
  body.home-layout-ref {
    --zp-drawer-border: #e3e8ed;
    --zp-drawer-text: #1c1f23;
    --zp-drawer-muted: #6d7580;
    --zp-drawer-accent: #0066cc;
    --zp-drawer-accent-hover: #0052a3;
    --zp-drawer-primary: #886cce;
    --zp-drawer-primary-hover: #7659b8;
    --zp-drawer-hover: #f4f6f9;
    --zp-drawer-icon: #886cce;
    --zp-drawer-inset-x: 16px;
    --zp-drawer-row-pad-x: 16px;
    --zp-drawer-row-gap: 12px;
    --zp-drawer-row-h: 48px;
  }

  body.home-layout-ref .nav-mobile {
    justify-content: flex-start;
    align-items: stretch;
  }

  body.home-layout-ref .nav-mobile-backdrop {
    background: rgba(15, 18, 24, 0.38);
    backdrop-filter: blur(2px);
  }

  body.home-layout-ref .nav-mobile-panel,
  body.home-layout-ref .nav-mobile-panel--bank-ref {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
    height: 100%;
    max-height: none;
    padding: 0;
    gap: 0;
    background: #ffffff;
    border: none;
    box-shadow: none;
    transform: translateX(-105%);
    transition: transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1);
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.home-layout-ref .nav-mobile:not([hidden]) .nav-mobile-panel {
    transform: translateX(0);
  }

  body.home-layout-ref .nav-mobile-head--bank {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    align-items: center;
    gap: 0 12px;
    min-height: 50px;
    margin: 0;
    padding: calc(env(safe-area-inset-top, 0px) + 11px) 12px 11px;
    border-bottom: 1px solid var(--zp-drawer-border);
    flex-shrink: 0;
  }

  body.home-layout-ref .nav-close--icon {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    flex: 0 0 40px;
    order: unset;
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--zp-drawer-text);
    font-size: 0;
    line-height: 0;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  body.home-layout-ref .nav-close__svg {
    display: block;
    width: 24px;
    height: 24px;
  }

  body.home-layout-ref .nav-close--icon:hover,
  body.home-layout-ref .nav-close--icon:focus-visible {
    background: rgba(100, 64, 191, 0.08);
    color: var(--zp-drawer-text);
    opacity: 1;
  }

  body.home-layout-ref .nav-close--icon:focus-visible {
    outline: 2px solid var(--zp-drawer-accent);
    outline-offset: 2px;
    opacity: 1;
  }

  body.home-layout-ref .nav-mobile-brand {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    justify-self: start;
    min-width: 0;
    width: auto;
    max-width: 100%;
    flex: none;
    text-decoration: none;
  }

  body.home-layout-ref .nav-mobile-brand__logo {
    display: block;
    height: 28px;
    width: auto;
    max-width: min(200px, calc(100vw - 72px));
    margin: 0;
    object-fit: contain;
    object-position: left center;
  }

  /* В drawer: без «Войти»/бонусов — справа только крестик */
  body.home-layout-ref .nav-mobile-head__login,
  body.home-layout-ref .nav-mobile-head .zp-nav-bonus {
    display: none !important;
  }

  body.home-layout-ref .nav-mobile-head__login:hover,
  body.home-layout-ref .nav-mobile-head__login:focus-visible {
    background: var(--zp-drawer-hover);
    color: var(--zp-drawer-text);
    border-color: var(--zp-drawer-border);
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer {
    margin: 0;
    padding: 4px var(--zp-drawer-inset-x) 0;
    border: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__inner {
    padding: 0;
    width: 100%;
    max-width: 100%;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__btn {
    width: 100%;
    max-width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    min-height: 48px;
    padding: 12px 16px;
    border: none;
    border-radius: 12px;
    background: #f4f6f9;
    color: var(--zp-drawer-text);
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .nav-mobile-row--city {
    flex-direction: row;
    flex-wrap: nowrap;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-links--bank > a.nav-mobile-row,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-links--bank .nav-mobile-services a.nav-mobile-row,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-extra__links a.nav-mobile-row {
    width: 100%;
    max-width: 100%;
    border: none;
    border-bottom: 1px solid var(--zp-drawer-border);
    border-radius: 0;
    font-weight: 500;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-services .nav-mobile-row {
    display: flex;
    align-items: center;
    gap: var(--zp-drawer-row-gap);
    box-sizing: border-box;
    width: 100%;
    height: var(--zp-drawer-row-h);
    min-height: var(--zp-drawer-row-h);
    max-height: var(--zp-drawer-row-h);
    padding: 0;
    margin: 0;
    border: none;
    border-bottom: 1px solid var(--zp-drawer-border);
    border-radius: 0;
    font-family: var(--zp-font-ui);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    color: var(--zp-drawer-text);
    background: #ffffff;
    text-decoration: none;
    text-align: left;
    cursor: pointer;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .nav-mobile-row--city {
    padding: 12px 16px;
    border-radius: 12px;
    border: none;
    background: #f4f6f9;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__btn:hover,
  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__btn:focus-visible {
    background: #eef1f5;
    color: var(--zp-drawer-text);
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row:hover,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row:active,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row[aria-current="page"] {
    background: var(--zp-drawer-hover);
    color: var(--zp-drawer-text);
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row:hover .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row:active .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row[aria-current="page"] .nav-mobile-row__icon {
    color: var(--zp-drawer-icon);
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-services .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__icon,
  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__pin {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    color: var(--zp-drawer-icon);
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg {
    color: var(--zp-drawer-icon);
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg path,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg circle,
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg rect {
    stroke: currentColor;
    color: inherit;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg circle[fill="currentColor"],
  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg path[fill="currentColor"] {
    fill: currentColor;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__chevron {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    margin-left: auto;
    color: #c5cad1;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__chevron-svg {
    display: block;
    width: 24px;
    height: 24px;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__icon-svg {
    display: block;
    width: 32px;
    height: 32px;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-row__text,
  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__text {
    flex: 1 1 auto;
    min-width: 0;
    color: inherit;
    font: inherit;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__icon {
    flex: 0 0 24px;
    margin-left: auto;
  }

  body.home-layout-ref .nav-mobile-panel .city-strip--drawer .city-strip__pin {
    width: 24px;
    height: 24px;
  }

  body.home-layout-ref .nav-mobile-links--bank {
    gap: 0;
    padding: 0 var(--zp-drawer-inset-x);
    box-sizing: border-box;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-services {
    margin: 0;
    padding: 0;
    gap: 0;
    border: none;
    border-left: none;
    display: flex;
    flex-direction: column;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-services .nav-mobile-row {
    position: static;
    padding-left: 0;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-services .nav-mobile-row__icon {
    position: static;
    left: auto;
  }

  body.home-layout-ref .nav-mobile-panel .nav-mobile-services__label {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 48px;
    margin: 0;
    padding: 12px var(--zp-drawer-row-pad-x);
    border-bottom: 1px solid var(--zp-drawer-border);
    font-family: var(--zp-font-ui);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    text-transform: none;
    color: var(--zp-drawer-text);
  }

  body.home-layout-ref .nav-mobile-extra {
    margin: 0;
    padding: 20px var(--zp-drawer-row-pad-x) 16px;
    border-top: 8px solid #f4f6f9;
    background: #ffffff;
  }

  body.home-layout-ref .nav-mobile-extra__title,
  body.home-layout-ref a.nav-mobile-extra__title {
    margin: 0 0 16px;
    padding: 12px 16px;
    font-family: var(--zp-font-ui);
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #ffffff;
  }

  body.home-layout-ref a.nav-mobile-extra__title,
  body.home-layout-ref .nav-mobile-extra__title-link {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    border: none;
    border-radius: 8px;
    background: var(--zp-drawer-primary, #886cce);
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.2s ease;
    -webkit-tap-highlight-color: transparent;
  }

  body.home-layout-ref a.nav-mobile-extra__title:hover,
  body.home-layout-ref a.nav-mobile-extra__title:focus-visible {
    background: var(--zp-drawer-primary-hover, #7659b8);
    color: #ffffff;
    text-decoration: none;
  }

  body.home-layout-ref .nav-mobile-extra__links {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0 calc(-1 * var(--zp-drawer-row-pad-x));
    width: calc(100% + 2 * var(--zp-drawer-row-pad-x));
    padding: 0;
  }

  body.home-layout-ref .nav-mobile-extra__links .nav-mobile-row {
    width: 100%;
  }

  body.home-layout-ref .nav-mobile-extra__links .lang-switch--drawer {
    display: inline-flex;
    align-self: center;
    flex: 0 0 auto;
    gap: 0;
    margin: 12px auto 2px;
    padding: 2px 3px;
    width: auto;
    max-width: none;
    border-radius: 999px;
    background: rgba(78, 42, 150, 0.08);
    border: 1px solid rgba(78, 42, 150, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  }

  body.home-layout-ref .nav-mobile-extra__links .lang-switch--drawer .lang-switch__seg {
    flex: 0 0 auto;
    min-width: 0;
    min-height: 32px;
    margin: 0;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body.home-layout-ref .nav-mobile-extra__links .lang-switch--drawer .lang-switch__seg--active {
    box-shadow: 0 3px 10px rgba(78, 42, 150, 0.22);
  }

  body.home-layout-ref .nav-mobile-extra__link {
    display: none;
  }

  body.home-layout-ref .nav-mobile-drawer-zp,
  body.home-layout-ref .nav-mobile-drawer-foot {
    display: block;
    flex-shrink: 0;
    margin-top: auto;
    margin-bottom: 0;
    padding: 16px var(--zp-drawer-inset-x) calc(16px + env(safe-area-inset-bottom, 0px));
    border-top: 8px solid #f4f6f9;
    background: #ffffff;
    position: sticky;
    bottom: 0;
    z-index: 3;
    box-shadow: 0 -8px 24px rgba(255, 255, 255, 0.95);
  }

  body.home-layout-ref .nav-mobile-drawer-foot__inner {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
  }


  body.home-layout-ref .nav-mobile-drawer-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin-top: 0;
    padding: 16px var(--zp-drawer-inset-x) calc(16px + var(--safe-bottom));
    background: #ffffff;
    border-top: 1px solid var(--zp-drawer-border);
    box-shadow: 0 -8px 24px rgba(255, 255, 255, 0.92);
  }

  body.home-layout-ref .nav-mobile-drawer-footer__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    padding: 12px 16px;
    border: none;
    border-radius: 8px;
    background: var(--zp-drawer-accent);
    color: #ffffff !important;
    font-family: var(--zp-font-ui);
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    text-align: center;
    text-decoration: none;
    box-shadow: none;
    transition: background 0.2s ease, filter 0.2s ease;
  }

  body.home-layout-ref .nav-mobile-drawer-footer__btn:hover,
  body.home-layout-ref .nav-mobile-drawer-footer__btn:focus-visible {
    background: var(--zp-drawer-accent-hover);
    color: #ffffff !important;
    filter: none;
    transform: none;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone {
    margin: 0 0 4px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__free {
    display: block;
    box-sizing: border-box;
    min-height: 28px;
    margin: 0;
    padding: 0;
    font-family: var(--zp-font-ui) !important;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    color: var(--zp-drawer-text) !important;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel {
    margin-bottom: 4px;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__free {
    margin-bottom: 0;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel:hover,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel:focus-visible,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__free:hover,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__free:focus-visible {
    color: var(--zp-drawer-text) !important;
    text-decoration: none;
    opacity: 0.85;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__caption,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__note {
    margin: 4px 0 12px;
    padding: 0;
    font-family: var(--zp-font-ui) !important;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0;
    color: var(--zp-drawer-text) !important;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-phone__caption--sub {
    display: block;
    min-height: 16px;
    max-width: 100%;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-social {
    margin: 0 0 16px;
    padding: 0;
    border: none;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta {
    display: none !important;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta .btn.primary,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta .btn.primary,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta a.btn.primary {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 48px !important;
    max-height: none;
    padding: 12px 16px !important;
    margin: 0;
    border: none !important;
    border-radius: 8px !important;
    background: var(--zp-drawer-primary) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-family: var(--zp-font-ui) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: 0;
    text-align: center;
    text-decoration: none;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    animation: none !important;
    transition: background 0.2s ease;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta .btn.primary:hover,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta .btn.primary:focus-visible,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary:hover,
  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary:focus-visible,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta .btn.primary:hover,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta .btn.primary:focus-visible,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta a.btn.primary:hover,
  body.home-layout-ref .nav-mobile-drawer-zp .nav-mobile-cta a.btn.primary:focus-visible {
    background: var(--zp-drawer-primary-hover) !important;
    background-image: none !important;
    color: #ffffff !important;
    filter: none !important;
    transform: none !important;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .nav-mobile-hint {
    margin: 10px 0 0;
    padding: 0;
    text-align: center;
    font-size: 13px;
    line-height: 18px;
    color: var(--zp-drawer-muted);
    font-weight: 500;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .socials.drawer__social-list {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .socials.drawer__social-list > li {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    justify-content: center;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .drawer__social-link {
    min-width: 0;
    max-width: none;
    width: 100%;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .drawer__social-link:hover {
    transform: none;
    opacity: 0.85;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .drawer__social-link img {
    width: 40px;
    height: 40px;
  }

  body.home-layout-ref .nav-mobile-drawer-foot .drawer__social-caption {
    color: var(--zp-drawer-muted);
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links--bank {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }

  body.home-layout-ref.menu-open,
  html.menu-open {
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.home-layout-ref.menu-open {
    touch-action: none;
  }

  body.home-layout-ref.menu-open .nav-mobile-panel--bank-ref {
    touch-action: auto;
  }

  /* Bank-ref: override zerkalo-main drawer (left slide, flat rows, white panel) */
  body.home-layout-ref .nav-mobile {
    justify-content: flex-start !important;
    align-items: stretch !important;
  }

  body.home-layout-ref .nav-mobile-panel.nav-mobile-panel--bank-ref {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    transform: translateX(-100%) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .city-strip--drawer {
    flex: 0 0 auto;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-head--bank {
    flex: 0 0 auto;
  }

  body.home-layout-ref .nav-mobile:not([hidden]) .nav-mobile-panel.nav-mobile-panel--bank-ref {
    transform: translateX(0) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-head--bank {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 40px !important;
    align-items: center !important;
    margin-bottom: 0 !important;
    padding-top: calc(env(safe-area-inset-top, 0px) + 11px) !important;
    padding-bottom: 11px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-brand {
    grid-column: 1 !important;
    justify-self: start !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-brand__logo {
    margin-left: 0 !important;
    margin-right: 0 !important;
    object-position: left center !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-head__login,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-head .zp-nav-bonus {
    display: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-close.nav-close--icon {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    flex: 0 0 40px !important;
    order: unset !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--zp-drawer-text) !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-close__svg {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-close.nav-close--icon:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-close.nav-close--icon:focus-visible {
    background: transparent !important;
    color: var(--zp-drawer-text) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links {
    gap: 0 !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links a.nav-mobile-row,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__links a.nav-mobile-row {
    display: flex !important;
    align-items: center !important;
    gap: var(--zp-drawer-row-gap) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: var(--zp-drawer-row-h) !important;
    min-height: var(--zp-drawer-row-h) !important;
    max-height: var(--zp-drawer-row-h) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--zp-drawer-border) !important;
    border-radius: 0 !important;
    font-family: var(--zp-font-ui) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    letter-spacing: 0 !important;
    color: var(--zp-drawer-text) !important;
    background: #ffffff !important;
    text-decoration: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links button.nav-mobile-row {
    display: flex !important;
    align-items: center !important;
    gap: var(--zp-drawer-row-gap) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: var(--zp-drawer-row-h) !important;
    min-height: var(--zp-drawer-row-h) !important;
    max-height: var(--zp-drawer-row-h) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--zp-drawer-border) !important;
    border-radius: 0 !important;
    font-family: var(--zp-font-ui) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    letter-spacing: 0 !important;
    color: var(--zp-drawer-text) !important;
    background: #ffffff !important;
    text-align: left !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links a.nav-mobile-row:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links a.nav-mobile-row:active,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links a.nav-mobile-row[aria-current="page"],
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__links a.nav-mobile-row:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__links a.nav-mobile-row:active,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__links a.nav-mobile-row[aria-current="page"] {
    background: var(--zp-drawer-hover) !important;
    color: var(--zp-drawer-text) !important;
    border-color: transparent !important;
    border-bottom-color: var(--zp-drawer-border) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links button.nav-mobile-row:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links button.nav-mobile-row:active,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-links button.nav-mobile-row:focus-visible {
    background: var(--zp-drawer-hover) !important;
    color: var(--zp-drawer-text) !important;
    border-color: transparent !important;
    border-bottom-color: var(--zp-drawer-border) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-services .nav-mobile-row__icon {
    flex: 0 0 32px !important;
    width: 32px !important;
    height: 32px !important;
    color: var(--zp-drawer-icon) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row__icon-svg {
    width: 32px !important;
    height: 32px !important;
    color: #886cce !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row__icon-svg path,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row__icon-svg circle,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row__icon-svg rect {
    stroke: currentColor !important;
    color: inherit !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row:hover .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row:active .nav-mobile-row__icon,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row[aria-current="page"] .nav-mobile-row__icon {
    color: var(--zp-drawer-icon) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__free {
    font-size: 20px !important;
    line-height: 28px !important;
    color: #1c1f23 !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__tel:focus-visible,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__free:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__free:focus-visible {
    color: #1c1f23 !important;
    opacity: 0.85 !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__caption,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-phone__caption--sub {
    margin: 4px 0 12px !important;
    font-size: 12px !important;
    line-height: 16px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    color: #1c1f23 !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary {
    min-height: 48px !important;
    border-radius: 8px !important;
    background: #886cce !important;
    background-image: none !important;
    color: #ffffff !important;
    filter: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot .nav-mobile-cta a.btn.primary:focus-visible {
    background: #7659b8 !important;
    background-image: none !important;
    color: #ffffff !important;
    filter: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra {
    flex: 0 0 auto;
    min-height: 0;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__title,
  body.home-layout-ref .nav-mobile-panel--bank-ref a.nav-mobile-extra__title {
    margin: 0 0 16px !important;
    padding: 12px 16px !important;
    min-height: 48px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: 0 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    background: #886cce !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref a.nav-mobile-extra__title:hover,
  body.home-layout-ref .nav-mobile-panel--bank-ref a.nav-mobile-extra__title:focus-visible {
    background: #7659b8 !important;
    color: #ffffff !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__links {
    row-gap: 0;
    margin-left: calc(-1 * var(--zp-drawer-row-pad-x)) !important;
    margin-right: calc(-1 * var(--zp-drawer-row-pad-x)) !important;
    width: calc(100% + 2 * var(--zp-drawer-row-pad-x)) !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-extra__link {
    display: none !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-drawer-foot {
    margin-top: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row--city .nav-mobile-row__text {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .nav-mobile-row--city .nav-mobile-row__chevron {
    margin-left: auto;
  }

  body.home-layout-ref .nav-mobile-panel--bank-ref .city-strip__map-img {
    display: block;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    object-fit: contain;
  }

}

/* --- Страница партнёрства (/pages/partnerstvo.html) --- */
body.home-layout-ref.page-partnerstvo #navMobile + main.zp-partner-page {
  padding-top: var(--zp-site-content-offset);
  box-sizing: border-box;
}

body.home-layout-ref .zp-partner-page {
  background: #fff;
}

body.home-layout-ref .zp-partner-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(217, 180, 96, 0.18), transparent 55%),
    linear-gradient(145deg, #4a1570 0%, var(--zp-figma-purple, #3b135c) 42%, #2a0d42 100%);
  color: #fff;
  padding: clamp(48px, 8vw, 88px) 0 clamp(56px, 9vw, 96px);
}

body.home-layout-ref .zp-partner-hero__wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

body.home-layout-ref .zp-partner-hero__kicker {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(11px, 1.6vw, 13px);
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--zp-gold, #d9b460);
}

body.home-layout-ref .zp-partner-hero__badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, #efd68d 0%, #d9b460 100%);
  border: 1px solid rgba(245, 226, 168, 0.65);
  font-family: var(--zp-font-ui);
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #311d65;
  font-weight: 700;
}

body.home-layout-ref .zp-partner-hero__title {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(34px, 6vw, 56px);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

body.home-layout-ref .zp-partner-hero__title span {
  color: var(--zp-gold, #d9b460);
}

body.home-layout-ref .zp-partner-hero__lead {
  margin: 0;
  max-width: 720px;
  font-family: var(--zp-font-ui);
  font-size: clamp(16px, 2.2vw, 20px);
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
}

body.home-layout-ref .zp-partner-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 8px;
}

/* Контурная кнопка на тёмном hero партнёрской программы. */
body.home-layout-ref .zp-partner-hero__actions .btn.zp-partner-hero__btn-outline {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.55);
}

body.home-layout-ref .zp-partner-hero__actions .btn.zp-partner-hero__btn-outline:hover,
body.home-layout-ref .zp-partner-hero__actions .btn.zp-partner-hero__btn-outline:focus-visible {
  background: rgba(255, 255, 255, 0.16);
  border-color: #fff;
}

body.home-layout-ref .zp-partner-hero__btn-secondary {
  border: 1px solid rgba(255, 255, 255, 0.38);
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08);
}

body.home-layout-ref .zp-partner-section {
  padding: clamp(40px, 6vw, 72px) 0;
}

body.home-layout-ref .zp-partner-section--light {
  background: #fff;
}

body.home-layout-ref .zp-partner-section--dark {
  background: linear-gradient(145deg, #4a1570 0%, var(--zp-figma-purple, #3b135c) 42%, #2a0d42 100%);
  color: #fff;
}

body.home-layout-ref .zp-partner-section__title {
  margin: 0 0 16px;
  font-family: var(--zp-font-ui);
  font-size: clamp(26px, 4vw, 36px);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--zp-figma-purple, #3b135c);
}

body.home-layout-ref .zp-partner-section__title--light {
  color: #fff;
}

body.home-layout-ref .zp-partner-section__title--center {
  text-align: center;
  margin-bottom: clamp(24px, 4vw, 40px);
}

body.home-layout-ref .zp-partner-section__lead,
body.home-layout-ref .zp-partner-section__text {
  margin: 0 0 16px;
  font-family: var(--zp-font-ui);
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.55;
  color: var(--muted, #4f4763);
}

body.home-layout-ref .zp-partner-section--dark .zp-partner-section__text {
  color: rgba(255, 255, 255, 0.88);
}

body.home-layout-ref .zp-partner-section__text strong {
  color: var(--zp-gold, #d9b460);
}

body.home-layout-ref .zp-partner-section__subhead {
  margin: 8px 0 14px;
  font-family: var(--zp-font-ui);
  font-size: clamp(16px, 1.7vw, 22px);
  line-height: 1.3;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--zp-gold-2, #f0cf81);
  font-weight: 700;
}

body.home-layout-ref .zp-partner-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.95fr);
  gap: clamp(24px, 4vw, 48px);
  align-items: center;
}

body.home-layout-ref .zp-partner-split__media {
  margin: 0;
  width: 80%;
  max-width: 80%;
  justify-self: end;
  aspect-ratio: 1512 / 1760;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(180deg, #dbeafe 0%, #eff6ff 100%);
  box-shadow: 0 24px 60px rgba(35, 18, 77, 0.12);
}

body.home-layout-ref .zp-partner-split--reverse .zp-partner-split__media {
  order: -1;
  justify-self: start;
}

body.home-layout-ref .zp-partner-split__media picture {
  display: block;
  width: 100%;
  height: 100%;
}

body.home-layout-ref .zp-partner-split__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.home-layout-ref .zp-partner-benefits {
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 18px;
}

body.home-layout-ref .zp-partner-benefits__item {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 1.5;
  color: var(--text, #18152a);
}

body.home-layout-ref .zp-partner-benefits__icon {
  font-size: 0;
  line-height: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(217, 180, 96, 0.18);
  display: grid;
  place-items: center;
}

body.home-layout-ref .zp-partner-benefits__icon::before {
  font-size: 14px;
  line-height: 1;
  font-weight: 800;
  color: var(--zp-gold-hover, #c5a048);
}

body.home-layout-ref .zp-partner-benefits__item:nth-child(1) .zp-partner-benefits__icon::before {
  content: "1";
}

body.home-layout-ref .zp-partner-benefits__item:nth-child(2) .zp-partner-benefits__icon::before {
  content: "2";
}

body.home-layout-ref .zp-partner-benefits__item:nth-child(3) .zp-partner-benefits__icon::before {
  content: "3";
}

body.home-layout-ref .zp-partner-card__note > span[aria-hidden="true"] {
  font-size: 0;
  line-height: 0;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
}

body.home-layout-ref .zp-partner-card__note > span[aria-hidden="true"]::before {
  font-size: 14px;
  line-height: 1;
  font-weight: 800;
}

body.home-layout-ref .zp-partner-card__note--warn > span[aria-hidden="true"]::before {
  content: "!";
  color: #b45309;
}

body.home-layout-ref .zp-partner-card__note--ok > span[aria-hidden="true"]::before {
  content: "\2713";
  color: #15803d;
}

body.home-layout-ref .zp-partner-benefits__label {
  color: var(--zp-gold-hover, #c5a048);
}

body.home-layout-ref .zp-partner-tag {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 6px 12px;
  border-radius: 999px;
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.home-layout-ref .zp-partner-tag--gold {
  background: linear-gradient(135deg, #efd68d 0%, #d9b460 100%);
  border: 1px solid rgba(245, 226, 168, 0.65);
  color: #311d65;
  font-weight: 700;
}

body.home-layout-ref .zp-partner-perks {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

body.home-layout-ref .zp-partner-perks__item {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.06);
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 1.35;
  color: #fff;
}

body.home-layout-ref .zp-partner-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 28px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

body.home-layout-ref .zp-partner-stats li {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.home-layout-ref .zp-partner-stats strong {
  font-family: var(--zp-font-ui);
  font-size: 18px;
  line-height: 1.2;
  color: #fff;
}

body.home-layout-ref .zp-partner-stats span {
  font-size: 14px;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.78);
}

body.home-layout-ref .zp-partner-quality {
  position: relative;
  padding-bottom: 0;
}

body.home-layout-ref .zp-partner-quality__badges {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.home-layout-ref .zp-partner-quality__badges span {
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--zp-figma-purple, #3b135c);
  text-transform: uppercase;
}

body.home-layout-ref .zp-partner-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

body.home-layout-ref .zp-partner-card {
  padding: clamp(24px, 3vw, 32px);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(35, 18, 77, 0.08);
}

body.home-layout-ref .zp-partner-card--accent {
  border: 2px solid rgba(217, 180, 96, 0.65);
}

body.home-layout-ref .zp-partner-card__badge {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 6px 12px;
  border-radius: 999px;
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
}

body.home-layout-ref .zp-partner-card__badge--violet {
  background: var(--zp-figma-purple, #3b135c);
}

body.home-layout-ref .zp-partner-card__badge--gold {
  background: linear-gradient(135deg, var(--zp-gold) 0%, var(--zp-gold-hover) 100%);
  color: #311d65;
}

body.home-layout-ref .zp-partner-card__title {
  margin: 0 0 12px;
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 3vw, 28px);
  line-height: 1.2;
  font-weight: 700;
  color: var(--zp-figma-purple, #3b135c);
}

body.home-layout-ref .zp-partner-card__text,
body.home-layout-ref .zp-partner-card__income,
body.home-layout-ref .zp-partner-card__note {
  margin: 0 0 12px;
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 1.55;
  color: var(--muted, #4f4763);
}

body.home-layout-ref .zp-partner-card__income strong {
  color: var(--zp-gold-hover, #c5a048);
}

body.home-layout-ref .zp-partner-card__note {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  margin-bottom: 0;
  padding-top: 8px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--muted-2, #5c5470);
}

body.home-layout-ref .zp-partner-cta {
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(217, 180, 96, 0.18), transparent 55%),
    linear-gradient(145deg, #4a1570 0%, var(--zp-figma-purple, #3b135c) 42%, #2a0d42 100%);
  color: #fff;
}

body.home-layout-ref .zp-partner-cta__wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

body.home-layout-ref .zp-partner-cta__title {
  margin: 0;
  font-family: var(--zp-font-ui);
  font-size: clamp(30px, 5vw, 44px);
  line-height: 1.1;
  font-weight: 700;
  text-transform: uppercase;
}

body.home-layout-ref .zp-partner-cta__title span {
  color: var(--zp-gold, #d9b460);
}

body.home-layout-ref .zp-partner-cta__lead {
  margin: 0;
  max-width: 640px;
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.88);
}

body.home-layout-ref .zp-partner-cta__grid {
  display: grid;
  grid-template-columns: minmax(320px, auto) minmax(260px, auto);
  gap: clamp(24px, 4vw, 40px);
  width: auto;
  max-width: 960px;
  margin-top: 12px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  text-align: left;
  align-items: center;
}

body.home-layout-ref .zp-partner-cta__phones {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-right: clamp(16px, 3vw, 30px);
  border-right: 1px solid rgba(255, 255, 255, 0.18);
}

body.home-layout-ref .zp-partner-cta__phone {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--zp-font-ui);
  font-size: clamp(22px, 3vw, 28px);
  line-height: 1.2;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
}

body.home-layout-ref .zp-partner-cta__phone-icon {
  color: var(--zp-gold-2, #f0cf81);
  font-size: 24px;
  line-height: 1;
}

body.home-layout-ref .zp-partner-cta__phone:hover,
body.home-layout-ref .zp-partner-cta__phone:focus-visible {
  color: var(--zp-gold-2, #f0cf81);
}

body.home-layout-ref .zp-partner-cta__qr {
  display: flex;
  align-items: center;
  justify-content: center;
}

body.home-layout-ref .zp-partner-cta__qr-link {
  display: block;
  width: clamp(170px, 20vw, 220px);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(10, 5, 30, 0.35);
}

body.home-layout-ref .zp-partner-cta__qr-link img {
  display: block;
  width: 100%;
  height: auto;
}

body.home-layout-ref .zp-partner-cta__socials-title {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--zp-gold, #d9b460);
}

body.home-layout-ref .zp-partner-cta__social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

body.home-layout-ref .zp-partner-social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  font-family: var(--zp-font-ui);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

body.home-layout-ref .zp-partner-social-btn:hover,
body.home-layout-ref .zp-partner-social-btn:focus-visible {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.12);
}

body.home-layout-ref .zp-partner-cta__crm {
  width: 100%;
  max-width: 320px;
}

/* === Страница «Инструкция для партнёров» === */
/* Список преимуществ читаемо смотрится и на тёмной секции инструкции. */
body.home-layout-ref .zp-partner-section--dark .zp-partner-benefits__item {
  color: rgba(255, 255, 255, 0.9);
}

/* Плейсхолдер скриншота вместо медиа в сплит-секциях инструкции. */
body.home-layout-ref .zp-guide-shot {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: clamp(220px, 28vw, 300px);
  padding: clamp(28px, 4vw, 44px);
  text-align: center;
  border: 1px dashed rgba(59, 19, 92, 0.3);
  border-radius: 20px;
  background: linear-gradient(180deg, #f4eeff 0%, #fbf8ff 100%);
  box-shadow: none;
  color: var(--zp-figma-purple, #3b135c);
}

body.home-layout-ref .zp-partner-section--dark .zp-guide-shot {
  border-color: rgba(245, 226, 168, 0.45);
  background: rgba(255, 255, 255, 0.05);
  color: var(--zp-gold-2, #f0cf81);
}

/* Реальный скрин CRM в первом шаге инструкции (вместо плейсхолдера). */
body.home-layout-ref .zp-guide-shot--crm {
  display: block;
  min-height: 0;
  padding: 0;
  border: 0;
  aspect-ratio: 4 / 5;
  max-width: min(100%, 420px);
  margin-inline: auto;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 20px 48px rgba(35, 18, 77, 0.18);
}

body.home-layout-ref .zp-guide-shot--crm img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
}

/* Скрин примера объявления на Авито (блок #guide-avito). */
body.home-layout-ref .zp-guide-shot--avito {
  display: block;
  min-height: 0;
  padding: 0;
  border: 0;
  aspect-ratio: auto;
  background: #fff;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
  border-radius: 12px;
  overflow: hidden;
}

body.home-layout-ref .zp-guide-shot--avito img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center top;
}

body.home-layout-ref .zp-guide-shot__icon {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(217, 180, 96, 0.16);
  color: var(--zp-gold-hover, #c5a048);
}

body.home-layout-ref .zp-partner-section--dark .zp-guide-shot__icon {
  background: rgba(245, 226, 168, 0.14);
  color: var(--zp-gold-2, #f0cf81);
}

body.home-layout-ref .zp-guide-shot__title {
  font-family: var(--zp-font-ui);
  font-size: 16px;
  line-height: 1.3;
  font-weight: 700;
}

body.home-layout-ref .zp-guide-shot__text {
  max-width: 320px;
  font-family: var(--zp-font-ui);
  font-size: 14px;
  line-height: 1.5;
  opacity: 0.86;
}

/* Карточка «База файлов» в секции материалов. */
body.home-layout-ref .zp-guide-files {
  max-width: 720px;
  margin: clamp(20px, 3vw, 36px) auto 0;
  padding: clamp(28px, 4vw, 48px);
  text-align: center;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(59, 19, 92, 0.1);
  box-shadow: 0 24px 60px rgba(35, 18, 77, 0.12);
}

body.home-layout-ref .zp-guide-files__badge {
  display: inline-flex;
  align-items: center;
  margin-bottom: 16px;
  padding: 7px 16px;
  border-radius: 999px;
  background: var(--zp-figma-purple, #3b135c);
  color: #fff;
  font-family: var(--zp-font-ui);
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
}

body.home-layout-ref .zp-guide-files__title {
  margin: 0 0 12px;
  font-family: var(--zp-font-ui);
  font-size: clamp(20px, 2.6vw, 28px);
  line-height: 1.2;
  font-weight: 700;
  color: var(--zp-figma-purple, #3b135c);
}

body.home-layout-ref .zp-guide-files__text {
  margin: 0 auto;
  max-width: 540px;
  font-family: var(--zp-font-ui);
  font-size: clamp(15px, 1.8vw, 17px);
  line-height: 1.55;
  color: var(--muted, #4f4763);
}

body.home-layout-ref .zp-guide-files__btn {
  margin-top: 24px;
  min-width: 240px;
}

/* Заголовок-ссылка CTA партнёрской программы ведёт на инструкцию. */
body.home-layout-ref .zp-partner-cta__title-link {
  color: inherit;
  text-decoration: none;
  transition: color 0.15s ease;
}

body.home-layout-ref .zp-partner-cta__title-link:hover,
body.home-layout-ref .zp-partner-cta__title-link:focus-visible {
  color: var(--zp-gold, #d9b460);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Подзаголовки в документе политики (разделы cookie-политики и т.п.). */
body.home-layout-ref .policy-page .policy-doc h3 {
  margin: 22px 0 8px;
  font-family: var(--zp-font-ui);
  font-size: clamp(18px, 2vw, 21px);
  font-weight: 700;
  line-height: 1.25;
  color: #2a1758;
}

body.home-layout-ref .policy-page .policy-doc h4 {
  margin: 16px 0 6px;
  font-family: var(--zp-font-ui);
  font-size: clamp(15px, 1.6vw, 17px);
  font-weight: 700;
  line-height: 1.3;
  color: #3b2470;
}

/* Главная ≥1320px: десктопная композиция героя (все слайды), как до правок планшета */
@media (min-width: 1320px) {
  body.home-layout-ref #top .hero-copy__top {
    aspect-ratio: 1344 / 487;
    width: 100%;
    max-width: var(--zp-home-col-w, min(100%, var(--content-max, 1440px)));
    height: auto;
    min-height: 0;
    max-height: none;
    margin-inline: auto;
    position: relative;
    overflow: visible;
    container-type: inline-size;
    container-name: zp-hero-banner;
  }

  /* Слайды 2–6 и баннер слайда 1: intro + CTA по центру баннера по вертикали */
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: absolute !important;
    left: calc(clamp(24px, 5.3vw, 71.5px) * var(--zp-hero-ui-scale, 1)) !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: min(668px, calc(100% - clamp(240px, 38vw, 480px))) !important;
    max-width: min(668px, calc(100% - clamp(240px, 38vw, 480px))) !important;
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    gap: calc(24px * var(--zp-hero-ui-scale, 1)) !important;
    min-height: calc(270px * var(--zp-hero-ui-scale, 1)) !important;
    height: auto !important;
    max-height: calc(100% - 2 * clamp(16px, 2vw, 32px)) !important;
    align-self: auto;
    flex: 0 0 auto;
    z-index: 5;
    box-sizing: border-box;
    transform: translateY(-50%) !important;
  }

  body.home-layout-ref #top .hero-copy__text {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: calc(var(--zp-hero-copy-text-gap, 16px) * var(--zp-hero-ui-scale, 1)) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: calc(190px * var(--zp-hero-ui-scale, 1)) !important;
    position: static !important;
  }

  body.home-layout-ref #top .hero-copy__cta {
    display: flex !important;
    flex-direction: column !important;
    gap: calc(16px * var(--zp-hero-ui-scale, 1)) !important;
    width: 100% !important;
    align-items: flex-start !important;
    margin: 0 !important;
  }

  body.home-layout-ref #top .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    position: static !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: calc(46px * var(--zp-hero-ui-scale, 1)) !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
    color: #ffffff !important;
    max-height: none !important;
    overflow: visible !important;
    text-align: left !important;
    white-space: normal !important;
    text-wrap: wrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: manual !important;
  }

  body.home-layout-ref #top .hero-copy__intro .lead,
  body.home-layout-ref #top .hero-copy__intro [data-i18n='hero.lead'],
  body.home-layout-ref #top .hero-copy__intro p,
  body.home-layout-ref #top .hero-copy__text .lead,
  body.home-layout-ref #top .hero-copy__text [data-i18n='hero.lead'],
  body.home-layout-ref #top .hero-copy__text p {
    position: static !important;
    font-size: clamp(
      calc(18px * var(--zp-hero-ui-scale, 1)),
      calc(2vw * var(--zp-hero-ui-scale, 1)),
      calc(22px * var(--zp-hero-ui-scale, 1))
    ) !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    white-space: normal !important;
    text-wrap: wrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: manual !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__text p {
    font-size: clamp(
      calc(16px * var(--zp-hero-ui-scale, 1)),
      calc(1.8vw * var(--zp-hero-ui-scale, 1)),
      calc(20px * var(--zp-hero-ui-scale, 1))
    ) !important;
  }

  body.home-layout-ref #top .hero-actions {
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
    width: calc(300px * var(--zp-hero-ui-scale, 1)) !important;
    min-width: calc(300px * var(--zp-hero-ui-scale, 1)) !important;
    max-width: calc(300px * var(--zp-hero-ui-scale, 1)) !important;
  }

  body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift) {
    width: calc(300px * var(--zp-hero-ui-scale, 1)) !important;
    min-width: min(224px, calc(300px * var(--zp-hero-ui-scale, 1))) !important;
    max-width: calc(300px * var(--zp-hero-ui-scale, 1)) !important;
    min-height: calc(56px * var(--zp-hero-ui-scale, 1)) !important;
    height: auto !important;
    padding: 12px calc(24px * var(--zp-hero-ui-scale, 1)) !important;
    border-radius: var(--zp-hero-cta-radius, 12px) !important;
    font-family: var(--zp-hero-cta-font, 'Roboto', system-ui, sans-serif) !important;
    font-size: calc(16px * var(--zp-hero-ui-scale, 1)) !important;
    line-height: 1.25 !important;
    font-weight: var(--zp-hero-cta-fw, 500) !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* Фото: эталон главной (левый край 730px × scale, портретные --zp-hero-photo-w/h), все слайды */
  body.home-layout-ref #top .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-quick-gallery {
    position: absolute !important;
    left: var(--zp-hero-photo-inset-x, 730px) !important;
    right: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    max-width: calc(
      100% - var(--zp-hero-photo-inset-x, 730px) - var(--zp-hero-panel-pad-x, 72px)
    ) !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    aspect-ratio: unset !important;
    perspective: none !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    overflow: visible !important;
    transform: none !important;
    z-index: 12 !important;
    pointer-events: none;
  }

  body.home-layout-ref #top .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo {
    transform: none !important;
    transform-origin: left center !important;
    width: auto !important;
    height: auto !important;
    aspect-ratio: unset !important;
    max-width: none !important;
    max-height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    justify-content: flex-start !important;
    align-items: center !important;
    filter: none;
    overflow: visible !important;
    flex-shrink: 1 !important;
    display: flex !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
  }

  body.home-layout-ref #top .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: min(
      calc(var(--zp-hero-slide-photo-w, var(--zp-hero-photo-w)) * var(--zp-hero-photo-fit-scale, 0.92)),
      calc(100cqi - var(--zp-hero-slide-photo-left, var(--zp-hero-photo-inset-x, 730px)) - var(--zp-hero-panel-pad-x, 72px))
    ) !important;
    max-height: min(
      calc(var(--zp-hero-slide-photo-h, var(--zp-hero-photo-h)) * var(--zp-hero-photo-fit-scale, 0.92)),
      var(--zp-hero-panel-h, calc(100cqi * 487 / 1344))
    ) !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: none !important;
    border-radius: inherit !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* 1440 desktop: per-slide image geometry from Figma refs 478:* / 479:* */
  body.home-layout-ref #top .zp-hero-slide {
    --zp-hero-slide-photo-left: 730px;
    --zp-hero-slide-photo-top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -67 / 487);
    --zp-hero-slide-photo-w: 578px;
    --zp-hero-slide-photo-h: 578px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) {
    --zp-hero-slide-photo-left: 695px;
    --zp-hero-slide-photo-top: 0;
    --zp-hero-slide-photo-w: 487px;
    --zp-hero-slide-photo-h: 487px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] {
    --zp-hero-slide-photo-left: 755px;
    --zp-hero-slide-photo-top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -67 / 487);
    --zp-hero-slide-photo-w: 578px;
    --zp-hero-slide-photo-h: 578px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] {
    --zp-hero-slide-photo-left: 696px;
    --zp-hero-slide-photo-top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -68 / 487);
    --zp-hero-slide-photo-w: 637px;
    --zp-hero-slide-photo-h: 637px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] {
    --zp-hero-slide-photo-left: 780px;
    --zp-hero-slide-photo-top: 0;
    --zp-hero-slide-photo-w: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * 4 / 3);
    --zp-hero-slide-photo-h: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344));
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] {
    --zp-hero-slide-photo-left: 771px;
    --zp-hero-slide-photo-top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -26 / 487);
    --zp-hero-slide-photo-w: 559px;
    --zp-hero-slide-photo-h: 559px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] {
    --zp-hero-slide-photo-left: 824px;
    --zp-hero-slide-photo-top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -27 / 487);
    --zp-hero-slide-photo-w: 425px;
    --zp-hero-slide-photo-h: 536px;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    left: var(--zp-hero-slide-photo-left) !important;
    top: var(--zp-hero-slide-photo-top) !important;
    right: auto !important;
    bottom: auto !important;
    width: var(--zp-hero-slide-photo-w) !important;
    height: var(--zp-hero-slide-photo-h) !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-static-photo {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-static-photo img {
    object-fit: contain !important;
    object-position: left center !important;
    border-radius: inherit !important;
  }

  /* Слайд-баннер (книга): фото справа, +30% к прежнему размеру на ПК */
  body.home-layout-ref #top .zp-hero-panel:has(.zp-hero-slide--banner-img.is-active),
  body.home-layout-ref #top .zp-hero-carousel__stage:has(.zp-hero-slide--banner-img.is-active) {
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__top {
    overflow: visible !important;
    border-radius: 40px;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-quick-gallery {
    left: auto !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: min(1014px, 75.4%) !important; /* было min(780px, 58%) × 1.3 */
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    aspect-ratio: auto !important;
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide--banner-img .zp-hero-slide1-banner-img {
    width: auto !important;
    height: 130% !important; /* +30% к высоте панели */
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: right center !important;
    filter: none !important;
    border-radius: 0 !important;
    transform: none !important;
    transform-origin: right center;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    left: 695px !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: calc(100% - 695px) !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-quick-gallery {
    left: 755px !important;
    top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -67 / 487) !important;
    right: auto !important;
    bottom: auto !important;
    width: 578px !important;
    height: 578px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-quick-gallery {
    left: 696px !important;
    top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -68 / 487) !important;
    right: auto !important;
    bottom: auto !important;
    width: 637px !important;
    height: 637px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-quick-gallery {
    left: 780px !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: calc(100% - 780px - var(--zp-hero-panel-pad-x, 72px)) !important;
    max-height: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-quick-gallery {
    left: 771px !important;
    top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -26 / 487) !important;
    right: auto !important;
    bottom: auto !important;
    width: 559px !important;
    height: 559px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-quick-gallery {
    left: 824px !important;
    top: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) * -27 / 487) !important;
    right: auto !important;
    bottom: auto !important;
    width: 425px !important;
    height: 536px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) !important;
    object-fit: contain !important;
    object-position: left center !important;
    border-radius: inherit !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo img {
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='3'] .hero-static-photo img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) !important;
    object-fit: contain !important;
    object-position: left center !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo img {
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: visible !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  /* Фото героя: уменьшение до границ панели, без обрезки overflow */
  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    top: 0 !important;
    bottom: 0 !important;
    height: 100% !important;
    width: auto !important;
    max-width: calc(
      100% - var(--zp-hero-slide-photo-left, var(--zp-hero-photo-inset-x, 730px)) - var(--zp-hero-panel-pad-x, 72px)
    ) !important;
    max-height: 100% !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-static-photo {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    overflow: visible !important;
    flex-shrink: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not(.zp-hero-slide--banner-img) .hero-static-photo img {
    width: auto !important;
    height: auto !important;
    max-width: min(
      calc(var(--zp-hero-slide-photo-w, var(--zp-hero-photo-w)) * var(--zp-hero-photo-fit-scale, 0.92)),
      calc(100cqi - var(--zp-hero-slide-photo-left, var(--zp-hero-photo-inset-x, 730px)) - var(--zp-hero-panel-pad-x, 72px))
    ) !important;
    max-height: min(
      calc(var(--zp-hero-slide-photo-h, var(--zp-hero-photo-h)) * var(--zp-hero-photo-fit-scale, 0.92)),
      var(--zp-hero-panel-h, calc(100cqi * 487 / 1344))
    ) !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-quick-gallery {
    top: 0 !important;
    width: auto !important;
    height: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo img {
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    object-fit: contain !important;
  }

  body.home-layout-ref #top .hero-btn__label--short {
    display: none !important;
  }

  body.home-layout-ref #top .hero-btn__label--full {
    display: inline !important;
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
    white-space: normal;
    pointer-events: auto;
  }
}

@media (max-width: 960px) {
  body.home-layout-ref .zp-partner-split,
  body.home-layout-ref .zp-partner-split--reverse {
    grid-template-columns: 1fr;
  }

  body.home-layout-ref .zp-partner-split--reverse .zp-partner-split__media {
    order: 0;
    justify-self: center;
  }

  body.home-layout-ref .zp-partner-split__media {
    justify-self: center;
  }

  body.home-layout-ref .zp-partner-cards,
  body.home-layout-ref .zp-partner-cta__grid {
    grid-template-columns: 1fr;
  }

  body.home-layout-ref .zp-partner-cta__phones {
    padding-right: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    padding-bottom: 14px;
  }

  body.home-layout-ref .zp-partner-cta__qr {
    justify-content: flex-start;
  }
}

/* --- Контент ≤1440px, фон секций — во всю ширину экрана ---
   Верхнеуровневые секции-ленты (с фоновой заливкой/градиентом) тянутся на всю
   ширину окна, а их контент удерживается в пределах 1440px внутренними
   обёртками (.wrap = min(1440px, …), .zp-universal-categories__section и т.п.).
   Покрывает все варианты вёрстки: секции напрямую в <body> (главная, о-нас,
   портфолио, услуги), <main> партнёрской страницы и секции внутри него.
   Шапка (#header, position:fixed) центрируется своим правилом выше. */
body.home-layout-ref > section,
body.home-layout-ref > .section,
body.home-layout-ref > footer.footer,
body.home-layout-ref > main.zp-partner-page,
body.home-layout-ref > main.zp-partner-page > section {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

/* Модули без фоновой ленты, чья вёрстка рассчитана на контейнер 1440px,
   остаются ограниченными по ширине и центрируются: герой главной
   (.home-first-module) и оболочка страниц услуг / служебные main-страницы. */
body.home-layout-ref > .home-first-module,
body.home-layout-ref > main:not(.zp-partner-page) {
  width: min(100%, 1440px);
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

@media (min-width: 1320px) {
  body.home-layout-ref:has(.home-first-module) {
    --zp-site-header-gap: 0;
  }

  body.home-layout-ref:has(.home-first-module) #top.hero {
    padding-top: var(--zp-hero-under-header);
  }
}

/* ===== Слайд 1 «Подарок по фото»: масштаб от ширины панели (до 1440 = .nav) ===== */
@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) {
    --s1-ref-w: 1344;
    --s1-scale: clamp(0.72, 100cqi / var(--s1-ref-w), calc(1440 / 1344));
    --s1-intro-left: calc(70px * var(--s1-scale));
    --s1-intro-top: calc(42px * var(--s1-scale));
    --s1-intro-width: min(
      calc(585px * var(--s1-scale)),
      calc(100cqi - var(--s1-intro-left) - calc(260px * var(--s1-scale)))
    );
    --s1-photo-left: min(
      calc(100cqi - calc(180px * var(--s1-scale))),
      max(
        calc(var(--s1-intro-left) + var(--s1-intro-width) + calc(20px * var(--s1-scale))),
        calc(695px * var(--s1-scale))
      )
    );
    --s1-stack-gap: calc(14px * var(--s1-scale));
    --s1-text-gap: calc(16px * var(--s1-scale));
    --s1-h1-size: calc(42px * var(--s1-scale));
    --s1-h1-lh: 1.12;
    --s1-lead-size: calc(20px * var(--s1-scale));
    --s1-lead-lh: 1.35;
    --s1-cta-gap: calc(8px * var(--s1-scale));
    --s1-btn-h: calc(56px * var(--s1-scale));
    --s1-btn-width: 100%;
    --s1-btn-radius: calc(14px * var(--s1-scale));
    --s1-btn-font: calc(18px * var(--s1-scale));
    --s1-note-size: calc(13px * var(--s1-scale));
    --s1-badge-h: calc(44px * var(--s1-scale));
    --s1-badge-pad-x: calc(16px * var(--s1-scale));
    --s1-badge-font: calc(15px * var(--s1-scale));
    --s1-badge-icon: calc(22px * var(--s1-scale));
    --s1-pill-gap: calc(10px * var(--s1-scale));
    --s1-pill-pad-y: calc(10px * var(--s1-scale));
    --s1-pill-pad-x: calc(8px * var(--s1-scale));
    --s1-pill-radius: calc(26px * var(--s1-scale));
    --s1-pill-min-h: calc(54px * var(--s1-scale));
    --s1-pill-icon: calc(40px * var(--s1-scale));
    --s1-pill-label: calc(12px * var(--s1-scale));
    --s1-photo-top: 0;
    --s1-photo-h: var(--zp-hero-panel-h, calc(100cqi * 487 / 1344));
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__top {
    position: relative !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    left: var(--s1-intro-left) !important;
    top: var(--s1-intro-top) !important;
    right: auto !important;
    bottom: auto !important;
    width: var(--s1-intro-width) !important;
    max-width: var(--s1-intro-width) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(var(--zp-hero-panel-h, calc(100cqi * 487 / 1344)) - var(--s1-intro-top) - calc(12px * var(--s1-scale))) !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: var(--s1-stack-gap) !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge {
    min-height: var(--s1-badge-h) !important;
    height: auto !important;
    margin: 0 !important;
    padding: calc(6px * var(--s1-scale)) var(--s1-badge-pad-x) !important;
    gap: calc(8px * var(--s1-scale)) !important;
    width: auto !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
    border-radius: 999px !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge__icon {
    width: var(--s1-badge-icon) !important;
    height: var(--s1-badge-icon) !important;
    flex: 0 0 var(--s1-badge-icon) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-occasion-badge__text {
    font-size: var(--s1-badge-font) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    text-wrap: balance !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text {
    min-height: 0 !important;
    height: auto !important;
    gap: var(--s1-text-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 1 auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text h1,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1 {
    font-size: var(--s1-h1-size) !important;
    line-height: var(--s1-h1-lh) !important;
    font-weight: 700 !important;
    max-width: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__line,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__gold {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    text-wrap: balance !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__gold {
    color: #f5cc57 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text .lead {
    font-size: var(--s1-lead-size) !important;
    font-weight: 400 !important;
    line-height: var(--s1-lead-lh) !important;
    color: #ffffff !important;
    max-width: 100% !important;
    text-wrap: pretty !important;
    overflow-wrap: anywhere !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__cta--gift {
    gap: var(--s1-cta-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions {
    width: var(--s1-btn-width) !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions .btn.primary.hero-btn--gift {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: var(--s1-btn-h) !important;
    height: auto !important;
    padding: calc(10px * var(--s1-scale)) calc(18px * var(--s1-scale)) !important;
    font-size: var(--s1-btn-font) !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    color: #261548 !important;
    white-space: normal !important;
    text-wrap: balance !important;
    border: none !important;
    border-radius: var(--s1-btn-radius) !important;
    background: linear-gradient(180deg, #ffe992 0%, #f5c84a 52%, #e8b83a 100%) !important;
    background-image: linear-gradient(180deg, #ffe992 0%, #f5c84a 52%, #e8b83a 100%) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.22) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__note--gift {
    display: block !important;
    margin: 0 !important;
    font-size: var(--s1-note-size) !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    color: rgba(255, 255, 255, 0.82) !important;
    max-width: 100% !important;
    text-wrap: pretty !important;
    overflow-wrap: anywhere !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pills {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    align-content: flex-start !important;
    gap: var(--s1-pill-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    margin-top: auto !important;
    padding: 0 !important;
    list-style: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill {
    flex: 1 1 0 !important;
    flex-direction: row !important;
    align-items: center !important;
    align-self: auto !important;
    justify-content: flex-start !important;
    gap: calc(8px * var(--s1-scale)) !important;
    min-width: 0 !important;
    min-height: var(--s1-pill-min-h) !important;
    height: auto !important;
    max-height: none !important;
    padding: var(--s1-pill-pad-y) var(--s1-pill-pad-x) !important;
    box-sizing: border-box !important;
    border-radius: var(--s1-pill-radius) !important;
    border: 1.5px solid rgba(230, 200, 102, 0.75) !important;
    background: rgba(35, 8, 90, 0.22) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill__icon {
    width: var(--s1-pill-icon) !important;
    height: var(--s1-pill-icon) !important;
    flex: 0 0 var(--s1-pill-icon) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pill__label {
    font-size: var(--s1-pill-label) !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    text-align: left !important;
    color: #ebe0ff !important;
    overflow-wrap: anywhere !important;
    min-width: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-quick-gallery {
    left: var(--s1-photo-left) !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: calc(100cqi - var(--s1-photo-left)) !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo {
    overflow: hidden !important;
    background: transparent !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    transform: none !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: var(--s1-photo-h) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-static-photo img {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: var(--s1-photo-h) !important;
    object-fit: contain !important;
    object-position: left center !important;
    filter: drop-shadow(-10px 6px 24px rgba(0, 0, 0, 0.32)) !important;
    border-radius: inherit !important;
  }
}

/* Слайд 1 «Подарок»: ≤1319px — flex-колонка вместо absolute-слотов (без наложения текста) */
@media (max-width: 1319px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__top {
    aspect-ratio: 16 / 9;
    min-height: 0;
    height: auto;
    overflow: visible;
    --zp-hero-m-lead: 2.55cqi;
    --zp-hero-m-title: 3.55cqi;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: var(--zp-hero-m-copy-pad-x) !important;
    right: auto !important;
    width: min(
      var(--zp-hero-m-copy-w),
      calc(
        100cqi - var(--zp-hero-m-photo-right) -
          calc(
            var(--zp-hero-m-photo-ref) / var(--zp-hero-m-banner-ref) * 100cqi *
              var(--zp-hero-photo-size-scale, 0.84)
          ) - 2cqi
      )
    ) !important;
    max-width: min(
      var(--zp-hero-m-copy-w),
      calc(
        100cqi - var(--zp-hero-m-photo-right) -
          calc(
            var(--zp-hero-m-photo-ref) / var(--zp-hero-m-banner-ref) * 100cqi *
              var(--zp-hero-photo-size-scale, 0.84)
          ) - 2cqi
      )
    ) !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: clamp(6px, 1.8cqi, 10px) 0 !important;
    margin: 0 !important;
    gap: clamp(3px, 1cqi, 7px) !important;
    box-sizing: border-box !important;
    z-index: 4 !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text {
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(2px, 0.75cqi, 5px) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro h1,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text h1,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1 {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    line-height: 1.12 !important;
    flex-shrink: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__text .lead {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    line-height: 1.22 !important;
    font-weight: 400 !important;
    flex: 0 1 auto !important;
    min-height: 0 !important;
    text-wrap: pretty !important;
    overflow-wrap: anywhere !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-copy__cta--gift {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    z-index: auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions .btn.primary,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-actions .btn.primary.hero-btn--gift {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: var(--zp-hero-m-btn-min-h) !important;
    height: auto !important;
    white-space: normal !important;
    text-wrap: balance !important;
    line-height: var(--zp-hero-m-btn-lh, 1.2) !important;
    padding: var(--zp-hero-m-btn-pad-y) var(--zp-hero-m-btn-pad-x) !important;
    font-size: var(--zp-hero-m-btn-fs) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__line,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-slide1-h1__gold {
    overflow-wrap: anywhere !important;
    text-wrap: balance !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='0']:not(.zp-hero-slide--banner-img) .hero-text-pills {
    display: none !important;
  }
}

/* Слайд 1-баннер на ПК: фон как у слайдов 2–6 (панель), без отдельного SVG-декора */
@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__bg-decor {
    display: none !important;
  }
}

/* Все слайды героя ≤767px: 16:9 на всю ширину */
@media (max-width: 767px) {
  body.home-layout-ref #top.hero {
    --zp-hero-banner-max-w: 100%;
    --zp-hero-banner-max-h: none;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']) .hero-copy__top {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin-inline: 0 !important;
    --zp-hero-m-photo-max-w: 46.02cqi;
  }

  /* Слайды 1-баннер и 2–6: flex-колонка + фото как zp-service-hero__banner */
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']):not([data-hero-slide='0']) .hero-copy__top {
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-copy__top {
    overflow: hidden !important;
    --zp-hero-s1-photo-max-w: 60cqi;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-mobile-layout='stack']):not([data-hero-slide='0']) .hero-copy__intro {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    left: 3.825cqi !important;
    right: calc(var(--zp-hero-m-photo-max-w, 38cqi) + 2.5cqi + 1.2cqi) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: calc(100% - clamp(10px, 2.8cqi, 14px)) !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: clamp(10px, 2.75cqi, 16px) !important;
    z-index: 4 !important;
    transform: translateY(-50%) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-copy__intro--slide1-banner {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    left: 3.825cqi !important;
    right: calc(var(--zp-hero-s1-photo-max-w, 60cqi) + 1.2cqi) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: calc(100% - clamp(10px, 2.8cqi, 14px)) !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: clamp(10px, 2.75cqi, 16px) !important;
    z-index: 4 !important;
    transform: translateY(-50%) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-copy__text {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: clamp(2px, 0.65cqi, 5px) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    flex: 0 1 auto !important;
    overflow: visible !important;
  }

  /* ПК ≥1320: заголовок/лид крупнее; селекторы без «голых» h2 после запятой */
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro h1,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text h1,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner h1,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-copy__text h1,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-copy__text h2.hero-slide-title {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: clamp(40px, 6.4cqi, 46px) !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
    text-align: left !important;
    white-space: normal !important;
    text-wrap: wrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: manual !important;
    -webkit-hyphens: manual !important;
    display: block !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__intro [data-i18n='hero.lead'],
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text .lead,
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-copy__text [data-i18n='hero.lead'],
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner p,
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-copy__text p {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    font-size: clamp(20px, 3.2cqi, 22px) !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    text-align: left !important;
    white-space: normal !important;
    text-wrap: wrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: manual !important;
    -webkit-hyphens: manual !important;
    display: block !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__text p {
    font-size: clamp(18px, 2.9cqi, 20px) !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']):not([data-hero-mobile-layout='stack']) .hero-copy__cta,
  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-copy__intro--slide1-banner .hero-copy__cta {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    overflow: visible !important;
    align-self: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']):not([data-hero-mobile-layout='stack']) .hero-actions,
  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-copy__intro--slide1-banner .hero-actions {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: clamp(16px, 4.2cqi, 22px) 0 0 !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    z-index: 5 !important;
    align-self: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']) .hero-actions a.btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide--banner-img .hero-copy__intro--slide1-banner .hero-actions a.btn.primary:not(.hero-btn--gift) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    max-width: none !important;
    min-height: 46px !important;
    height: auto !important;
    padding: 12px 16px !important;
    border-radius: var(--zp-hero-cta-radius, 12px) !important;
    font-family: var(--zp-hero-cta-font, 'Roboto', system-ui, sans-serif) !important;
    font-size: 15px !important;
    font-weight: var(--zp-hero-cta-fw, 500) !important;
    line-height: 20px !important;
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    box-shadow: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']):not([data-hero-mobile-layout='stack']) .hero-quick-gallery {
    --zp-hero-photo-inset-y: clamp(5px, 1.4cqi, 9px);
    position: absolute !important;
    top: var(--zp-hero-photo-inset-y) !important;
    bottom: var(--zp-hero-photo-inset-y) !important;
    left: auto !important;
    right: 2.5cqi !important;
    width: auto !important;
    height: auto !important;
    max-width: var(--zp-hero-m-photo-max-w, 38cqi) !important;
    max-height: calc(100% - 2 * var(--zp-hero-photo-inset-y)) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    z-index: 3 !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  /* Слайд 1: фото на всю высоту модуля, вплотную к правому краю (≤767px, не stack) */
  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-quick-gallery {
    --zp-hero-photo-inset-y: 0;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    right: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: var(--zp-hero-s1-photo-max-w, 60cqi) !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 3 !important;
    transform: none !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']):not([data-hero-mobile-layout='stack']) .hero-static-photo {
    width: auto !important;
    height: auto !important;
    aspect-ratio: auto !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: calc(100% - 2 * var(--zp-hero-photo-inset-y, 6px)) !important;
    flex: 0 0 auto !important;
    border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
    overflow: hidden !important;
    background: transparent !important;
  }

  body.home-layout-ref #top .zp-hero-slide:not([data-hero-slide='0']):not([data-hero-mobile-layout='stack']) .hero-static-photo img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    aspect-ratio: auto !important;
    max-width: var(--zp-hero-m-photo-max-w, 38cqi) !important;
    max-height: calc(100% - 2 * var(--zp-hero-photo-inset-y, 6px)) !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: inherit !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-static-photo {
    width: auto !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img:not([data-hero-mobile-layout='stack']) .hero-static-photo img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: right center !important;
    border-radius: 0 !important;
  }
}

/* Планшет 768–1319: stack — overlay (текст слева, фото справа) */
@media (min-width: 768px) and (max-width: 1319px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    left: 3.825cqi !important;
    right: calc(var(--zp-hero-m-photo-max-w, 38cqi) + 2.5cqi + 1.2cqi) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: calc(100% - clamp(10px, 2.8cqi, 14px)) !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: clamp(12px, 2.75cqi, 18px) !important;
    z-index: 4 !important;
    transform: translateY(-50%) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner {
    right: calc(var(--zp-hero-s1-photo-max-w, 60cqi) + 1.2cqi) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: clamp(8px, 2.2cqi, 14px) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    flex: 0 1 auto !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: clamp(24px, var(--zp-hero-m-title), 32px) !important;
    line-height: var(--zp-hero-m-title-lh, 1.2) !important;
    font-weight: 400 !important;
    color: #ffffff !important;
    text-align: left !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text .lead {
    font-family: var(--zp-font-ui) !important;
    font-size: var(--zp-hero-m-lead) !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    text-align: left !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text h1, .hero-copy__text h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text .hero-copy__micro {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-copy__text .hero-copy__micro {
    font-size: calc(var(--zp-hero-m-lead) * 0.86) !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
    opacity: 0.94 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__cta {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: clamp(8px, 2cqi, 12px) !important;
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    align-self: flex-start !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions a.btn.primary:not(.hero-btn--gift) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    min-height: 46px !important;
    height: auto !important;
    padding: 12px 20px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: var(--zp-hero-cta-radius, 12px) !important;
    font-family: var(--zp-hero-cta-font, 'Roboto', system-ui, sans-serif) !important;
    font-size: clamp(14px, var(--zp-hero-m-btn-fs, 3.279cqi), 16px) !important;
    line-height: 20px !important;
    font-weight: var(--zp-hero-cta-fw, 500) !important;
    letter-spacing: 0 !important;
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    filter: none !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions .btn.primary:not(.hero-btn--gift):hover,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions a.btn.primary:not(.hero-btn--gift):hover {
    background: var(--zp-hero-cta-bg, #ffffff) !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    filter: brightness(0.97) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label--short {
    display: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label--full {
    display: inline !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: nowrap !important;
    pointer-events: auto !important;
  }
}

/* Мобилка ≤767px: stack — один столбец: h1 → lead → кнопка → фото 4:3 */
@media (max-width: 767px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] {
    height: 100% !important;
    min-height: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'].is-active {
    display: block !important;
    height: 100% !important;
    min-height: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy {
    height: 100% !important;
    min-height: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__bg-decor {
    display: none !important;
  }

  /* Единый контейнер слайда */
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__top {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: var(--zp-hero-m-stack-gap, 12px) !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: calc(10px + var(--zp-hero-m-stack-drop, 30px)) var(--zp-hero-m-pad-x, 16px)
      var(--zp-hero-m-photo-controls-gap, 8px) !important;
    box-sizing: border-box !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__top::before {
    display: none !important;
    content: none !important;
  }

  /* Блок текста + кнопка (без фото) */
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner {
    position: static !important;
    z-index: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    gap: var(--zp-hero-m-stack-gap, 12px) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background: transparent !important;
    transform: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: var(--zp-hero-m-text-gap, 8px) !important;
    flex: 0 0 auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro h1, .hero-copy__intro h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner h1, .hero-copy__intro--slide1-banner h2.hero-slide-title,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text h1, .hero-copy__text h2.hero-slide-title {
    order: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: var(--zp-hero-m-title-fs, 28px) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    color: #fff !important;
    text-align: center !important;
    text-wrap: wrap !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text p,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text .lead,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner p {
    order: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: var(--zp-hero-m-lead-fs, 17px) !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    color: #fff !important;
    text-align: center !important;
    text-wrap: wrap !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__text .hero-copy__micro {
    display: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__cta {
    order: 3 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 5 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-copy__note {
    display: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions {
    position: static !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 5 !important;
    align-self: center !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions a.btn.primary:not(.hero-btn--gift) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 10px 20px !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: #fff !important;
    background-image: none !important;
    color: var(--zp-hero-usib-brand, #6440bf) !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    text-align: center !important;
    box-shadow: none !important;
    filter: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions .btn.primary.hero-btn--gift,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions a.btn.primary.hero-btn--gift {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 46px !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffe992 0%, #f5c84a 52%, #e8b83a 100%) !important;
    background-image: linear-gradient(180deg, #ffe992 0%, #f5c84a 52%, #e8b83a 100%) !important;
    color: #261548 !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22) !important;
    white-space: normal !important;
    text-wrap: balance !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label--short {
    display: none !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label--full {
    display: inline !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: nowrap !important;
    pointer-events: auto !important;
  }

  /* Фото 4:3 на всю ширину #zpHeroCarousel, прижато к пагинации */
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-quick-gallery {
    order: 4 !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    flex: 1 1 auto !important;
    flex-shrink: 1 !important;
    width: calc(100% + 2 * var(--zp-hero-m-pad-x, 16px)) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: calc(100% + 2 * var(--zp-hero-m-pad-x, 16px)) !important;
    margin: 0 calc(-1 * var(--zp-hero-m-pad-x, 16px)) !important;
    padding: 0 !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .zp-hero-slide1-banner-img {
    pointer-events: auto !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-static-photo {
    position: relative !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: var(--zp-hero-m-photo-ratio, 4 / 3) !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .zp-hero-slide1-banner-img {
    position: static !important;
    transform: none !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 0 !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'][data-hero-mobile-layout='stack'],
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'][data-hero-mobile-layout='stack'] {
    --zp-hero-m-title-fs: clamp(20px, 5.8vw, 24px);
    --zp-hero-m-lead-fs: 15px;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'][data-hero-mobile-layout='stack'] {
    --zp-hero-m-lead-fs: 15px;
  }

  /* Visual slides 2,3,5,6: фото на всю ширину экрана, без боковых отступов (только размер) */
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'][data-hero-mobile-layout='stack'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-slide='0'][data-hero-mobile-layout='stack'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'][data-hero-mobile-layout='stack'] .hero-quick-gallery,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'][data-hero-mobile-layout='stack'] .hero-quick-gallery {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'][data-hero-mobile-layout='stack'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-slide='0'][data-hero-mobile-layout='stack'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'][data-hero-mobile-layout='stack'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'][data-hero-mobile-layout='stack'] .hero-static-photo,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'][data-hero-mobile-layout='stack'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-slide='0'][data-hero-mobile-layout='stack'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-slide='0'][data-hero-mobile-layout='stack'] .zp-hero-slide1-banner-img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'][data-hero-mobile-layout='stack'] .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='1'][data-hero-mobile-layout='stack'] .hero-static-photo img {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Hero CTA mobile (stack): hover/label — только мобилка */
@media (max-width: 767px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions .btn.primary:hover,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-actions a.btn.primary:hover,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner .hero-actions .btn.primary:hover,
  body.home-layout-ref #top .zp-hero-slide--banner-img[data-hero-mobile-layout='stack'] .hero-copy__intro--slide1-banner .hero-actions a.btn.primary:hover {
    background: #ffffff !important;
    background-image: none !important;
    color: #6440bf !important;
    filter: brightness(0.97) !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label,
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-btn__label--full {
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    pointer-events: auto !important;
  }
}

/* Главная ≤767px: кнопки секций — ширина по контенту, отступы как на ПК */
@media (max-width: 767px) {
  /* Отмена zerkalo-main.css (≤800px): hero-actions и .btn на всю ширину */
  body.home-layout-ref .hero-actions {
    width: auto !important;
    max-width: 100% !important;
  }

  body.home-layout-ref .hero-actions .btn,
  body.home-layout-ref .hero-actions a.btn,
  body.home-layout-ref .hero-actions button.btn {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Золотые primary (карточки кейсов — full width внутри карточки, как на ПК) */
  body.home-layout-ref .btn.primary:not(.zp-home-case-card__cta-btn),
  body.home-layout-ref a.btn.primary:not(.zp-home-case-card__cta-btn),
  body.home-layout-ref button.btn.primary:not(.zp-home-case-card__cta-btn) {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 8px 36px !important;
    min-height: 60px !important;
    font-size: 18px !important;
    line-height: 22px !important;
    border-radius: 15px !important;
    box-sizing: border-box !important;
  }

  /* Герой: белая CTA поверх общего .btn.primary */
  body.home-layout-ref #top .hero-actions .btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .hero-actions a.btn.primary:not(.hero-btn--gift),
  body.home-layout-ref #top .hero-actions button.btn.primary:not(.hero-btn--gift) {
    padding: 10px 20px !important;
    min-height: 48px !important;
    font-size: 15px !important;
    line-height: 18px !important;
    border-radius: 11px !important;
    background: #fff !important;
    background-image: none !important;
    color: var(--zp-hero-cta-color, #6440bf) !important;
    font-family: var(--zp-hero-cta-font, 'Roboto', system-ui, sans-serif) !important;
    font-weight: 500 !important;
  }

  body.home-layout-ref .btn.secondary,
  body.home-layout-ref a.btn.secondary,
  body.home-layout-ref button.btn.secondary {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.home-layout-ref .zp-process__cta .btn {
    width: auto !important;
    min-width: 0 !important;
  }

  body.home-layout-ref #reviews .reviews-more .btn {
    width: auto !important;
    max-width: 100% !important;
  }
}

/* Hero carousel: unified 4:3 photo box = full module height, width from ratio, contain (transparent). */
body.home-layout-ref #top .zp-hero-carousel {
  --zp-hero-photo-box-ratio: 4 / 3;
}

body.home-layout-ref #top .zp-hero-slide .hero-quick-gallery {
  --zp-hero-photo-inset-x: auto;
  --zp-hero-photo-inset-y: 0;
}

body.home-layout-ref #top .zp-hero-slide .hero-quick-gallery,
body.home-layout-ref #top .zp-hero-slide--banner-img .hero-quick-gallery {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  left: auto !important;
  width: auto !important;
  height: 100% !important;
  max-height: 100% !important;
  aspect-ratio: var(--zp-hero-photo-box-ratio, 4 / 3) !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  transform: none !important;
  z-index: 12 !important;
  pointer-events: none;
}

body.home-layout-ref #top .zp-hero-slide .hero-static-photo,
body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  background: transparent !important;
  border-radius: var(--zp-hero-photo-radius, clamp(6px, 4.098cqi, 14px)) !important;
  transform: none !important;
  filter: none;
}

body.home-layout-ref #top .zp-hero-slide .hero-static-photo img,
body.home-layout-ref #top .zp-hero-slide--banner-img .hero-static-photo img,
body.home-layout-ref #top .zp-hero-slide .zp-hero-slide1-banner-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
  border-radius: inherit !important;
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* ПК: слайды «книга» (3) и «документы» (4) — одинаковое фото справа, 130% высоты */
@media (min-width: 1320px) {
  body.home-layout-ref #top .zp-hero-panel:has(.zp-hero-slide--banner-img.is-active),
  body.home-layout-ref #top .zp-hero-panel:has(.zp-hero-slide[data-hero-slide='5'].is-active),
  body.home-layout-ref #top .zp-hero-panel:has(.zp-hero-slide[data-hero-slide='4'].is-active),
  body.home-layout-ref #top .zp-hero-carousel__stage:has(.zp-hero-slide--banner-img.is-active),
  body.home-layout-ref #top .zp-hero-carousel__stage:has(.zp-hero-slide[data-hero-slide='5'].is-active),
  body.home-layout-ref #top .zp-hero-carousel__stage:has(.zp-hero-slide[data-hero-slide='4'].is-active) {
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide.zp-hero-slide--gift.zp-hero-slide--banner-img .hero-copy__top,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-copy__top,
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-copy__top {
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide.zp-hero-slide--gift.zp-hero-slide--banner-img .hero-quick-gallery {
    left: auto !important;
    right: 0 !important;
    top: 50% !important;
    bottom: auto !important;
    width: auto !important;
    height: 110.5% !important; /* 130% × 0.85 */
    max-width: min(862px, 64.1%) !important; /* 1014/75.4 × 0.85 */
    max-height: none !important;
    aspect-ratio: auto !important;
    transform: translateY(-50%) !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  /* Слайд 4 (документы): как книга −15%, затем ещё −15%, right: 0 */
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-quick-gallery {
    left: auto !important;
    right: 0 !important;
    top: 50% !important;
    bottom: auto !important;
    width: auto !important;
    height: 93.925% !important; /* 110.5% × 0.85 */
    max-width: min(733px, 54.5%) !important; /* 862/64.1 × 0.85 */
    max-height: none !important;
    aspect-ratio: 1600 / 1195 !important; /* lazy-img */
    transform: translateY(-50%) !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide.zp-hero-slide--gift.zp-hero-slide--banner-img .hero-static-photo {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide.zp-hero-slide--gift.zp-hero-slide--banner-img .hero-static-photo img,
  body.home-layout-ref #top .zp-hero-slide.zp-hero-slide--gift.zp-hero-slide--banner-img .zp-hero-slide1-banner-img {
    width: auto !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: right center !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='4'] .hero-static-photo img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: right center !important;
  }

  /* Слайд 2 (металл): вплотную к правому краю контентного блока, −10% затем ещё −15% */
  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-quick-gallery {
    left: auto !important;
    right: 0 !important; /* край hero-copy__top, не 100vw */
    top: 50% !important;
    bottom: auto !important;
    width: auto !important;
    height: 99.45% !important; /* 117% × 0.85 */
    max-width: min(776px, 57.7%) !important; /* 913/67.9 × 0.85 */
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: 904 / 678 !important; /* иначе width:auto → 0 до lazy-load */
    transform: translateY(-50%) !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='5'] .hero-static-photo img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: right center !important;
  }

  /* Слайд 5 (нейро): +15% к текущему размеру фото, позиция слева как была */
  body.home-layout-ref #top .zp-hero-panel:has(.zp-hero-slide[data-hero-slide='2'].is-active),
  body.home-layout-ref #top .zp-hero-carousel__stage:has(.zp-hero-slide[data-hero-slide='2'].is-active) {
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-copy__top {
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-quick-gallery {
    left: 696px !important;
    right: auto !important;
    top: 50% !important;
    bottom: auto !important;
    width: 674px !important; /* ~586 × 1.15 */
    height: 504px !important; /* ~438 × 1.15 */
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: auto !important;
    transform: translateY(-50%) !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }

  body.home-layout-ref #top .zp-hero-slide[data-hero-slide='2'] .hero-static-photo img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
}

@media (max-width: 1319px) {
  body.home-layout-ref #top .hero-quick-gallery {
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: auto !important;
    width: auto !important;
    height: 100% !important;
    max-height: 100% !important;
    aspect-ratio: var(--zp-hero-photo-box-ratio, 4 / 3) !important;
    transform: none !important;
  }

  body.home-layout-ref #top .hero-static-photo,
  body.home-layout-ref #top .hero-static-photo img {
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

@media (min-width: 768px) and (max-width: 1319px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-quick-gallery {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: auto !important;
    width: auto !important;
    height: 100% !important;
    max-height: 100% !important;
    aspect-ratio: var(--zp-hero-photo-box-ratio, 4 / 3) !important;
    margin: 0 !important;
    transform: none !important;
  }
}

@media (max-width: 767px) {
  body.home-layout-ref #top .zp-hero-slide[data-hero-mobile-layout='stack'] .hero-quick-gallery {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: var(--zp-hero-photo-box-ratio, 4 / 3) !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* Hub group lead under fotoobrabotka / service hubs */
.zp-service-hub__group-lead {
  margin: 0 0 14px;
  max-width: 72ch;
  color: #5c5470;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
}