/* Progressive enhancement: everything stays visible without JavaScript. */
.motion-on .hero { overflow: clip; }
.motion-on .hero-visuals {
  transform: translate3d(0, var(--hero-photo-y, 0px), 0) scale(var(--hero-zoom, 1.07));
  transform-origin: 50% 60%;
  will-change: transform;
}
.motion-on .hero-editorial {
  transform: translate3d(0, var(--hero-copy-y, 0px), 0);
  opacity: var(--hero-copy-opacity, 1);
  will-change: transform, opacity;
}
.motion-on .hero-scene { position: relative; }
.motion-on .hero-scene .hero { position: sticky; top: 0; }
.motion-on .reveal {
  opacity: 0;
  transform: translate3d(0, 34px, 0);
  transition: opacity 850ms cubic-bezier(.16,1,.3,1), transform 1000ms cubic-bezier(.16,1,.3,1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-on .reveal.is-visible,
.motion-on .reveal:focus-within {
  opacity: 1;
  transform: translate3d(0,0,0);
}
.motion-on .reveal:focus-within { transition: none; }
.motion-on .room.reveal { transition-duration: 950ms, 1150ms; }
.motion-on .brand-art img {
  transform: translate3d(0, var(--brand-drift, 0px), 0) scale(var(--brand-scale, 1));
  transform-origin: center;
}
.motion-on .stay-images .living {
  transform: translate3d(0, var(--living-drift, 0px), 0);
  clip-path: inset(var(--photo-inset, 0%) 0);
}
.motion-on .stay-images .dining {
  transform: translate3d(0, var(--dining-drift, 0px), 0);
}
.motion-on .ducks-photo,
.motion-on .area-photo { overflow: hidden; }
.motion-on .ducks-photo > img,
.motion-on .area-photo > img {
  transform: translate3d(0, var(--photo-drift, 0px), 0) scale(var(--photo-zoom, 1.09));
}
/* Different layers move at different speeds; the page itself remains free. */
.motion-on .stay-slide-frame > img {
  transform: scale(var(--stay-photo-zoom, 1.04));
  transform-origin: center;
}
.motion-on .room-image img {
  transform: translate3d(0, var(--room-drift, 0px), 0) scale(var(--room-zoom, 1.06));
  transition: none;
}
.motion-on .area-photo { clip-path: inset(var(--photo-inset, 0%) 0); }
.motion-on .brand-copy h2,
.motion-on .section-copy h2,
.motion-on .section-heading h2,
.motion-on .ducks-copy h2,
.motion-on .practical h2,
.motion-on .booking-intro h2 {
  opacity: var(--title-opacity, 1);
  transform: translate3d(0, var(--title-lift, 0px), 0);
  transition: none;
}
.motion-on .guestbook-book {
  transform: translate3d(0, var(--book-lift, 0px), 0) scale(var(--book-scale, 1));
  transform-origin: center 65%;
}
/* Inputs never drift or fade while a guest is making a booking. */
.motion-on #request-form.reveal {
  opacity: 1;
  transform: translate3d(0, 16px, 0);
  transition: transform 900ms cubic-bezier(.16,1,.3,1);
}
.motion-on #request-form.reveal.is-visible,
.motion-on #request-form.reveal:focus-within {
  transform: none;
}

.motion-on .ducks-copy .tiny-duck path {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
.motion-on .ducks-copy.is-visible .tiny-duck path {
  animation: duck-handdraw 18s cubic-bezier(.4,0,.25,1) infinite;
  animation-play-state: paused;
}
.motion-on .ducks-copy.is-visible.duck-in-view .tiny-duck path { animation-play-state: running; }
@keyframes duck-handdraw {
  0% { stroke-dashoffset: 1; opacity: 0; }
  6% { opacity: 1; }
  50%, 88% { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0; }
}
.scroll-progress {
  position: fixed;
  z-index: 30;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: #b39b70;
  pointer-events: none;
  transform: scaleX(0);
  transform-origin: left center;
}
@media (max-width:760px) {
  .motion-on .reveal { transform: translate3d(0,22px,0); }
  .motion-on .reveal.is-visible,
  .motion-on .reveal:focus-within { transform: none; }
  .motion-on .reveal { transition-duration: 700ms, 800ms; transition-delay: 0ms; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .scroll-progress { display: none; }
  .motion-on .hero-scene { height: auto !important; }
  .motion-on .hero-scene .hero { position: relative; }
  .motion-on .hero-visuals,
  .motion-on .hero-editorial,
  .motion-on .reveal,
  .motion-on .brand-art img,
  .motion-on .stay-images .living,
  .motion-on .stay-images .dining,
  .motion-on .ducks-photo > img,
  .motion-on .area-photo > img {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
  }
  .motion-on .ducks-copy .tiny-duck path { stroke-dashoffset: 0; opacity: 1; animation: none !important; }
}
@media print {
  .motion-on .ducks-copy .tiny-duck path { stroke-dashoffset: 0; opacity: 1; animation: none !important; }
  .scroll-progress { display: none; }
  .motion-on .reveal { opacity: 1; transform: none; transition: none; }
  .motion-on .hero-scene { height: auto !important; }
  .motion-on .hero-scene .hero { position: relative; }
}

@media (prefers-reduced-motion:reduce), print {
  .motion-on .hero-visuals,
  .motion-on .hero-editorial,
  .motion-on .brand-art img,
  .motion-on .stay-images .living,
  .motion-on .stay-images .dining,
  .motion-on .stay-slide-frame > img,
  .motion-on .room-image img,
  .motion-on .ducks-photo > img,
  .motion-on .area-photo,
  .motion-on .area-photo > img,
  .motion-on .brand-copy h2,
  .motion-on .section-copy h2,
  .motion-on .section-heading h2,
  .motion-on .ducks-copy h2,
  .motion-on .practical h2,
  .motion-on .booking-intro h2,
  .motion-on .guestbook-book,
  .motion-on #request-form.reveal {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }
}
