.mp-ba-wrapper{width:100%;margin-top:var(--mp-ba-margin-top-desktop, 48px);margin-bottom:var(--mp-ba-margin-bottom-desktop, 48px);padding-top:var(--mp-ba-padding-top, 0px);padding-bottom:var(--mp-ba-padding-bottom, 0px);background-color:var(--mp-ba-bg, transparent);box-sizing:border-box}.mp-ba-wrapper.mp-page-shell{width:100%;margin-left:auto;margin-right:auto;padding-left:15px;padding-right:15px;max-width:calc(var(--fluid-container-width, 1620px) + var(--fluid-container-offset, 60px) * 2);box-sizing:border-box}@media screen and (min-width:1280px){.mp-ba-wrapper.mp-page-shell{padding-left:var(--fluid-container-offset, 60px);padding-right:var(--fluid-container-offset, 60px)}}@media(max-width:767px){.mp-ba-wrapper{margin-top:var(--mp-ba-margin-top-mobile, 28px);margin-bottom:var(--mp-ba-margin-bottom-mobile, 28px)}}.mp-ba-grid{display:grid;grid-template-columns:var(--mp-ba-content-width, 38%) 1fr;gap:var(--mp-ba-gap-desktop, 48px);align-items:center;box-sizing:border-box}.mp-ba-grid.mp-ba--image-left{grid-template-columns:1fr var(--mp-ba-content-width, 38%)}.mp-ba-grid.mp-ba--image-left .mp-ba-content{order:2}.mp-ba-grid.mp-ba--image-left .mp-ba-slider-col{order:1}.mp-ba-content{display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}.mp-ba-heading{margin:0 0 16px;line-height:1.2;font-family:inherit;color:var(--mp-ba-heading-color, #111827);font-size:var(--mp-ba-heading-size-desktop, 38px);font-weight:var(--mp-ba-heading-weight, 700)}.mp-ba-subheading{margin:0 0 28px;line-height:1.6;color:var(--mp-ba-subheading-color, #4b5563);font-size:var(--mp-ba-subheading-size, 15px)}.mp-ba-subheading p{margin:0;font-size:inherit;color:inherit;line-height:inherit}.mp-ba-action{display:inline-block}.mp-ba-btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 32px;background-color:var(--mp-ba-btn-bg, #000000);color:var(--mp-ba-btn-color, #ffffff);border:1px solid var(--mp-ba-btn-border, #000000);border-radius:var(--mp-ba-btn-radius, 6px);font-size:14px;font-weight:600;text-decoration:none;cursor:pointer;transition:all .25s cubic-bezier(.16,1,.3,1);box-shadow:0 2px 8px #00000014}.mp-ba-btn:hover{background-color:var(--mp-ba-btn-hover-bg, #1a5e73);color:var(--mp-ba-btn-hover-color, #ffffff);border-color:var(--mp-ba-btn-hover-bg, #1a5e73);box-shadow:0 6px 18px #00000026;transform:translateY(-2px)}.mp-ba-slider-col{width:100%;box-sizing:border-box}.mp-ba-slider{position:relative;width:100%;aspect-ratio:var(--mp-ba-aspect-ratio, 16 / 9);overflow:hidden;border-radius:var(--mp-ba-radius, 12px);box-shadow:var(--mp-ba-shadow, 0 8px 30px rgba(0, 0, 0, .08));user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:col-resize;background-color:#f3f4f6;--slider-pos: 50%}.mp-ba-image-layer{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.mp-ba-image-layer img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}.mp-ba-layer--after{z-index:1}.mp-ba-layer--before{z-index:2;clip-path:polygon(0 0,var(--slider-pos) 0,var(--slider-pos) 100%,0 100%);-webkit-clip-path:polygon(0 0,var(--slider-pos) 0,var(--slider-pos) 100%,0 100%);will-change:clip-path}.mp-ba-slider.is-animating .mp-ba-layer--before{transition:clip-path .35s cubic-bezier(.16,1,.3,1),-webkit-clip-path .35s cubic-bezier(.16,1,.3,1)}.mp-ba-slider.is-animating .mp-ba-divider{transition:left .35s cubic-bezier(.16,1,.3,1)}.mp-ba-badge{position:absolute;top:18px;z-index:5;padding:6px 18px;background-color:#fffffff2;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#111827;font-size:13px;font-weight:600;border-radius:4px;box-shadow:0 2px 10px #0000001f;letter-spacing:.3px;pointer-events:none;transition:opacity .2s ease}.mp-ba-badge--before{left:18px}.mp-ba-badge--after{right:18px}.mp-ba-divider{position:absolute;top:0;bottom:0;left:var(--slider-pos);width:2px;background-color:var(--mp-ba-divider-color, #ffffff);box-shadow:0 0 12px #0006;transform:translate(-50%);z-index:4;pointer-events:none;will-change:left}.mp-ba-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background-color:var(--mp-ba-handle-bg, #ffffff);box-shadow:0 4px 16px #00000040;display:flex;align-items:center;justify-content:center;pointer-events:auto;cursor:grab;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s ease}.mp-ba-slider:active .mp-ba-handle,.mp-ba-slider.is-dragging .mp-ba-handle{cursor:grabbing;transform:translate(-50%,-50%) scale(1.1);box-shadow:0 8px 24px #00000052}.mp-ba-handle-grip{display:flex;align-items:center;justify-content:center;gap:3px;height:16px}.mp-ba-handle-grip span{display:block;width:2px;height:14px;background-color:var(--mp-ba-handle-icon-color, #718096);border-radius:1px}.mp-ba-range{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:6;margin:0;cursor:col-resize;-webkit-appearance:none;appearance:none}@media(max-width:991px){.mp-ba-grid{grid-template-columns:1fr;gap:32px}.mp-ba-grid.mp-ba--image-left{grid-template-columns:1fr}.mp-ba-grid.mp-ba--image-left .mp-ba-content{order:1}.mp-ba-grid.mp-ba--image-left .mp-ba-slider-col{order:2}.mp-ba-heading{font-size:var(--mp-ba-heading-size-mobile, 28px)}.mp-ba-slider{aspect-ratio:var(--mp-ba-aspect-ratio-mobile, 16 / 10)}.mp-ba-badge{top:12px;padding:4px 12px;font-size:11px}.mp-ba-badge--before{left:12px}.mp-ba-badge--after{right:12px}.mp-ba-handle{width:38px;height:38px}}
/*# sourceMappingURL=/cdn/shop/t/151/assets/mp-before-after.css.map */