/* Each snapshot retains its own aspect ratio as the scene's visible frame changes. */
html[data-route-arriving] { --route-duration:520ms; }
html[data-route-arriving="employer"] { --route-duration:480ms; }
::view-transition-group(route-scene) {
  z-index:2;
  animation-duration:var(--route-duration,520ms);
  animation-timing-function:cubic-bezier(.22,1,.36,1);
  overflow:hidden;
}
::view-transition-image-pair(route-scene) { isolation:isolate;overflow:hidden; }
::view-transition-old(route-scene),
::view-transition-new(route-scene) {
  width:100%;height:100%;object-fit:cover;object-position:center;
  mix-blend-mode:normal;
  animation-duration:var(--route-duration,520ms);
  animation-timing-function:cubic-bezier(.22,1,.36,1);
}
::view-transition-old(route-scene) { animation-name:route-scene-out; }
::view-transition-new(route-scene) { animation-name:route-scene-in; }
::view-transition-group(root) { z-index:1;animation-duration:var(--route-duration,520ms); }
::view-transition-old(root) { animation:180ms ease-out both route-page-out; }
::view-transition-new(root) { animation:var(--route-duration,520ms) ease-out both route-page-in; }
::view-transition-group(route-copy),
::view-transition-group(route-chrome),
::view-transition-group(route-shade) { z-index:3;animation-duration:var(--route-duration,520ms); }
::view-transition-new(route-copy),
::view-transition-new(route-chrome),
::view-transition-new(route-shade) {
  mix-blend-mode:normal;
  animation:var(--route-duration,520ms) ease-out both route-details-in;
}
/* The existing fallback is the same EH1 still on both pages. No video seek is needed. */
.employer-film[data-route-capture] > video { visibility:hidden; }
.employer-film[data-route-capture] > .employer-film-fallback {
  display:block!important;opacity:1;transform:none!important;
}
[data-route-capture] > .hero-film-control,
[data-route-capture] > .door-index { visibility:hidden; }
@keyframes route-scene-out { 0%,20%{opacity:1} 72%,100%{opacity:0} }
@keyframes route-scene-in { 0%{opacity:0} 62%,100%{opacity:1} }
@keyframes route-page-out { to{opacity:0} }
@keyframes route-page-in { 0%{opacity:0} 65%,100%{opacity:1} }
@keyframes route-details-in { 0%,42%{opacity:0} 100%{opacity:1} }
@media(max-width:1100px) {
  html[data-route-arriving] { --route-duration:360ms; }
  html[data-route-arriving="employer"] { --route-duration:320ms; }
}
@media(prefers-reduced-motion:reduce) {
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation:none!important; }
}
