/* V25's forest, with movement that arrives somewhere.
   All transforms belong to artwork; type, controls, and section geometry stay put. */

/* Journey: one approach towards the warm doorway, followed by quiet lamplight. */
#invitation-page #travel.finale-scene .travel-stilllife img {
  transform-origin: 72% 41%;
  transform: scale(1.105) translate3d(-.45%,-.3%,0);
  animation: none;
}
#invitation-page #travel.finale-scene .travel-stilllife.finale-armed:not(.finale-arriving) {
  opacity: .55;
  transform: none;
}
#invitation-page #travel.finale-scene .travel-stilllife.finale-armed:not(.finale-arriving) img {
  transform: scale(1.015) translate3d(.35%,.25%,0);
}
#invitation-page #travel.finale-scene .travel-stilllife.finale-arriving {
  animation-duration: 4.2s;
  animation-timing-function: cubic-bezier(.18,.63,.22,1);
}
#invitation-page #travel.finale-scene .travel-stilllife.finale-arriving img {
  animation: tender-doorway-approach 4.2s cubic-bezier(.18,.63,.22,1) both;
  animation-play-state: var(--finale-play);
}
#invitation-page #travel.finale-scene .arrival-lamplight {
  animation: tender-doorway-warmth 8.8s ease-in-out infinite;
  animation-play-state: var(--finale-play);
}
#invitation-page #travel.finale-scene .guest-note-toggle::before {
  animation: none;
  transform: none;
}
#invitation-page #travel.finale-scene .guest-note:nth-child(even) .guest-note-toggle::before {
  animation: none;
  transform: scaleX(-1);
  transform-origin: 50% 50%;
}

/* Time: the glass is gently set down; its real rendered sand keeps moving. */
#invitation-page #countdown.finale-scene .hourglass-glass.finale-armed:not(.finale-arriving) {
  opacity: .04;
  transform: translate3d(0,-20px,0) rotateY(-9deg) rotateZ(-5deg);
}
#invitation-page #countdown.finale-scene .hourglass-glass.finale-arriving {
  animation-duration: 3.15s;
  animation-timing-function: cubic-bezier(.2,.61,.25,1);
}
#invitation-page #countdown.finale-scene .autumn-hourglass:has(.hourglass-glass.finale-armed:not(.finale-arriving)) .hourglass-contact {
  opacity: .26;
  transform: scaleX(1.4) scaleY(.72);
}
#invitation-page #countdown.finale-scene .autumn-hourglass:has(.hourglass-glass.finale-arriving) .hourglass-contact {
  animation: tender-hourglass-contact 3.15s cubic-bezier(.2,.61,.25,1) both;
  animation-play-state: paused;
}
#invitation-page #countdown.finale-scene .autumn-hourglass:has(.hourglass-glass.finale-art-running) .hourglass-contact {
  animation-play-state: running;
}

/* Welcome: two lanterns come inward, their light gathering between them. */
#invitation-page #rsvp.finale-scene .wish-lantern {
  --tender-lantern-from-x: -44px;
  --tender-lantern-from-angle: -6deg;
  --tender-lantern-meet-x: 3px;
  --tender-lantern-meet-angle: 1deg;
}
#invitation-page #rsvp.finale-scene .wish-lantern-far {
  --tender-lantern-from-x: 38px;
  --tender-lantern-from-angle: 5deg;
  --tender-lantern-meet-x: -3px;
  --tender-lantern-meet-angle: -.8deg;
}
#invitation-page #rsvp.finale-scene .wish-lantern.finale-armed:not(.finale-arriving) {
  opacity: 0;
  transform: translate3d(var(--tender-lantern-from-x),-28px,0) rotate(var(--tender-lantern-from-angle)) scale(.97);
}
#invitation-page #rsvp.finale-scene .wish-lantern.finale-arriving {
  animation-duration: 3.8s;
  animation-timing-function: cubic-bezier(.2,.61,.24,1);
}
#invitation-page #rsvp.finale-scene .wish-lantern-far.finale-arriving { animation-duration: 3.65s; animation-delay: .22s; }
#invitation-page #rsvp.finale-scene .wish-lantern-swing { animation-duration: 9.8s; }
#invitation-page #rsvp.finale-scene .wish-lantern-far .wish-lantern-swing { animation-duration: 9.8s; animation-delay: -4.9s; }
#invitation-page #rsvp.finale-scene .rsvp-art :is(img,.scene-film) {
  animation: none;
  transform: scale(1.065) translate3d(0,-.35%,0);
}
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-armed:not(.finale-arriving)) .rsvp-art :is(img,.scene-film) {
  transform: scale(1.015) translate3d(0,0,0);
}
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-arriving) .rsvp-art :is(img,.scene-film) {
  animation: tender-garden-approach 3.8s cubic-bezier(.2,.61,.24,1) both;
  animation-play-state: paused;
}
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-art-running) .rsvp-art :is(img,.scene-film) { animation-play-state: running; }
#invitation-page #rsvp.finale-scene .rsvp-art::after {
  content: '';
  position: absolute;
  inset: 19% 8% 39%;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 48%,rgb(239 164 58/.15),rgb(228 153 56/.045) 40%,transparent 71%);
  mix-blend-mode: screen;
  opacity: .85;
  transform: scale(1);
}
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-armed:not(.finale-arriving)) .rsvp-art::after { opacity: .08; transform: scale(.82); }
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-arriving) .rsvp-art::after {
  animation: tender-light-together 3.8s ease-out both;
  animation-play-state: paused;
}
#invitation-page #rsvp.finale-scene:has(.wish-lantern-near.finale-art-running) .rsvp-art::after { animation-play-state: running; }

/* Rest: the flame becomes visible where it already stands, then burns quietly. */
#invitation-page #closing.finale-scene .gif-lantern.finale-armed:not(.finale-arriving) {
  opacity: .16;
  filter: brightness(.76) blur(2px);
  transform: none;
}
#invitation-page #closing.finale-scene .gif-lantern.finale-arriving {
  animation-duration: 3.4s;
  animation-timing-function: cubic-bezier(.22,.61,.27,1);
}
#invitation-page #closing.finale-scene .closing-hearth {
  animation: tender-resting-light 8.6s ease-in-out infinite;
  animation-play-state: var(--finale-play);
}

/* Preserve the controller's names so it can finish, pause, and replay each story. */
@keyframes finale-path-arrive {
  0% { opacity: .55; transform: none; }
  45% { opacity: .9; }
  100% { opacity: 1; transform: none; }
}
@keyframes tender-doorway-approach {
  from { transform: scale(1.015) translate3d(.35%,.25%,0); }
  to { transform: scale(1.105) translate3d(-.45%,-.3%,0); }
}
@keyframes tender-doorway-warmth {
  0%,100% { opacity: .58; }
  37% { opacity: .76; }
  61% { opacity: .67; }
  78% { opacity: .73; }
}
@keyframes finale-hourglass-settle {
  0% { opacity: .04; transform: translate3d(0,-20px,0) rotateY(-9deg) rotateZ(-5deg); }
  25% { opacity: 1; }
  69% { transform: translate3d(0,1px,0) rotateY(1.5deg) rotateZ(.75deg); }
  100% { opacity: 1; transform: translate3d(0,0,0) rotateY(0deg) rotateZ(0deg); }
}
@keyframes tender-hourglass-contact {
  0% { opacity: .26; transform: scaleX(1.4) scaleY(.72); }
  69% { opacity: 1; transform: scaleX(1.05) scaleY(1.03); }
  100% { opacity: 1; transform: scaleX(1.1) scaleY(1); }
}
@keyframes finale-lantern-lower {
  0% { opacity: 0; transform: translate3d(var(--tender-lantern-from-x),-28px,0) rotate(var(--tender-lantern-from-angle)) scale(.97); }
  29% { opacity: .97; }
  73% { transform: translate3d(var(--tender-lantern-meet-x),2px,0) rotate(var(--tender-lantern-meet-angle)) scale(1); }
  100% { opacity: .97; transform: translate3d(0,0,0) rotate(0deg) scale(1); }
}
@keyframes finale-lantern-near { 0%,100% { transform: rotate(-1.9deg); } 50% { transform: rotate(1.4deg); } }
@keyframes finale-lantern-far { 0%,100% { transform: rotate(1.7deg); } 50% { transform: rotate(-1.2deg); } }
@keyframes tender-garden-approach {
  from { transform: scale(1.015) translate3d(0,0,0); }
  to { transform: scale(1.065) translate3d(0,-.35%,0); }
}
@keyframes tender-light-together {
  0% { opacity: .08; transform: scale(.82); }
  48% { opacity: .48; }
  100% { opacity: .85; transform: scale(1); }
}
@keyframes finale-candle-focus {
  0% { opacity: .16; filter: brightness(.76) blur(2px); transform: none; }
  52% { opacity: .81; filter: brightness(.98) blur(.35px); }
  100% { opacity: 1; filter: brightness(1) blur(0); transform: none; }
}
@keyframes tender-resting-light {
  0%,100% { opacity: .79; }
  34% { opacity: .9; }
  56% { opacity: .83; }
  78% { opacity: .93; }
}

@media(prefers-reduced-motion:reduce) {
  #invitation-page #rsvp.finale-scene .rsvp-art::after { animation: none!important; opacity: .85!important; transform: none!important; }
  #invitation-page #countdown.finale-scene .hourglass-contact { animation: none!important; opacity: 1!important; transform: scaleX(1.1)!important; }
}
