.animated-image-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.animated-image-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.animated-image-container .collage-item {
  overflow: hidden;
  will-change: transform;
  width: 100%;
}

.animated-image-container .collage-item .image-inner {
  width: 100%;
  height: 100%;
  transform: translateY(var(--parallax-offset, 0px));
  transition: transform 0.2s ease-out;
  will-change: transform;
}

.animated-image-container .collage-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.1);
  animation: fadeZoomIna 1s ease forwards;
  animation-play-state: paused;
  will-change: transform, opacity;
  display: block;
}

.animated-image-container .collage-item.parallax-img img {
  transform: scale(1.2);
  animation: fadeZoomInb 1s ease forwards;
  animation-play-state: paused;
  will-change: transform, opacity;
}

/* Animation keyframes */
@keyframes fadeZoomIna {
  0% {
    opacity: 0;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* Animation keyframes */
@keyframes fadeZoomInb {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  100% {
    opacity: 1;
    transform: scale(1.1);
  }
}