.bas__heading{margin:0 0 24px;text-align:center;font-size:clamp(1.6rem,4vw,2.3rem);color:#0F4C50;line-height:1.2}
.bas{max-width:640px;margin:0 auto}
.bas__frame{position:relative;width:100%;overflow:hidden;border-radius:16px;background:#f5f3ef;touch-action:none;-webkit-user-select:none;user-select:none}
.bas__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none;user-drag:none}
.bas__frame.is-dragging .bas__img--after,.bas__frame.is-dragging .bas__divider{transition:none}
.bas__img--after{transition:clip-path .12s linear}
.bas__divider{position:absolute;top:0;bottom:0;width:0;transform:translateX(-50%);pointer-events:none;transition:left .12s linear}
.bas__divider::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08);transform:translateX(-50%)}
.bas__handle{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:#fff;border:none;box-shadow:0 2px 10px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;gap:2px;color:#0F4C50;cursor:grab;pointer-events:auto;touch-action:none}
.bas__handle:active{cursor:grabbing}
.bas__handle:focus-visible{outline:2px solid #0F4C50;outline-offset:3px}
.bas__badge{position:absolute;top:14px;padding:6px 12px;border-radius:999px;background:rgba(15,76,80,.85);color:#fff;font-size:.78rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;pointer-events:none}
.bas__badge--before{left:14px}
.bas__badge--after{right:14px}
@media(min-width:750px){.bas{max-width:720px}}