.property-mosaic {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: clamp(4px, .75vw, 11px);
    aspect-ratio: 8 / 3;
    overflow: hidden;
    border-radius: 14px;
}
.property-mosaic-tile {
    position: relative;
    display: block;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--tint);
    cursor: zoom-in;
}
.property-mosaic-tile:first-child { grid-row: 1 / 3; }
.property-mosaic[data-photo-count="1"] { grid-template-columns: 1fr; }
.property-mosaic[data-photo-count="2"] .property-mosaic-tile:nth-child(2) { grid-row: 1 / 3; }
.property-mosaic-tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.property-mosaic-tile:focus-visible { outline-offset: -4px; z-index: 1; }
.property-photos-cta {
    position: absolute;
    right: clamp(10px, 1.4vw, 20px);
    bottom: clamp(10px, 1.4vw, 20px);
    display: inline-flex;
    gap: 7px;
    align-items: center;
    padding: 9px 14px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--white);
    color: var(--ink);
    font: 700 15px/1.3 var(--sans);
    box-shadow: 0 1px 6px #09283f24;
}
.property-photo-viewer {
    width: min(960px, calc(100% - 24px));
    max-width: 100%;
    max-height: 94vh;
    max-height: 94dvh;
    margin: auto;
    padding: clamp(12px, 2vw, 24px);
    border: 0;
    border-radius: 14px;
    background: var(--paper);
    color: var(--ink);
}
.property-photo-viewer:not([open]), .property-mosaic[hidden], .property-mosaic-tile[hidden],
.property-photo-link[hidden], .property-viewer-nav[hidden] { display: none; }
.property-photo-viewer::backdrop { background: rgb(6 21 32 / 86%); }
.property-viewer-head, .property-viewer-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.property-viewer-head h2 { font-size: clamp(20px, 3vw, 32px); }
.property-photo-viewer button {
    min-height: 44px;
    padding: 7px 14px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--white);
    color: var(--ink);
    font-weight: 700;
    cursor: pointer;
}
.property-photo-viewer figure { margin: 14px 0; }
.property-viewer-image {
    width: 100%;
    height: min(59vh, 580px);
    height: min(59dvh, 580px);
    object-fit: contain;
    background: var(--ink-deep);
    border-radius: 6px;
}
.property-photo-viewer figcaption {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    align-items: baseline;
    margin-top: 8px;
}
.property-photo-viewer [data-counter] { font-size: 14px; font-weight: 700; }
.property-photo-link { cursor: zoom-in; }
:root:has(.property-photo-viewer[open]) { overflow: hidden; }
@media (max-width: 640px) {
    .property-mosaic {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: minmax(0, 2.4fr) minmax(0, 1fr);
        aspect-ratio: 1.1;
        border-radius: 10px;
    }
    .property-mosaic-tile:first-child { grid-column: 1 / -1; grid-row: 1; }
    .property-mosaic[data-photo-count="2"] .property-mosaic-tile:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
    .property-mosaic[data-photo-count="1"] { grid-template-rows: 1fr; aspect-ratio: 1.5; }
    .property-photos-cta { font-size: 13px; }
}
