/* The product moves independently in the shared .dstnstv feature diagrams. */
body .dstnstv .center.vo-dstnstv-split {
    position: relative;
    isolation: isolate;
    overflow: visible !important;
    cursor: zoom-in;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

body .dstnstv .center.vo-dstnstv-split > img.vo-dstnstv-static-art {
    position: relative;
    z-index: 1;
    display: block;
    transform: none !important;
    transition: none !important;
}

body .dstnstv .center.vo-dstnstv-split > img.vo-dstnstv-foreground {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain;
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, -50%) scale(.96) translateZ(0);
    transform-origin: center center;
    filter: drop-shadow(0 6px 8px rgba(22, 43, 41, 0));
    transition: transform 1.85s cubic-bezier(.22, 1, .36, 1), opacity .6s ease-out, filter 1.85s ease;
    will-change: transform, opacity;
}

@media (hover: hover) and (pointer: fine) {
    body .dstnstv .center.vo-dstnstv-split:hover > img.vo-dstnstv-foreground {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.12) translateZ(0);
        filter: drop-shadow(0 14px 18px rgba(22, 43, 41, .18));
    }
}

@media (hover: none), (pointer: coarse) {
    body .dstnstv .center.vo-dstnstv-split:active > img.vo-dstnstv-foreground,
    body .dstnstv .center.vo-dstnstv-split:focus-within > img.vo-dstnstv-foreground {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.12) translateZ(0);
        filter: drop-shadow(0 14px 18px rgba(22, 43, 41, .18));
    }
}

@media (prefers-reduced-motion: reduce) {
    body .dstnstv .center.vo-dstnstv-split > img.vo-dstnstv-foreground {
        transition: opacity .15s linear;
    }

    body .dstnstv .center.vo-dstnstv-split:hover > img.vo-dstnstv-foreground,
    body .dstnstv .center.vo-dstnstv-split:active > img.vo-dstnstv-foreground {
        transform: translate(-50%, -50%);
    }
}
