.gallery-next { display:block; cursor:pointer; }
.gallery-next:focus-visible { outline-offset: -5px; }
.studio-gallery figcaption { padding: 10px 2px; color: #514f46; }
.roof-grid figure { background:#eeebe1; padding:clamp(18px,3vw,36px); }
.roof-grid svg { display:block; max-height:none; height:clamp(140px,19vw,235px); }
.roof-grid path { stroke-linejoin:round; }
.portal-choice-title { margin:24px 0 12px; font-size:26px; }
.studio-footer { background:#262b25; color:#fff8e9; grid-template-columns:1.6fr 1fr 1fr; gap:32px; }
.studio-footer h2 { font-size:16px; letter-spacing:0; margin:0 0 14px; }
.studio-footer p { text-align:left; color:#e3ddd0; margin-top:18px; }
.studio-footer nav,.studio-footer>div { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.studio-footer a,.studio-footer button { min-height:28px; }
.studio-footer small { text-align:left; grid-column:1/-1; border-top:1px solid #ffffff44; padding-top:20px; }
.section-index { position:fixed; right:16px; top:47%; z-index:19; color:#292e25; font-size:12px; }
.section-index>button,.section-index nav { background:#fff8e9; border:1px solid #c9c6b8; box-shadow:0 4px 16px #262b2525; }
.section-index>button { display:flex; margin-left:auto; align-items:center; gap:12px; padding:10px 13px; border-radius:24px; min-height:44px; }
.section-index nav { position:absolute; right:0; top:52px; min-width:168px; display:grid; gap:0; padding:8px; border-radius:12px; max-height:42svh; overflow:auto; }
.section-index nav[hidden] { display:none; }
.section-index nav a { padding:8px; display:flex; align-items:center; gap:10px; border-radius:6px; }
.section-index nav a[aria-current],.section-index nav a:hover { background:#e5e2d4; }
body:has(#designer:not([hidden]).open) .section-index { display:none; }
@media(max-width:820px){
 .section-index { top:auto; bottom:max(14px,env(safe-area-inset-bottom)); right:10px; }
 .section-index nav { top:auto; bottom:52px; max-height:65svh; }
}
@media(max-width:680px){.studio-footer { grid-template-columns:1fr; gap:22px; padding-bottom:80px; }}
.connection-photo:has(img[src$="-plan.svg"]), .pair-photo:has(img[src$="-plan.svg"]) { height:auto; aspect-ratio:16 / 10; background:#f2efe5; }
.connection-photo img[src$="-plan.svg"], .pair-photo img[src$="-plan.svg"], .finish-image img[src$="-elevation.svg"] { object-fit:contain; object-position:center; }

.roof-grid figure { padding:0; overflow:hidden; }
.roof-grid figcaption { padding:clamp(16px,3vw,30px); }
.roof-grid .roof-render { aspect-ratio:4 / 3; height:auto; object-fit:cover; }
.finish-image img[src*="finish-"][src$="-render.webp"] { object-position:center; }

/* Track widths must be allowed to shrink below a floor plan's intrinsic size. */
#spaces .collection-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
#spaces .product-card,
#spaces .studio-gallery,
#spaces .layout-plan { min-width:0; max-width:100%; }
#spaces .product-card .gallery-next { width:100%; max-width:100%; }
#spaces .layout-plan a { display:block; min-width:0; }
#spaces .layout-plan img { max-width:100%; }
@media (max-width:900px) {
  #spaces .collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  #spaces .collection-grid { grid-template-columns:minmax(0,1fr); margin:0; padding:0; overflow:visible; }
  #spaces .product-card .gallery-next { height:auto; aspect-ratio:4 / 3; }
  #spaces .product-heading { gap:8px; }
}

.quote-extras { border:0; margin:20px 0; padding:0; min-width:0; }
.quote-extras legend { font-size:17px; padding:0; }
.quote-extras .price-note { margin:6px 0 12px; }