/* A sequential walk shares the house's type, colour and outer margins. */
.sa-exhibition-intro { max-width: 62ch; margin-top: 24px; font-size: 16px; line-height: 1.65; }
.sa-exhibition-walk { list-style: none; margin: 0; padding: 0; }
.sa-exhibition-link {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 28px 64px;
  border-top: 1px solid var(--sa-line);
  padding-block: 38px 68px;
}
.sa-exhibition-index { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 28px; }
.sa-exhibition-index > .sa-small { color: var(--sa-accent); }
.sa-exhibition-index h2 { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; letter-spacing: -.035em; }
.sa-exhibition-image { min-width: 0; }
.sa-exhibition-image img { display: block; width: 100%; height: auto; max-height: 640px; object-fit: contain; }
.sa-exhibition-caption { align-self: center; min-width: 0; }
.sa-exhibition-caption h3 { font-size: clamp(22px, 2vw, 26px); line-height: 1.2; letter-spacing: -.035em; overflow-wrap: anywhere; margin-top: 14px; }
.sa-exhibition-note { font-size: 16px; line-height: 1.7; max-width: 48ch; color: var(--sa-muted); margin-top: 22px; }
.sa-exhibition-caption .sa-textlink { margin-top: 18px; }
.sa-exhibition-stop-text .sa-exhibition-index { grid-column: 1; align-self: start; }
.sa-exhibition-stop-text .sa-exhibition-caption { align-self: start; }
.sa-exhibition-archive { border-top: 1px solid var(--sa-line); margin-top: 12px; }
.sa-exhibition-archive > summary { cursor: pointer; padding-block: 26px; font-size: 24px; letter-spacing: -.025em; }
.sa-exhibition-archive > summary:hover { color: var(--sa-accent); }
.sa-exhibition-archive-note { color: var(--sa-muted); font-size: 15px; max-width: 53ch; margin-bottom: 36px; }
.sa-exhibition-archive .sa-gallery-grid { margin-top: 0; }

/* The art room opens with the exhibitions: a title, up to three whole images and one plain sentence. */
.sa-shows { list-style: none; margin: 0; padding: 0; }
.sa-show > a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px 64px; align-items: start; border-top: 1px solid var(--sa-line); padding-block: 36px 52px; }
.sa-show-head { grid-column: 1; display: flex; align-items: baseline; gap: 28px; }
.sa-show-head > .sa-small { color: var(--sa-accent); }
.sa-show-head h2 { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; letter-spacing: -.025em; }
.sa-show-images { grid-column: 2; grid-row: 1 / span 4; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.sa-show-images img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: var(--sa-soft); }
.sa-show-lead { grid-column: 1; color: var(--sa-muted); max-width: 40ch; }
.sa-show > a > .sa-small { grid-column: 1; }
.sa-show > a > .sa-textlink { grid-column: 1; justify-self: start; margin-top: 8px; }
.sa-show > a:is(:hover, :focus-visible) h2 { color: var(--sa-accent); }
.sa-exhibition-others ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 32px; }
.sa-exhibition-others .sa-list-heading { margin-bottom: 18px; }

@media (max-width: 1000px) {
  .sa-exhibition-link { column-gap: 40px; }
}
@media (max-width: 760px) {
  .sa-show > a { grid-template-columns: minmax(0, 1fr); padding-block: 28px 40px; }
  .sa-show-images { grid-column: 1; grid-row: auto; gap: 10px; margin-block: 8px; }
  .sa-exhibition-link { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .sa-exhibition-link { padding-block: 28px 46px; }
  .sa-exhibition-index, .sa-exhibition-stop-text .sa-exhibition-index { grid-column: 1; gap: 20px; }
  .sa-exhibition-caption h3 { margin-top: 10px; }
  .sa-exhibition-note { margin-top: 16px; max-width: 58ch; }
}
