/* Home page. Loaded by index.php only. */

/* Welcome: close under the booking bar, a touch more air above the facts row. */
.home-welcome { padding-top: clamp(2.5rem, 5vw, 4rem); }
.home-welcome .collage { margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.home-welcome .collage h2 { margin-bottom: 2rem; }

/* Lodges: the pale block behind the lower left, as in the reference, with the
   turning badge sitting on its edge. */
.home-lodges { position: relative; overflow: hidden; }
.home-lodges__block {
  position: absolute; left: 0; bottom: 0; z-index: -1;
  width: min(24vw, 360px); height: 58%;
  background: var(--mist);
}
.home-lodges__body { position: relative; }
.home-lodges__badge {
  position: absolute; z-index: 2;
  left: calc(min(24vw, 360px) - 52px); bottom: calc(58% - 52px);
  background: var(--white); border-radius: 50%;
  color: var(--forest);
}
.home-lodges .rail { --rail-card: clamp(270px, 27vw, 400px); }
@media (max-width: 1100px) { .home-lodges__badge { display: none; } }

/* Experiences: heading sticky on the left, the numbered list on the right. */
.home-exp__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.home-exp__head { position: sticky; top: calc(var(--header-h) + 2rem); margin: 0; }
.home-exp__head p { margin-bottom: .4rem; }
.home-exp .index__row { grid-template-columns: 3rem minmax(0, 12rem) minmax(0, 1fr) auto; }
@media (max-width: 960px) {
  .home-exp__grid { grid-template-columns: 1fr; }
  .home-exp__head { position: static; }
}
@media (max-width: 760px) { .home-exp .index__row { grid-template-columns: 1fr; } }

/* The restaurant feature runs edge to edge. */
.home-restaurant .feature__panel { padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); }
@media (max-width: 900px) { .home-restaurant .feature__panel { padding-left: var(--gutter); } }
