.banner-image { opacity: 1 !important; }
@keyframes page-fade-in {
  from { opacity:0; }
  to { opacity:1; }
}
#page, main:has(.legal-content) {
  animation:page-fade-in 1.8s cubic-bezier(.42, 0, .58, 1) both;
}
@media (prefers-reduced-motion:reduce) {
  #page, main:has(.legal-content) { animation:none; }
}
@media (max-width: 1023px) {
  .local-mobile-menu { position:absolute; top:100%; left:0; right:0; z-index:30; background:var(--header-background,#ff0042); color:white; padding:24px; display:flex; flex-direction:column; gap:24px; font-size:24px; }
  .local-mobile-menu[hidden] { display:none; }
}

/* Cross-fade over the previous rendered page, rather than an empty canvas. */
.site-page-transition #page,
.site-page-transition main:has(.legal-content),
body[data-router-entered] #page,
body[data-router-entered] main:has(.legal-content) { animation:none; }
::view-transition-old(root) { animation:none; opacity:1; }
::view-transition-new(root) {
  animation:page-fade-in 1.8s cubic-bezier(.42, 0, .58, 1) both;
  mix-blend-mode:normal;
}
::view-transition-image-pair(root) { isolation:isolate; }

/* White hero captions enter with the background, using the same timing.
   Snapshot navigation already fades the image and caption as one frame. */
#page :is(.banner-container__title, .about-hero__title, .careers-hero__title) {
  animation:page-fade-in 1.8s cubic-bezier(.42, 0, .58, 1) both;
}
.site-page-transition #page :is(.banner-container__title, .about-hero__title, .careers-hero__title),
body[data-router-entered] #page :is(.banner-container__title, .about-hero__title, .careers-hero__title) {
  animation:none;
}
@media (prefers-reduced-motion:reduce) {
  #page :is(.banner-container__title, .about-hero__title, .careers-hero__title) { animation:none; }
}