.m-image-comparison{position:relative;display:block;overflow:hidden}.m-image-comparison[data-animation]{--percent: 95%}@media screen and (min-width: 768px){.m-image-comparison[data-animation]{--percent: 98%}}.m-image-comparison[is-visible]{--percent: 50%}.m-image-comparison--media{display:block;position:relative;overflow:hidden;background:#f3f3f3}.m-image-comparison__after{position:absolute;z-index:2;top:0;left:0;width:100%;height:100%;overflow:hidden}[data-layout=horizontal] .m-image-comparison__after{clip-path:inset(0px 0px 0px var(--percent, 50%))}[data-layout=vertical] .m-image-comparison__after{clip-path:inset(var(--percent, 50%) 0px 0px 0px)}.m-image-comparison__before .m-placeholder-svg{background-color:rgba(0,0,0,.4392156863)}.m-image-comparison__button{position:absolute;z-index:2;color:inherit;background-color:rgba(0,0,0,0);border:none;padding:0;cursor:pointer;transition:none}.m-image-comparison__button svg{width:12px;color:var(--color-text-body)}.m-image-comparison__button::after,.m-image-comparison__button::before{content:"";position:absolute;background-color:rgba(var(--bg-white), 1);pointer-events:none}[data-layout=horizontal] .m-image-comparison__button::after,[data-layout=horizontal] .m-image-comparison__button::before{width:5px;height:50%;left:50%;margin-left:-2.5px}[data-layout=vertical] .m-image-comparison__button::after,[data-layout=vertical] .m-image-comparison__button::before{width:50%;height:5px;top:50%;margin-top:-2.5px}[data-layout=horizontal] .m-image-comparison__button::before{top:0;margin-top:-20px}[data-layout=vertical] .m-image-comparison__button::before{left:0;margin-left:-20px}[data-layout=horizontal] .m-image-comparison__button::after{bottom:0;margin-bottom:-20px}[data-layout=vertical] .m-image-comparison__button::after{right:0;margin-right:-20px}[data-layout=horizontal] .m-image-comparison__button{top:0;left:var(--percent, 50%);width:28px;height:100%;margin-left:-14px;cursor:col-resize}[data-layout=vertical] .m-image-comparison__button{left:0;top:var(--percent, 50%);width:100%;height:28px;margin-top:-14px;cursor:row-resize}.m-image-comparison__button span{position:absolute;top:50%;left:50%;width:50px;height:50px;margin-left:-25px;margin-top:-25px;border-radius:40px;background-color:rgba(var(--bg-white), 1);color:rgba(var(--text-black), 1);pointer-events:none;display:flex;align-items:center;justify-content:center;box-shadow:0px 21px 24px rgba(0,0,0,.15)}[data-layout=vertical] .m-image-comparison__button span{transform:rotate(90deg)}.m-image-comparison__animation{display:block;position:absolute;bottom:0;left:0;width:100%;height:.1rem;pointer-events:none}.m-image-comparison.m-animating .m-image-comparison__after{transition-property:clip-path;transition-duration:1s;transition-timing-function:ease}.m-image-comparison.m-animating .m-image-comparison__button{transition-property:top,left;transition-duration:1s;transition-timing-function:ease}.m-image-comparison--small{--hero-height: 290px}.m-image-comparison--medium{--hero-height: 360px}.m-image-comparison--large{--hero-height: 420px}@media screen and (min-width: 768px){.m-image-comparison--small{--hero-height: 420px}.m-image-comparison--medium{--hero-height: 560px}.m-image-comparison--large{--hero-height: 720px}}.m-image-comparison__wrapper{height:var(--hero-height)}.m-image-comparison__wrapper img,.m-image-comparison__wrapper svg{display:block;max-width:100%;position:absolute;top:0;left:0;height:100%;width:100%;object-fit:cover}@media screen and (max-width: 767px){.m-image-comparison__wrapper.has-mobile-image .m-image-comparison__image-desktop{display:none}}@media screen and (min-width: 768px){.m-image-comparison__image-mobile{display:none !important}}.m-image-comparison__heading{position:absolute;z-index:2;background:rgba(var(--bg-white), 1);color:rgba(var(--text-black), 1);padding:8px 20px;top:20px;left:20px;min-width:80px;font-weight:500;text-align:center;margin:0;line-height:1;min-height:40px;display:flex;align-items:center;justify-content:center;opacity:1;visibility:visible;transition:opacity var(--m-duration-default, 0.25s) ease;box-shadow:0 21px 24px rgba(0,0,0,.1490196078);text-transform:uppercase;letter-spacing:.05rem}.m-image-comparison__after .m-image-comparison__heading{left:auto;right:20px}.image-comparing .m-image-comparison__heading{opacity:0;visibility:hidden}.m-image-comparison[data-layout=vertical] .m-image-comparison__after .m-image-comparison__heading{left:20px;right:auto;bottom:20px;top:auto}
