/* СЕКЦИЯ: Комнаты (rec1711016631, rec1711016641) */

.rooms {
  padding-block: 56px 0;
}

.rooms__heading {
  margin-bottom: 34px;
}

.rooms__list {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.room {
  display: flex;
  align-items: stretch;
  gap: 29px;
}

.room__slider {
  flex: 1 1 538px;
  min-width: 0;
  aspect-ratio: 538 / 419;
}

.room__card {
  flex: 1 1 546px;
  min-width: 0;
}

.room__card-body {
  display: flex;
  flex-direction: column;
  padding: 32px 48px 36px;
}

.room__title {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  font-weight: 500;
  margin-bottom: 2px;
}

.room__capacity {
  font-size: 14px;
  line-height: 22px;
  margin-bottom: 22px;
}

.room__features {
  gap: 22px;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  margin-bottom: 30px;
}

.room__cta {
  align-self: flex-start;
  min-width: 271px;
  min-height: 48px;
  margin-top: auto;
}

/* Вторая комната — картинка справа (как в Tilda: слайдер остаётся слева,
   но карточка «Бит» выводилась зеркально по сетке) */
.room--reverse .room__slider {
  order: 2;
}

/* ── 960 ─────────────────────────────────────────────────────── */
@media (max-width: 1199px) {
  .room {
    gap: 24px;
  }

  .room__slider {
    flex-basis: 437px;
  }

  .room__card {
    flex-basis: 443px;
  }

  .room__card-body {
    padding: 26px 30px 30px;
  }

  .room__features {
    gap: 18px;
  }

  .room__cta {
    min-width: 220px;
  }
}

/* ── 640 ─────────────────────────────────────────────────────── */
@media (max-width: 959px) {
  .rooms {
    padding-block: 40px 0;
  }

  .rooms__heading {
    margin-bottom: 26px;
  }

  .room {
    gap: 20px;
  }

  .room__slider {
    flex-basis: 300px;
    aspect-ratio: 300 / 371;
  }

  .room__card {
    flex-basis: 301px;
  }

  .room__card-body {
    padding: 22px 14px 24px;
  }

  .room__capacity {
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 16px;
  }

  .room__features {
    gap: 14px;
    margin-bottom: 22px;
  }

  .room__cta {
    min-width: 0;
    width: 100%;
    min-height: 36px;
    font-size: 12px;
    line-height: 18.6px;
  }
}

/* ── 320: в столбец ──────────────────────────────────────────── */
@media (max-width: 639px) {
  .rooms {
    padding-block: 32px 0;
  }

  .rooms__list {
    gap: 34px;
  }

  .room,
  .room--reverse {
    flex-direction: column;
    gap: 0;
  }

  .room__slider,
  .room--reverse .room__slider {
    order: 0;
    flex-basis: auto;
    width: 100%;
    aspect-ratio: 300 / 200;
  }

  .room__card {
    flex-basis: auto;
    width: 100%;
    margin-top: 10px;
  }
}
