/* Only artwork reproductions use the full width and natural proportions.
   Portraits, exhibition photographs and background compositions keep their layouts. */
main :is(.home-work, .catalog-card, .artist-work, .exhibition-artwork,
    .artwork-related-card, .artwork-detail-hero__figure) .media-frame--artwork,
main .collector-first__artwork.media-frame--artwork {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    padding: 0;
    align-self: start;
}
main :is(.home-work, .catalog-card, .artist-work, .exhibition-artwork,
    .artwork-related-card, .artwork-detail-hero__figure, .collector-first__artwork) img {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    padding: 0;
    transform: none;
    animation: none;
}
main .artwork-detail-hero__stage.media-frame--artwork > img {
    width: 100%;
    height: auto;
    max-height: none;
}
main :is(.home-work, .catalog-card, .artist-work, .exhibition-artwork__link,
    .artwork-related-card):is(:hover, :focus-visible) img,
main .artwork-detail-hero__stage:has(.artwork-zoom-button:is(:hover, :focus-visible)) > img {
    transform: none;
}

/* Compact artwork detail on laptop viewports; keep complete reproductions. */
@media (min-width: 992px) {
    .artwork-detail-hero { padding-top: calc(var(--header-height) + 1rem); }
    .artwork-detail-hero__back { margin-bottom: .75rem; }
    /* Size the hero from the page grid, not from the viewport height. */
    .artwork-detail-hero__layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 3.5rem); }
    .artwork-detail-hero__figure { max-width: none; justify-self: stretch; }
    main .artwork-detail-hero__stage.media-frame--artwork > img { height: auto; width: 100%; object-fit: contain; }
    .artwork-detail-hero__intro { max-width: none; padding-block: 1rem; }
    .artwork-detail-hero__intro .page-title { font-size: clamp(2.75rem, 3.8vw, 3.8rem); }
    .artwork-detail-hero__artist { margin-bottom: 1rem; }
    .artwork-detail-hero__intro .lead-copy { max-width: 46ch; margin-top: 1.25rem; font-size: 1rem; }
    .artwork-detail-hero__intro .artwork-facts { margin-top: 1.75rem; }
    .artwork-detail-hero__intro .artwork-facts dd { font-size: 1.3rem; }
    .artwork-detail-hero__intro .artwork-facts__details { gap: 1.25rem 1.5rem; }
    .artwork-detail-hero__actions { margin-top: 1.75rem; }
    .artwork-related__grid { max-width: none; margin-inline: 0; gap: 2rem 1.25rem; }
    .artwork-related-card h3 { font-size: clamp(1.4rem, 1.8vw, 1.8rem); }
}

/* Artwork galleries: natural image heights, compact responsive masonry.
   The regular grid remains a readable fallback when JavaScript is unavailable. */
[data-artwork-masonry] {
    --masonry-columns: 4;
    --masonry-gap: clamp(.75rem, 1vw, 1rem);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--masonry-gap);
    align-items: start;
}
[data-artwork-masonry].is-masonry { display: block; position: relative; }
[data-artwork-masonry].is-masonry > :not([hidden]) {
    position: absolute;
    margin: 0;
}
[data-artwork-masonry] > [hidden] { display: none !important; }
@media (max-width: 1099px) {
    [data-artwork-masonry] { --masonry-columns: 3; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    [data-artwork-masonry] { --masonry-columns: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 479px) {
    [data-artwork-masonry] { --masonry-columns: 1; grid-template-columns: minmax(0, 1fr); }
}

/* Measured blank source margins, scoped to gallery thumbnails only.
   Keep 1% breathing room around the complete work; originals stay untouched. */
/* Sculpture photographs: remove surplus source background, keeping the object and pedestal. */
main [data-artwork-masonry] .media-frame--artwork { position: relative; }

/* Compact captions and a separate action column below the reproduction. */
[data-artwork-masonry] > * { container-type: inline-size; }
main [data-artwork-masonry] .catalog-card { padding-bottom: 0; }
main [data-artwork-masonry] .catalog-card__caption {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    align-items: start; gap: .5rem; padding: .65rem .65rem .75rem;
}
main [data-artwork-masonry] .catalog-card__heading { display: block; padding: 0; }
main [data-artwork-masonry] .catalog-card__heading :is(h2, h3) {
    margin: 0; padding: 0; max-width: none; font-size: clamp(1.125rem, 7cqi, 1.5rem);
    line-height: 1.12; letter-spacing: -.025em; overflow-wrap: anywhere;
}
main [data-artwork-masonry] .catalog-card__meta {
    margin: .35rem 0 0; padding: 0; color: var(--color-muted); font-size: .75rem; line-height: 1.5;
}
.catalog-card__actions { display: flex; flex-direction: column; gap: .35rem; }
main [data-artwork-masonry] .catalog-card__actions :is(.catalog-card__arrow, .gallery-video-button) {
    position: static; width: 36px; height: 36px; flex: 0 0 36px;
}
@media (pointer: coarse) {
    main [data-artwork-masonry] .catalog-card__actions :is(.catalog-card__arrow, .gallery-video-button) {
        width: 44px; height: 44px; flex-basis: 44px;
    }
}

/* The same fine edge around every reproduction, independent of source background. */
main [data-artwork-masonry] .media-frame--artwork::after {
    content: ''; position: absolute; inset: 0; z-index: 1;
    border: 3px solid var(--media-surface); pointer-events: none;
}