/* Work thumbnails are 1080 x 720. Portrait selectors retain their own proportions. */
.exhibition-2026 .layers-work-grid .layers-artist-card img,
.exhibition-2026 .layers-project-card img,
.exhibition-2026 .layers-student-project-grid .layers-project-card img,
.exhibition-2026 img.layers-work-image{
    display:block;width:100%;height:auto;aspect-ratio:3 / 2;object-fit:cover;object-position:center;
    background:var(--exhibition-paper);
}
/* Long artwork in the article keeps its natural height; no cropping or stretching. */
.exhibition-2026 .layers-project-content img{
    width:100%!important;max-width:100%;height:auto!important;aspect-ratio:auto!important;object-fit:contain;
}

/* Keep the missing-image notice fully visible. */
.exhibition-2026 .layers-work-grid .layers-artist-card img[src*="noimg.jpg"],
.exhibition-2026 .layers-project-card img[src*="noimg.jpg"],
.exhibition-2026 .layers-student-project-grid .layers-project-card img[src*="noimg.jpg"],
.exhibition-2026 img.layers-work-image[src*="noimg.jpg"]{object-fit:contain}

/* Student portraits use the 500 x 625 frame, independently of work thumbnails. */
.exhibition-2026 .planning-member-portrait,
.exhibition-2026 .layers-student-portrait{
    height:auto!important;aspect-ratio:4 / 5!important;object-fit:contain!important;
}

/* Fill the 500 x 625 portrait frame without distorting the uploaded photo. */
.exhibition-2026 .planning-member-portrait{object-fit:cover!important;object-position:center}

/* Keep the profile close to its title and remove the mobile portrait spacer. */
.exhibition-2026 .layers-artist-content>.content-wrap{padding-top:40px}
.exhibition-2026 .layers-artist-content .layers-student-profile{padding-top:36px}
@media(max-width:767.98px){
    .exhibition-2026 .layers-artist-content>.content-wrap{padding-top:24px}
    .exhibition-2026 .layers-artist-content .layers-student-profile{padding-top:24px}
}
/* A subtle edge distinguishes white artwork without changing the source files. */
.exhibition-2026 .layers-work-grid .layers-artist-card img,
.exhibition-2026 .layers-project-card img,
.exhibition-2026 .layers-project-content img{
    box-sizing:border-box;border:1px solid #d9d9d9;
}

/* Use the supplied representative-work banner on student and detail pages too. */
.exhibition-2026 #page-title.layers-work-title{
    background-image:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),url(/assets/request2026/designer-banner.jpg?v=20261028-upload1729)!important;
    background-position:center!important;background-size:cover!important;
}
.exhibition-2026 #page-title.layers-work-title::before,
.exhibition-2026 #page-title.layers-work-title::after{display:none!important}
.exhibition-2026 #page-title.layers-work-title h2{color:#fff!important}

/* Match the directory banner's content and spacing at every screen width. */
.exhibition-2026 #page-title.layers-work-title{padding-top:64px!important;padding-bottom:64px!important}
.exhibition-2026 #page-title.layers-work-title>.container>p:last-child{margin-bottom:0!important}
@media(max-width:767.98px){
    .exhibition-2026 #page-title.layers-work-title{padding-top:48px!important;padding-bottom:48px!important}
}

/* Let the portrait's natural proportions determine the compact designer card. */
.exhibition-2026 .layers-detail-designer{align-items:center}
.exhibition-2026 .layers-detail-designer>img{
    width:112px;flex:0 0 112px;height:auto;min-height:0;aspect-ratio:auto;
    align-self:flex-start;object-fit:contain;
}
.exhibition-2026 .layers-detail-designer-info{gap:4px;padding:12px 20px 12px 16px}
.exhibition-2026 .layers-detail-designer-role{font-size:28px;line-height:1;margin:0 0 4px}
.exhibition-2026 .layers-detail-designer-name{line-height:1.4}
@media(max-width:575.98px){
    .exhibition-2026 .layers-detail-designer>img{width:96px;flex-basis:96px}
    .exhibition-2026 .layers-detail-designer-info{padding:8px 16px 8px 12px}
    .exhibition-2026 .layers-detail-designer-role{font-size:24px}
}

/* Place the portrait flush against the designer panel edges. */
.exhibition-2026 .layers-artist-content .layers-student-profile {
    padding-top: 0; padding-bottom: 0; padding-left: 0;
}
@container student-introduction (max-width: 700px) {
    .exhibition-2026 .layers-artist-content .layers-student-profile .layers-student-portrait { margin-left: 0; }
    .exhibition-2026 .layers-artist-content .layers-student-intro { padding: 0 20px 20px; }
}

.exhibition-2026 .layers-artist-content .layers-student-portrait { aspect-ratio: auto!important; height: auto!important; }

@container student-introduction (max-width: 700px) {
    .exhibition-2026 .layers-artist-content .layers-student-profile {
        grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
        align-items: center; gap: 20px; padding-right: 16px; border-radius: 16px;
    }
    .exhibition-2026 .layers-artist-content .layers-student-profile .layers-student-portrait {
        width: 100%; margin: 0; align-self: start;
    }
    .exhibition-2026 .layers-artist-content .layers-student-intro { padding: 16px 0; }
    .exhibition-2026 .layers-artist-content .layers-student-profile .layers-student-role {
        position: absolute; z-index: -1; top: 12px; right: 12px;
        font-size: clamp(28px, 10cqw, 64px); line-height: 1!important;
        letter-spacing: -.035em; color: rgba(0, 0, 0, .055); margin: 0;
    }
    .exhibition-2026 .layers-artist-content .layers-student-class { font-size: 12px; margin-bottom: 4px; }
    .exhibition-2026 .layers-artist-content .layers-student-intro h2 { font-size: 22px; line-height: 1.4; margin-bottom: 12px; }
    .exhibition-2026 .layers-artist-content .layers-student-greeting { font-size: 13px; line-height: 1.7; }
}

.exhibition-2026 .layers-artist-content .layers-student-intro {
    align-self: end;
}
@container student-introduction (min-width: 701px) {
    .exhibition-2026 .layers-artist-content .layers-student-intro { padding-bottom: 24px; }
}
