/* Suite pages: highlights: the part every page shares.
   Used on: /suites/deluxe/, /suites/honeymoon/, /suites/standard/, /suites/super-deluxe/.
   Pages that look a little different have a small extra file beside them (suite-highlights-<page>.css), loaded right after this one.
   Forum Homini website, editable IIS version v016 20261109 081746. Generated with Claude Opus 5.5. */
.sh-more[data-c-suite-highlights] {
  display: grid;
  justify-items: center;
  margin-block-start: calc(-1 * var(--s-9));
  padding: 0 var(--margin) var(--s-9);
  background-color: var(--room-deep);
  color: var(--naledi);
}
.sh[data-c-suite-highlights] {
  padding-block: var(--s-8) var(--s-9);
  background-color: var(--room-deep);
  color: var(--naledi);
}
.sh__grid[data-c-suite-highlights] {
  display: grid;
  gap: var(--s-7);
}
.sh__title[data-c-suite-highlights] {
  margin-block-end: var(--s-7);
  font-size: var(--fs-xl);
  line-height: 1;
  color: var(--naledi);
}
.sh__facts[data-c-suite-highlights] {
  display: grid;
  gap: var(--s-7);
  align-content: center;
  font-size: var(--fs-body-long);
}
/* The suite's film stands upright, like a phone held up beside the words (owner's portrait video) */
.sh__film[data-c-suite-highlights] {
  margin: 0;
  justify-self: center;
  inline-size: min(100%, 380px);
}
.sh__video[data-c-suite-highlights] {
  display: block;
  inline-size: 100%;
  aspect-ratio: 9 / 16;
  border-radius: 18px;
  background: var(--night);
  box-shadow: 0 30px 80px -30px rgb(0 0 0 / 0.8);
}
@media (min-width: 821px) {
  .sh__grid[data-c-suite-highlights] {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    align-items: center;
    column-gap: var(--s-9);
  }
}
@media (min-width: 641px) {
  .sh__title[data-c-suite-highlights] {
    padding-inline-end: min(22rem, 28vw);
  }
}