.before-after{--position:50%;display:grid;position:relative;overflow:hidden}.before-after__wrapper{overscroll-behavior-x:none;display:grid}.before-after__img{-webkit-user-select:none;user-select:none;grid-area:1/1}.before-after__img--before{clip-path:polygon(0 0,var(--position)0,var(--position)100%,0% 100%)}.before-after__slider{opacity:0;cursor:pointer;overscroll-behavior-x:none;width:100%;height:100%;position:absolute;inset:0}.before-after__slider:focus-visible~.before-after__slider-button{outline-offset:3px;outline:5px solid #000}.before-after__slider-line{inset:0;left:var(--position);pointer-events:none;background-color:#000;width:.2rem;height:100%;position:absolute;transform:translate(-50%)}.before-after__slider-button{top:50%;left:var(--position);background-color:var(--c-highlight);color:#fff;pointer-events:none;border-radius:100vw;place-items:center;padding:.5rem;display:grid;position:absolute;transform:translate(-50%,-50%);box-shadow:1px 1px 1px #08030380}.before-after__slider-button-svg{max-width:unset}