/* V6 — clearer hierarchy, solid surfaces and an editable page flow */
.sr-site main {
  display: flex;
  flex-direction: column;
}

/* Keep the interface tactile and photographic: no glass UI. */
.sr-header.is-scrolled {
  background: #12231c;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sr-button--glass {
  color: var(--sr-paper) !important;
  border-color: rgba(251,248,242,.72);
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sr-hero__rating {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sr-arrive .sr-arch-image img { object-position: center; }

/* The hut explorer now arrives early and owns the fold. */
.sr-hut-explorer {
  padding-top: clamp(75px,8vw,125px);
  padding-bottom: clamp(95px,9vw,145px);
}

.sr-hut-explorer .sr-section-head {
  margin-bottom: clamp(35px,4vw,58px);
}

.sr-hut-map {
  max-width: 1580px;
  aspect-ratio: 16/10;
  margin-bottom: 0;
}

.sr-hut-panorama {
  border-radius: 14px;
  box-shadow: 0 30px 80px rgba(18,35,28,.17);
}

.sr-hut-map.is-engaged .sr-hut-panorama__base {
  filter: grayscale(1) brightness(1.27) contrast(.67);
  opacity: .77;
  transform: scale(1.008);
}

.sr-hut-map__shade { opacity: .55; }
.sr-hut-map.is-engaged .sr-hut-map__shade { opacity: .12; }
.sr-hut-highlight { display: none !important; }

.sr-hut-hotspot,
.sr-hut-hotspot:hover,
.sr-hut-hotspot.is-active {
  top: 46%;
  height: 27%;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sr-hut-hotspot.is-active {
  border-color: var(--sr-forest);
  color: var(--sr-forest);
}

.sr-hut-hotspot.is-active small { color: var(--sr-forest); }
.sr-hut-map.is-engaged .sr-hut-hotspot:not(.is-active) { opacity: .16; background: transparent; }

/* Selected hut: four close-set supporting frames plus a real exterior card. */
.sr-hut-profiles { z-index: 6; }
.sr-hut-profile__gallery {
  left: 2.5%;
  top: 6%;
  width: 56%;
  height: 77%;
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  grid-template-rows: 1fr 1fr;
  gap: 12px;
}

.sr-hut-profile__image,
.sr-hut-profile__image--1,
.sr-hut-profile__image--2,
.sr-hut-profile__image--3,
.sr-hut-profile__image--4 {
  position: relative;
  inset: auto;
  width: auto;
  height: auto;
  margin: 0;
  border: 4px solid var(--sr-paper);
  border-radius: 3px;
  box-shadow: 0 15px 40px rgba(18,35,28,.18);
  transform: translateY(18px) scale(.98);
}

.sr-hut-profile.is-active .sr-hut-profile__image {
  transform: none;
}

.sr-hut-profile__image--1 { grid-row: 1 / 3; transition-delay: .04s; }
.sr-hut-profile__image--2 { transition-delay: .1s; }
.sr-hut-profile__image--3 { transition-delay: .16s; }
.sr-hut-profile__image--4 {
  position: absolute;
  left: 31%;
  bottom: -11%;
  width: 40%;
  height: 30%;
  z-index: 2;
  transition-delay: .22s;
}

.sr-hut-profile__copy {
  right: 2.5%;
  top: 6%;
  bottom: auto;
  width: 36%;
  max-height: 88%;
  padding: 0;
  overflow: hidden auto;
  border: 0;
  border-radius: 8px;
  color: var(--sr-ink);
  background: var(--sr-paper);
  box-shadow: 0 22px 60px rgba(18,35,28,.2);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sr-hut-profile__cover {
  position: relative;
  width: 100%;
  height: clamp(145px,16vw,235px);
  margin: 0;
  overflow: hidden;
  background: #d8d4cb;
}

.sr-hut-profile__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg,rgba(12,24,19,.32),transparent 50%);
  pointer-events: none;
}

.sr-hut-profile__cover img { width: 100%; height: 100%; object-fit: cover; }
.sr-hut-profile__body { padding: clamp(17px,1.8vw,27px); }
.sr-hut-profile__body h3 { font-size: clamp(37px,3.6vw,58px); }
.sr-hut-profile__body .sr-kicker { margin-bottom: 8px; }
.sr-hut-profile__facts { margin: 12px 0; padding: 10px 0; }
.sr-hut-profile__facts strong { font-size: 20px; }
.sr-hut-profile__body > p:not(.sr-kicker) { margin: 0 0 13px; color: rgba(27,40,34,.72); font-size: 11px; line-height: 1.5; }
.sr-hut-profile__body ul { margin: 0 0 15px; gap: 6px 12px; }
.sr-hut-profile__body li { padding-left: 14px; font-size: 7px; }
.sr-hut-profile__body li::before { width: 6px; height: 6px; }
.sr-hut-profile__body .sr-button { min-height: 45px; }

.sr-hut-map__guide {
  bottom: 2%;
  color: var(--sr-forest);
}

.sr-hut-map__guide i { background: rgba(32,55,45,.25); }
.sr-hut-map__guide i::after { background: var(--sr-forest); }

/* Hot-tub promise is integrated into the writing, not a floating glass card. */
.sr-soak__included {
  display: inline-block;
  margin-top: 28px;
  padding-top: 15px;
  border-top: 1px solid rgba(251,248,242,.45);
  color: var(--sr-paper);
  font-family: var(--sr-serif);
  font-size: clamp(22px,2.4vw,34px);
  font-weight: 400;
  line-height: 1.15;
}

@media (max-width: 900px) {
  .sr-hut-map { aspect-ratio: 4/3; }
  .sr-hut-profile__gallery { width: 53%; }
  .sr-hut-profile__copy { width: 40%; }
  .sr-hut-profile__body > p:not(.sr-kicker) { display: none; }
}

@media (max-width: 600px) {
  .sr-hut-explorer { padding: 72px 0 90px; }
  .sr-hut-explorer .sr-section-head { padding-inline: 22px; }
  .sr-hut-map { height: 116svh; min-height: 820px; aspect-ratio: auto; }
  .sr-hut-panorama { border-radius: 0; }
  .sr-hut-panorama__scene { width: 230vw; }

  .sr-hut-hotspot,
  .sr-hut-hotspot:hover,
  .sr-hut-hotspot.is-active { top: 46%; height: 22%; }

  .sr-hut-profile__gallery {
    left: 5%;
    top: 7%;
    width: 90%;
    height: 43%;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 7px;
  }

  .sr-hut-profile__image,
  .sr-hut-profile__image--1,
  .sr-hut-profile__image--2,
  .sr-hut-profile__image--3,
  .sr-hut-profile__image--4 {
    position: relative;
    inset: auto;
    width: auto;
    height: auto;
    grid-row: auto;
    border-width: 3px;
  }

  .sr-hut-profile__copy {
    left: 5%;
    right: 5%;
    top: auto;
    bottom: 5%;
    width: auto;
    max-height: 42%;
    padding: 0;
    border-radius: 7px;
  }

  .sr-hut-profile__cover { height: 120px; }
  .sr-hut-profile__body { padding: 15px 17px 17px; }
  .sr-hut-profile__body h3 { font-size: 39px; }
  .sr-hut-profile__copy .sr-kicker { display: block; font-size: 6px; }
  .sr-hut-profile__facts { margin: 8px 0; padding: 7px 0; }
  .sr-hut-profile__facts strong { font-size: 18px; }
  .sr-hut-profile__body ul { margin-bottom: 10px; }
  .sr-hut-profile__body .sr-button { width: 100%; min-height: 42px; }
  .sr-hut-map__guide { top: 15px; bottom: auto; color: var(--sr-paper); }
  .sr-hut-map__guide i { background: rgba(251,248,242,.35); }
  .sr-hut-map__guide i::after { background: var(--sr-sand); }

  .sr-soak__included { margin-top: 22px; font-size: 24px; }
}
