.side-by-side,
.slider-layout {
  .img-container {
    position: relative;
    overflow: hidden;
    --shadow-scale: 0;
    transform: translateY(15%);
    &:before {
      content: '';
      display: block;
      position: absolute;
      z-index: 0;
      background-color: var(--accent-200);
      height: 100%;
      width: 100%;
      bottom: 0;
      opacity: 0.5;
      transform-origin: bottom;
      transform: scaleY(var(--shadow-scale));
    }

    img {
      transform-origin: center;
      opacity: 0;
      transform: scale(1.25);
    }
  }

  .description > * {
    opacity: 0;
    /* transform: translateY(25px); */
  }
}

.motion-word {
  display: inline-block;
  will-change: transform, opacity;
  opacity: 0;
  transform: translateY(20%);
}