/* ---------------- exhibition ---------------- */
/* Option A: title block on paper, then the image. The image is optional — an exhibition
   with no usable photograph goes title → works and nothing looks broken. */
.ex-head { padding: clamp(1.5rem,4vw,2.6rem) 0 clamp(2rem,5vw,3rem); }
.kicker { font-size: calc(.5rem * var(--s)); letter-spacing:.18em; text-transform:uppercase;
  color: var(--accent); }
.ex-title { font-size: clamp(2.4rem, 6.4vw, 4.6rem); font-weight:300; letter-spacing:-.022em;
  line-height:1.02; margin:.7rem 0 0; text-wrap:balance; }
.ex-meta { font-size: calc(.56rem * var(--s)); letter-spacing:.1em; text-transform:uppercase;
  color: var(--muted); margin-top:1.1rem; line-height:1.7; }

.lead img { width:100%; height:auto; }
.lead-cap { font-size: calc(.49rem * var(--s)); color: var(--muted); margin:.9rem 0 0; line-height:1.5; }

.statement { padding: clamp(3rem,7vw,5rem) 0 0; }
.statement-in { max-width:70ch; margin:0 auto; }
.statement p { font-size: calc(.85rem * var(--s-body)); line-height:1.75; margin:0 0 1.3rem; }
.statement p:first-child { font-size: calc(1rem * var(--s-body)); line-height:1.6; }
.statement p:last-child { margin-bottom:0; }
.statement em { font-style:italic; }
.sig { font-size: calc(.6rem * var(--s)); letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); margin-top:1.8rem; }

.dl { display:inline-block; margin-top:2.4rem; text-decoration:none; font-weight:700;
  font-size: calc(.5rem * var(--s)); letter-spacing:.14em; text-transform:uppercase;
  color: var(--accent); border:1px solid var(--accent); padding:.8rem 1.3rem; }
.dl:hover { background: var(--accent); color: var(--paper); }
/* A page can carry both a catalogue download and a link out to the gallery.
   Two buttons on one line need a gap that survives the line wrapping on a
   phone, so the space comes from the second button, not from the markup. */
.dl + .dl { margin-left: 1rem; }

/* Works — same masonry as the index, so no work is cropped. Captions are Option A:
   the full didactic under every work, always visible. */
.did { margin-top:.9rem; }
.did-t { font-size: calc(1rem * var(--s)); line-height:1.3; font-weight:300; }
.did-y { color: var(--muted); }
.did-m { font-size: calc(.735rem * var(--s-did)); line-height:1.55; color: var(--muted); margin-top:.4rem; }
.did-c { font-size: calc(.62rem * var(--s-did)); color:var(--muted); margin-top:.45rem; letter-spacing:.02em; }
.did-q { font-size: calc(.58rem * var(--s-did)); letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); margin-top:.5rem; font-weight:700; }

.proc figcaption { font-size: calc(.735rem * var(--s-body)); color: var(--muted);
  margin-top:.7rem; line-height:1.55; }
.proc figure { margin:0; }

.colophon { margin-top:clamp(4rem,9vw,6.5rem); }
.colophon dl { display:grid; grid-template-columns:11rem minmax(0,1fr); gap:.7rem 1.6rem;
  margin:0; font-size: calc(.72rem * var(--s-did)); line-height:1.6; }
.colophon dt { color:var(--muted); }
.colophon dd { margin:0; }
@media (max-width:560px) { .colophon dl { grid-template-columns:1fr; gap:.15rem 0; }
  .colophon dd { margin-bottom:.8rem; } }

/* a hole in the content, said out loud rather than filled with something plausible */
.gap { font-size: calc(.76rem * var(--s-did)); line-height:1.7; color:var(--accent);
  border-left:2px solid var(--accent); padding-left:1rem; margin:0 0 2.4rem; max-width:62ch; }
.epigraph { margin:0; font-size: calc(.9rem * var(--s-body)); line-height:1.9;
  color:var(--ink); font-style:italic; }
.epigraph cite { display:block; font-style:normal; font-size:.62em; letter-spacing:.06em;
  color:var(--muted); margin-top:1.2rem; }

/* A work Jude has catalogued but not yet matched to a picture. Occupies the
   same slot an image would, so the grid keeps its rhythm and the missing
   picture reads as an outstanding job rather than a broken page. Added with
   the CMS rebuild, 17 August 2026 — under the old build a work was always
   given some image, whether or not it was the right one. */
.no-img {
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 4 / 5; padding: 1.2rem;
  background: #F4F1EC;
  border: 1px dashed var(--rule);
  text-align: center;
}