/* Real project photography and a keyboard-accessible comparison. */
.floor-comparison[hidden]{display:none!important}
.floor-comparison{background:#203530;color:#fff;padding:64px 0 72px}
.floor-comparison .container{max-width:1000px}
.comparison-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:28px}
.comparison-heading .eyebrow{color:#ffd17f}
.comparison-heading h2{font-size:clamp(2rem,3.8vw,3.25rem);line-height:1.1;letter-spacing:-.035em;margin:12px 0 0}
.comparison-heading p{font-size:.875rem;line-height:1.6;max-width:250px;margin:0;color:#d1dcd4}
.comparison-frame{position:relative;aspect-ratio:4/3;background:#14241f;isolation:isolate;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}
.comparison-frame .comparison-image{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%;pointer-events:none}
.comparison-before{clip-path:inset(0 calc(100% - var(--split)) 0 0);z-index:1}
.comparison-divider{position:absolute;inset:0 auto 0 var(--split);width:2px;transform:translateX(-1px);background:#f2b544;z-index:3;pointer-events:none}
.comparison-handle{position:absolute;left:var(--split);top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border:2px solid #f2b544;border-radius:50%;background:#203530;color:#ffd17f;display:grid;place-items:center;z-index:4;cursor:ew-resize;box-shadow:0 2px 12px #0005;outline-offset:5px}
.comparison-handle>span{font:500 28px/1 Arial,sans-serif;white-space:nowrap}.handle-grip{font-size:17px;vertical-align:3px}
.comparison-handle:focus-visible{outline:3px solid #fff;box-shadow:0 0 0 7px #14241f}
.comparison-label{position:absolute;top:18px;z-index:2;background:#14241feb;border:1px solid #ffffff4d;color:#fff;font:700 .8125rem/1.4 Arial,sans-serif;padding:7px 12px;pointer-events:none;border-radius:2px}
.before-label{left:18px}.after-label{right:18px}
.finished-room{margin:0;background:#203530;overflow:hidden}
.finished-room img{display:block;width:100%;height:auto;aspect-ratio:21/9;max-height:650px;object-fit:cover;object-position:50% 72%}
@media(max-width:600px){.floor-comparison{display:block;padding:42px 0 48px}.comparison-heading{display:block;margin-bottom:23px}.comparison-heading h2{font-size:2.25rem}.comparison-heading p{margin-top:15px;max-width:320px}.comparison-frame{width:100%;aspect-ratio:4/5;touch-action:pan-y}.comparison-frame .comparison-image{object-position:50% 62%}.comparison-label{top:12px;padding:6px 9px}.before-label{left:12px}.after-label{right:12px}.finished-room img{aspect-ratio:4/3;object-position:52% 76%}}

.comparison-handle{left:clamp(28px,var(--split),calc(100% - 28px))}

/* Both full-size photos occupy the exact same frame; only the reveal edge moves. */
.comparison-frame{display:block;overflow:hidden}
.comparison-frame .comparison-image{max-width:none;margin:0;border:0}
.comparison-handle{width:88px;height:56px;left:clamp(46px,var(--split),calc(100% - 46px));border:2px solid #fff3d0;border-radius:28px;background:#f2b544;color:#14241f;box-shadow:0 3px 16px #0007}
.comparison-handle>span{display:flex;align-items:center;gap:7px;font-size:30px;font-weight:700}
.comparison-handle .handle-grip{font:700 11px/1 Arial,sans-serif;letter-spacing:.07em}
.comparison-divider{box-shadow:0 0 3px #14241f88}
@media(max-width:600px){.comparison-handle{width:92px;height:60px;left:clamp(48px,var(--split),calc(100% - 48px))}.comparison-handle .handle-grip{font-size:12px}}