.stoneplus-image-swap {
	--spis-duration: 450ms;
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	background: transparent;
	isolation: isolate;
}

/* Elementor can retain a stale entrance-animation flag after widget controls change. */
.elementor-widget-stoneplus-image-swap.elementor-invisible {
	visibility: visible;
}

.stoneplus-image-swap__link {
	display: block;
}

.stoneplus-image-swap__image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	backface-visibility: hidden;
	transition-duration: var(--spis-duration);
	transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.stoneplus-image-swap__primary {
	position: relative;
	z-index: 1;
	opacity: 1;
}

.stoneplus-image-swap__hover {
	z-index: 2;
	opacity: 0;
}

.stoneplus-image-swap:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap:focus-within .stoneplus-image-swap__primary {
	opacity: 0;
}

.stoneplus-image-swap:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap:focus-within .stoneplus-image-swap__hover {
	opacity: 1;
}

.stoneplus-image-swap--fade .stoneplus-image-swap__image {
	transition-property: opacity;
}

.stoneplus-image-swap--slide-left .stoneplus-image-swap__image,
.stoneplus-image-swap--slide-right .stoneplus-image-swap__image,
.stoneplus-image-swap--slide-up .stoneplus-image-swap__image,
.stoneplus-image-swap--slide-down .stoneplus-image-swap__image {
	transition-property: opacity, transform;
}

.stoneplus-image-swap--slide-left .stoneplus-image-swap__hover { transform: translateX(100%); }
.stoneplus-image-swap--slide-right .stoneplus-image-swap__hover { transform: translateX(-100%); }
.stoneplus-image-swap--slide-up .stoneplus-image-swap__hover { transform: translateY(100%); }
.stoneplus-image-swap--slide-down .stoneplus-image-swap__hover { transform: translateY(-100%); }
.stoneplus-image-swap--slide-left .stoneplus-image-swap__primary { transform: translateX(0); }
.stoneplus-image-swap--slide-right .stoneplus-image-swap__primary { transform: translateX(0); }
.stoneplus-image-swap--slide-up .stoneplus-image-swap__primary { transform: translateY(0); }
.stoneplus-image-swap--slide-down .stoneplus-image-swap__primary { transform: translateY(0); }

.stoneplus-image-swap--slide-left:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-left:focus-within .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-right:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-right:focus-within .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-up:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-up:focus-within .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-down:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--slide-down:focus-within .stoneplus-image-swap__hover { transform: translate(0); }

.stoneplus-image-swap--slide-left:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--slide-left:focus-within .stoneplus-image-swap__primary { transform: translateX(-100%); }
.stoneplus-image-swap--slide-right:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--slide-right:focus-within .stoneplus-image-swap__primary { transform: translateX(100%); }
.stoneplus-image-swap--slide-up:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--slide-up:focus-within .stoneplus-image-swap__primary { transform: translateY(-100%); }
.stoneplus-image-swap--slide-down:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--slide-down:focus-within .stoneplus-image-swap__primary { transform: translateY(100%); }

.stoneplus-image-swap--zoom-in .stoneplus-image-swap__image,
.stoneplus-image-swap--zoom-out .stoneplus-image-swap__image {
	transition-property: opacity, transform;
}
.stoneplus-image-swap--zoom-in .stoneplus-image-swap__hover { transform: scale(.78); }
.stoneplus-image-swap--zoom-out .stoneplus-image-swap__hover { transform: scale(1.22); }
.stoneplus-image-swap--zoom-in:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--zoom-in:focus-within .stoneplus-image-swap__hover,
.stoneplus-image-swap--zoom-out:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--zoom-out:focus-within .stoneplus-image-swap__hover { transform: scale(1); }
.stoneplus-image-swap--zoom-in:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--zoom-in:focus-within .stoneplus-image-swap__primary { transform: scale(1.22); }
.stoneplus-image-swap--zoom-out:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--zoom-out:focus-within .stoneplus-image-swap__primary { transform: scale(.78); }

.stoneplus-image-swap--flip-x,
.stoneplus-image-swap--flip-y { perspective: 1000px; }
.stoneplus-image-swap--flip-x .stoneplus-image-swap__image,
.stoneplus-image-swap--flip-y .stoneplus-image-swap__image { transition-property: opacity, transform; }
.stoneplus-image-swap--flip-x .stoneplus-image-swap__hover { transform: rotateY(-180deg); }
.stoneplus-image-swap--flip-y .stoneplus-image-swap__hover { transform: rotateX(-180deg); }
.stoneplus-image-swap--flip-x:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--flip-x:focus-within .stoneplus-image-swap__primary { transform: rotateY(180deg); }
.stoneplus-image-swap--flip-y:hover .stoneplus-image-swap__primary,
.stoneplus-image-swap--flip-y:focus-within .stoneplus-image-swap__primary { transform: rotateX(180deg); }
.stoneplus-image-swap--flip-x:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--flip-x:focus-within .stoneplus-image-swap__hover { transform: rotateY(0); }
.stoneplus-image-swap--flip-y:hover .stoneplus-image-swap__hover,
.stoneplus-image-swap--flip-y:focus-within .stoneplus-image-swap__hover { transform: rotateX(0); }

.stoneplus-image-swap__empty {
	padding: 32px;
	border: 1px dashed #a7aaad;
	color: #646970;
	text-align: center;
}

@media (prefers-reduced-motion: reduce) {
	.stoneplus-image-swap__image {
		transition-duration: 0.01ms !important;
	}
}
