/* SKOLATO – posuvník před/po (.sk-ba) v popisu realizace. Komponenta je stejná jako na blogu mimicry
   (posuvnik/balicek), jen písmo a barva podle SKOLATO. Načítá ji skolatohome::posuvnikHead() mimo balíček CCC. */
.sk-ba{--pos:50%;position:relative;display:block;width:100%;max-width:1200px;margin:0 auto 30px;aspect-ratio:3/2;overflow:hidden;border-radius:20px;background:#F2F3F5;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize}
.sk-ba .sk-ba__img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;display:block;margin:0;pointer-events:none;-webkit-user-drag:none}
.sk-ba__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0);-webkit-clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.sk-ba__label{position:absolute;top:14px;z-index:2;padding:5px 14px;border-radius:999px;font-family:Montserrat,Arial,sans-serif;font-size:14px;font-weight:700;line-height:1.2;color:#fff;background:rgba(57,67,77,.75);pointer-events:none}
.sk-ba__label--before{left:14px}
.sk-ba__label--after{right:14px;background:#d20957}
.sk-ba__handle{position:absolute;top:0;bottom:0;left:var(--pos);z-index:3;width:44px;margin-left:-22px;display:flex;align-items:center;justify-content:center;outline:none;cursor:ew-resize}
.sk-ba__handle::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.35)}
.sk-ba__knob{position:relative;width:44px;height:44px;border-radius:50%;background:#d20957;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.sk-ba__knob svg{width:22px;height:22px;fill:#fff}
.sk-ba__handle:focus-visible .sk-ba__knob{outline:3px solid #fff;outline-offset:3px}
@media (max-width:600px){.sk-ba{border-radius:12px}.sk-ba__label{font-size:12px;top:10px}.sk-ba__label--before{left:10px}.sk-ba__label--after{right:10px}}