/* Fix media fill for work frames + before/after overlay */

.work-frame__view > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

/* Only the single-screenshot frames drift on hover: scaling a compare pair
   would slide the clipped "after" layer out of register with the handle. */
.work-frame__view:not([data-ba]) > img {
  transition: transform 0.7s var(--soft-out);
}

.work-item:hover .work-frame__view:not([data-ba]) > img {
  transform: scale(1.03);
}

@media (prefers-reduced-motion: reduce) {
  .work-item:hover .work-frame__view:not([data-ba]) > img {
    transform: none;
  }
}

[data-ba] > img,
[data-ba] .ba__after {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}