/* Wireframe labels/placeholders only. Layout is supplied by artist.css. */
.composition { background: #f1f3f5; }
.composition .group { background-color: white; }
.composition .group.exhibit { --art-base: #e1e5e9; background-color: var(--art-base); }
.composition-art { display: grid; place-items: center; background: linear-gradient(#d2d8de, #e1e5e9); color: #425262; }
.composition-media { display: grid; place-items: center; aspect-ratio: 8 / 5; background: #e1e5e9; color: #425262; border: 1px dashed #95a1af; font-size: 16px; }
.composition-header { display: flex; flex-wrap: wrap; gap: 16px 32px; padding: 20px 15px; max-width: 1230px; margin: auto; font-size: 14px; }
.composition-header span { margin-left: auto; color: #596776; }
.composition-label { color: #596776; font: 500 12px/1.5 system-ui, sans-serif; letter-spacing: .03em; }
.composition-gap { padding: 12px 16px; border-left: 3px solid #c18122; background: #fff6e5; color: #65440e; font-size: 14px; }
.composition .exhibit.is-immersive .composition-label { margin: 0; }
/* Screenshot-derived composition exceptions, NOT silently added Artist defaults. */
.composition-tile { --exhibit-card-height: 500px; --exhibit-content-width: 100%; --art-base: #e1e5e9; }
.composition-tile .composition-art { justify-items: end; padding: 24px; }
.composition-stagger > * + * { margin-top: var(--layout-gap); }
.composition-stagger .stack > .card { max-width: 75%; }
.composition-start { margin-right: auto; }
.composition-end { margin-left: auto; }
.composition-feature-panel { margin-top: 40px; }
.composition-mission-photo { --exhibit-height: 1000px; }
.composition-letter { max-width: 620px; color: var(--ink); }
.composition-video { max-width: 960px; margin-inline: auto; }
.composition-lanes > .marquee { width: calc(100% + 2 * max(var(--gutter), (100cqw - var(--content-width)) / 2)); margin-inline: calc(-1 * max(var(--gutter), (100cqw - var(--content-width)) / 2)); }
.composition-lanes .proof-item { background: white; border: 1px solid var(--border-color); }
.composition-lanes .quote { margin-top: 16px; }
.composition-exhibit-action { --exhibit-content-width: 100%; }
.composition-logo-lane { padding-block: 24px; }
.composition-logo-lane .content h2 { font-size: 16px; font-weight: 400; }
.composition-logo-lane .proof-item { flex: none; width: auto; padding: 8px 24px; background: transparent; border: 0; }
.composition-icon { width: 100px; margin-inline: auto; }
@media (max-width: 800px) {
  .composition-stagger .stack > .card { max-width: 100%; }
  .composition-offset > .column[aria-hidden] { display: none; }
}
