/*--------------------------------------------

    # Interactivity

----------------------------------------------*/
.has-zoom-effect { 
    transition-property: transform, opacity, box-shadow, background-color;
    transition-duration: var(--wp--custom--transition--duration);
    transition-timing-function: linear;
    transition-delay: var(--wp--custom--transition--delay);
}
.has-zoom-effect [class*="__background"],
.has-zoom-effect [class*="__gradient-background"],
.has-zoom-effect [class*="__inner-container"],
.has-zoom-effect::after {
    pointer-events: none;
}
.has-zoom-effect [class*="__inner-container"] a {
    pointer-events: all;
}

/* Zoom */
.has-zoom-effect {
    position: relative;
    overflow: hidden;
    box-shadow: none;
}
.has-zoom-effect > img,
.has-zoom-effect > a > img {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    /*object-fit: none;
    object-position: center;*/
    transform: translate3d(0, 0, 0) scale3d(1.0, 1.0, 1.0);
    transition-property: transform, object-position;
    transition-duration: var(--wp--custom--transition--duration);
    transition-timing-function: linear;
    will-change: transform;
}
.has-zoom-effect.has-processing > img,
.has-zoom-effect.has-processing > a > img {
    transition-delay: 0ms;
}
.has-zoom-effect.has-processing:hover > img,
.has-zoom-effect.has-processing:hover > a > img,
.has-zoom-effect.has-processing:focus > img,
.has-zoom-effect.has-processing:focus > a > img {
    /*object-position: calc(var(--wp--custom--cursor-position-x) * 0.1%) calc(var(--wp--custom--cursor-position-y) * 0.1%);*/
    transform: translate3d(calc(var(--wp--custom--cursor-position-x) / var(--wp--custom--effect--zoom--scale) * 0.2px), calc(var(--wp--custom--cursor-position-y) / var(--wp--custom--effect--zoom--scale) * 0.2px), 0px) scale3d(var(--wp--custom--effect--zoom--scale), var(--wp--custom--effect--zoom--scale), var(--wp--custom--effect--zoom--scale));
}

.has-zoom-effect figcaption,
.has-parallax-effect figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    color: var(--wp--preset--color--white);
    background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0 ,.5));
    text-shadow: 1px 1px 1px var(--wp--preset--color--black);
    max-height: 100%;
    margin: 0;
    padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--40) var(--wp--preset--spacing--40);
    pointer-events: none;
}
.has-zoom-effect figcaption a,
.has-parallax-effect figcaption a {
    color: var(--wp--preset--color--gray-ultra-light);
    pointer-events: all;
}
.has-zoom-effect figcaption a:hover,
.has-zoom-effect figcaption a:focus,
.has-parallax-effect figcaption a:hover,
.has-parallax-effect figcaption a:focus {
    color: var(--wp--preset--color--white);
}

/* Parallax */
.has-parallax-effect {
    position: relative;
}
.has-parallax-effect > img,
.has-parallax-effect > a > img {
    visibility: hidden;
    object-fit: cover;
    /*object-position: calc(var(--wp--custom--effect--scroll-x, 50) * 1%) calc(var(--wp--custom--effect--scroll-y, 50) * 1%);*/
    transition-property: all;
    transition-delay: 0ms;
    transition-duration: 0ms;
    transition-timing-function: linear;
    will-change: object-position;
}
.has-parallax-effect.is-visible > img,
.has-parallax-effect.is-visible > a > img {
    visibility: visible;
}
.has-parallax-effect.has-processing > img,
.has-parallax-effect.has-processing > a > img {
    transition-duration: var(--wp--custom--transition--duration); 
}
/*---------------- End interactivity ----------------*/