/* Local review: reserve navigation and footer before sizing page content. */
@media (min-width:601px) {
  body:has(#content > :is(.photos,.details,.property-facts,.faq)) {
    --review-header-height:clamp(56px,9dvh,76px);
    min-height:100dvh;
    display:grid;
    grid-template-rows:var(--review-header-height) minmax(min-content,1fr) 40px;
  }
  body:has(#content > :is(.photos,.details,.property-facts,.faq)) > header {
    height:var(--review-header-height);
  }
  body:has(#content > :is(.photos,.details,.property-facts,.faq)) > footer {
    height:40px;padding:10px 8px;font-size:14px;line-height:20px;
  }
  #content > :is(.photos,.details,.property-facts,.faq) {
    width:100%;padding:clamp(12px,2dvh,24px) 4.5%;
  }
  #content > .photos {
    height:calc(100dvh - var(--review-header-height) - 40px);
    min-height:430px;grid-template-columns:clamp(205px,19vw,270px) minmax(0,1fr);
    gap:clamp(18px,2vw,30px);
  }
  .photos .spaces {min-height:0;display:flex;flex-direction:column;}
  .photos .spaces .eyebrow {font-size:18px;margin:0 0 8px;}
  .photos .small-label {margin:8px 0 10px;}
  .photos .room-list {min-height:0;gap:0;}
  .photos .room-list button {font-size:clamp(14px,2.5dvh,18px);padding:clamp(4px,.9dvh,8px) 12px;line-height:1.3;}
  .photos .gallery {min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto clamp(55px,11dvh,95px);gap:10px;}
  .photos .photo-stage {min-height:0;}
  .photos .photo-stage #enlarge-photo {height:100%;min-height:0;}
  .photos .photo-stage img {height:100%;width:100%;object-fit:contain;}
  .photos :is(.stage-prev,.stage-next) {top:50%;transform:translateY(-50%);}
  .photos .gallery-caption {margin:0;gap:16px;}
  .photos .gallery-caption h2 {font-size:clamp(20px,3.5dvh,28px);margin:0 0 4px;}
  .photos .gallery-caption p {font-size:14px;line-height:1.35;margin:0;}
  .photos .photo-count {font-size:14px;gap:12px;}
  .photos .thumbnails {min-height:0;padding:0 2px;gap:10px;}
  .photos .thumbnails button {height:100%;flex-basis:clamp(100px,12vw,180px);}

  #content > .details {
    height:calc(100dvh - var(--review-header-height) - 40px);
    min-height:430px;display:grid;grid-template-rows:minmax(230px,1fr) auto auto;gap:12px;
  }
  .details .details-hero {min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,4vw,60px);}
  .details .details-hero > img {height:100%;min-height:0;object-fit:contain;}
  .details .eyebrow {font-size:15px;line-height:1.2;margin:0 0 12px;}
  .details .details-hero h1 {font-size:clamp(30px,5.6dvh,48px);line-height:1.06;margin:0 0 16px;max-width:520px;}
  .details .lead {font-size:clamp(16px,2.6dvh,19px);line-height:1.45;margin:0;}
  .details .reference-links {font-size:16px;margin-top:16px;gap:24px;}
  .details > .small-label {margin:0;line-height:18px;}
  .details .detail-groups {gap:0 20px;}
  .details .detail-groups button {font-size:clamp(15px,2.6dvh,19px);padding:8px 4px 12px;line-height:1.3;}
  .details .detail-number {font-size:13px;line-height:16px;margin-bottom:5px;}
  .details .detail-groups button:nth-child(n+5) {margin-top:4px;}

  #content > .property-facts {
    max-width:1500px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
    column-gap:clamp(24px,3vw,48px);row-gap:12px;align-items:start;
  }
  .property-facts > .eyebrow {grid-column:1/-1;margin:0;font-size:16px;line-height:20px;}
  .property-facts > h1 {grid-column:1;grid-row:2;margin:0;font-size:36px;line-height:1.12;}
  .property-facts > .price {grid-column:2;grid-row:2;margin:0;align-self:center;font-size:18px;}
  .property-facts > .facts {grid-column:1;grid-row:3/6;margin:0;}
  .property-facts .facts > div {grid-template-columns:minmax(120px,1fr) minmax(0,1.6fr);padding:10px 0;gap:16px;font-size:15px;}
  .property-facts .facts dd {line-height:1.4;}
  .property-facts > .area-note {grid-column:1;grid-row:6;margin:0;padding:12px;font-size:14px;line-height:1.4;}
  .property-facts > h2 {grid-column:2;grid-row:3;margin:0;font-size:22px;line-height:1.2;}
  .property-facts > .reference-grid {grid-column:2;grid-row:4;margin:0;gap:12px;}
  .property-facts .reference-grid button {padding:0;}
  .property-facts .reference-grid img {height:clamp(70px,15dvh,120px);}
  .property-facts .reference-grid span {font-size:14px;line-height:1.3;margin-top:6px;}
  .property-facts > .muted {grid-column:2;grid-row:5;margin:0;font-size:14px;line-height:1.4;}
  .property-facts > .link-button {grid-column:2;grid-row:6;margin:0;padding:10px 16px;min-height:44px;font-size:16px;justify-self:start;}

  #content > .faq {max-width:1120px;}
  .faq > .eyebrow {font-size:16px;line-height:20px;margin:0 0 8px;}
  .faq > h1 {font-size:clamp(30px,5dvh,42px);line-height:1.12;margin:0 0 14px;}
  .faq > details {padding:10px 0;}
  .faq > details > summary {font-size:17px;line-height:1.3;}
  .faq > details p {font-size:15px;line-height:1.4;margin:10px 0 0;}
  .faq > .area-note {font-size:14px;line-height:1.4;margin:14px 0 0;padding:10px 14px;}
}
/* Small windows and zoom retain every control and paragraph through normal scrolling. */
@media (min-width:601px) and (max-height:560px) {
  #content > .photos {height:430px;}
  #content > .details {height:auto;min-height:430px;grid-template-rows:260px auto auto;}
}
@media (min-width:601px) and (max-width:850px) {
  #content > .property-facts {display:block;}
  .property-facts > :is(h1,.price,.facts,h2,.reference-grid,.area-note,.muted,.link-button) {margin-top:16px;}
  .property-facts .facts > div {grid-template-columns:1fr 1.6fr;}
  .property-facts > .reference-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* The native media element persists; only its viewing box changes. */
#film .film-tools {position:absolute;z-index:2;inset:0 0 auto;height:auto;min-height:56px;padding:calc(6px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 6px max(16px,env(safe-area-inset-left));gap:12px;background:linear-gradient(#000a,transparent);pointer-events:none;}
#film .film-tools button {pointer-events:auto;min-height:44px;padding:8px 12px;background:#0008;border-radius:3px;}
#film video {display:block;width:100%;height:100dvh;object-fit:cover;object-position:center;background:#000;}
#film[data-fit="contain"] video {object-fit:contain;}
#film video:fullscreen {width:100%;height:100%;}
@media (orientation:portrait) {#film:not([data-fit="cover"]) video {object-fit:contain;}}
@media (max-width:600px) {#film .film-tools {gap:4px;}#film .film-tools button {font-size:13px;padding:8px;}}