@media (min-width:761px){
  .gallery{grid-template-columns:repeat(4,1fr)}
  .gallery-large,.gallery-exterior{grid-column:span 2}
  .gallery-large img,.gallery-exterior img{height:415px}
  .gallery-exterior img{object-position:center 45%}
  .gallery>figure:not(.gallery-large):not(.gallery-exterior){margin-top:-2px}
}
@media (max-width:760px){
  .gallery-exterior{grid-column:1/-1}
  .gallery-exterior img{height:330px;object-position:center 45%}
}

.comparison-slider{height:415px;position:relative;overflow:hidden;background:var(--ink);--position:50%}
.comparison-slider img{width:100%;height:100%;object-fit:cover;display:block}
.comparison-before{position:absolute;inset:0}
.comparison-after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--position))}
.comparison-label{position:absolute;top:14px;padding:6px 9px;color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;pointer-events:none}
.before-label{left:14px;background:var(--ink)}.after-label{right:14px;background:var(--orange)}
.comparison-control{appearance:none;position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:2}
.comparison-handle{position:absolute;top:0;bottom:0;left:var(--position);width:2px;background:#fff;transform:translateX(-50%);pointer-events:none;z-index:1}
.comparison-handle:after{content:'↔';position:absolute;top:50%;left:50%;width:38px;height:38px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;background:#fff;color:var(--ink);font:700 17px 'DM Sans';box-shadow:0 2px 12px rgba(0,0,0,.24)}
.comparison figcaption span{color:var(--orange);margin-left:10px;font-size:10px;letter-spacing:.08em}
@media(max-width:760px){.comparison-slider{height:330px}.comparison-label{top:10px;font-size:8px;padding:5px 7px}.before-label{left:10px}.after-label{right:10px}}