.before-after-img-sec *,.before-after-img-sec *:after,.before-after-img-sec *:before{box-sizing:border-box}.heading-box{text-align:center;width:50%;margin:0 auto 40px}.heading-box .subheadline{line-height:1.2}.img-grid-slides{display:flex;justify-content:space-between;width:100%}.comparison-slider{position:relative;overflow:hidden;display:inline-block;width:100%;height:100%}.image-wrapper{position:relative;width:100%}.image-after,.image-before{position:absolute;top:0;left:0;width:100%;height:100%}.image-after img,.image-before img,.placeholder-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.image-before{clip-path:inset(0 calc(100% - var(--position)) 0 0)}.range-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:30;-webkit-appearance:none;appearance:none;background:transparent;outline:none}.range-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:transparent;cursor:pointer}.range-input::-moz-range-thumb{width:20px;height:20px;background:transparent;cursor:pointer;border:none;border-radius:0}.handle-line{position:absolute;top:0;height:100%;left:var(--position);transform:translate(-50%);pointer-events:none;z-index:3;display:block!important}.handle-button{position:absolute;top:50%;left:var(--position);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:3;box-shadow:0 4px 12px #00000040;cursor:pointer;padding:10px}.comparison-slider:hover .handle-button{transform:translate(-50%,-50%) scale(1.1)}.range-input:active~.handle-button{transform:translate(-50%,-50%) scale(.95)}.range-input:focus-visible~.handle-button{outline:3px solid #007acc;outline-offset:3px}.before-label,.after-label{position:absolute;top:20px;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;z-index:15;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.after-label{z-index:0}.before-label{left:20px}.after-label{right:20px}.after-befor-img-text{display:flex;gap:30px;flex-wrap:wrap}.after-befor-img-text>div{width:calc(50% - 15px)}.before-after-img-sec .comparison-slider .slider-title{margin-top:30px!important}.before-after-img-sec .comparison-slider .slider-title,.before-after-img-sec .img-cards .img-card-content h3{line-height:1.2;margin:0 0 20px;font-family:var(--font-family-medium)}.before-after-img-sec .comparison-slider .slider-description,.before-after-img-sec .img-cards .img-card-content p{line-height:1.2;margin:0}.before-after-img-sec .comparison-slider img{width:100%;object-fit:cover;display:block}.before-after-img-sec .img-cards img{width:100%;height:100%;object-fit:cover;display:block}.before-after-img-sec .comparison-slider-box{height:100%}.before-after-img-sec .img-cards .img-card{position:relative;margin-bottom:30px}.before-after-img-sec .img-cards .img-card:before{content:"";background:linear-gradient(180deg,#0000,#000);position:absolute;bottom:0;left:0;right:0;height:100%}.before-after-img-sec .img-cards .img-card:last-child{margin-bottom:0}.before-after-img-sec .img-cards .img-card-content{position:absolute;bottom:0;padding:30px}@media(max-width:1440px){.heading-box{width:65%}}@media(max-width:1199.98px){.after-befor-img-text{gap:20px}.after-befor-img-text>div{width:calc(50% - 10px)}.before-after-img-sec .img-cards .img-card{margin-bottom:20px}.before-after-img-sec .img-cards .img-card-content{padding:15px}.before-after-img-sec .comparison-slider .slider-title{margin-top:20px!important}.before-after-img-sec .comparison-slider .slider-title,.before-after-img-sec .img-cards .img-card-content h3{margin:0 0 10px}.heading-box{width:86%}}@media(max-width:991.98px){.after-befor-img-text{gap:20px}.after-befor-img-text>div{width:100%}.before-after-img-sec .img-cards .img-card{margin-bottom:20px}.before-after-img-sec .img-cards .img-card-content{padding:15px}.before-after-img-sec .comparison-slider .slider-title{margin-top:20px!important}.before-after-img-sec .comparison-slider .slider-title,.before-after-img-sec .img-cards .img-card-content h3{margin:0 0 10px}.heading-box{width:100%}}@media(max-width:768.98px){.before-label,.after-label{font-size:12px;padding:6px 12px;top:15px}.before-label{left:15px}.after-label{right:15px}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/after-before-sec.css.map */
