/* === AMS Zoom Gallery Styles (robust Ken Burns restart) === */

.ams-gallery-swiper {
  width: 100%;
  height: 100vh; /* change to 75vh if you prefer smaller */
  position: relative;
  overflow: hidden;
}

/* ensure wrapper and slides fill the container */
.ams-gallery-swiper .swiper-wrapper,
.ams-gallery-swiper .swiper-slide {
  width: 100%;
  height: 100%;
}

/* the image wrapper uses a CSS variable for duration so JS can set it */
.ams-image-wrapper {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transform-origin: center;
  will-change: transform;
  /* no animation by default; JS toggles .is-animate to run one-shot animations */
  animation: none;
}

/* run animation only when .is-animate is present and animation class set */
.ams-image-wrapper.is-animate.zoom-in {
  animation: kenburnsZoomIn var(--kb-duration, 12000ms) linear 1 both;
}
.ams-image-wrapper.is-animate.zoom-out {
  animation: kenburnsZoomOut var(--kb-duration, 12000ms) linear 1 both;
}
.ams-image-wrapper.is-animate.zoom-in-left {
  animation: kenburnsZoomInLeft var(--kb-duration, 12000ms) linear 1 both;
}
.ams-image-wrapper.is-animate.zoom-in-right {
  animation: kenburnsZoomInRight var(--kb-duration, 12000ms) linear 1 both;
}
.ams-image-wrapper.is-animate.none {
  animation: none;
}

/* Keyframes - tweak scale & translate to taste */
@keyframes kenburnsZoomIn {
  0%   { transform: scale(1) translateX(0); }
  100% { transform: scale(1.10) translateX(0); } /* soft zoom-in */
}
@keyframes kenburnsZoomOut {
  0%   { transform: scale(1.10) translateX(0); }
  100% { transform: scale(1) translateX(0); } /* zoom-out */
}
@keyframes kenburnsZoomInLeft {
  0%   { transform: scale(1) translateX(0); }
  100% { transform: scale(1.10) translateX(-40px); }
}
@keyframes kenburnsZoomInRight {
  0%   { transform: scale(1) translateX(0); }
  100% { transform: scale(1.10) translateX(40px); }
}

/* Smooth fade easing (quad-out-like) for Swiper fade */
.swiper-fade .swiper-slide {
  transition: opacity 0.8s cubic-bezier(0.25,0.46,0.45,0.94) !important;
}

/* responsive tweak */
@media (max-width: 768px) {
  .ams-gallery-swiper { height: 65vh; }
}
