.cds-before-after{background-color:var(--cds-ba-bg, #ffffff);padding-top:var(--cds-ba-padding-top, 50px);padding-bottom:var(--cds-ba-padding-bottom, 50px);width:100%;box-sizing:border-box}.cds-before-after *,.cds-before-after *:before,.cds-before-after *:after{box-sizing:border-box}.cds-before-after__container{max-width:var(--cds-ba-max-width, 1200px);margin:0 auto;padding:0 20px}.cds-before-after__wrapper--horizontal{display:flex;flex-direction:column;gap:40px;align-items:center}.cds-before-after__wrapper--horizontal .cds-before-after__comparison{width:100%;max-width:600px}.cds-before-after__wrapper--horizontal .cds-before-after__content{width:100%;display:flex;flex-direction:column;justify-content:center}.cds-before-after__wrapper--vertical{display:flex;flex-direction:column;gap:30px;align-items:center;text-align:center}.cds-before-after__wrapper--vertical .cds-before-after__header{max-width:700px}.cds-before-after__wrapper--vertical .cds-before-after__comparison{width:100%;max-width:900px}.cds-before-after__wrapper--vertical .cds-before-after__footer{max-width:600px}.cds-before-after__slider-container{position:relative;width:100%;overflow:hidden;border-radius:var(--cds-ba-border-radius, 8px);cursor:ew-resize;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;box-shadow:0 10px 40px #0000001a;touch-action:pan-y pinch-zoom}.cds-before-after__image-wrapper{position:relative;width:100%;line-height:0}.cds-before-after__image{width:100%;height:auto;display:block;object-fit:cover;pointer-events:none}.cds-before-after__before{position:absolute;top:0;left:0;width:50%;height:100%;overflow:hidden}.cds-before-after__before .cds-before-after__image{position:absolute;top:0;left:0;width:auto;min-width:100%;height:100%;max-width:none}.cds-before-after__slider{position:absolute;top:0;bottom:0;left:50%;width:var(--cds-ba-slider-width, 3px);background:var(--cds-ba-slider-color, #ffffff);cursor:ew-resize;z-index:10;transform:translate(-50%);box-shadow:0 0 10px #0000004d}.cds-before-after__slider-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:var(--cds-ba-slider-color, #ffffff);border-radius:50%;box-shadow:0 2px 15px #00000040;display:flex;align-items:center;justify-content:center;gap:6px;transition:transform .3s ease,box-shadow .3s ease}.cds-before-after__slider-container:hover .cds-before-after__slider-handle,.cds-before-after__slider-container:active .cds-before-after__slider-handle{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 4px 25px #0000004d}.cds-before-after__slider-arrow{width:10px;height:10px;border:solid #333333;border-width:0 2px 2px 0}.cds-before-after__slider-arrow--left{transform:rotate(135deg);margin-right:-2px}.cds-before-after__slider-arrow--right{transform:rotate(-45deg);margin-left:-2px}.cds-before-after__label{position:absolute;bottom:16px;padding:8px 16px;background:var(--cds-ba-label-bg, rgba(0, 0, 0, .7));color:var(--cds-ba-label-text, #ffffff);font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;border-radius:30px;z-index:5;pointer-events:none;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.cds-before-after__label--before{left:16px}.cds-before-after__label--after{right:16px}.cds-before-after__legend{font-size:var(--cds-ba-legend-size, 11px);letter-spacing:var(--cds-ba-legend-spacing, 2px);text-transform:uppercase;color:var(--cds-ba-legend-color, #BE9B44);font-weight:500;margin:0 0 12px}.cds-before-after__title{font-size:var(--cds-ba-title-size, 28px);line-height:1.2;color:var(--cds-ba-title-color, #1a1a1a);font-weight:var(--cds-ba-title-weight, 500);margin:0 0 20px;max-width:500px}.cds-before-after__title--uppercase{text-transform:uppercase}.cds-before-after__wrapper--vertical .cds-before-after__title{max-width:none}.cds-before-after__text{font-size:var(--cds-ba-text-size, 15px);line-height:1.7;color:var(--cds-ba-text-color, #666666);margin:0;max-width:500px}.cds-before-after__text p{margin:0}.cds-before-after__wrapper--vertical .cds-before-after__text{max-width:none}.cds-before-after__placeholder{background:linear-gradient(135deg,#f0f0f0,#e0e0e0);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:#999}.cds-before-after__placeholder svg{width:48px;height:48px;opacity:.4}.cds-before-after__placeholder--overlay{position:absolute;top:0;right:0;bottom:0;left:0;aspect-ratio:auto}.cds-ba-animate{opacity:0;transition:opacity .8s ease,transform .8s ease}.cds-ba-animate--fade-up{transform:translateY(40px)}.cds-ba-animate--fade-in{transform:translateY(0)}.cds-ba-animate--fade-left{transform:translate(-40px)}.cds-ba-animate--fade-right{transform:translate(40px)}.cds-ba-animate--zoom-in{transform:scale(.9)}.cds-ba-animate.cds-ba-visible{opacity:1;transform:translateY(0) translate(0) scale(1)}.cds-ba-delay-1{transition-delay:.15s}.cds-ba-delay-2{transition-delay:.3s}.cds-ba-delay-3{transition-delay:.45s}.cds-ba-animate-slider .cds-before-after__before{width:100%!important}.cds-ba-animate-slider .cds-before-after__slider{left:100%!important}.cds-ba-slider-ready .cds-before-after__before,.cds-ba-slider-ready .cds-before-after__slider{transition:left .8s cubic-bezier(.4,0,.2,1),width .8s cubic-bezier(.4,0,.2,1)}@media(prefers-reduced-motion:reduce){.cds-ba-animate{opacity:1;transform:none;transition:none}.cds-ba-slider-ready .cds-before-after__before,.cds-ba-slider-ready .cds-before-after__slider{transition:none}}@media screen and (min-width:750px){.cds-before-after{padding-top:var(--cds-ba-padding-top-desktop, 80px);padding-bottom:var(--cds-ba-padding-bottom-desktop, 80px)}.cds-before-after__container{padding:0 40px}.cds-before-after__wrapper--horizontal{flex-direction:row;gap:var(--cds-ba-gap, 60px)}.cds-before-after__wrapper--horizontal.cds-before-after__wrapper--reverse{flex-direction:row-reverse}.cds-before-after__wrapper--horizontal .cds-before-after__comparison{flex:1.2;max-width:55%}.cds-before-after__wrapper--horizontal .cds-before-after__content{flex:1;max-width:45%}.cds-before-after__legend{font-size:var(--cds-ba-legend-size-desktop, 13px)}.cds-before-after__title{font-size:var(--cds-ba-title-size-desktop, 38px)}.cds-before-after__text{font-size:var(--cds-ba-text-size-desktop, 16px)}.cds-before-after__label{font-size:12px;padding:10px 20px}}@media screen and (min-width:990px){.cds-before-after__wrapper--horizontal .cds-before-after__comparison{max-width:50%}.cds-before-after__wrapper--horizontal .cds-before-after__content{max-width:50%;padding:0 30px}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/cds-before-after.css.map */