/* Shared media rows: a common height, continuous edges and room for dot rims. */
:root{--project-row-height:clamp(180px,20.6vw,460px);--project-grid-gap:28px;--campaign-row-height:clamp(150px,12.5vw,280px)}
/* The five-photo mosaic has one outer rectangle, with no floating middle image. */
@media(min-width:851px){
.projects-page .bbh-project .project-mosaic .gallery-track{height:calc(var(--project-row-height) + 18px);grid-template-columns:2.4fr 1fr 1fr;grid-template-rows:repeat(3,minmax(0,1fr));align-items:stretch;gap:var(--project-grid-gap);padding:9px}
.projects-page .bbh-project .project-mosaic .gallery-track>[data-gallery-item]{height:100%;align-self:stretch}
.projects-page .bbh-project .project-mosaic .gallery-track>[data-gallery-item] figure{height:100%;margin:0}
.projects-page .bbh-project .project-mosaic .gallery-track>[data-gallery-item] .photo-media{height:100%!important;aspect-ratio:auto!important}
}
/* Film and logo have identical top/bottom edges; the logo keeps its square format. */
.project-motion-pair{grid-template-columns:minmax(0,1fr) var(--project-row-height);gap:var(--project-grid-gap);align-items:start}
.project-motion-pair .logo-visual{width:100%;justify-self:stretch;align-self:start}
.project-motion-pair .motion-media{height:var(--project-row-height);aspect-ratio:auto!important}
.project-motion-pair .logo-media{width:100%}
.project-motion-pair figcaption{min-height:32px;margin:0}
/* Overview showreel and portrait films use the same reference height. */
.projects-page .sennheiser-showreel-placeholder{height:var(--project-row-height);aspect-ratio:auto!important}
.projects-page .bmg-grid{grid-template-columns:repeat(5,minmax(0,1fr));align-items:start}
.projects-page .bmg-grid .bmg-media{height:var(--project-row-height);aspect-ratio:auto!important;background:#000}
/* One line per Sennheiser campaign; all chapters share one media height. */
.sennheiser-study .sennheiser-media-row{display:grid;gap:var(--project-grid-gap);padding:9px;align-items:start;grid-template-rows:auto;grid-auto-flow:row}
.sennheiser-study #ambeo .sennheiser-media-row{grid-template-columns:2fr .64fr 1.6fr .82fr .82fr}
.sennheiser-study #hear-more .sennheiser-media-row{grid-template-columns:1.78fr 1.78fr 1fr 1fr 1.78fr}
.sennheiser-study #faces-of-wonder .sennheiser-media-row{grid-template-columns:repeat(4,minmax(0,1fr))}
.sennheiser-study [id="80-years"] .sennheiser-media-row{grid-template-columns:minmax(0,1fr) calc(var(--campaign-row-height)*9/16)}
.sennheiser-study .sennheiser-media-row>.project-visual,.sennheiser-study .sennheiser-media-row>.sennheiser-photo{width:100%;min-width:0;justify-self:stretch;margin:0}
.sennheiser-study .sennheiser-media-row .sennheiser-media{width:100%;height:var(--campaign-row-height);aspect-ratio:auto!important}
.sennheiser-study .sennheiser-media-row .sennheiser-photo{height:var(--campaign-row-height);border-radius:9px;overflow:hidden}
.sennheiser-study .sennheiser-media-row .sennheiser-photo img{width:100%;height:100%;object-fit:cover;object-position:center}
.sennheiser-study .sennheiser-media-row figcaption{min-height:34px;margin:0}
.sennheiser-study .sennheiser-chapter{margin-top:48px}
.sennheiser-study .sennheiser-chapter-heading{margin-bottom:22px}
/* Smaller screens retain readable media in a grid instead of squeezing a desktop row. */
@media(max-width:850px){
:root{--project-row-height:clamp(160px,30vw,300px);--project-grid-gap:24px;--campaign-row-height:clamp(130px,23vw,220px)}
.project-motion-pair{grid-template-columns:minmax(0,1fr) var(--project-row-height)}
.sennheiser-study .sennheiser-media-row{gap:24px}
.sennheiser-study #ambeo .sennheiser-media-row,.sennheiser-study #hear-more .sennheiser-media-row{grid-template-columns:repeat(3,minmax(0,1fr))}
.sennheiser-study #faces-of-wonder .sennheiser-media-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.projects-page .bmg-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:600px){
:root{--project-row-height:clamp(125px,29vw,180px);--campaign-row-height:clamp(125px,31vw,180px)}
.project-motion-pair{grid-template-columns:minmax(0,1fr) var(--project-row-height);gap:24px}
.project-motion-pair .logo-visual{width:100%;justify-self:stretch}
.project-motion-pair figcaption{font-size:11px;flex-wrap:wrap;gap:4px}
.projects-page .bmg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.projects-page .bmg-grid .bmg-media{height:auto;aspect-ratio:9/16!important}
.sennheiser-study #ambeo .sennheiser-media-row,.sennheiser-study #hear-more .sennheiser-media-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.sennheiser-study [id="80-years"] .sennheiser-media-row{grid-template-columns:minmax(0,1fr) calc(var(--campaign-row-height)*9/16)}
}

.sennheiser-study .sennheiser-media-row .sennheiser-photo{background:#080d10}
.sennheiser-study .sennheiser-media-row .sennheiser-photo img{object-fit:contain}

/* Source proportions take precedence over a fixed height: no added letterboxing. */
.project-motion-pair{grid-template-columns:minmax(0,16fr) minmax(0,9fr)}
.project-motion-pair .film-media{height:auto;aspect-ratio:16/9!important}
.project-motion-pair .logo-media{height:auto;aspect-ratio:1!important}
.projects-page .bmg-grid .bmg-media,.bmg-study .bmg-grid .bmg-media{height:auto;aspect-ratio:9/16!important;background:transparent}
.sennheiser-study .sennheiser-media-row .sennheiser-media{height:auto;aspect-ratio:16/9!important}
.sennheiser-study .sennheiser-media-row .sennheiser-portrait .sennheiser-media{aspect-ratio:9/16!important}
.sennheiser-study .sennheiser-media-row .sennheiser-photo{height:auto;background:transparent;aspect-ratio:var(--photo-ratio)}
.sennheiser-study .sennheiser-media-row .sennheiser-photo img{width:100%;height:100%;object-fit:cover}
.sennheiser-study #ambeo .sennheiser-media-row{grid-template-columns:1.777778fr .5625fr 1.423fr .723fr .723fr}
.sennheiser-study #hear-more .sennheiser-media-row{grid-template-columns:repeat(6,minmax(0,1fr))}
.sennheiser-study #hear-more .sennheiser-media-row>.project-visual{grid-column:span 3}
.sennheiser-study #hear-more .sennheiser-media-row>.sennheiser-photo{grid-column:span 2}
.sennheiser-study #faces-of-wonder .sennheiser-media-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.sennheiser-study [id="80-years"] .sennheiser-media-row{grid-template-columns:minmax(0,1fr) minmax(0,.5625fr);max-width:1120px}
.sennheiser-study [id="80-years"] .sennheiser-media-row>.project-visual:first-child .sennheiser-media{aspect-ratio:1!important}
.sennheiser-study [id="80-years"] .sennheiser-media-row>.project-visual:first-child video{object-fit:cover}
.sennheiser-study [id="80-years"] .sennheiser-media-row>.project-visual:first-child .sennheiser-media{background:#000}
@media(max-width:850px){.sennheiser-study #ambeo .sennheiser-media-row{grid-template-columns:repeat(6,minmax(0,1fr))}.sennheiser-study #ambeo .sennheiser-media-row>.project-visual{grid-column:span 3}.sennheiser-study #ambeo .sennheiser-media-row>.sennheiser-photo{grid-column:span 2}}
@media(max-width:600px){.project-motion-pair{grid-template-columns:minmax(0,16fr) minmax(0,9fr)}.sennheiser-study #faces-of-wonder .sennheiser-media-row{grid-template-columns:1fr}.sennheiser-study #hear-more .sennheiser-media-row>.project-visual{grid-column:1/-1}.sennheiser-study #hear-more .sennheiser-media-row>.sennheiser-photo{grid-column:span 2}}

.perplexity-project{scroll-margin-top:32px}
.perplexity-overview{grid-column:span 3;display:grid;grid-template-columns:1.778fr .833fr .927fr;gap:28px;padding:9px;align-items:start;min-width:0}
.perplexity-media{display:block!important;border:0!important;border-radius:9px;background:transparent!important;aspect-ratio:auto!important}
.perplexity-media::before{display:none!important}
.perplexity-media img{display:block;width:100%;height:auto}
.perplexity-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:9px;margin-top:38px;align-items:start}
.perplexity-detail-grid .perplexity-flamingo-billboard,.perplexity-detail-grid .perplexity-rosenthaler-platz{grid-column:span 2}
.perplexity-detail-grid .perplexity-media{outline:2px dotted #111514;outline-offset:7px}
/* The supplied poster screenshot contains a black surround: frame the artwork itself. */
.perplexity-berghain-poster .perplexity-media{aspect-ratio:459/815!important;overflow:hidden}
.perplexity-berghain-poster .perplexity-media img{position:absolute;width:235.3%;max-width:none;left:-65.58%;top:-36.81%;height:auto}
@media(max-width:850px){.perplexity-overview{grid-column:1/-1}}
@media(max-width:600px){.perplexity-overview{grid-template-columns:1fr 1fr;gap:24px}.perplexity-overview .project-visual:first-child{grid-column:1/-1}.perplexity-detail-grid{grid-template-columns:1fr 1fr;gap:24px}.perplexity-detail-grid .perplexity-flamingo-billboard,.perplexity-detail-grid .perplexity-rosenthaler-platz{grid-column:1/-1}}
.perplexity-overview .project-visual .perplexity-media{aspect-ratio:auto!important}