.b-ba__grid{display:grid;gap:4rem;align-items:center}.b-ba:not(.b-ba--with-text) .b-ba__figure{max-width:72rem;margin:0 auto;width:100%}@media screen and (min-width:990px){.b-ba--with-text .b-ba__grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:8rem}.b-ba--text-right .b-ba__text{order:2}}.b-ba__text{max-width:52rem}.b-ba__lede p{margin:0 0 1.2rem}.b-ba__lede p:last-child{margin-bottom:0}.b-ba__figure{margin:0}.b-ba__compare{--pos: 50%;position:relative;display:block;aspect-ratio:4 / 5;border-radius:var(--b-radius-lg);overflow:hidden;background:rgb(var(--b-stone));touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}.b-ba__compare--square{aspect-ratio:1 / 1}.b-ba__layer{position:absolute;top:0;right:0;bottom:0;left:0}.b-ba__layer .b-placeholder{aspect-ratio:auto;height:100%;border-radius:0}.b-ba__layer--before{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}.b-ba__img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.b-ba__layer--after .b-placeholder__label{margin-left:auto}.b-ba__label{position:absolute;top:1.4rem;padding:.6rem 1.2rem;border-radius:var(--b-pill);background:rgba(var(--b-cream),.88);color:rgb(var(--b-espresso));font-size:1.2rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;pointer-events:none}.b-ba__label--before{left:1.4rem}.b-ba__label--after{right:1.4rem}.b-ba__handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:rgb(var(--b-cream));box-shadow:0 0 0 1px #2a211c14;pointer-events:none}.b-ba__knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:5.2rem;height:5.2rem;border-radius:50%;background:rgb(var(--b-cream));color:rgb(var(--b-espresso));box-shadow:var(--b-shadow-lift);display:flex;align-items:center;justify-content:center;transition:transform .3s var(--b-ease)}.b-ba__knob .b-icon{width:1.8rem;height:1.8rem;margin:0 -.2rem}.b-ba__compare[data-dragging] .b-ba__knob{transform:translate(-50%,-50%) scale(1.06)}.b-ba__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none;-webkit-appearance:none;appearance:none}.b-ba__compare:has(.b-ba__range:focus-visible){outline:2px solid rgb(var(--b-clay));outline-offset:4px}.b-ba__compare:has(.b-ba__range:focus-visible) .b-ba__knob{box-shadow:0 0 0 3px rgb(var(--b-clay)),var(--b-shadow-lift)}.b-ba__caption{margin-top:1.4rem;text-align:center}
/*# sourceMappingURL=/cdn/shop/t/13/assets/section-before-after.css.map */