/* V5 — interior-led storytelling and an in-scene hut explorer */
.sr-interiors {
  min-height: 100svh;
  padding: clamp(110px,12vw,185px) clamp(24px,7vw,115px);
  background: var(--sr-cream);
}

.sr-interiors > header {
  max-width: 1380px;
  margin: 0 auto clamp(65px,8vw,110px);
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: end;
  gap: 80px;
}

.sr-interiors h2 {
  margin: 0;
  color: var(--sr-forest);
  font-family: var(--sr-serif);
  font-size: clamp(62px,7.5vw,118px);
  font-weight: 400;
  line-height: .83;
  letter-spacing: -.06em;
}

.sr-interiors > header > p {
  max-width: 460px;
  margin: 0 0 8px auto;
  color: rgba(27,40,34,.68);
  font-size: 15px;
  line-height: 1.85;
}

.sr-interiors__gallery {
  position: relative;
  max-width: 1380px;
  height: min(64vw,830px);
  margin: 0 auto;
}

.sr-interiors__image { position: absolute; margin: 0; overflow: hidden; background: #ded9d0; box-shadow: 0 28px 80px rgba(18,35,28,.16); }
.sr-interiors__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.75,.25,1); }
.sr-interiors__image:hover img { transform: scale(1.035); }
.sr-interiors__image--1 { left: 0; top: 8%; width: 47%; height: 70%; border-radius: 240px 240px 18px 18px; }
.sr-interiors__image--2 { left: 40%; top: 0; z-index: 2; width: 34%; height: 43%; border: 10px solid var(--sr-cream); transform: rotate(2deg); }
.sr-interiors__image--3 { right: 0; top: 22%; width: 35%; height: 55%; border-radius: 16px; }
.sr-interiors__image--4 { left: 38%; bottom: 0; z-index: 3; width: 30%; height: 36%; border: 10px solid var(--sr-paper); transform: rotate(-3deg); }

.sr-hut-explorer { padding-bottom: clamp(120px,12vw,180px); }
.sr-hut-map { position: relative; max-width: 1500px; aspect-ratio: 3/2; margin: 0 auto 45px; }
.sr-hut-panorama { position: absolute; inset: 0; border-radius: 26px; overflow: hidden; background: #d8d9d5; box-shadow: 0 42px 110px rgba(18,35,28,.22); }
.sr-hut-panorama__scene { position: relative; width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; }
.sr-hut-panorama__base { width: 100%; height: 100%; object-fit: cover; transition: filter .8s cubic-bezier(.2,.75,.25,1), opacity .8s ease, transform 1s cubic-bezier(.2,.75,.25,1); }
.sr-hut-map.is-engaged .sr-hut-panorama__base { filter: grayscale(1) brightness(1.38) contrast(.56); opacity: .72; transform: scale(1.012); }
.sr-hut-map__shade { z-index: 1; background: linear-gradient(180deg,rgba(16,30,24,.08),transparent 35%),linear-gradient(0deg,rgba(16,30,24,.24),transparent 42%); transition: opacity .6s ease; }
.sr-hut-map.is-engaged .sr-hut-map__shade { opacity: .18; }

.sr-hut-highlight {
  position: absolute;
  z-index: 2;
  inset: 0;
  opacity: 0;
  background-position: center;
  background-size: cover;
  filter: saturate(1.05) contrast(1.03);
  transform: scale(1.012);
  transition: opacity .6s ease;
  pointer-events: none;
}
.sr-hut-highlight--0 { clip-path: polygon(7% 39%,36% 39%,36% 76%,7% 76%); }
.sr-hut-highlight--1 { clip-path: polygon(34% 40%,61% 40%,61% 75%,34% 75%); }
.sr-hut-highlight--2 { clip-path: polygon(58% 40%,88% 40%,88% 76%,58% 76%); }
.sr-hut-map[data-active="0"] .sr-hut-highlight--0,
.sr-hut-map[data-active="1"] .sr-hut-highlight--1,
.sr-hut-map[data-active="2"] .sr-hut-highlight--2 { opacity: 1; }

.sr-hut-hotspot { z-index: 8; top: 48%; width: 24%; height: 23%; border-color: rgba(255,255,255,.68); background: rgba(18,35,28,.18); }
.sr-hut-hotspot:nth-of-type(1) { left: 8%; }
.sr-hut-hotspot:nth-of-type(2) { left: 36%; }
.sr-hut-hotspot:nth-of-type(3) { left: 63%; }
.sr-hut-hotspot:hover,.sr-hut-hotspot.is-active { top: 46%; height: 27%; background: rgba(18,35,28,.7); }
.sr-hut-map.is-engaged .sr-hut-hotspot:not(.is-active) { opacity: .28; border-color: rgba(32,55,45,.35); color: var(--sr-forest); background: rgba(255,255,255,.14); }

.sr-hut-profiles { position: absolute; z-index: 5; inset: 0; margin: 0; display: block; pointer-events: none; }
.sr-hut-profile { position: absolute; inset: 0; display: block; visibility: hidden; opacity: 0; transform: none; pointer-events: none; transition: opacity .55s ease, visibility .55s; }
.sr-hut-profile.is-active { visibility: visible; opacity: 1; pointer-events: none; }
.sr-hut-profile__gallery { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.sr-hut-profile__image { position: absolute; margin: 0; border: 7px solid rgba(251,248,242,.96); border-radius: 5px; background: var(--sr-paper); box-shadow: 0 24px 65px rgba(18,35,28,.24); opacity: 0; transform: translateY(24px) rotate(var(--sr-photo-rotate,0deg)) scale(.96); transition: opacity .6s ease, transform .8s cubic-bezier(.2,.75,.25,1); }
.sr-hut-profile.is-active .sr-hut-profile__image { opacity: 1; transform: translateY(0) rotate(var(--sr-photo-rotate,0deg)) scale(1); }
.sr-hut-profile__image--1 { left: 3%; top: 5%; width: 28%; height: 27%; --sr-photo-rotate: -2deg; transition-delay: .06s; }
.sr-hut-profile__image--2 { right: 30%; top: 4%; width: 23%; height: 25%; --sr-photo-rotate: 2.5deg; transition-delay: .13s; }
.sr-hut-profile__image--3 { right: 3%; top: 27%; width: 21%; height: 23%; --sr-photo-rotate: -2deg; transition-delay: .2s; }
.sr-hut-profile__image--4 { left: 4%; bottom: 4%; width: 16%; height: 20%; --sr-photo-rotate: 2.5deg; transition-delay: .27s; }
.sr-hut-profile__image img { width: 100%; height: 100%; object-fit: cover; }

.sr-hut-profile__copy {
  position: absolute;
  right: 3%;
  bottom: 4%;
  width: min(430px,34%);
  padding: clamp(22px,2.4vw,38px);
  border: 1px solid rgba(32,55,45,.13);
  border-radius: 13px;
  color: var(--sr-ink);
  background: rgba(250,247,240,.94);
  box-shadow: 0 25px 75px rgba(18,35,28,.2);
  backdrop-filter: blur(14px);
  pointer-events: auto;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .55s .18s ease, transform .7s .18s cubic-bezier(.2,.75,.25,1);
}
.sr-hut-profile.is-active .sr-hut-profile__copy { opacity: 1; transform: none; }
.sr-hut-profile__copy h3 { font-size: clamp(44px,4.4vw,72px); }
.sr-hut-profile__facts { margin: 17px 0; padding: 13px 0; }
.sr-hut-profile__facts strong { font-size: 23px; }
.sr-hut-profile__facts span { font-size: 8px; }
.sr-hut-profile__copy > p:not(.sr-kicker) { margin-bottom: 16px; font-size: 12px; line-height: 1.6; }
.sr-hut-profile__copy ul { margin-bottom: 20px; gap: 8px 15px; }
.sr-hut-profile__copy li { font-size: 8px; }
.sr-hut-profile__copy .sr-button { min-height: 48px; box-shadow: none; }
.sr-hut-map__guide { position: absolute; z-index: 10; left: 3%; right: 3%; bottom: 2.5%; margin: 0; padding: 0; color: rgba(251,248,242,.84); pointer-events: none; }
.sr-hut-map__guide i { background: rgba(251,248,242,.35); }
.sr-hut-map__guide i::after { background: var(--sr-sand); }
.sr-hut-map__guide b { min-width: 90px; text-align: right; }

@media (max-width: 900px) {
  .sr-interiors > header { grid-template-columns: 1fr; gap: 30px; }
  .sr-interiors > header > p { margin-left: 0; }
  .sr-interiors__gallery { height: 760px; }
  .sr-hut-profile__copy { width: 42%; }
}

@media (max-width: 600px) {
  .sr-interiors { min-height: 0; padding: 100px 22px 115px; }
  .sr-interiors h2 { font-size: 16vw; }
  .sr-interiors__gallery { height: 155vw; }
  .sr-interiors__image--1 { width: 78%; height: 48%; }
  .sr-interiors__image--2 { left: auto; right: -5%; top: 32%; width: 52%; height: 34%; border-width: 6px; }
  .sr-interiors__image--3 { right: auto; left: 3%; top: auto; bottom: 0; width: 60%; height: 39%; }
  .sr-interiors__image--4 { left: auto; right: 2%; bottom: 2%; width: 45%; height: 28%; border-width: 6px; }

  .sr-hut-explorer { padding-bottom: 105px; }
  .sr-hut-map { width: 100%; height: 108svh; min-height: 760px; aspect-ratio: auto; margin-bottom: 0; }
  .sr-hut-panorama { height: 100%; border-radius: 0; overflow-x: auto; }
  .sr-hut-panorama__scene { width: 230vw; height: 100%; min-height: 0; }
  .sr-hut-panorama__base { object-fit: cover; }
  .sr-hut-highlight { background-size: cover; }
  .sr-hut-hotspot { top: 48%; width: 21%; height: 20%; padding: 0 12px 12px; }
  .sr-hut-hotspot:nth-of-type(1) { left: 8%; }
  .sr-hut-hotspot:nth-of-type(2) { left: 36%; }
  .sr-hut-hotspot:nth-of-type(3) { left: 63%; }
  .sr-hut-hotspot:hover,.sr-hut-hotspot.is-active { top: 46%; height: 24%; }
  .sr-hut-hotspot b { font-size: 22px; }
  .sr-hut-hotspot small { font-size: 6px; }

  .sr-hut-profile__image { border-width: 5px; }
  .sr-hut-profile__image--1 { left: 5%; top: 5%; width: 48%; height: 20%; }
  .sr-hut-profile__image--2 { right: 5%; top: 18%; width: 44%; height: 19%; }
  .sr-hut-profile__image--3 { right: 4%; top: 39%; width: 36%; height: 15%; }
  .sr-hut-profile__image--4 { left: 5%; bottom: 34%; width: 34%; height: 15%; }
  .sr-hut-profile__copy { left: 5%; right: 5%; bottom: 6%; width: auto; max-height: 32%; padding: 18px; overflow: auto; border-radius: 10px; }
  .sr-hut-profile__copy .sr-kicker { display: none; }
  .sr-hut-profile__copy h3 { font-size: 46px; }
  .sr-hut-profile__facts { margin: 10px 0; padding: 9px 0; }
  .sr-hut-profile__facts strong { font-size: 20px; }
  .sr-hut-profile__copy > p:not(.sr-kicker) { display: none; }
  .sr-hut-profile__copy ul { grid-template-columns: repeat(2,minmax(0,1fr)); margin-bottom: 13px; gap: 6px 10px; }
  .sr-hut-profile__copy li { padding-left: 14px; font-size: 6px; }
  .sr-hut-profile__copy li::before { width: 6px; height: 6px; }
  .sr-hut-profile__copy .sr-button { min-height: 45px; }
  .sr-hut-map__guide { top: 17px; bottom: auto; left: 20px; right: 20px; }
  .sr-hut-map__guide span { display: inline; }
  .sr-hut-map__guide b { min-width: 70px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .sr-site *, .sr-site *::before, .sr-site *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  [data-sr-reveal] { opacity: 1; transform: none; }
}