.project-compare-before,.project-compare-images{position:absolute;inset:0}.project-compare-images{touch-action:pan-y;cursor:ew-resize;overflow:hidden;user-select:none}.compare-label,.project-compare-images img{pointer-events:none}.compare-label{position:absolute;top:18px;background:#082f53;color:#fff;font-size:13px;font-weight:650;padding:7px 12px;border-radius:4px}.compare-label.before{left:18px}.compare-label.after{right:18px}.compare-divider{position:absolute;top:0;bottom:0;width:3px;background:#fff;transform:translateX(-50%);pointer-events:none;box-shadow:0 0 8px #0004}.compare-divider span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border:3px solid #fff;border-radius:50%;background:var(--prince-blue);color:#fff}.compare-control{padding:14px 18px 16px;background:#eff4f8}.compare-control label{display:block;font-size:13px;font-weight:650}.compare-control input{display:block;width:100%;min-height:36px;accent-color:#082f53;cursor:ew-resize}.compare-control p{margin-top:4px;color:#516577;font-size:12px;line-height:1.6}.compare-control[hidden]{display:none}.project-showcase:has(.compare-control input:focus-visible) .compare-divider span{outline:3px solid #e7be73;outline-offset:3px}