.ws-image-reveal--none {
  opacity: 1;
}

.ws-image-reveal--reveal {
  animation: wsImageReveal var(--ws-image-duration) var(--ws-image-easing) both;
}

.ws-image-reveal--clip {
  animation: wsImageClipReveal var(--ws-image-duration) var(--ws-image-easing) both;
}

.ws-image-reveal--zoom {
  animation: wsImageZoomReveal var(--ws-image-duration) var(--ws-image-easing) both;
}

.ws-image-reveal--stagger {
  animation: wsImageStaggerReveal var(--ws-image-duration) var(--ws-image-easing) both;
}

.ws-image-reveal--strips {
  animation: wsImageStripsReveal var(--ws-image-duration) var(--ws-image-easing) both;
}

.ws-image-reveal--cinematic {
  animation: wsImageCinematicReveal 900ms var(--ws-image-easing) both;
}

@keyframes wsImageReveal {
  from {
    opacity: 0;
    transform: translateY(32px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes wsImageClipReveal {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0);
  }
}

@keyframes wsImageZoomReveal {
  from {
    opacity: 0;
    transform: scale(0.94);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes wsImageStaggerReveal {
  from {
    opacity: 0;
    transform: translateX(44px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes wsImageStripsReveal {
  from {
    opacity: 0;
    clip-path: polygon(
      0 0,
      12% 0,
      12% 0,
      24% 0,
      24% 0,
      36% 0,
      36% 0,
      48% 0,
      48% 0,
      60% 0,
      60% 0,
      72% 0,
      72% 0,
      84% 0,
      84% 0,
      100% 0,
      100% 0,
      0 0
    );
  }

  to {
    opacity: 1;
    clip-path: polygon(
      0 0,
      12% 0,
      12% 100%,
      24% 100%,
      24% 0,
      36% 0,
      36% 100%,
      48% 100%,
      48% 0,
      60% 0,
      60% 100%,
      72% 100%,
      72% 0,
      84% 0,
      84% 100%,
      100% 100%,
      100% 0,
      0 0
    );
  }
}

@keyframes wsImageCinematicReveal {
  from {
    opacity: 0;
    transform: scale(1.08);
    filter: blur(18px);
  }
  to {
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
  }
}