.archive-intro { padding-bottom: 32px; }
.gef-design .archive-intro h1 { max-width: 24ch; }
.archive-intro .intro-description { margin-bottom: 16px; }
.archive-context { color: var(--cp-text-muted); margin: 0 0 24px; }
.archive-grid, .archive-selection {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.archive-grid { padding: 0 0 64px; }
.archive-grid > li, .archive-selection > li { flex: 0 0 calc((100% - 48px) / 3); min-width: 0; }
.archive-grid figure, .archive-selection figure { margin: 0; }
.archive-grid img, .archive-selection img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: var(--cp-surface-soft);
}
.archive-grid figcaption, .archive-selection figcaption { margin-top: 16px; }
.gef-design .archive-grid h2 { font-size: 1.25rem; line-height: 1.3; margin: 0 0 8px; }
.gef-design .archive-selection h4 { font-size: 1.0625rem; line-height: 1.35; margin: 0 0 8px; }
.archive-grid figcaption p, .archive-selection figcaption p { font-size: 1rem; margin: 0; }
.archive-grid .archive-reference { color: var(--cp-text-muted); margin-top: 12px; }
.archive-grid > li:first-child { flex-basis: 100%; padding-bottom: 32px; margin-bottom: 8px; border-bottom: 1px solid var(--cp-border); }
.archive-grid > li:first-child figure { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: center; gap: 40px; }
.archive-grid > li:first-child figcaption { margin: 0; }
.archive-grid > li:first-child h2 { font-size: 1.75rem; }
.archive-selection { gap: 24px; margin: 24px 0; }
.archive-about { padding: 36px 0; border-top: 1px solid var(--cp-border); }
.gef-design .archive-about h3 { font-size: 1.625rem; margin: 0 0 16px; }
.archive-about > p { font-size: 1rem; }
.archive-provenance { padding: 32px 0 48px; border-top: 1px solid var(--cp-border); }
.archive-provenance h2 { font-size: 1.5rem; }
.archive-provenance p { font-size: 1rem; color: var(--cp-text-muted); }
.archive-viewer-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; }
.archive-viewer-nav p { font-size: 1rem; margin: 0; }
.archive-viewer-nav button { min-width: 96px; }
@media (max-width: 1050px) {
  .archive-grid > li, .archive-selection > li { flex-basis: calc((100% - 24px) / 2); }
  .archive-grid > li:first-child figure { gap: 24px; }
}
@media (max-width: 760px) {
  .archive-grid { gap: 32px; }
  .archive-grid > li, .archive-selection > li { flex-basis: 100%; }
  .archive-grid > li:first-child figure { display: block; }
  .archive-grid > li:first-child figcaption { margin-top: 16px; }
  .archive-grid > li:first-child { padding-bottom: 24px; margin-bottom: 0; }
}
html.a11y-text-xl .archive-grid > li,
html.a11y-spacing .archive-grid > li,
html.a11y-text-xl .archive-selection > li,
html.a11y-spacing .archive-selection > li { flex-basis: 100%; }
html.a11y-text-xl .archive-grid > li:first-child figure,
html.a11y-spacing .archive-grid > li:first-child figure { display: block; }
html.a11y-text-xl .archive-grid > li:first-child figcaption,
html.a11y-spacing .archive-grid > li:first-child figcaption { margin-top: 16px; }