.kr-before-after{--kr-ba-accent:var(--kr-color-primary,var(--color-primary,#6f2cff));color:var(--kr-color-text,#1d2327)}.kr-before-after__heading{margin:0 0 1.25rem}.kr-before-after__figure{margin:0}.kr-before-after__stage{position:relative;overflow:hidden;aspect-ratio:var(--kr-ba-aspect,16 / 9);border-radius:var(--kr-radius-medium,18px);background:#ddd}.kr-before-after__layer{position:absolute;inset:0}.kr-before-after__image{width:100%;height:100%;object-fit:cover;display:block}.kr-before-after__layer--after{clip-path:inset(0 0 0 var(--kr-ba-pos))}.kr-before-after--vertical .kr-before-after__layer--after{clip-path:inset(var(--kr-ba-pos) 0 0 0)}.kr-before-after__divider{position:absolute;top:0;bottom:0;left:var(--kr-ba-pos);width:2px;background:#fff;transform:translateX(-1px);pointer-events:none}.kr-before-after--vertical .kr-before-after__divider{left:0;right:0;top:var(--kr-ba-pos);bottom:auto;width:auto;height:2px;transform:translateY(-1px)}.kr-before-after__handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:3rem;height:3rem;border-radius:999px;background:#fff;color:var(--kr-ba-accent);font-weight:800;box-shadow:0 4px 18px rgba(0,0,0,.18)}.kr-before-after--vertical .kr-before-after__handle{transform:translate(-50%,-50%) rotate(90deg)}.kr-before-after__range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.kr-before-after--vertical .kr-before-after__range{cursor:ns-resize}.kr-before-after__range:focus-visible+.kr-before-after__divider,.kr-before-after__stage:focus-within .kr-before-after__handle{outline:3px solid var(--kr-ba-accent);outline-offset:3px}.kr-before-after__label{position:absolute;top:1rem;padding:.4rem .65rem;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-weight:700;font-size:.85rem;pointer-events:none}.kr-before-after__label--before{left:1rem}.kr-before-after__label--after{right:1rem}.kr-before-after__caption{margin-top:.6rem;font-size:.9rem;opacity:.75}
.kr-before-after--vertical .kr-before-after__label--after{top:auto;bottom:1rem;right:1rem}
