.sk-roof-slider{--olive:#718044;--olive-deep:#536236;--pct:50%;font-family:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;max-width:1180px;margin-inline:auto;}
.sk-roof-slider *{box-sizing:border-box}
.sk-roof-slider__viewport{position:relative;isolation:isolate;overflow:hidden;width:100%;aspect-ratio:2.16/1;min-height:250px;background:#dedacb;border:1.5px solid var(--olive);border-radius:22px;box-shadow:0 12px 26px rgba(34,46,22,.13),0 2px 5px rgba(34,46,22,.05)}
.sk-roof-slider__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}
.sk-roof-slider__photo--before{clip-path:inset(0 calc(100% - var(--pct)) 0 0)}
.sk-roof-slider__badge{pointer-events:none;position:absolute;z-index:2;top:clamp(14px,2.4vw,28px);padding:10px 22px;background:var(--olive-deep);color:white;border-radius:99px;font-size:clamp(14px,1.5vw,18px);font-weight:650;line-height:1.2;box-shadow:0 3px 8px rgba(0,0,0,.12)}
.sk-roof-slider__badge--before{left:clamp(14px,2.5vw,28px)}
.sk-roof-slider__badge--after{right:clamp(14px,2.5vw,28px);background:var(--olive)}
.sk-roof-slider__line{position:absolute;z-index:3;top:0;bottom:0;left:var(--pct);width:2px;transform:translateX(-50%);background:rgba(255,255,255,.97);box-shadow:0 0 3px rgba(0,0,0,.18);pointer-events:none}
.sk-roof-slider__handle{position:absolute;left:var(--pct);top:50%;z-index:4;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:clamp(56px,6.5vw,76px);aspect-ratio:1;border-radius:50%;border:8px solid #fff;background:var(--olive);color:#fff;box-shadow:0 4px 15px rgba(29,38,20,.22);pointer-events:none}
.sk-roof-slider__handle svg{width:30px;height:24px}
.sk-roof-slider__control{position:absolute;z-index:5;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;touch-action:pan-y}
.sk-roof-slider__control::-webkit-slider-thumb{-webkit-appearance:none;width:50px;height:80px;cursor:ew-resize}
.sk-roof-slider__control::-moz-range-thumb{width:50px;height:80px;cursor:ew-resize;border:0;background:transparent}
.sk-roof-slider__viewport:has(.sk-roof-slider__control:focus-visible){outline:3px solid var(--olive);outline-offset:3px}
.sk-roof-slider__hint{display:flex;gap:20px;align-items:center;justify-content:center;margin:17px 0 0;color:var(--olive-deep);font-size:clamp(14px,1.35vw,17px);font-weight:500}
.sk-roof-slider__hint svg{width:26px;height:14px}
@media(max-width:650px){.sk-roof-slider__viewport{aspect-ratio:1.28/1;min-height:230px;border-radius:16px}.sk-roof-slider__badge{padding:8px 14px}.sk-roof-slider__handle{border-width:6px}.sk-roof-slider__hint{gap:12px;margin-top:12px}}

.sk-roof-slider{max-width:980px;scroll-margin-top:118px}
.sk-tile-service .sk-roof-slider__hint{font-size:12px;margin:17px 0 0}
@media(max-width:650px){.sk-tile-service .sk-roof-slider__hint{margin-top:12px}}