/*
  Desktop exhibitions-only content.
  Shared page layout comes from collections.css and site_global.css.
*/

@font-face {
  font-family: "Exhibitions Gotham XLight";
  src:
    url("../fonts/Gotham-XLight.woff2") format("woff2"),
    url("../fonts/Gotham-XLight.woff") format("woff"),
    url("../fonts/Gotham-XLight.ttf") format("truetype"),
    url("../fonts/Gotham-XLight.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: "Exhibitions Gotham Light";
  src:
    url("../fonts/Gotham-Light.woff2") format("woff2"),
    url("../fonts/Gotham-Light.woff") format("woff"),
    url("../fonts/Gotham-Light.ttf") format("truetype"),
    url("../fonts/Gotham-Light.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 300;
}

.exhibitions-title-block {
  margin-bottom: 89px;
}

.exhibitions-section {
  margin-top: 0;
}

:root {
  --exhibitions-text-cell-width: 360px;
  --exhibitions-text-column-gap: 36px;
  --exhibitions-text-row-gap: 64px;
  --exhibitions-text-grid-top-gap: 90px;
  --exhibitions-text-motion-duration: 0.3s;
}

.exhibitions-image-line {
  width: var(--exhibitions-viewport-width, 100vw);
  height: 280px;
  margin: 0 0 0 calc((100% - var(--exhibitions-viewport-width, 100vw)) / 2);
  overflow: hidden;
  contain: layout paint;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.exhibitions-image-line.is-dragging {
  cursor: grabbing;
}

.exhibitions-image-track {
  display: flex;
  gap: 4px;
  height: 100%;
  will-change: transform;
}

.exhibitions-image-track img {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  user-select: none;
}

.exhibitions-text-grid {
  --exhibitions-text-column-count: 1;
  position: relative;
  contain: layout;
  display: grid;
  grid-template-columns: repeat(var(--exhibitions-text-column-count), var(--exhibitions-text-cell-width));
  column-gap: var(--exhibitions-text-column-gap);
  row-gap: var(--exhibitions-text-row-gap);
  justify-content: center;
  margin-top: var(--exhibitions-text-grid-top-gap);
}

.exhibitions-text-cell {
  width: var(--exhibitions-text-cell-width);
  max-width: var(--exhibitions-text-cell-width);
  min-width: 0;
  color: #fff;
}

.exhibitions-text-cell__line {
  width: 100%;
  height: 1px;
  margin: 0 0 19px;
  background: #4d4d4d;
}

.exhibitions-text-cell__heading {
  min-height: 26px;
  margin: 0;
  color: #c9a875;
  font-family: "Exhibitions Gotham Light", var(--site-font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 26px;
  letter-spacing: 0;
  text-transform: none;
}

.exhibitions-text-cell__body {
  margin: 0;
  color: #fff;
  font-family: "Exhibitions Gotham Light", var(--site-font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 26px;
  letter-spacing: 0;
  text-transform: none;
}

.exhibitions-text-cell__body p {
  margin: 0;
}

.exhibitions-text-cell__body p + p {
  margin-top: 0;
}

.exhibitions-text-cell__body .style1 {
  color: #c9a875;
  text-transform: none;
}

/* 2*360 + 36 = 756px content width, plus the existing 122px side gutters. */
@media (min-width: 878px) {
  .exhibitions-text-grid {
    --exhibitions-text-column-count: 2;
  }
}

/* 3*360 + 2*36 = 1152px content width, plus the existing 122px side gutters. */
@media (min-width: 1274px) {
  .exhibitions-text-grid {
    --exhibitions-text-column-count: 3;
  }
}

@media (prefers-reduced-motion: reduce) {
  .exhibitions-text-cell {
    transition: none;
    will-change: auto;
  }
}