/*
 * Единая система отступов публичной части сайта.
 *
 * Секция получает одинаковый внутренний отступ сверху и снизу. Следующая
 * фоновая секция перекрывает только пустой нижний отступ предыдущей секции,
 * поэтому между соседними содержательными блоками остаётся ровно один
 * стандартный промежуток, а не сумма двух разных отступов.
 */
:root {
  --site-layout-gutter: clamp(18px, 4vw, 72px);
  --site-section-space: clamp(56px, 6vw, 96px);
  --site-page-top-space: clamp(104px, 10vw, 144px);
  --site-block-gap: clamp(24px, 3vw, 38px);
  --site-column-gap: clamp(28px, 4vw, 64px);
  --site-grid-gap: clamp(18px, 2vw, 26px);
  --site-section-overlap: clamp(14px, 1.4vw, 22px);
  --site-hero-overlap: clamp(48px, 6vw, 84px);
}

/* Все основные секции используют одинаковые внешние поля и вертикальный ритм. */
main > .section,
main > .booking,
.house-detail-page > .section,
.house-detail-page > .booking {
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  padding: var(--site-section-space) var(--site-layout-gutter) !important;
}

/*
 * На главной странице соседний фон лишь немного заходит на предыдущую секцию.
 * Карточки остаются видимыми почти полностью, а визуальный переход сохраняется.
 */
main > .home-section-bg + .home-section-bg {
  margin-top: calc(0px - var(--site-section-overlap)) !important;
  padding-top: var(--site-section-overlap) !important;
}

/* На страницах домов сохраняем отдельную схему перекрытия секций. */
.house-detail-page > .home-section-bg + .home-section-bg {
  margin-top: calc(0px - var(--site-section-space)) !important;
  padding-top: var(--site-section-space) !important;
}

/* Первый блок дома мягко заходит на нижний градиент обложки без лишней пустоты. */
.house-detail-page > .home-section-bg:first-of-type {
  margin-top: calc(0px - var(--site-hero-overlap)) !important;
  padding-top: calc(var(--site-section-space) + var(--site-hero-overlap)) !important;
}

/* Контактный блок в доме получает одинаковое видимое расстояние сверху и снизу. */
.house-detail-page > .availability-section + .house-contact-section {
  margin-top: calc(0px - var(--site-section-space)) !important;
  padding-top: var(--site-section-space) !important;
  padding-bottom: var(--site-section-space) !important;
  min-height: 0 !important;
}

/* Стандартные расстояния между заголовком секции и её содержимым. */
.section__head,
.gallery-section__head,
.house-detail-page .house-about__headline,
.house-detail-page .availability-panel__head {
  margin-bottom: var(--site-block-gap) !important;
}

.rooms-panel__head {
  margin-bottom: clamp(18px, 2vw, 24px) !important;
}

/* Единые промежутки в двухколоночных секциях и основных сетках. */
.about-section,
.price-intro,
.booking,
.house-about__layout,
.reviews-page__layout {
  column-gap: var(--site-column-gap) !important;
  row-gap: var(--site-block-gap) !important;
}

.feature-grid,
.room-grid {
  gap: var(--site-grid-gap) !important;
}

.rooms-panel {
  margin-bottom: var(--site-grid-gap) !important;
}

.price-table {
  margin-top: var(--site-block-gap) !important;
}

.reviews-page__intro {
  margin-bottom: var(--site-block-gap) !important;
}

/* Внутренние страницы начинаются ниже фиксированной шапки и завершаются одинаково. */
.contacts-page,
.reviews-page {
  padding-top: var(--site-page-top-space) !important;
  padding-right: var(--site-layout-gutter) !important;
  padding-bottom: var(--site-section-space) !important;
  padding-left: var(--site-layout-gutter) !important;
}

.contacts-page .booking {
  margin: 0 auto !important;
}

/* Нижняя часть сайта продолжает общий вертикальный ритм. */
.site-footer {
  padding: clamp(38px, 4vw, 56px) var(--site-layout-gutter) !important;
}

@media (max-width: 900px) {
  :root {
    --site-section-space: clamp(48px, 9vw, 68px);
    --site-block-gap: clamp(22px, 5vw, 32px);
    --site-column-gap: clamp(24px, 6vw, 40px);
    --site-grid-gap: clamp(16px, 4vw, 22px);
    --site-section-overlap: clamp(12px, 2.5vw, 18px);
    --site-hero-overlap: clamp(36px, 8vw, 58px);
  }
}

@media (max-width: 640px) {
  :root {
    --site-layout-gutter: 18px;
    --site-section-space: clamp(42px, 12vw, 58px);
    --site-page-top-space: 96px;
    --site-block-gap: 22px;
    --site-column-gap: 24px;
    --site-grid-gap: 16px;
    --site-section-overlap: 10px;
    --site-hero-overlap: 38px;
  }

  .site-footer {
    padding-top: 34px !important;
    padding-bottom: 30px !important;
  }
}