/* Hallmark · macrostructure: Split Studio · theme: Midnight
 * Static feature galleries with native media ratios and intentional hover previews.
 * pre-emit critique: P4 H5 E4 S5 R5 V4 */
.sample-exhibit{padding-block:var(--space-xl);scroll-margin-top:var(--space-lg)}
.exhibit-heading{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-xl)}
.exhibit-heading h2{font-size:var(--text-heading)}
.exhibit-heading p{font-size:var(--text-sm);color:var(--color-muted)}
.feature-showcases{display:grid}
.feature-showcase{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,2fr);align-items:start;gap:clamp(32px,5vw,72px);padding-block:var(--space-2xl);border-top:1px solid var(--color-rule);scroll-margin-top:var(--space-lg);min-width:0}
.feature-showcase-copy{min-width:0;padding-top:var(--space-xs)}
.feature-showcase-copy h3{font-size:clamp(1.625rem,2.4vw,2rem);font-weight:650;line-height:1.4}
.feature-showcase-promise{font-size:var(--text-base);line-height:1.85;color:var(--color-ink-2);margin-top:var(--space-md);max-width:21em}
.feature-showcase-points{display:grid;gap:var(--space-2xs);list-style:none;margin:var(--space-lg) 0 0;padding:0;color:var(--color-muted);font-size:var(--text-sm);line-height:1.8}
.feature-showcase-points li{padding-left:var(--space-sm);border-left:2px solid var(--color-rule)}
.feature-showcase-points{font-size:var(--text-sm)}
#feature-commerce .feature-showcase-points{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-sm);row-gap:var(--space-xs)}
#feature-commerce .feature-showcase-points li:last-child{grid-column:1/-1}
.feature-gallery{--gallery-max-height:380px;display:flex;flex-wrap:nowrap;align-items:flex-start;justify-content:space-between;gap:var(--space-lg) var(--space-md);min-width:0}
.feature-gallery>.result-card{display:block;flex:var(--media-ratio) 1 0;width:auto;min-width:0;max-width:min(100%,calc(var(--media-ratio)*var(--gallery-max-height)));height:auto;padding:0;background:var(--color-transparent);color:var(--color-ink);border:0;text-align:left;border-radius:var(--radius-sm);aspect-ratio:auto}
.feature-gallery .result-cover{position:relative;display:block;width:100%;height:auto;aspect-ratio:var(--media-ratio);overflow:clip;border:0;border-radius:var(--radius-sm);background:var(--color-paper-2)}
.feature-gallery .result-cover>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;object-position:center;transform:none;transition:none}
.feature-gallery .result-caption{display:grid;gap:var(--space-2xs);margin:0;padding-top:var(--space-sm);font-size:var(--text-sm);line-height:1.6}
.feature-gallery .result-caption strong{display:block;font-size:var(--text-sm);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.feature-gallery .result-caption>span{font-size:var(--text-xs);color:var(--color-soft)}
.feature-gallery .result-video-badge,.feature-gallery .real-cover-label,.feature-gallery .real-cover-title{display:none}
.feature-preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;pointer-events:none}
.result-cover[data-preview=playing]>.feature-preview-video{opacity:1}
.result-cover[data-preview=playing]>img{opacity:0}
.feature-gallery-empty{width:100%;color:var(--color-muted);padding-block:var(--space-xl)}
@media(hover:hover) and (pointer:fine){.feature-gallery .result-card:hover img{transform:none}}
@media(max-width:1100px){.feature-showcase{grid-template-columns:minmax(0,.7fr) minmax(0,1.8fr);gap:var(--space-lg)}.feature-gallery{gap:var(--space-lg) var(--space-sm)}}
@media(max-width:800px){
 .exhibit-heading{align-items:flex-start;flex-direction:column;gap:var(--space-xs)}
 .feature-showcase{grid-template-columns:minmax(0,1fr);gap:var(--space-lg);padding-block:var(--space-xl)}
 .feature-showcase-copy{padding-top:0}
 .feature-showcase-promise{max-width:none;margin-top:var(--space-xs)}
 .feature-showcase-points{display:flex;flex-wrap:wrap;gap:var(--space-xs) var(--space-md);margin-top:var(--space-sm)}
 #feature-commerce .feature-showcase-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:30em}
}
@media(max-width:540px){
 .exhibit-heading h2{font-size:1.625rem}
 .feature-gallery{gap:var(--space-lg) var(--space-sm);overflow-x:auto;scrollbar-width:thin;padding:6px 6px var(--space-sm);margin-inline:-6px;scroll-padding-inline:6px}
 .feature-gallery>.result-card{flex:0 0 calc(var(--media-ratio)*160px);max-width:none}
 .feature-gallery .result-caption strong{font-size:var(--text-xs)}
}
