/* One live crop travels above the existing incoming-page reveal bands. */
::view-transition-group(pep-project-image) {
  z-index:2;
  animation-duration:1.12s;
  animation-timing-function:cubic-bezier(.22,.8,.2,1);
  overflow:hidden;
}
::view-transition-image-pair(pep-project-image) {
  isolation:isolate;
  background-image:var(--project-flight-photo);
  background-size:cover;
  background-position:var(--project-flight-position,50% 20%);
  background-repeat:no-repeat;
  animation:pep-photo-settle 1.12s cubic-bezier(.22,.8,.2,1) both;
}
/* Snapshots have baked-in crops; painting the full photograph above avoids
   stretching a thumbnail or cross-fading into another crop at the end. */
::view-transition-old(pep-project-image),
::view-transition-new(pep-project-image) {animation:none;opacity:0;}
@keyframes pep-photo-settle {
  from {transform:scale(var(--project-flight-zoom,1));}
  to {transform:scale(1);}
}
.project-image-flight {
  position:fixed;z-index:2147483647;overflow:hidden;pointer-events:none;
  background-image:var(--project-flight-photo);
  background-size:cover;
  background-position:var(--project-flight-position,50% 20%);
  background-repeat:no-repeat;
  contain:paint;will-change:left,top,width,height;
}
html.is-project-image-flying .case-hero .case-image > img,
html.is-project-image-flying .case-hero .case-image__expand {visibility:hidden;}
/* The live middle frame remains animated, while its parent owns navigation. */
.portfolio-filmstrip__image--website .portfolio-filmstrip__preview {pointer-events:none;}
.portfolio-filmstrip__image--website iframe {pointer-events:none;}
@media(prefers-reduced-motion:reduce) {
  ::view-transition-group(pep-project-image),
  ::view-transition-image-pair(pep-project-image) {animation:none;}
}
