.before-after-slider{width:100%;max-width:800px;margin:2rem auto}.ba-title{text-align:center;margin-bottom:1.5rem}.ba-container{position:relative;width:100%;overflow:hidden;border-radius:8px;box-shadow:0 4px 20px rgb(0 0 0 / .1);cursor:ew-resize;user-select:none}.ba-container img{display:block;width:100%;height:auto;pointer-events:none}.ba-before{position:relative;z-index:1}.ba-after{position:absolute;top:0;left:0;z-index:2;clip-path:inset(0 50% 0 0)}.ba-handle{position:absolute;top:0;left:50%;width:4px;height:100%;background:#fff;z-index:3;transform:translateX(-50%);cursor:ew-resize}.ba-handle::before{content:'';position:absolute;top:50%;left:50%;width:48px;height:48px;background:#fff;border:3px solid #333;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 10px rgb(0 0 0 / .2)}.ba-handle::after{content:'⟷';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#333;font-weight:700;z-index:1}@media (max-width:768px){.before-after-slider{max-width:100%;margin:1rem 0}.ba-handle::before{width:40px;height:40px}.ba-handle::after{font-size:20px}}