.comparison{--position:52%;position:relative;height:460px;overflow:hidden;background:#0c1327;user-select:none}.comparison-image,.comparison-after img{width:100%;height:100%;object-fit:cover;object-position:center 22%}.comparison-after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--position))}.comparison-after img{position:absolute;inset:0;width:100%;max-width:none}.comparison:after{content:'';position:absolute;top:0;bottom:0;left:var(--position);width:2px;background:#fff;box-shadow:0 0 0 1px rgba(16,22,42,.25);transform:translateX(-1px)}.comparison-label{position:absolute;z-index:2;top:20px;padding:8px 11px;background:#fff;color:var(--ink);font:500 10px var(--mono);text-transform:uppercase;letter-spacing:.06em}.before-label{left:20px}.after-label{right:20px;background:var(--coral);color:#fff}.comparison-handle{position:absolute;z-index:3;left:var(--position);top:50%;display:grid;place-items:center;width:42px;height:42px;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:50%;background:var(--ink);color:#fff}.comparison-handle span{font-size:19px}.comparison-range{position:absolute;z-index:4;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}@media(max-width:750px){.comparison{height:390px}.comparison-label{top:12px}.before-label{left:12px}.after-label{right:12px}}