/* Authored motion for the homepage. The unenhanced document is fully visible. */
.opening-photo {
  clip-path: inset(var(--hero-inset, 0px) round var(--hero-radius, 0px));
}
.motion-enhanced .opening-photo img {
  transform: translate3d(0, var(--hero-drift, 0px), 0) scale(var(--hero-zoom, 1.09));
}
.opening-title > span, .opening-title > em {
  overflow: clip;
  padding-block: .13em .2em;
  margin-block: -.13em -.2em;
}
.opening-title > span > span, .opening-title > em > span { display: block; }
.opening-arrival .opening-title > span > span,
.opening-arrival .opening-title > em > span {
  animation: opening-line 1.05s cubic-bezier(.16,1,.3,1) both;
}
.opening-arrival .opening-title > em > span { animation-delay: .11s; }
.opening-arrival .opening-title > .opening-last > span { animation-delay: .22s; }
.opening-arrival .opening-photo img { animation: opening-lens 1.5s cubic-bezier(.2,.65,.3,1) both; }
@keyframes opening-line { from { transform: translateY(115%); } to { transform: translateY(0); } }
@keyframes opening-lens { from { transform: scale(1.19); } to { transform: scale(1.09); } }

.rental-composition { position: relative; }
.rental-composition::before {
  content: ''; position: absolute; left: calc(-1 * var(--home-gutter)); right: calc(-1 * var(--home-gutter));
  top: -18px; height: 19px; background: var(--paper); border-radius: 26px 26px 0 0;
}
.motion-enhanced .rental-piece-image {
  clip-path: inset(var(--photo-inset, 0%) round var(--photo-round, 0px));
}
.motion-enhanced .rental-piece-image picture {
  transform: translate3d(0, var(--photo-rise, 0px), 0) scale(var(--photo-scale, 1));
  transform-origin: 50% 65%;
}
.motion-enhanced .rental-piece-image img { transition: none; }
.motion-enhanced .rental-piece:focus-visible .rental-piece-image { clip-path: none; }
.motion-enhanced .rental-piece:focus-visible picture { transform: none; }

.motion-enhanced .reveal-pending { opacity: 0; transform: translate3d(0, 28px, 0); }
.reveal-enter { animation: section-arrival .8s cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms) both; }
@keyframes section-arrival {
  from { opacity: 0; transform: translate3d(0, 28px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
.motion-reveal:focus-within { opacity: 1 !important; transform: none !important; animation: none !important; }

.chapter-visual { isolation: isolate; }
.chapter-visual::before {
  content: ''; position: absolute; z-index: -1; inset: 4% 4% 5%; pointer-events: none;
  background: radial-gradient(ellipse, #e9bc7b69, #caa57820 40%, transparent 70%);
  opacity: .15; transform: scale(.88); transition: opacity 1.2s, transform 1.2s;
}
.party-chapter[data-stage="2"] .chapter-visual::before { opacity: .95; transform: scale(1.06); }
.motion-enhanced .chapter-view {
  transform: translate3d(0, var(--stage-rise, 0px), 0) scale(var(--stage-scale, 1));
  clip-path: inset(0 var(--stage-inset, 0%) round var(--stage-radius, 0px) var(--stage-radius, 0px) 4px 4px);
  transform-origin: 50% 80%;
}
.chapter-view:focus-visible { transform: none !important; clip-path: none !important; }
.chapter-credit { margin-top: 5px; }

.photo-album { padding-top: 22px; }
.album-print {
  padding: 9px; background: #fffcf5; border: 1px solid #e4d9ca;
  box-shadow: 0 8px 16px #311c380d;
}
.motion-enhanced .album-print {
  transform: translate3d(0, var(--print-lift, 0px), 0) rotate(var(--print-angle, 0deg));
  transform-origin: 50% 100%;
}
.motion-enhanced .album-photo img { transform: translateX(var(--print-pan, 0px)) scale(1.065); }
.album-photo figcaption { position: relative; }

.home-endmark { margin-top: 50px; overflow: clip; text-align: center; }
.home-endmark span {
  display: block; font: 500 min(23vw,20rem)/.9 var(--serif); letter-spacing: -.07em;
  padding: .06em .06em .13em 0; color: #d9c1aa;
}
.motion-enhanced .home-endmark span {
  color: transparent; -webkit-text-stroke: 1px #d9c1aa88;
  background: linear-gradient(90deg, #d9c1aa var(--signature-fill,100%), transparent var(--signature-fill,100%));
  background-clip: text; -webkit-background-clip: text;
  transform: translate3d(0,var(--signature-rise,0px),0);
}
@media (min-width: 900px) {
  .rental-composition::before { top: -24px; height: 25px; border-radius: 40px 40px 0 0; }
  .album-print { padding: 13px; }
  .home-endmark { margin-top: 80px; }
}
@media (max-width: 599px) {
  .motion-enhanced .album-photo-1 img { transform: translateX(var(--print-pan, 0px)) scale(1.065); }
  .chapter-visual::before { inset: 4%; }
}
@media (max-height: 600px) {
  .reveal-enter { animation-duration: .55s; }
  .home-endmark { margin-top: 35px; }
}
/* Runtime preference changes and the native preference both reveal the final state. */
.motion-reduced .opening-photo { clip-path: none; }
.motion-reduced .motion-reveal { opacity: 1; transform: none; animation: none; }
.motion-reduced .chapter-visual::before { transition: none; }
.motion-reduced .opening-arrival * { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .opening-photo, .rental-piece-image, .chapter-view { clip-path: none !important; }
  .opening-photo img, .rental-piece-image picture, .chapter-view, .album-print, .home-endmark span { transform: none !important; }
  .motion-reveal { opacity: 1 !important; transform: none !important; animation: none !important; }
  .home-endmark span { color: #d9c1aa !important; background: none !important; }
}
