/* The existing service-page composition, extended to four native triplets per rail.
   No typography, header, footer, collage geometry or shared motion is replaced. */
.dna-page .dna-grid-scene{position:relative;isolation:isolate}
.dna-page .dna-grid-scene>.services-brand-grid{opacity:.20;z-index:-1;--grid-ink:rgba(255,255,255,.16)}
/* Editorial sections have side gutters; extend only their decorative layer to the
   same page-wide coordinate space as the full-width gallery sections. */
.dna-page .editorial-split.dna-grid-scene>.services-brand-grid{left:calc(-1 * var(--gutter));width:calc(100% + 2 * var(--gutter))}
.dna-page .dna-gallery[data-gallery-count="12"] .gallery-track{grid-template-columns:repeat(4,calc(var(--unit) * 7 - var(--grid-gap)) calc(var(--unit) * 3 - var(--grid-gap)))}
.dna-page .dna-gallery .gallery-image{grid-column:var(--dna-column);grid-row:var(--dna-row);align-self:center;max-height:none}
.dna-page .dna-gallery .dna-gallery-main{grid-row:1/3;height:auto;aspect-ratio:4/3}
.dna-page .dna-gallery .dna-gallery-detail{height:100%;aspect-ratio:auto}
.dna-page .lightbox-progress span{width:calc(100% / 12)}
@media(max-width:767px){
 .dna-page .dna-gallery[data-gallery-count="12"] .gallery-track{grid-template-columns:repeat(8,calc((var(--viewport,100vw) - 24px) / 2))}
 .dna-page .dna-gallery .gallery-image{grid-column:var(--dna-mobile-column);grid-row:1;max-height:none;aspect-ratio:auto}
 .dna-page .dna-gallery .dna-gallery-main{grid-column:var(--dna-mobile-column) / span 2;height:calc((var(--viewport) - 16px) * .548);align-self:start}
 .dna-page .dna-gallery .dna-gallery-detail{height:calc((var(--viewport) - 24px) / 2);align-self:end}
 .dna-page .dna-gallery .dna-pack-even.dna-gallery-main{align-self:end}
 .dna-page .dna-gallery .dna-pack-even.dna-gallery-detail{align-self:start}
}
