/* DepthPushIn container + CSS Ken Burns fallback (used when WebGL or the
   depth map is unavailable). Pairs with js/depth-push-in.js. */

.depth-push-in {
  position: relative;
  overflow: hidden;
}

.depth-push-in .dpi-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.depth-push-in img.dpi-media {
  object-fit: cover;
  transform-origin: center center;
}

.dpi-kenburns {
  animation: dpi-kenburns 8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes dpi-kenburns {
  from { transform: scale(1); }
  to   { transform: scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
  .dpi-kenburns {
    animation: none;
  }
}
