/* Project-only category shortcuts; home filter styling is unchanged. */
.project-filters{background:rgba(224,224,219,.48)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.project-filters a{display:block;white-space:nowrap;padding:10px 13px;font-size:11px;border-radius:4px;line-height:1.2}
.project-filters a:hover,.project-filters a:focus-visible{background:#222;color:#fff}
body:has(.project-filters) footer{padding-bottom:100px}
body:has(dialog[open]) .project-filters{visibility:hidden}
.garment-pair>figure>.image-button{height:clamp(210px,calc(100svh - 290px),650px)!important}
.garment-pair>figure>figcaption{padding:8px 0 4px}
.garment-pair .outside-zoom{padding:4px 0 8px}
.garment-pair .view-thumb{height:98px;flex-basis:88px}.garment-pair .view-thumb img{height:66px}
.look-garments{display:flex;flex-wrap:wrap;gap:6px 18px;padding:12px 4px;font-size:12px;line-height:1.5}
.look-garments a{text-decoration:underline;text-underline-offset:4px}
.film-description{display:block}.film-description .description{max-width:920px;margin-left:auto;margin-right:auto}
.film-stage{position:relative;width:100%;height:auto;min-height:0;aspect-ratio:16/9;max-width:1400px;margin-inline:auto;overflow:hidden;background:#171717}
.film-stage>iframe,.film-stage>.film-play{position:absolute;inset:0;width:100%;height:100%;border:0}
.film-stage>.film-play img{width:100%;height:100%;object-fit:contain;max-height:100%}
.film-retry{display:block;margin:12px auto;font-size:12px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.project-filters{max-width:calc(100vw - 12px);overflow-x:auto}.project-filters a{padding:10px 9px;font-size:10px}.garment-pair>figure>.image-button{height:clamp(220px,calc(100svh - 265px),540px)!important}.look-garments{font-size:11px}.film-stage{height:auto;min-height:0}}
/* Editorial covers: reserve a separate row for the title, below the artwork. */
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"]){display:flex;flex-direction:column;height:auto;min-height:0;max-height:none;overflow:visible}
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"])>.cover{position:relative;flex:none;height:clamp(360px,70svh,850px);padding:60px 0 0!important}
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"])>.cover img{height:100%;object-fit:contain;object-position:center}
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"])>.hero-title{position:relative;left:auto!important;bottom:auto!important;flex:none;margin:20px 24px 28px;padding:0!important;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;max-width:calc(100% - 48px)!important}
/* Campaign titles retain black type over a lighter, smaller translucent panel. */
.project-hero:is([data-project="mid20s"],[data-project="bioscape"])>.hero-title{background:rgba(246,246,243,.24);backdrop-filter:none;-webkit-backdrop-filter:none;padding:12px 16px;color:#171717}
@media(max-width:760px){
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"])>.cover{height:clamp(290px,58svh,530px);padding-top:110px!important}
.project-hero:is([data-project="graphic-system"],[data-project="specimen-file"])>.hero-title{margin:16px 12px 24px;max-width:calc(100% - 24px)!important}
.project-hero[data-project="mid20s"]>.hero-title{padding:9px 12px!important}
/* BIOSCAPE already places its mobile title below the photographs. */
.project-hero[data-project="bioscape"]>.hero-title{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* Catalogue: equal fitting area for the occupied silhouette of every garment. */
#garments .garment-card > a.image-button{display:block;width:100%;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:1 / 1!important;padding:0;position:relative;overflow:hidden}
#garments .garment-card > a.image-button:not(.fitted-garment) img{width:100%;height:100%;object-fit:contain;padding:6%}

/* Keep the poster and embedded film in the same fluid frame, including iOS. */
.film-section>.film-play{width:100%;max-width:1400px;aspect-ratio:16/9;margin-inline:auto;overflow:hidden}
.film-section>.film-play img{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;object-fit:contain}
.film-stage>iframe{display:block;min-width:0;min-height:0;max-width:100%;max-height:100%;padding:0;transform:none}
@media(max-width:760px){
 .film-section{width:100%;min-width:0;padding-inline:12px;overflow:hidden}
 .film-stage,.film-section>.film-play{width:100%;max-width:100%;height:auto;min-height:0;aspect-ratio:16/9;margin-inline:auto}
 .film-stage>iframe,.film-stage>.film-play{width:100%;height:100%;inset:0}
 .film-section .film-play span{width:max-content;max-width:calc(100% - 32px);padding:12px 16px;font-size:11px}
}