/* Shared by the two /home states. Real navigation keeps scripts and history native. */
@view-transition { navigation: auto; }

::view-transition-group(*) { animation-duration: 760ms; animation-timing-function: cubic-bezier(.22,1,.36,1); }
::view-transition-image-pair(root) { isolation: isolate; }
::view-transition-old(root) { animation: homeSceneOut 520ms ease both; mix-blend-mode: normal; }
::view-transition-new(root) { animation: homeSceneIn 720ms cubic-bezier(.22,1,.36,1) both; mix-blend-mode: normal; }

/* Only the incoming UI moves. The outgoing church photograph never pans or zooms. */
.home-entering.has-entry-transition body > .site-header { view-transition-name: home-navigation; }
.home-entering.has-entry-transition .cinematic-verse { view-transition-name: home-scene; }
.home-entering.has-entry-transition #announcements { view-transition-name: home-announcement; }
::view-transition-new(home-navigation) { animation: homeNavIn 660ms cubic-bezier(.22,1,.36,1) 70ms both; }
::view-transition-new(home-scene) { animation: homeContentIn 780ms cubic-bezier(.22,1,.36,1) 100ms both; }
::view-transition-new(home-announcement) { animation: homeContentIn 720ms cubic-bezier(.22,1,.36,1) 210ms both; }

/* Progressive fallback: no hidden document and no load-event/image gate. */
.home-entering:not(.has-entry-transition) body > .site-header { animation: homeNavIn 620ms cubic-bezier(.22,1,.36,1) both; }
.home-entering:not(.has-entry-transition) .cinematic-verse { animation: homeContentIn 720ms cubic-bezier(.22,1,.36,1) 60ms both; }
.home-entering:not(.has-entry-transition) #announcements { animation: homeContentIn 680ms cubic-bezier(.22,1,.36,1) 150ms both; }

@keyframes homeSceneOut { to { opacity: 0; } }
@keyframes homeSceneIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes homeNavIn { from { opacity: 0; transform: translate3d(0,-8px,0); } to { opacity: 1; transform: none; } }
@keyframes homeContentIn { from { opacity: 0; transform: translate3d(0,18px,0); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
  .home-entering body > .site-header, .home-entering .cinematic-verse, .home-entering #announcements { animation: none !important; }
}