/* Optional Main-Box compact state. Interni retains its existing scene wrapper. */
.byat-panel.main-box-minimized{position:relative;display:flex!important;align-items:center!important;height:clamp(96px,10svh,120px)!important;min-height:0!important;padding:12px 64px 12px 20px!important}
.byat-panel.main-box-minimized>.byat-copy,.byat-panel.main-box-minimized>.photo-gallery,.byat-panel.main-box-minimized>.letter-preview{display:none!important}
.byat-panel.main-box-minimized>.interior-mini{display:grid;grid-template-columns:minmax(130px,.85fr) minmax(0,1fr) minmax(160px,1.4fr);gap:24px;width:100%;height:100%;align-items:center}
.main-box-minimized .interior-mini-thumbs{display:flex;height:100%}
.main-box-minimized .interior-mini-thumbs img{height:100%;width:auto}
.byat-panel .interior-minimize[hidden]{display:none!important}
@media(max-width:900px){.byat-panel.main-box-minimized>.interior-mini{grid-template-columns:1fr 1fr}.main-box-minimized .interior-mini-body{display:none}}

/* Main-Box shared geometry v2 — one definition for BAYT, Interni and Butera.
   Instance data and photo controls remain individual. */

@media(min-width:901px){
 :is(.exterior-track,.byat-track,.butera-track)>.byat-panel:not(.main-box-minimized){
    display:grid!important;
    grid-template-columns:minmax(0,var(--ds-main-box-copy-width)) minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    column-gap:var(--ds-main-box-column-gap)!important;
    align-items:stretch!important;
    padding:var(--ds-main-box-inset)!important;
 }
 .byat-panel:not(.main-box-minimized)>.byat-copy{
    grid-column:1!important;grid-row:1!important;align-self:start!important;justify-content:flex-start!important;
    display:flex!important;flex-direction:column!important;
    gap:var(--ds-main-box-copy-gap)!important;
    padding:0!important;margin:0!important;max-width:none!important;width:100%!important;
 }
 .byat-panel:not(.main-box-minimized)>.photo-gallery,
 .byat-panel:not(.main-box-minimized)>.letter-preview{
    grid-column:2!important;grid-row:1!important;width:100%!important;max-width:none!important;
    height:100%!important;min-height:0!important;align-self:stretch!important;
 }
 .byat-panel:not(.main-box-minimized) .photo-stage{width:100%!important;max-width:none!important}
 .byat-panel:not(.main-box-minimized) .byat-copy :is(h2,h3){
    margin:0!important;padding:0!important;font-size:clamp(29px,2.8vw,51px)!important;
    line-height:1.02!important;letter-spacing:-.035em;
 }
 .byat-panel:not(.main-box-minimized) .byat-copy :is(.render-kicker,.project-place){
    padding:0!important;margin:0 0 clamp(6px,.8vw,13px)!important;
    line-height:1.4!important;
 }
 .byat-panel:not(.main-box-minimized) .byat-copy>p:not(.render-kicker):not(.project-place){margin:0!important}
}
@media(min-width:901px){
 /* ID specificity counteracts legacy per-section title sizing: every Main-Box
    now inherits the same editorial scale without modifying other components. */
 :is(#mondo,#casa,#palazzo-butera) :is(.exterior-track,.byat-track,.butera-track)>.byat-panel:not(.main-box-minimized)>.byat-copy :is(h2,h3){
    font-size:clamp(29px,2.8vw,51px)!important;
    line-height:1.02!important;
 }
 :is(#mondo,#casa,#palazzo-butera) :is(.exterior-track,.byat-track,.butera-track)>.byat-panel:not(.main-box-minimized)>.byat-copy>p:not(.render-kicker):not(.project-place){
    font-size:clamp(13px,.98vw,16px)!important;
    line-height:1.5!important;
 }
}

/* Shared image-gallery controls. One reusable component across all Main Boxes. */
.photo-gallery .photo-arrow.gallery-nav, .project-gallery .photo-arrow.gallery-nav{
  width:var(--ds-gallery-nav-size)!important;height:var(--ds-gallery-nav-size)!important;
  min-width:var(--ds-gallery-nav-size)!important;min-height:var(--ds-gallery-nav-size)!important;
  padding:0!important;border:1px solid var(--ds-gallery-nav-stroke)!important;
  border-radius:var(--ds-gallery-nav-radius)!important;
  color:var(--ds-gallery-nav-ink)!important;
  background:var(--ds-gallery-nav-glass)!important;
  -webkit-backdrop-filter:blur(12px) saturate(120%);backdrop-filter:blur(12px) saturate(120%);
  box-shadow:0 2px 12px color-mix(in srgb,var(--brand-plum) 13%,transparent);
  transition:opacity .2s ease,background .2s ease,transform .2s ease;
}
.photo-gallery .photo-arrow.gallery-nav:hover{background:color-mix(in srgb,var(--brand-white) 90%,transparent)!important}
.photo-gallery .photo-arrow.gallery-nav svg{width:18px!important;height:18px!important;stroke-width:2!important}
@media(hover:none){.photo-gallery .photo-arrow.gallery-nav{opacity:.88}}
