.before-after__header{text-align:center;margin-bottom:3rem}.before-after__heading{margin:0 0 .8rem}.before-after__subheading{margin:0;opacity:.7}.before-after__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(28rem,1fr));gap:3.2rem}before-after-slider{--ba-position: 50%;position:relative;display:block;aspect-ratio:1;border-radius:var(--inputs-radius, .4rem);overflow:hidden;cursor:ew-resize;-webkit-user-select:none;user-select:none;background:rgba(var(--color-foreground),.06)}.ba-after{position:absolute;top:0;right:0;bottom:0;left:0}.ba-after img{width:100%;height:100%;object-fit:cover;display:block}.ba-before{position:absolute;top:0;left:0;bottom:0;width:50%;overflow:hidden}.ba-before img{width:100%;height:100%;object-fit:cover;display:block}.ba-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:rgba(var(--color-foreground),.08);font-size:1.4rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;opacity:.5}.ba-label{position:absolute;bottom:1.4rem;padding:.5rem 1.2rem;border-radius:5rem;font-size:1rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;pointer-events:none}.ba-label--before{left:1.2rem;background:#0009}.ba-label--after{right:1.2rem;background:rgb(var(--color-button));color:rgb(var(--color-button-label))}.ba-handle{position:absolute;top:0;bottom:0;left:var(--ba-position);width:.2rem;transform:translate(-50%);background:#fff;display:flex;align-items:center;justify-content:center;pointer-events:none}.ba-handle__circle{width:3.6rem;height:3.6rem;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 .2rem 1.2rem #0003}.ba-handle__circle svg{width:1.2rem;height:1.2rem;stroke:rgb(var(--color-foreground))}.ba-static{grid-column:1 / -1;max-width:80rem;margin:0 auto}.ba-static img{width:100%;height:auto;display:block;border-radius:var(--inputs-radius, .4rem);box-shadow:0 .8rem 3.2rem #00000014}.ba-caption{margin:1.4rem 0 0;text-align:center;font-size:1.3rem;font-style:italic;opacity:.7}
/*# sourceMappingURL=/cdn/shop/t/10/assets/component-before-after.css.map */