.before-after__header{max-width:62rem;margin:0 auto 2rem;text-align:center}.before-after__heading{margin:0}.before-after__text{margin:.8rem 0 0;color:rgba(var(--color-foreground),.72)}.before-after__slider{display:block;width:100%;max-width:var(--ba-max-width, 56rem);margin-left:auto;margin-right:auto}.before-after__frame{position:relative;width:100%;max-width:100%;aspect-ratio:var(--ba-ratio, 1);overflow:hidden;border-radius:var(--ba-radius, .6rem);background-color:rgba(var(--color-foreground),.04);cursor:ew-resize;touch-action:pan-y;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.before-after__layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.before-after__layer--after{clip-path:inset(0 0 0 var(--ba-position, 50%))}.before-after__image,.before-after__layer .placeholder-svg{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;max-width:100%;object-fit:var(--ba-fit, contain);object-position:center center;-webkit-user-drag:none}.before-after__label{position:absolute;top:1.2rem;z-index:2;display:inline-block;padding:.5rem 1.1rem;border-radius:10rem;background-color:#ffffffeb;color:#121212;font-size:1.05rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;box-shadow:0 .1rem .6rem #00000024;pointer-events:none}.before-after__label--before{left:1.2rem}.before-after__label--after{right:1.2rem;color:var(--ba-accent, #0897b9)}.before-after__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;z-index:3;border:0;opacity:0;cursor:ew-resize;background:transparent;touch-action:pan-y;-webkit-appearance:none;appearance:none}.before-after--enhanced .before-after__range{pointer-events:none}.before-after__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:.2rem;height:100%}.before-after__range::-moz-range-thumb{width:.2rem;height:100%;border:0;border-radius:0;background:transparent}.before-after__handle{position:absolute;top:0;bottom:0;left:var(--ba-position, 50%);transform:translate(-50%);z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.before-after__line{width:.2rem;height:100%;background-color:var(--ba-accent, #0897b9);box-shadow:0 0 0 .1rem #ffffff8c}.before-after__knob{position:absolute;display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;border-radius:50%;background-color:#fff;color:var(--ba-accent, #0897b9);box-shadow:0 .2rem 1.2rem #00000038,0 0 0 .1rem rgba(var(--ba-accent-rgb, 8, 151, 185),.22)}.before-after__range:focus-visible~.before-after__handle .before-after__knob{outline:.2rem solid rgb(var(--ba-accent-rgb, 8, 151, 185));outline-offset:.3rem}@media(prefers-reduced-motion:no-preference){.before-after__knob{transition:transform .15s ease,box-shadow .15s ease}.before-after__frame:hover .before-after__knob{transform:scale(1.04)}}@media screen and (max-width:749px){.before-after__header{margin-bottom:1.6rem}.before-after__label{top:.8rem;padding:.45rem .9rem;font-size:1rem}.before-after__label--before{left:.8rem}.before-after__label--after{right:.8rem}.before-after__knob{width:4rem;height:4rem}}
/*# sourceMappingURL=/cdn/shop/t/16/assets/section-before-after.css.map */