.home-scroll-story {
  height: 500svh;
  min-height: 3400px;
  position: relative;
  color: #f7faf5;
}

.home-scroll-sticky {
  height: 100svh;
  min-height: 680px;
  position: sticky;
  top: 0;
  overflow: hidden;
  display: block;
  padding: 0;
  gap: 0;
}

.home-scroll-viewport {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.home-scroll-rail {
  display: flex;
  width: max-content;
  height: 100%;
  will-change: transform;
  gap: 0;
  align-items: stretch;
}

.scroll-scene {
  width: 100vw;
  height: 100%;
  flex: 0 0 100vw;
  position: relative;
  overflow: hidden;
}

.scroll-scene img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.scroll-scene h2 {
  font-size: clamp(5rem, 9vw, 11.8rem);
  line-height: .84;
}

.scroll-scene p {
  font-size: clamp(.95rem, 1.1vw, 1.2rem);
  line-height: 1.55;
}

.scene-opening,
.scene-finale { background: #000; }

/* One continuous black canvas across the full visual journey. */
.home-scroll-story,
.scene-day,
.scene-cottages,
.scene-evening { background: #000; color: #fff; }
.scene-day-copy p,
.scene-cottages-heading p,
.scene-evening-copy p { color: rgba(255,255,255,.72); }
.scene-cottages-grid span { background: #111 !important; color: #fff; }
.scene-cottages-footer { border-color: rgba(255,255,255,.3); }
.scene-cottages-footer { border-top: 0; }
.scene-cottages-heading { padding-top: 44px; }
.scroll-story-controls { background: #000; color: #fff; }

@media (min-width: 761px) {
  .scene-day-photo { top: 8%; left: 2%; width: 64%; height: 84%; }
  .scene-day-inset { top: 7%; right: 3%; width: 32%; height: 45%; }
  .scene-day-copy { right: 3%; bottom: 7%; width: 31%; }
  .scene-cottages { padding-left: 4vw; padding-right: 4vw; }
  .scene-cottages-grid { height: min(58vh, 590px); margin-top: 2vh; }
  .scene-evening-photo { inset: 0 31% 0 0; }
  .scene-evening-detail { right: 3%; width: 32%; height: 28%; }
}

.scene-opening-copy,
.scene-finale-copy {
  position: absolute;
  z-index: 2;
  left: clamp(30px, 6vw, 115px);
  top: 19%;
  max-width: 47vw;
}

.scene-opening-copy p,
.scene-finale-copy p {
  width: min(390px, 32vw);
  margin-top: 35px;
  color: #dce8de;
}

.scene-opening-image,
.scene-finale-image {
  position: absolute;
  inset: 0 0 0 47%;
}

.scene-opening-image > img,
.scene-opening-image > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.scene-opening-image > video { z-index: 1; }

.scene-opening-side {
  position: absolute;
  z-index: 2;
  right: 8%;
  bottom: 7%;
  font-size: .72rem;
  letter-spacing: .12em;
}

.scene-day {
  background: #ccd8cd;
  color: #1a302a;
}

.scene-day-photo {
  position: absolute;
  top: 14%;
  left: 5%;
  width: 59%;
  height: 72%;
}

.scene-day-inset {
  position: absolute;
  z-index: 2;
  top: 11%;
  right: 5%;
  width: 29%;
  height: 38%;
  box-shadow: 0 18px 50px rgba(17, 44, 33, .18);
  transform: translateY(var(--scene-drift, 0px));
}

.scene-day-copy {
  position: absolute;
  z-index: 2;
  right: 5%;
  bottom: 9%;
  width: 30%;
}

.scene-day-copy h2 {
  font-size: clamp(3.5rem, 5.2vw, 7rem);
}

.scene-day-copy p { margin-top: 22px; }

.scene-day-copy a {
  display: inline-block;
  border-bottom: 1px solid currentColor;
  padding-bottom: 5px;
  margin-top: 24px;
  font-size: .8rem;
  font-weight: 700;
}

.scene-cottages {
  background: #eff2ec;
  color: #1b302a;
  padding: 12vh clamp(30px, 6vw, 115px) 7vh;
}

.scene-cottages-heading {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 30%);
  align-items: end;
  column-gap: 6vw;
}

.scene-cottages-heading h2 { font-size: clamp(4.5rem, 6.3vw, 8.5rem); }
.scene-cottages-heading p { max-width: 370px; padding-bottom: 8px; }

.scene-cottages-grid {
  display: flex;
  gap: 1vw;
  height: min(48vh, 470px);
  min-height: 260px;
  margin-top: 3vh;
}

.scene-cottages-grid a {
  display: flex;
  flex: var(--accordion-weight, 1) 1 0;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}

.scene-cottages-grid img {
  flex: 1 1 0;
  width: 100%;
  height: 0;
  min-height: 0;
  transition: transform .6s ease;
}

.scene-cottages-grid a:hover img { transform: scale(1.04); }

.scene-cottages-grid span {
  display: block;
  flex: 0 0 auto;
  padding: 13px 15px;
  background: #d7e1d5;
  font: 400 clamp(1.8rem, 2.5vw, 3.2rem)/1 var(--serif);
}

.scene-cottages-grid a:nth-child(2) span { background: #c2d0c2; }
.scene-cottages-grid a:nth-child(3) span { background: #e0e8df; }
.scene-cottages-footer { display: flex; align-items: center; gap: clamp(22px, 4vw, 58px); margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(27,48,42,.5); }
.scene-cottages-footer > span { flex: 1; }
.scene-cottages-all { display: inline-block; flex: 0 0 auto; margin: 0; padding: 0 0 5px; border-bottom: 1px solid currentColor; font: 700 .8rem/1.35 var(--sans); }

.scene-evening {
  background: #b9ad96;
  color: #1b302a;
}

.scene-evening-photo {
  position: absolute;
  inset: 0 39% 0 0;
}

.scene-evening-copy {
  position: absolute;
  right: 5%;
  top: 20%;
  width: 30%;
}

.scene-evening-copy h2 { font-size: clamp(4rem, 6.5vw, 8.5rem); }
.scene-evening-copy p { max-width: 400px; margin-top: 35px; }

.scene-evening-detail {
  position: absolute;
  right: 5%;
  bottom: 10%;
  width: 30%;
  height: 24%;
  transform: translateY(var(--scene-drift, 0px));
}

.scene-finale-image { inset: 0 0 0 56%; }
.scene-finale-copy { top: 23%; }
.scene-finale-copy .button { margin-top: 36px; }

.scene-opening-copy,
.scene-day-copy,
.scene-cottages-heading,
.scene-evening-copy,
.scene-finale-copy {
  opacity: .55;
  transform: translateY(32px);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}

.scroll-scene.is-active .scene-opening-copy,
.scroll-scene.is-active .scene-day-copy,
.scroll-scene.is-active .scene-cottages-heading,
.scroll-scene.is-active .scene-evening-copy,
.scroll-scene.is-active .scene-finale-copy {
  opacity: 1;
  transform: translateY(0);
}

.scroll-story-controls {
  position: absolute;
  z-index: 5;
  left: clamp(22px, 3vw, 56px);
  bottom: 20px;
  display: flex;
  align-items: center;
  gap: 27px;
  min-height: 55px;
  padding: 10px 18px;
  background: rgba(14, 37, 31, .92);
  color: white;
  backdrop-filter: blur(12px);
}

.scroll-story-controls::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: var(--scene-progress, 0%);
  height: 2px;
  background: #aac8b4;
}

.scroll-story-progress {
  display: flex;
  gap: 6px;
  align-items: baseline;
  margin: 0;
  font-size: .8rem;
  color: #b9cebf;
}

.scroll-story-progress strong { color: white; font-weight: 700; }
.scroll-story-buttons { display: flex; gap: 9px; }

.scroll-story-buttons button {
  border: 1px solid rgba(255, 255, 255, .45);
  background: none;
  color: white;
  padding: 7px 12px;
  cursor: pointer;
  font-size: .72rem;
}

.scroll-story-buttons button:hover { background: white; color: #142d27; }
.scroll-story-buttons button:disabled { opacity: .4; cursor: default; }
.scroll-story-buttons button:disabled:hover { background: none; color: white; }

@media (hover: hover) and (pointer: fine) and (min-width: 761px) {
  .home-scroll-viewport { cursor:none; }
  .home-scroll-viewport a,.home-scroll-viewport button { cursor:pointer; }
  .scroll-story-cursor {
    position:absolute; z-index:6; left:0; top:0; width:76px; height:76px;
    display:grid; place-items:center; color:#fff; pointer-events:none;
    opacity:0; transform:translate(-50%,-50%) scale(.78);
    transition:opacity .18s ease, transform .25s cubic-bezier(.2,.7,.2,1);
    mix-blend-mode:difference;
  }
  .scroll-story-cursor.is-visible { opacity:1; transform:translate(-50%,-50%) scale(1); }
  .scroll-story-cursor svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
  .scroll-story-cursor circle { fill:none; stroke:currentColor; stroke-width:1; }
  .scroll-story-cursor .cursor-ring-track { opacity:.3; }
  .scroll-story-cursor .cursor-ring-progress { stroke-dasharray:233; stroke-dashoffset:233; transform:rotate(-90deg); transform-origin:50% 50%; }
  .scroll-story-cursor.is-filling .cursor-ring-progress { animation:story-cursor-fill .65s cubic-bezier(.2,.7,.2,1) forwards; }
  .scroll-story-cursor span { position:relative; font-size:.61rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
  .scroll-story-cursor[data-disabled="true"] { opacity:.45; }
}

@keyframes story-cursor-fill { to { stroke-dashoffset:0; } }

@media (max-width: 760px) {
  .home-scroll-story { height: auto; min-height: 0; }
  .home-scroll-sticky { position: relative; height: min(760px, 88svh); min-height: 600px; overflow: hidden; }
  .home-scroll-viewport { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .home-scroll-viewport::-webkit-scrollbar { display: none; }
  .home-scroll-rail { transform: none !important; }
  .scroll-scene { scroll-snap-align: start; }
  .scroll-scene h2 { font-size: clamp(4.2rem, 13vw, 7rem); }
  .scene-opening-image,
  .scene-finale-image { inset: 0 0 47% 0; }
  .scene-finale-image { inset: 0 0 56% 0; }
  .scene-opening-copy,
  .scene-finale-copy { left: 24px; right: 24px; top: auto; bottom: 105px; max-width: none; }
  .scene-opening-copy p,
  .scene-finale-copy p { width: auto; max-width: 350px; margin-top: 20px; }
  .scene-opening-side { display: none; }
  .scene-day-photo { top: 0; left: 0; width: 100%; height: 52%; }
  .scene-day-inset { display: none; }
  .scene-day-copy { left: 24px; right: 24px; bottom: 100px; width: auto; }
  .scene-day-copy h2 { font-size: clamp(3.4rem, 11vw, 5rem); }
  .scene-day-copy p { margin-top: 15px; }
  .scene-cottages { padding: 90px 22px 92px; }
  .scene-cottages-heading { display: block; }
  .scene-cottages-heading h2 { font-size: clamp(3.5rem, 10vw, 5rem); }
  .scene-cottages-heading p { margin-top: 15px; font-size: .84rem; }
  .scene-cottages-grid { display: grid; height: 36%; min-height: 0; margin-top: 25px; gap: 8px; grid-template-columns: 1.1fr .9fr; grid-template-rows: 1fr 1fr; }
  .scene-cottages-grid a { flex: initial; }
  .scene-cottages-grid a:first-child { grid-row: span 2; }
  .scene-cottages-grid span { padding: 8px; font-size: clamp(1.1rem, 3vw, 1.5rem); }
  .scene-cottages-footer { gap: 16px; margin-top: 14px; padding-top: 12px; }
  .scene-cottages-all { font-size: .72rem; }
  .scene-evening-photo { inset: 0 0 48% 0; }
  .scene-evening-copy { left: 24px; right: 24px; top: auto; bottom: 100px; width: auto; }
  .scene-evening-copy h2 { font-size: clamp(3.8rem, 11vw, 5.5rem); }
  .scene-evening-copy p { margin-top: 18px; }
  .scene-evening-detail { display: none; }
  .scene-finale-copy .button { margin-top: 20px; }
  .scroll-story-controls { left: 18px; right: 18px; bottom: 16px; justify-content: space-between; }
}

@media (prefers-reduced-motion: reduce) {
  .home-scroll-story { height: auto; min-height: 0; }
  .home-scroll-sticky { position: relative; height: min(900px, 100svh); }
  .home-scroll-viewport { overflow-x: auto; scroll-snap-type: x mandatory; }
  .home-scroll-rail { transform: none !important; will-change: auto; }
  .scroll-scene { scroll-snap-align: start; }
  .scene-cottages-grid img { transition: none; }
  .scene-opening-copy,
  .scene-day-copy,
  .scene-cottages-heading,
  .scene-evening-copy,
  .scene-finale-copy { opacity: 1; transform: none; }
}

/* Final visual treatment for the cottage scene. */
.scene-cottages { background: #000 !important; color: #fff !important; }
.scene-finale { background: #000 !important; color: #fff !important; }
.scene-finale-copy p { color: rgba(255,255,255,.72); }
.scene-day { background: #000 !important; color: #fff !important; }
.scene-day-copy h2, .scene-day-copy p, .scene-day-copy a { color: #fff !important; }
.scene-day-copy p { color: #fff !important; opacity: 1; }
.scene-evening { background: #000 !important; color: #fff !important; }
.scene-evening-copy h2, .scene-evening-copy p { color: #fff !important; }
.scene-evening-copy p { opacity: .82; }
.scene-cottages-heading h2 { color: #fff; font-size: clamp(2.35rem, 3.6vw, 4.6rem); line-height: .98; }
.scene-cottages-heading p { color: rgba(255,255,255,.72); }
.scene-cottages-grid span { background: #111 !important; color: #fff !important; }
.scene-cottages-grid a { position: relative; }
.scene-cottages-grid a::after { content: ""; position: absolute; inset: 45% 0 0; z-index: 1; background: linear-gradient(transparent, rgba(0,0,0,.72)); pointer-events: none; }
.scene-cottages-grid img { height: 100%; }
.scene-cottages-grid span { position: absolute; z-index: 2; left: 18px; right: 12px; bottom: 18px; padding: 0 !important; background: transparent !important; color: #fff !important; font: 400 clamp(1.15rem, 2vw, 2.1rem)/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.scene-cottages-grid span { font-size: clamp(.78rem, 1.15vw, 1.25rem); letter-spacing: .08em; bottom: 14px; }
.scene-cottages-footer { border-color: rgba(255,255,255,.3); }
.scene-day-copy h2 { font-size: clamp(3.4rem, 5vw, 6.8rem); }
.scene-cottages-heading h2 { font-size: clamp(3.2rem, 4.8vw, 6.4rem) !important; }
.scene-cottage-stack { position: relative; background: #111 !important; color: #fff; padding: 0; display: block; overflow: hidden; }
.scene-cottage-stack-copy { position: absolute; left: 6vw; top: 22%; max-width: 400px; z-index: 2; }
.scene-cottage-stack-copy > span { display: block; margin-bottom: 28px; color: #c48663; font: 500 .7rem/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.scene-cottage-stack-copy h2 { font-size: clamp(3.2rem, 4.8vw, 6.2rem); }
.scene-cottage-stack-copy h2 em { color: #b8c1bb; font-style: normal; }
.scene-cottage-stack-copy p { max-width: 350px; margin-top: 28px; color: rgba(255,255,255,.7); }
.scene-cottage-stack-track { position: absolute; top: 8%; right: 5vw; width: min(58vw, 860px); display: flex; flex-direction: column; gap: 5vh; overflow: visible; transform: translateY(calc(var(--stack-progress, 0) * -66.666%)); transition: transform .42s cubic-bezier(.22,.61,.36,1); }
.scene-cottage-stack-track figure { flex: 0 0 auto; width: 100%; aspect-ratio: 1; margin: 0; overflow: hidden; }
.scene-cottage-stack-track img { width: 100%; height: 100%; object-fit: cover; }
.scene-day-copy h2 { font-size: clamp(2.5rem, 3.3vw, 4.8rem) !important; }
.scene-cottages-heading h2 { font-size: clamp(2.5rem, 3.3vw, 4.8rem) !important; }
@media (max-width: 760px) { .scene-day-copy h2,.scene-cottages-heading h2 { font-size: clamp(3rem, 10vw, 5rem) !important; } .scene-cottage-stack { display: block; } .scene-cottage-stack-copy { left: 24px; top: 16%; max-width: 290px; } .scene-cottage-stack-track { top: 7%; right: 0; width: 88vw; gap: 4vh; } .scene-cottage-stack-copy h2 { font-size: clamp(3rem, 10vw, 5rem); } }
@media (min-width: 761px) {
  .scene-cottages { padding-top: 10vh; padding-bottom: 5vh; }
  .scene-cottages-grid { height: min(66vh, 660px); margin-top: 2vh; }
}

/* Premium scroll treatment: gentle depth, elastic movement, and a quieter control rail. */
@media (min-width: 761px) {
  .home-scroll-viewport { perspective: 1400px; }
  .home-scroll-rail { transition: filter .35s ease; }
  .scroll-scene { isolation: isolate; }
  .scroll-scene::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.08), transparent 28%, rgba(0,0,0,.18)); opacity: .52; transition: opacity .9s ease; }
  .scroll-scene:not(.is-active)::before { opacity: .78; }
  .scroll-scene > img,
  .scroll-scene > video,
  .scene-opening-image img,
  .scene-opening-image video,
  .scene-day-photo img,
  .scene-day-inset img,
  .scene-evening-photo img,
  .scene-evening-detail img,
  .scene-finale-image img { transform: scale(1.045); transition: transform 1.2s cubic-bezier(.22,.61,.36,1), filter 1.2s ease; }
  .scroll-scene.is-active > img,
  .scroll-scene.is-active > video,
  .scroll-scene.is-active .scene-opening-image img,
  .scroll-scene.is-active .scene-opening-image video,
  .scroll-scene.is-active .scene-day-photo img,
  .scroll-scene.is-active .scene-day-inset img,
  .scroll-scene.is-active .scene-evening-photo img,
  .scroll-scene.is-active .scene-evening-detail img,
  .scroll-scene.is-active .scene-finale-image img { transform: scale(1); }
  .scroll-story-controls { background: rgba(0,0,0,.72); border: 1px solid rgba(255,255,255,.16); box-shadow: 0 18px 48px rgba(0,0,0,.28); backdrop-filter: blur(18px) saturate(120%); }
  .scroll-story-controls::after { height: 3px; background: linear-gradient(90deg, #fff, rgba(255,255,255,.56)); box-shadow: 0 0 14px rgba(255,255,255,.32); transition: width .25s ease-out; }
  .scroll-story-buttons button { border-color: rgba(255,255,255,.3); transition: background .3s ease, border-color .3s ease, transform .3s ease; }
  .scroll-story-buttons button:hover { transform: translateY(-2px); border-color: #fff; }
}

/* Keep the visual journey clean: navigation is handled by scroll and titles stay steady. */
.scroll-story-controls { display: none !important; }
.scene-opening-copy,
.scene-day-copy,
.scene-cottages-heading,
.scene-evening-copy,
.scene-finale-copy { opacity: 1 !important; transform: none !important; transition: none !important; }

/* Light strip through the lake, cottages, stack and stay scenes. */
.home-scroll-story,
.scene-opening,
.scene-day,
.scene-cottages,
.scene-cottage-stack,
.scene-evening {
  background: #f7f7f4 !important;
  color: #111 !important;
}

.scene-opening-copy h2,
.scene-day-copy h2,
.scene-cottages-heading h2,
.scene-cottage-stack-copy h2,
.scene-evening-copy h2 {
  color: #111 !important;
}

.scene-opening-copy h2 em,
.scene-day-copy h2 em,
.scene-cottages-heading h2 em,
.scene-cottage-stack-copy h2 em,
.scene-evening-copy h2 em {
  color: #929b96 !important;
}

.scene-opening-copy p,
.scene-day-copy p,
.scene-cottages-heading p,
.scene-cottage-stack-copy p,
.scene-evening-copy p {
  color: #4f5b56 !important;
  opacity: 1 !important;
}

.scene-day-copy a,
.scene-cottages-all {
  color: #111 !important;
}

.scene-cottages-grid span {
  background: transparent !important;
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.72);
}

.scene-cottages-grid a::after {
  display: none !important;
}

.scene-cottages-heading-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
}

.scene-cottages-heading-meta .scene-cottages-all {
  color: #111 !important;
  border-bottom: 1px solid currentColor;
  padding-bottom: 5px;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.scene-cottage-stack-copy > span {
  color: #a65b3b !important;
}

.scene-cottage-stack {
  color: #111 !important;
}

@media (min-width: 761px) {
  .scene-cottages-footer {
    position: absolute;
    left: 4vw;
    right: 4vw;
    bottom: 4vh;
    z-index: 3;
    margin-top: 0;
  }
}

.scene-opening::before,
.scene-day::before,
.scene-cottages::before,
.scene-cottage-stack::before,
.scene-evening::before {
  background: none !important;
  opacity: 0 !important;
}
