/* Before and after share one camera crop; only the after image is wiped. */
.room-comparison{overflow:clip;isolation:isolate}
.journey-stage[data-scene="0"] .room-comparison .compare-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:none;transition:none;opacity:1;mask-image:none;-webkit-mask-image:none;pointer-events:none;user-select:none}
.journey-stage[data-scene="0"] .room-comparison .compare-after{clip-path:inset(0 0 0 var(--comparison-split,50%));z-index:1}
.compare-label{position:absolute;z-index:4;top:96px;border:1px solid #fff7;background:#f7f2e9ed;box-shadow:0 2px 10px #31271812;color:#383b30;font-size:10px;letter-spacing:1.4px;padding:9px 12px;border-radius:4px;min-height:36px}
.compare-label-before{left:22px}.compare-label-after{right:12%}.compare-label:hover{background:#fffaf0}.compare-label[aria-pressed=true]{background:#343b30;color:#fff9ee}
.compare-divider{position:absolute;z-index:2;top:0;bottom:0;left:var(--comparison-split,50%);width:2px;background:#fff8ee;box-shadow:0 0 5px #30271b66;pointer-events:none}
.compare-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:7px;width:46px;height:46px;border:2px solid #fff9ef;border-radius:50%;background:#f7f1e9f2;color:#4a4e3e;box-shadow:0 4px 18px #332b2033;font:27px/1 Georgia,serif}
.compare-divider i{height:20px;width:1px;background:#a79b85}
.comparison-slider{position:absolute;z-index:3;inset:0 auto 0 -23px;width:calc(100% + 46px);height:100%;margin:0;padding:0;opacity:0;cursor:ew-resize;touch-action:pan-y;appearance:none;-webkit-appearance:none;background:transparent}
.comparison-slider::-webkit-slider-runnable-track{height:2px;background:transparent}.comparison-slider::-webkit-slider-thumb{-webkit-appearance:none;width:46px;height:46px;border:0;background:transparent;margin-top:-22px}
.comparison-slider::-moz-range-track{height:2px;background:transparent}.comparison-slider::-moz-range-thumb{width:46px;height:46px;border:0;background:transparent}
.room-comparison:focus-within .compare-divider>span{outline:3px solid #a66b46;outline-offset:3px}
.comparison-note{position:absolute;z-index:4;bottom:160px;left:22px;max-width:76%;padding:4px 7px;border-radius:3px;background:#f7f2e9e8;color:#58584a;font-size:9px;line-height:1.5;pointer-events:none}
.compare-unavailable .compare-after,.compare-unavailable .comparison-slider,.compare-unavailable .compare-divider,.compare-unavailable .compare-label{display:none}
@media(max-width:850px){
 .journey-stage[data-scene="0"] .room-comparison .compare-photo{object-position:50% 58%}
 .journey-stage[data-scene="0"] .bedroom-room .compare-photo{object-position:50% 68%}
 .compare-label{top:10px;font-size:9px;min-height:34px;padding:7px 9px}.compare-label-before{left:12px}.compare-label-after{right:12px}.comparison-note{bottom:5px;left:12px;font-size:8px;max-width:92%;padding:3px 5px}
}
@media(max-width:600px){
 .journey-stage[data-scene="0"] .room-comparison .compare-photo{object-position:50% 55%}
 .journey-stage[data-scene="0"] .bedroom-room .compare-photo{object-position:50% 68%}
}
@media(max-width:950px) and (max-height:500px) and (orientation:landscape){
 .journey-stage[data-scene="0"] .room-comparison .compare-photo{object-position:50% 55%}
 .compare-label{top:65px}.comparison-note{bottom:150px;font-size:8px;max-width:84%}
}
@media(min-width:601px) and (max-width:850px){.comparison-note{bottom:32px}}
.room-comparison[data-position="0"] .compare-divider>span{left:32px}.room-comparison[data-position="100"] .compare-divider>span{left:-32px}
.room-comparison[data-position="0"] .compare-divider:after,.room-comparison[data-position="100"] .compare-divider:after{content:'';position:absolute;top:50%;width:32px;height:2px;background:#fff8ee}
.room-comparison[data-position="0"] .compare-divider:after{left:0}.room-comparison[data-position="100"] .compare-divider:after{right:0}
@media(max-width:600px){.compare-label{min-height:44px}}

/* Keep the automatic transformation free of comparison controls until requested. */
.room-comparison:not(.comparison-manual) .compare-divider,
.room-comparison:not(.comparison-manual) .compare-label,
.room-comparison:not(.comparison-manual) .comparison-slider{visibility:hidden;pointer-events:none}
.comparison-activate{position:absolute;inset:0;z-index:3;width:100%;height:100%;border:0;padding:0;background:transparent;cursor:pointer;color:#383b30}
.comparison-activate span{position:absolute;left:22px;top:100px;padding:8px 12px;background:#f7f2e9ed;border:1px solid #fff7;border-radius:4px;font-size:10px;letter-spacing:.4px;box-shadow:0 2px 10px #31271812}
.comparison-activate:focus-visible{outline:3px solid #a66b46;outline-offset:-4px}
.comparison-activate[hidden]{display:none}
.compare-unavailable .comparison-activate{display:none}
@media(max-width:850px){.comparison-activate span{top:12px;left:12px}}
@media(max-width:950px) and (max-height:500px) and (orientation:landscape){.comparison-activate span{top:65px}}