/* Scale the exhibition with both viewport dimensions, including large displays. */
.hero-processing {padding:24px;text-align:center;font-size:14px;color:#c9b482;max-width:280px}.hero-processing button{display:block;margin:16px auto;text-decoration:underline}
.exhibit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr) minmax(0, 1fr);
  grid-template-rows: auto auto minmax(450px, 1fr) auto;
  column-gap: clamp(24px, 3vw, 48px);
  padding: 116px max(24px, calc((100% - 1440px) / 2));
  padding-bottom: 0;
  height: auto;
  min-height: 100svh;
  max-height: none;
}
.exhibit-intro, .exhibit-title, .hero-stage, .exhibit-copy,
.exhibit-caption, .hero-models {
  position: relative;
  inset: auto;
  width: auto;
  min-width: 0;
  max-width: none;
}
.exhibit-intro { grid-column: 1 / -1; padding-bottom: 28px; }
.exhibit-title {
  grid-column: 1 / -1;
  margin: 0;
  font-size: clamp(100px, 14vw, 210px);
  line-height: .88;
  letter-spacing: -.025em;
  z-index: 0;
  padding-bottom: 15px;
}
.hero-stage {
  grid-column: 2;
  grid-row: 3;
  height: clamp(450px, 39vw, 580px);
  align-self: end;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.hero-stage > .hero-single {
  display: block;
  position: static;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: translate3d(var(--scene-x, 0px), var(--scene-y, 0px), 0);
  transition: transform .7s cubic-bezier(.2,.75,.25,1);
  animation: hero-reveal .7s ease-out both;
  filter: drop-shadow(0 16px 18px #0006);
}
@keyframes hero-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .hero-stage > .hero-single { transform: none; transition: none; animation: none; }
}
.exhibit-copy { grid-column: 1; grid-row: 3; align-self: center; padding-block: 32px; }
.exhibit-caption { grid-column: 3; grid-row: 3; align-self: center; padding: 26px 0 26px 28px; border-left: 1px solid #cda65a40; }
.exhibit-copy h2 { font-size: clamp(32px, 3vw, 46px); }
.exhibit-caption h2 { font-size: 44px; }
.exhibit-number { font-size: 52px; margin-bottom: 24px; }
.hero-models { grid-column: 1 / -1; margin-top: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hero-models > button { min-width: 0; }
.hero-models > button > span:nth-child(2) { min-width: 0; }
.hero-models strong { overflow-wrap: anywhere; }
.exhibit::after { bottom: 123px; height: 60px; }
@media (min-width: 1101px) {
  .exhibit {
    padding-inline: max(4.5vw, calc((100% - 3200px) / 2));
    padding-top: clamp(125px, 7svh, 170px);
    column-gap: clamp(32px, 3vw, 110px);
    height: max(860px, 100svh);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }
  .exhibit-intro { font-size: clamp(11px, .55vw, 18px); padding-bottom: clamp(22px, 2svh, 44px); }
  .exhibit-title { font-size: clamp(140px, min(14vw, 19svh), 460px); }
  .hero-stage { height: 100%; min-height: 0; align-self: stretch; }
  .exhibit-copy h2 { font-size: clamp(38px, 2.65vw, 94px); }
  .exhibit-caption h2 { font-size: clamp(40px, 2.55vw, 90px); }
  .exhibit-number { font-size: clamp(52px, 3.2vw, 112px); margin-bottom: clamp(24px, 2svh, 44px); }
  .exhibit-copy p { max-width: 29em; font-size: clamp(15px, .9vw, 28px); }
  .exhibit-caption p { font-size: clamp(14px, .85vw, 26px); }
  .exhibit-copy .overline, .exhibit-caption .overline { font-size: clamp(11px, .6vw, 20px); }
  .exhibit-caption { padding-left: clamp(28px, 2vw, 70px); }
  .exhibit-action, .exhibit-detail { font-size: clamp(14px, .8vw, 25px); }
  .hero-models > button { padding: clamp(16px, 1vw, 34px); }
  .hero-models strong { font-size: clamp(26px, 1.45vw, 48px); }
  .hero-models .hero-thumbnail { width: clamp(44px, 3vw, 96px); height: clamp(76px, 5vw, 144px); }
}
/* Wide but short windows must leave enough room for the side copy. */
@media (min-width: 1101px) and (max-height: 900px) {
  .exhibit-copy h2, .exhibit-caption h2 { font-size: clamp(38px, 2.2vw, 52px); }
  .exhibit-copy p, .exhibit-caption p { font-size: 16px; }
  .exhibit-number { font-size: 56px; margin-bottom: 20px; }
}
@media (max-width: 1000px) {
  .exhibit { column-gap: 22px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1fr); }
  .exhibit-caption { padding-left: 18px; }
  .exhibit-caption h2 { font-size: 34px; }
  .exhibit-copy h2 { font-size: 32px; }
}
@media (max-width: 760px) {
  .exhibit {
    padding-top: 105px;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto auto;
    min-height: 0;
    height: auto;
    gap: 0 24px;
  }
  .exhibit-intro { padding-bottom: 22px; font-size: 8px; }
  .exhibit-title { font-size: clamp(74px, 19vw, 140px); padding-bottom: 6px; }
  .hero-stage { grid-column: 1 / -1; grid-row: 3; height: 420px; width: 100%; }
  .exhibit-copy { grid-column: 1; grid-row: 4; padding: 18px 0 26px; align-self: start; }
  .exhibit-copy h2 { font-size: 29px; }
  .exhibit-caption { grid-column: 2; grid-row: 4; padding: 18px 0 26px 18px; align-self: start; }
  .exhibit-caption .overline { display: block; font-size: 9px; }
  .exhibit-caption h2 { font-size: 31px; }
  .exhibit-number { font-size: 29px; margin-bottom: 13px; }
  .exhibit-detail { font-size: 12px; }
  .hero-models { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; }
  .exhibit::after { bottom: 395px; }
}
@media (max-width: 380px) {
  .exhibit { padding-inline: 18px; column-gap: 16px; }
  .hero-stage { height: 360px; }
  .exhibit-copy h2 { font-size: 25px; }
  .exhibit-caption { padding-left: 12px; }
  .exhibit-caption h2 { font-size: 27px; }
  .exhibit-action { font-size: 11px; gap: 8px; }
}
