/* ===========================================================================
   VT360 compact menu placement — Home only
   ===========================================================================
   The menu is independent from the topbar and the legacy RD Navbar.
   At load it begins 50px below the fixed topbar; while the hero scrolls,
   native position: sticky keeps it 20px below that bar.
   =========================================================================== */
:root {
  --vt360-topbar-height: 52px;
  --vt360-home-menu-start-gap: 50px;
  --vt360-home-menu-sticky-gap: 20px;
  --vt360-home-menu-surface-width-delta: 36px;
}

.page.vt360-home-page {
  overflow: visible;
}

.vt360-home-hero {
  position: relative;
}

/* Avoid the Windows scrollbar-gutter overflow caused by the template's 100vw slider. */
.vt360-home-page .swiper-container {
  width: 100%;
}

/* Keep the caption animation on its nested headings; shift only the caption wrapper. */
.vt360-home-hero .swiper-slide-caption {
  position: relative;
  top: 130px;
}

/* Decorative 620px pseudo-text must not widen the document after .page became sticky-safe. */
.vt360-home-page > .decor-text {
  overflow-x: clip;
}

.vt360-home-menu-layer {
  position: absolute;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
}

/* Прозрачный слой активен только при раскрытом мобильном фильтре. Он лежит
   под меню (1000), но над страницей: фон нельзя нажать или прокрутить. */
.vt360-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 999;
  touch-action: none;
  overscroll-behavior: contain;
  background: transparent;
}

/* При раскрытом мобильном фильтре жесты блокирует JS вместе с этой подложкой.
   overflow у html/body не меняется: у sticky-меню всегда один scroll-контейнер. */

.vt360-home-menu {
  position: sticky;
  top: calc(var(--vt360-topbar-height) + var(--vt360-home-menu-sticky-gap));
  width: 100%;
  margin-top: calc(var(--vt360-topbar-height) + var(--vt360-home-menu-start-gap));
  padding: 0 15px;
  pointer-events: auto;
}

.vt360-home-menu .vt-menu {
  width: 100%;
  max-width: 1040px;
}

.vt360-home-menu .vt-menu {
    transition: width 0.24s ease, max-width 0.24s ease;
  }

  .vt360-home-menu .vt-menu-surface {
    transition: padding 0.24s ease;
  }

  .vt360-home-menu .vt-menu-tabs {
    max-height: 60px;
    overflow: hidden;
    opacity: 1;
    transition: max-height 0.24s ease, padding 0.24s ease,
      border-color 0.18s ease, opacity 0.16s ease;
  }

  .vt360-home-menu .vt-menu-panel {
    transition: margin-top 0.24s ease;
  }

  .vt360-home-menu .vt-menu-select-trigger,
  .vt360-home-menu .vt-geo-toggle,
  .vt360-home-menu .vt-menu-location-input,
  .vt360-home-menu .vt-menu-submit {
    transition: height 0.24s ease, font-size 0.24s ease, padding 0.24s ease;
  }

  .vt360-home-menu .vt-menu-field--select {
    transition: flex-basis 0.24s ease, width 0.24s ease, max-width 0.24s ease;
  }

  .vt360-home-menu .vt-menu-field--select-narrow,
  .vt360-home-menu .vt-menu-field--location,
  .vt360-home-menu .vt-menu-pair {
    transition: flex-basis 0.24s ease;
  }

  .vt360-home-menu .vt-menu-filters {
    transition: margin-top 0.24s ease;
  }

  .vt360-home-menu .vt-menu-filters .vt-menu-select-trigger {
    transition: padding 0.24s ease;
  }

  /* Fixed state: links collapse, leaving a 10px dark frame around filters. */
  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-surface {
    padding: 10px;
  }

  /* The surface is 36px narrower; with 8px less padding per side, the white form is 20px narrower. */
  .vt360-home-menu.vt360-home-menu--stuck .vt-menu {
    width: calc(100% - var(--vt360-home-menu-surface-width-delta));
    max-width: calc(1040px - var(--vt360-home-menu-surface-width-delta));
    --vt-menu-deal-w: 186px;
    --vt-menu-type-w: 206px;
  }

  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-field--location {
    flex-basis: 216px;
  }

  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-tabs {
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom-color: transparent;
    opacity: 0;
  }

  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-panel {
    margin-top: 0;
  }

  /* Compact white form: each filter row becomes 4px shorter (2px per side). */
  .vt360-home-menu.vt360-home-menu--stuck .vt-menu {
    --vt-menu-control-h: 42px;
  }

  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-filters .vt-menu-select-trigger {
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-filters {
    margin-top: -10px;
  }

  /* Compact labels in the fixed form; category tabs and dropdown items stay unchanged. */
  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-panel .vt-menu-select-trigger,
  .vt360-home-menu.vt360-home-menu--stuck .vt-menu-location-input {
    font-size: 13px;
  }

.vt360-home-menu.vt360-home-menu--stuck .vt-menu-submit {
  font-size: 14px;
  padding-right: 33px;
  padding-left: 33px;
}

/* «Заказать съёмку» — пункт верхней строки только для мобильной раскладки.
   На 992px и шире он полностью исключён из строки; ниже возвращается штатно. */
@media (min-width: 992px) {
  .vt360-home-menu [data-vt-menu-tab="photo-order"] {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .vt360-home-menu {
    padding: 0 10px;
  }
}
