/* Shared navigation motion; page layout and fixed containing blocks stay intact. */
@view-transition { navigation: auto; }
::view-transition { animation: forme-background 600ms ease-in-out both; }
::view-transition-group(root) { animation: none; }
::view-transition-image-pair(root) { isolation: isolate; }
::view-transition-old(root) { mix-blend-mode: normal; animation: forme-old-fade 600ms ease-in-out both; }
::view-transition-new(root) { mix-blend-mode: normal; animation: forme-new-ready 600ms ease-in-out both; }
@keyframes forme-background { from { background-color: var(--forme-from-background, var(--paper)); } to { background-color: var(--forme-to-background, var(--paper)); } }
@keyframes forme-old-fade { to { opacity: 0; } }
@keyframes forme-new-ready { from { opacity: 0; } to { opacity: 1; } }
/* Keep the hero text on the page fade timing, including its first visit. */
#hero-title.reveal { transform: none; transition: opacity 600ms ease-in-out; transition-delay: 0ms; }
html main .forme-heading-sync.reveal, #hero-title.forme-heading-sync.reveal { opacity: 1; transform: none; transition: none; }
html.forme-fallback-pending body { opacity: 0; }
html.forme-arriving main img:not(.forme-image-ready) { opacity: 0; }
.forme-image-ready { animation: forme-image-in 800ms cubic-bezier(0.16, 1, 0.3, 1) both; animation-delay: var(--forme-image-delay, 0ms); }
@keyframes forme-image-in { from { opacity: 0; scale: 1.05; } to { opacity: 1; scale: 1; } }
@media (prefers-reduced-motion: reduce) {
 @view-transition { navigation: none; }
 #hero-title.reveal { opacity: 1; transform: none; transition: none !important; }
 html.forme-fallback-pending body { opacity: 1; }
 ::view-transition, ::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
 html.forme-arriving main :is(h1,h2,h3) { visibility: visible; }
 html.forme-arriving main img { opacity: 1; }
 .forme-image-ready { animation: none !important; }
}