@font-face {
  font-family: "Brillume Beta Headline";
  src: url("../../fonts/BrillumeBeta-Headline.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: block;
}

:root {
  --color-black: #121212;
  /* Difference blending over #e0e0e0 produces the same #121212 ink. */
  --color-inverse-ink: #cecece;
  --color-white: #e0e0e0;
  --color-grey: #c0bdbe;
  --font-main: "Brillume Beta Headline", Arial, Helvetica, sans-serif;
  --font-size-small: 12px;
  --font-size-medium: 24px;
  --font-size-large: 72px;
  --line-height-text: 1.08;
  --first-row-ink-offset: 5.772px;
  --menu-dot-cap-offset: 3.78px;
  --art-badge-dot-y: 3.28px;
  --small-ink-offset: 2.886px;
  --grid-columns: 6;
  --overlay-center-offset: -3dvh;
  --footer-logo-size: clamp(72px, 8vw, 128px);
  --grid-margin: 20px;
  --grid-gutter: 20px;
  --first-row-top: 18.5px;
  --mobile-menu-width: clamp(260px, 42vw, 360px);
  --page-min: 100svh;
  --grid-column-width: calc((100vw - (var(--grid-margin) * 2) - (var(--grid-gutter) * (var(--grid-columns) - 1))) / var(--grid-columns));
  --grid-unit: calc(var(--grid-column-width) + var(--grid-gutter));
  --grid-start-2: calc(var(--grid-margin) + var(--grid-unit));
  --grid-start-3: calc(var(--grid-margin) + 2 * var(--grid-unit));
  --grid-start-4: calc(var(--grid-margin) + 3 * var(--grid-unit));
  --grid-start-6: calc(var(--grid-margin) + 5 * var(--grid-unit));
  --grid-half-width: calc(3 * var(--grid-unit) - var(--grid-gutter));
  color-scheme: light;
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

/* Taps should not select navigation labels or leave Safari's native highlight. */
a, button, [role="button"] {
  -webkit-user-select: none;
  user-select: none;
}
:focus:not(:focus-visible) { outline: none; }

html {
  min-height: 100%;
  background: var(--color-black);
  overscroll-behavior: none;
  scroll-behavior: smooth;
}

html.template-art,
html.template-about,
html.template-exhibitions,
html.template-press,
html.template-default,
html.template-error {
  background: var(--color-white);
}

body {
  min-height: 100%;
  margin: 0;
  background: var(--color-black);
  color: var(--color-white);
  font-family: var(--font-main);
  font-size: var(--font-size-small);
  font-weight: 600;
  line-height: var(--line-height-text);
  overscroll-behavior-y: none;
}

body.template-home {
  overflow: hidden;
}

body.template-about {
  overflow: hidden;
  background: var(--color-white);
}

body.template-exhibitions {
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-black);
}

body.template-press {
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-black);
}

body:is(.template-art, .home-art-active) {
  background: var(--color-white);
  color: var(--color-black);
}

body,
button,
input,
textarea,
select {
  font-family: var(--font-main);
}

a {
  color: inherit;
  text-decoration: none;
}

a[href],
button {
  cursor: pointer;
}

img {
  display: block;
  max-width: 100%;
}

p {
  margin: 0;
}

.site-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gutter);
  padding-inline: var(--grid-margin);
}

.site-header {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 20;
  width: calc(var(--grid-margin) + var(--grid-column-width));
  height: 100svh;
  color: var(--color-white);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
}

.site-nav {
  position: relative;
  display: block;
  height: 100%;
}

.site-menu-toggle {
  display: none;
}

.site-menu-dismiss {
  display: none;
}

.site-nav a,
.site-footer a {
  width: fit-content;
  word-break: break-word;
}

.site-nav a {
  position: absolute;
  left: var(--grid-margin);
  white-space: nowrap;
  word-break: normal;
}

.site-nav__dot {
  position: absolute;
  top: 0;
  left: calc(var(--grid-margin) - 14px);
  width: 8px;
  height: 8px;
  content: "";
  background: currentColor;
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transform: translateY(calc(var(--menu-dot-y, -16px) + var(--menu-dot-cap-offset)));
  transition:
    transform 980ms cubic-bezier(0.55, 0, 0.25, 1),
    opacity 420ms ease;
}

.site-nav.has-active .site-nav__dot,
.site-nav.is-hovering .site-nav__dot {
  opacity: 1;
}

.site-nav [data-menu-item="art"] {
  top: var(--first-row-top);
}

.site-nav [data-menu-item="about"] {
  top: 248px;
}

.site-nav [data-menu-item="exhibitions"] {
  top: 459px;
}

body.template-exhibitions .site-header,
body.template-exhibitions .site-footer,
body.template-press .site-header,
body.template-press .site-footer,
body:is(.template-art, .home-art-active) .site-header,
body:is(.template-art, .home-art-active) .site-footer {
  color: var(--color-black);
}

body.template-exhibitions .site-header.is-on-dark,
body.template-exhibitions .site-footer__copyright.is-on-dark {
  color: var(--color-white);
}

.site-nav [data-menu-item="press"] {
  top: 670px;
}

.site-footer {
  position: fixed;
  inset: 0;
  z-index: 20;
  color: var(--color-white);
  pointer-events: none;
}

.site-footer__copyright {
  position: fixed;
  top: auto;
  bottom: 12px;
  left: var(--grid-margin);
  display: inline-flex;
  align-items: baseline;
  width: auto;
  height: auto;
  overflow: visible;
  border: 0;
  font-size: var(--font-size-large);
  font-kerning: none;
  font-variant-ligatures: none;
  line-height: var(--line-height-text);
  text-decoration: none;
  white-space: nowrap;
  word-break: normal;
  pointer-events: auto;
}

.site-footer__copyright:hover {
  border: 0;
}

.site-footer__copyright:focus-visible {
  outline: 0;
}

.site-footer__copyright-reveal {
  display: inline-block;
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
}.site-footer__copyright.is-home .site-footer__copyright-reveal {
  max-width: 12ch;
}
@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.site-footer__copyright:hover .site-footer__copyright-reveal,
.site-footer__copyright:focus-visible .site-footer__copyright-reveal {
  max-width: 12ch;
}
}

.site-footer__email {
  position: absolute;
  bottom: 20px;
  left: var(--grid-start-4);
  width: 177px;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  word-break: break-word;
  pointer-events: auto;
}

.site-footer__socials {
  position: absolute;
  bottom: 20px;
  left: var(--grid-start-6);
  display: flex;
  gap: 12px;
  align-items: baseline;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  white-space: nowrap;
  word-break: break-word;
  pointer-events: auto;
}

.site-footer__socials > span {
  display: none;
}

body.template-about .site-footer__email,
body.template-about .site-footer__socials,
body.template-exhibitions .site-footer__email,
body.template-exhibitions .site-footer__socials,
body.template-press .site-footer__email,
body.template-press .site-footer__socials,
body:is(.template-art, .home-art-active) .site-footer__email,
body:is(.template-art, .home-art-active) .site-footer__socials {
  color: var(--color-black);
}

.home-hero {
  position: relative;
  min-height: var(--page-min);
  overflow: hidden;
  background: var(--color-black);
  isolation: isolate;
}

.home-hero__image-frame {
  position: absolute;
  top: 0;
  left: 1px;
  width: calc(100% - 1px);
  height: 100%;
  overflow: hidden;
}

.home-hero__image {
  position: absolute;
  top: -40.5%;
  left: -0.08%;
  width: 100.16%;
  height: 200.2%;
  max-width: none;
}

.home-hero__shade {
  position: absolute;
  inset: 0;
  background: rgb(18 18 18 / 18%);
  pointer-events: none;
}

.home-hero__intro {
  position: absolute;
  top: calc(var(--first-row-top) - var(--first-row-ink-offset));
  left: var(--grid-start-4);
  z-index: 10;
  width: var(--grid-half-width);
  height: 83px;
  color: var(--color-white);
  font-size: calc(var(--font-size-medium) * 11 / 12);
  line-height: var(--line-height-text);
  word-break: break-word;
  overflow: hidden;
}

.about-page {
  position: relative;
  min-height: var(--page-min);
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-black);
}

.about-page__image-frame {
  position: absolute;
  top: -1svh;
  left: -1.1875vw;
  width: 50.5vw;
  height: 101svh;
  overflow: hidden;
}

.about-page__image {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.about-page__copy {
  position: absolute;
  top: calc(var(--first-row-top) - var(--first-row-ink-offset));
  left: var(--grid-start-4);
  width: var(--grid-half-width);
  height: calc(100svh - var(--first-row-top) + var(--first-row-ink-offset) - 74px);
  overflow-x: hidden;
  overflow-y: auto;
  color: var(--color-black);
  font-size: var(--font-size-medium);
  line-height: var(--line-height-text);
  scrollbar-width: none;
  word-break: break-word;
}

.about-page__copy::-webkit-scrollbar {
  display: none;
}

.about-page__copy p {
  margin: 0 0 25.92px;
}

.about-page__copy p:last-child {
  margin-bottom: 0;
}

.exhibitions-page {
  position: relative;
  min-height: var(--page-min);
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-black);
}

.exhibitions-page__media {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 5;
  width: calc(50vw - 6px);
  margin: 0;
}

.exhibitions-page__media img {
  width: 100%;
  height: auto;
  max-width: none;
}

.exhibitions-page__content {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 50%;
  z-index: 8;
  overflow-y: auto;
  padding: var(--first-row-top) var(--grid-margin) 112px 10px;
  scrollbar-width: none;
}

.exhibitions-page__content::-webkit-scrollbar {
  display: none;
}

.exhibition-section {
  width: var(--grid-half-width);
}

.exhibition-section + .exhibition-section {
  margin-top: 135.2px;
}

.exhibition-section__title {
  margin: 0 0 30px;
  color: var(--color-black);
  font-size: var(--font-size-small);
  font-weight: 600;
  line-height: var(--line-height-text);
}

.exhibition-card {
  cursor: default;
}

.exhibition-card + .exhibition-card {
  margin-top: 84px;
}

.exhibition-meta,
.exhibition-row {
  display: grid;
  grid-template-columns: var(--grid-column-width) var(--grid-column-width) minmax(0, 1fr);
  column-gap: var(--grid-gutter);
  color: var(--color-black);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  word-break: break-word;
}

.exhibition-meta h2,
.exhibition-meta h3,
.exhibition-row h3 {
  margin: 0;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
}

.exhibition-card__body {
  margin-top: 22px;
  color: var(--color-black);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  word-break: break-word;
}

.exhibition-card__description p {
  margin: 0;
}

.exhibition-link {
  display: inline-block;
  margin-top: 13px;
  color: var(--color-grey);
  transition: color 140ms ease;
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.exhibition-link:hover,
.exhibition-link:focus-visible {
  color: var(--color-black);
}
}

.exhibition-archive {
  display: grid;
  gap: 22px;
}

.exhibition-row {
  cursor: default;
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.exhibition-card:focus-within .exhibition-meta,
.exhibition-row:focus-within {
  color: var(--color-black);
}
}

.press-page {
  position: relative;
  min-height: var(--page-min);
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-black);
}

.press-page__content {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 50%;
  overflow-y: auto;
  padding: calc(var(--first-row-top) + 44px) var(--grid-margin) 112px 10px;
  scrollbar-width: none;
}

.press-page__content::-webkit-scrollbar {
  display: none;
}

.press-filters {
  position: fixed;
  top: var(--first-row-top);
  right: var(--grid-margin);
  left: var(--grid-start-4);
  z-index: 30;
  display: flex;
  gap: 18px;
  align-items: baseline;
  width: auto;
  padding-bottom: 0;
}

.press-filters-shell {
  display: contents;
}

.filter-toggle {
  display: none;
}

/* Use the touch-style disclosure whenever the desktop row reaches Contact. */
body.filters-collapsed .art-filters-shell {
  position: fixed;
  top: var(--first-row-top);
  left: var(--grid-start-4);
  z-index: 1000;
  display: block;
  width: var(--grid-half-width);
  isolation: isolate;
}
body.filters-collapsed .filter-toggle {
  position: fixed;
  top: var(--first-row-top);
  left: var(--grid-start-4);
  z-index: 32;
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-black);
  font: inherit;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  pointer-events: auto;
}
body.filters-collapsed .art-filters {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 19;
  width: 100vw;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: calc(var(--first-row-top) + 38px) var(--grid-margin) 16px var(--grid-start-4);
  background: var(--color-white);
  mix-blend-mode: normal;
  visibility: hidden;
  clip-path: inset(0 0 100% 0);
  pointer-events: none;
  transition: clip-path 720ms cubic-bezier(0.55, 0, 0.25, 1);
}
body.filters-collapsed .art-filters .art-filter { color: var(--color-black); }
body.filters-collapsed .art-filters-shell .art-filters { mix-blend-mode: normal; }
body.filters-collapsed .art-filters-shell:is(.is-filter-open, .is-filter-closing) .art-filters {
  visibility: visible;
}
body.filters-collapsed .art-filters-shell.is-filter-open .art-filters {
  clip-path: inset(0);
  pointer-events: auto;
}
body.filters-collapsed .art-filters-shell:is(.is-filter-open, .is-filter-closing) ~ .art-grid {
  transform: translateY(var(--filter-content-y, 0px));
  transition: transform 720ms cubic-bezier(0.55, 0, 0.25, 1);
}
body.filters-collapsed .art-filters-shell.is-filter-open ~ .art-grid {
  --filter-content-y: var(--filter-content-shift, 0px);
}
body .art-filters.filter-fit-probe {
  position: fixed !important;
  inset: 0 auto auto var(--grid-start-4) !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  gap: 18px !important;
  padding: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important;
}
.filter-fit-probe .art-filter { flex-shrink: 0; white-space: nowrap; }

.press-filter {
  display: inline-flex;
  gap: 1px;
  align-items: baseline;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-black);
  font-size: var(--font-size-small);
  font-weight: 600;
  line-height: var(--line-height-text);
  cursor: pointer;
}

.press-filter sup {
  position: relative;
  top: -.45em;
  font-size: .65em;
  line-height: 1;
  font-feature-settings: normal;
  font-variant-numeric: normal;
}
@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.press-filter:hover span,
.press-filter:focus-visible span {
  text-decoration-line: underline;
  text-decoration-thickness: 1.4px;
  text-underline-offset: 0.08em;
}
}

.press-filter.is-active span {
  text-decoration-line: underline;
  text-decoration-thickness: 1.4px;
  text-underline-offset: 0.08em;
}

.press-list {
  display: grid;
  gap: 22px;
  width: var(--grid-half-width);
  padding-top: 0;
}

.press-row {
  display: grid;
  grid-template-columns: var(--grid-column-width) var(--grid-column-width) minmax(0, 1fr);
  column-gap: var(--grid-gutter);
  color: var(--color-black);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  word-break: break-word;
  cursor: default;
}

a.press-row {
  cursor: pointer;
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.press-row:hover,
.press-row:focus-visible {
  color: var(--color-black);
}
}

.press-row.is-hidden {
  display: none;
}

.press-row__preview {
  display: none;
  width: 112px;
  height: 70px;
  margin: 0;
  overflow: hidden;
}

.press-row__preview img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.press-preview {
  position: fixed;
  top: 214px;
  left: calc(50% + 80px);
  z-index: 30;
  display: none;
  width: 112px;
  height: 70px;
  margin: 0;
  overflow: hidden;
  transform: translateY(var(--small-ink-offset));
  pointer-events: none;
}

.press-preview.is-visible {
  display: block;
}

.press-preview img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.art-page {
  --art-row-gap: 108px;
  position: relative;
  min-height: 100svh;
  padding: 134px var(--grid-margin) 124px;
  background: var(--color-white);
  color: var(--color-black);
}

.art-filters {
  position: fixed;
  top: var(--first-row-top);
  right: var(--grid-margin);
  left: var(
    --art-filters-left,
    calc(
      var(--grid-margin) +
      var(--grid-column-width) +
      var(--grid-gutter) +
      var(--grid-column-width) +
      var(--grid-gutter) +
      var(--grid-column-width) +
      var(--grid-gutter) +
      var(--grid-column-width) +
      var(--grid-gutter)
    )
  );
  z-index: 30;
  display: flex;
  gap: 18px;
  align-items: baseline;
  width: auto;
  margin: 0;
}

.art-filters-shell {
  display: contents;
}

.art-filter {
  display: inline-flex;
  gap: 1px;
  align-items: baseline;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-black);
  font-size: var(--font-size-small);
  font-weight: 600;
  line-height: var(--line-height-text);
  cursor: pointer;
}

.art-filter sup {
  position: relative;
  top: -.45em;
  font-size: .65em;
  line-height: 1;
  font-feature-settings: normal;
  font-variant-numeric: normal;
}
@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.art-filter:hover span,
.art-filter:focus-visible span {
  text-decoration-line: underline;
  text-decoration-thickness: 1.4px;
  text-underline-offset: 0.08em;
}
}

.art-filter.is-active span {
  text-decoration-line: underline;
  text-decoration-thickness: 1.4px;
  text-underline-offset: 0.08em;
}

.art-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  gap: var(--art-row-gap) var(--grid-gutter);
}

.art-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: auto;
  align-self: stretch;
  color: var(--color-black);
  text-decoration: none;
}

.art-tile.is-hidden {
  display: none;
}

.art-tile__badge {
  position: absolute;
  bottom: 8px;
  left: 8px;
  z-index: 2;
  display: inline-flex;
  gap: 6px;
  align-items: flex-start;
  color: var(--color-black);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
}

.art-tile__badge.is-on-dark {
  color: var(--color-white);
}

.art-tile__badge::before {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  content: "";
  background: currentColor;
  border-radius: 50%;
  transform: translateY(var(--art-badge-dot-y));
}

.art-tile__image {
  width: 100%;
  margin: 0;
}

.art-tile__picture {
  position: relative;
  display: block;
  width: 100%;
  line-height: 0;
}

.art-tile__picture img {
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: top left;
}

.art-tile__meta {
  min-width: 0;
  margin-top: auto;
  padding-top: 12px;
  color: var(--color-black);
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  word-break: break-word;
}

.art-tile__line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.art-tile__line span {
  display: inline-block;
  margin-right: 4px;
}

.art-tile__meta p {
  margin: 0;
}

.text-page {
  min-height: var(--page-min);
  padding: 120px var(--grid-margin);
  background: var(--color-white);
  color: var(--color-black);
}

.text-page h1 {
  max-width: 10ch;
  margin: 0 0 32px;
  font-size: var(--font-size-large);
  line-height: 0.9;
}

.text-block {
  max-width: 720px;
  color: var(--color-black);
  font-size: var(--font-size-medium);
}

.text-block p + p {
  margin-top: 1em;
}

body:is(.template-art, .home-art-active)::before,
body.template-press::before {
  position: fixed;
  inset: 0 0 auto;
  z-index: 10;
  height: 67.5px;
  content: "";
  background: rgb(224 224 224 / 24%);
  backdrop-filter: blur(5px) saturate(1.01);
  -webkit-backdrop-filter: blur(5px) saturate(1.01);
  mask-image: linear-gradient(to bottom, #000 68%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 68%, transparent 100%);
  pointer-events: none;
}

body:is(.template-art, .home-art-active).is-filter-layer-open::before,
body.template-press.is-filter-layer-open::before {
  visibility: hidden;
}

@media (min-width: 1101px) {
  body:is(.template-art, .home-art-active) .art-page {
    padding-left: calc(var(--grid-margin) + var(--grid-column-width) + var(--grid-gutter));
  }


}

@media (max-width: 1100px) {
  :root {
    --line-height-text: 1.2;
    --first-row-ink-offset: 7.212px;
    --menu-dot-cap-offset: 4.5px;
    --art-badge-dot-y: 4px;
    --footer-logo-info-gap: 6px;
  }

  .site-footer__copyright {
    bottom: 18px;
  }

  html {
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body {
    max-width: 100%;
  }

  body:not(.template-home) {
    display: flex;
    min-height: 100svh;
    flex-direction: column;
    background: var(--color-white);
    color: var(--color-black);
    overflow: visible;
  }

  body:not(.template-home) main {
    flex: 1 0 auto;
  }

  html.is-menu-open:not(.template-project),
  body.is-menu-open:not(.template-project) {
    overflow: hidden !important;
  }

  .site-header {
    width: 100%;
    z-index: 2000;
    pointer-events: none;
  }

  body:is(.template-art, .home-art-active)::before,
  body.template-press::before {
    content: none;
  }

  body:is(.template-art, .home-art-active) .site-header::before,
  body.template-press .site-header::before {
    position: fixed;
    inset: 0 0 auto;
    z-index: 0;
    height: 67.5px;
    content: "";
    background: rgb(224 224 224 / 24%);
    backdrop-filter: blur(5px) saturate(1.01);
    -webkit-backdrop-filter: blur(5px) saturate(1.01);
    mask-image: linear-gradient(to bottom, #000 68%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #000 68%, transparent 100%);
    pointer-events: none;
  }

  body:is(.template-art, .home-art-active).is-filter-layer-open .site-header::before,
  body.template-press.is-filter-layer-open .site-header::before {
    visibility: hidden;
  }

  .site-menu-toggle {
    position: fixed;
    top: var(--first-row-top);
    left: var(--grid-margin);
    z-index: 32;
    display: block;
    width: fit-content;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-black);
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    pointer-events: auto;
    transition: opacity 180ms ease;
  }

  .site-menu-toggle.is-on-dark {
    color: var(--color-white);
  }

  body:is(.template-art, .home-art-active) .site-menu-toggle,
  body.template-press .site-menu-toggle,
  body:is(.template-art, .home-art-active) .site-menu-toggle.is-on-dark,
  body.template-press .site-menu-toggle.is-on-dark {
    color: var(--color-black);
  }

  .site-menu-dismiss {
    position: fixed;
    inset: 0;
    z-index: 1;
    display: block;
    padding: 0;
    border: 0;
    visibility: hidden;
    background: transparent;
    opacity: 0;
    pointer-events: none;
  }

  .site-nav {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 2;
    width: var(--mobile-menu-width);
    height: 100svh;
    background: var(--color-white);
    color: var(--color-black);
    transform: translateX(-100%);
    transition: transform 720ms cubic-bezier(0.55, 0, 0.25, 1);
    pointer-events: none;
  }

  .site-nav a {
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
  }

  .site-nav__dot {
    visibility: hidden;
  }

  .site-nav [data-menu-item="art"] {
    top: var(--first-row-top);
  }

  .site-nav [data-menu-item="about"] {
    top: 25svh;
  }

  .site-nav [data-menu-item="exhibitions"] {
    top: 50svh;
  }

  .site-nav [data-menu-item="press"] {
    top: 75svh;
  }

  body.is-menu-open .site-menu-toggle {
    opacity: 0;
    pointer-events: none;
  }

  body.is-menu-open .site-menu-dismiss {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  body.is-menu-open .site-nav {
    transform: translateX(0);
    pointer-events: auto;
  }

  body.is-menu-open .site-nav a {
    opacity: 1;
    pointer-events: auto;
  }

  body.is-menu-open .site-nav__dot {
    visibility: visible;
  }

  .home-hero,
  .about-page,
  .exhibitions-page,
  .press-page,
  .press-list,
  .art-grid,
  .art-filters-shell,
  .text-page,
  .site-footer__email,
  .site-footer__socials {
    transition: transform 720ms cubic-bezier(0.55, 0, 0.25, 1);
  }

  .art-grid,
  .press-list {
    transform: translate(var(--menu-content-x, 0px), var(--filter-content-y, 0px));
  }

  .site-footer__copyright {
    left: calc(var(--grid-margin) + var(--footer-logo-menu-x, 0px));
    transform: translateY(var(--footer-logo-dock, 0px));
    transition: left 720ms cubic-bezier(0.55, 0, 0.25, 1);
  }

  body.is-menu-open .home-hero,
  body.is-menu-open .about-page,
  body.is-menu-open .exhibitions-page,
  body.is-menu-open .press-page,
  body.is-menu-open .art-filters-shell,
  body.is-menu-open .text-page,
  body.is-menu-open .site-footer__email,
  body.is-menu-open .site-footer__socials {
    transform: translateX(var(--mobile-menu-width));
    will-change: transform;
  }

  body.is-menu-open .art-grid {
    --menu-content-x: var(--mobile-menu-width);
    will-change: transform;
  }

  body.is-menu-open .site-footer__copyright {
    --footer-logo-menu-x: var(--mobile-menu-width);
    will-change: left;
  }

  main,
  .home-hero,
  .about-page,
  .exhibitions-page,
  .press-page,
  .art-page,
  .text-page {
    width: 100%;
    max-width: 100%;
  }

  body:not(.template-home) .site-footer {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0 12px;
    align-items: baseline;
    flex: 0 0 auto;
    margin-top: auto;
    width: 100%;
    padding: 48px var(--grid-margin) var(--grid-margin);
    background: var(--color-white);
    color: var(--color-black);
    pointer-events: auto;
  }

  body:not(.template-home) .site-footer__email,
  body:not(.template-home) .site-footer__socials {
    position: static;
    width: auto;
    max-width: 100%;
  }

  body:not(.template-home) .site-footer__copyright {
    z-index: 21;
    height: auto;
    overflow: hidden;
    font-size: 48px;
    left: calc(var(--grid-margin) + var(--footer-logo-menu-x, 0px));
    transform: translateY(var(--footer-logo-dock, 0px));
    pointer-events: auto;
  }

  body:not(.template-home) .site-footer__copyright-reveal {
    max-width: 0 !important;
  }

  body:not(.template-home) .site-footer__email {
    grid-column: 1;
    justify-self: start;
    overflow-wrap: anywhere;
    white-space: nowrap;
  }

  body:not(.template-home) .site-footer__socials {
    grid-column: 2;
    display: flex;
    gap: 12px;
    justify-self: end;
    white-space: nowrap;
  }

  body:not(.template-home) .site-footer__socials > span {
    display: none;
  }

  .about-page {
    min-height: 0;
    overflow: visible;
  }

  .home-hero__intro {
    height: auto;
    overflow: visible;
  }

  .about-page__image-frame {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: min(62svh, 620px);
  }

  .about-page__copy {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    padding: 32px var(--grid-margin) 72px;
    overflow: visible;
    font-size: 20px;
  }

  .exhibitions-page {
    min-height: 0;
    overflow: visible;
  }

  .exhibitions-page__media {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: 62svh;
    margin: 0;
    overflow: hidden;
  }

  .exhibitions-page__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
  }

  .exhibitions-page__content {
    position: relative;
    inset: auto;
    overflow: visible;
    padding: 32px var(--grid-margin) 72px;
  }

  .exhibition-section {
    width: 100%;
  }

  .exhibition-section + .exhibition-section {
    margin-top: 96px;
  }

  .exhibition-meta,
  .exhibition-row {
    grid-template-columns: minmax(110px, 0.8fr) minmax(120px, 1fr) minmax(0, 1.5fr);
    column-gap: 16px;
  }

  .press-page {
    min-height: 0;
    overflow: visible;
  }

  .press-page__content {
    position: relative;
    inset: auto;
    overflow: visible;
    padding: 98px var(--grid-margin) 72px;
  }

  .art-filters-shell,
  .press-filters-shell {
    position: fixed;
    top: var(--first-row-top);
    left: 50%;
    z-index: 1000;
    display: block;
    width: calc(50% - var(--grid-margin));
    margin: 0;
    overflow: visible;
    background: transparent;
    isolation: isolate;
  }

  .filter-toggle {
    position: fixed;
    top: var(--first-row-top);
    left: 50%;
    z-index: 2147483647;
    display: block;
    width: fit-content;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-black);
    font-size: var(--font-size-small);
    font-weight: 600;
    line-height: var(--line-height-text);
    isolation: isolate;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    pointer-events: auto;
  }

  body:is(.template-art, .home-art-active) .filter-toggle,
  body.template-press .filter-toggle {
    color: var(--color-black);
  }

  body:is(.template-art, .home-art-active) .art-filters-shell,
  body:is(.template-art, .home-art-active) .filter-toggle {
    left: var(--art-filter-control-left, 50%);
  }

  body:is(.template-art, .home-art-active) .art-filters-shell {
    width: calc(100vw - var(--art-filter-control-left, 50vw) - var(--grid-margin));
  }

  .art-filters,
  .press-filters {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 19;
    display: flex;
    width: 100vw;
    min-width: 140px;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    margin: 0;
    padding: calc(var(--first-row-top) + 38px) var(--grid-margin) 16px 50vw;
    overflow: hidden;
    visibility: hidden;
    background: var(--color-white);
    clip-path: inset(0 0 100% 0);
    pointer-events: none;
    transform: none;
    transition: clip-path 720ms cubic-bezier(0.55, 0, 0.25, 1);
  }

  body:is(.template-art, .home-art-active) .art-filters {
    padding-left: var(--art-filter-control-left, 50vw);
  }

  .art-filters-shell.is-filter-closing .art-filters,
  .press-filters-shell.is-filter-closing .press-filters,
  .art-filters-shell.is-filter-open .art-filters,
  .press-filters-shell.is-filter-open .press-filters {
    visibility: visible;
  }

  .art-filters-shell.is-filter-open .art-filters,
  .press-filters-shell.is-filter-open .press-filters {
    clip-path: inset(0 0 0 0);
    pointer-events: auto;
  }

  .press-list {
    width: 100%;
    margin-top: 0;
  }

  .art-filters-shell.is-filter-open ~ .art-grid,
  .press-filters-shell.is-filter-open ~ .press-page__content .press-list {
    --filter-content-y: var(--filter-content-shift, 0px);
    will-change: transform;
  }

  .press-row {
    grid-template-columns: minmax(110px, 0.8fr) minmax(140px, 1fr) minmax(0, 1.5fr);
    column-gap: 16px;
  }

  .press-preview {
    display: none !important;
  }

  .art-page {
    padding: 98px var(--grid-margin) 72px;
  }


  .art-grid {
    gap: 72px var(--grid-gutter);
    margin-top: 0;
  }

  .art-tile__picture {
    aspect-ratio: auto;
  }

  .art-tile__picture img {
    height: auto;
    object-fit: contain;
    object-position: top left;
  }

  .art-tile__meta {
    min-width: 0;
  }

  .art-tile__meta p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .text-page {
    padding: 72px var(--grid-margin);
  }

  .text-page h1 {
    font-size: 48px;
    line-height: 1.05;
  }

  .text-block {
    max-width: 100%;
    font-size: 20px;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 1100px) and (orientation: portrait) {
  body.template-home .home-hero__intro {
    top: calc(var(--first-row-top) + 38px);
    left: var(--grid-margin);
    width: calc(100vw - (var(--grid-margin) * 2));
    height: auto;
    max-height: calc(100svh - var(--first-row-top) - 168px);
    line-height: 1.08;
    overflow: hidden;
  }

  body.template-home .site-footer__copyright {
    overflow: hidden;
    font-size: 48px;
  }

  body.template-home .site-footer__email {
    bottom: 20px;
    left: var(--grid-margin);
    width: auto;
    max-width: calc(50vw - var(--grid-margin) - 6px);
    overflow-wrap: anywhere;
    white-space: nowrap;
  }

  body.template-home .site-footer__socials {
    right: var(--grid-margin);
    bottom: 20px;
    left: auto;
    width: auto;
    max-width: calc(50vw - var(--grid-margin) - 6px);
    white-space: nowrap;
  }

  body.template-home .site-footer__socials > span {
    display: none;
  }
}

@media (max-width: 700px) {
  body.template-home .site-footer__copyright {
    font-size: 36px;
  }

  body.template-home .site-footer__email,
  body.template-home .site-footer__socials {
    font-size: clamp(10px, 2.8vw, var(--font-size-small));
  }

  body:not(.template-home) .site-footer {
    gap: 0 8px;
    padding: 40px var(--grid-margin) var(--grid-margin);
  }

  body:not(.template-home) .site-footer__copyright {
    font-size: 36px;
    left: calc(var(--grid-margin) + var(--footer-logo-menu-x, 0px));
  }

  body:not(.template-home) .site-footer__email,
  body:not(.template-home) .site-footer__socials {
    font-size: clamp(10px, 2.8vw, var(--font-size-small));
  }

  .about-page__image-frame {
    height: 52svh;
  }

  .about-page__copy {
    padding: 24px var(--grid-margin) 64px;
    font-size: 18px;
  }

  .exhibitions-page__media {
    margin-top: 0;
    height: 52svh;
  }

  .exhibitions-page__media img {
    max-height: none;
  }

  .exhibitions-page__content {
    padding: 24px var(--grid-margin) 64px;
  }

  .exhibition-section + .exhibition-section {
    margin-top: 72px;
  }

  .exhibition-card + .exhibition-card {
    margin-top: 56px;
  }

  .exhibition-meta,
  .exhibition-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 4px 12px;
  }

  .exhibition-meta > :nth-child(2),
  .exhibition-row > :nth-child(2) {
    text-align: right;
  }

  .exhibition-meta > :nth-child(3),
  .exhibition-row > :nth-child(3) {
    grid-column: 1 / -1;
  }

  .press-page__content {
    padding: 90px var(--grid-margin) 64px;
  }

  .press-filters {
    gap: 8px 12px;
  }

  .press-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 4px 12px;
  }

  .press-row > :nth-child(2) {
    text-align: right;
  }

  .press-row > :nth-child(3) {
    grid-column: 1 / -1;
  }

  .art-page {
    padding: 90px var(--grid-margin) 64px;
  }

  .art-filters {
    gap: 8px 12px;
  }

  .art-grid {
    gap: 48px var(--grid-gutter);
  }

  .text-page {
    padding: 72px var(--grid-margin) 64px;
  }

  .text-page h1 {
    font-size: 36px;
  }

  .text-block {
    font-size: 18px;
  }
}

@media (max-width: 1100px) {
  body.template-press .press-list {
    gap: 48px;
  }

  body.template-press .press-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    align-items: start;
  }

  body.template-press .press-row__preview {
    display: block;
    grid-column: 3 / -1;
    width: 112px;
    height: 70px;
    margin-bottom: 10px;
  }

  body.template-press .press-row__category {
    grid-column: 1;
    grid-row: 2;
    margin-top: 0;
    padding-right: 16px;
    text-align: left;
  }

  body.template-press .press-row__source {
    grid-column: 2 / 3;
    grid-row: 2;
    margin-top: 0;
    padding-right: 16px;
    text-align: left;
  }

  body.template-press .press-row__title {
    grid-column: 3 / -1;
    grid-row: 2;
    overflow-wrap: anywhere;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero,
  .about-page,
  .exhibitions-page,
  .press-page,
  .press-list,
  .art-grid,
  .art-filters-shell,
  .text-page,
  .site-footer__copyright,
  .site-footer__email,
  .site-footer__socials {
    transition-duration: 0ms;
  }
}

/* Project detail: orientation, rather than device width, defines the reading direction. */
@font-face {
  font-family: "Ugly Dave";
  src: url("../../fonts/UglyDaveAlternates.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
html.template-project,
body.template-project {
  background: var(--color-white);
  color: var(--color-black);
}
body.template-project { overflow: hidden; }
.project-page {
  --project-edge: 20px;
  --project-room: calc(100dvh - 36px);
  /* Preserve the approved media composition independently of the site's six-column text grid. */
  --project-unit: calc(var(--project-room) * 198 / 964);
  --project-gutter: calc(var(--project-room) * 20 / 964);
  --project-column: calc(var(--project-unit) - var(--project-gutter));
}
.project-title {
  position: absolute;
  z-index: 3;
  top: 0;
  left: max(var(--project-edge), env(safe-area-inset-left));
  max-width: calc(100% - 120px);
  margin: 0;
  font-size: clamp(32px, 7.2vh, 72px);
  font-weight: 600;
  line-height: 1.08;
  pointer-events: auto;
}
.project-gallery {
  position: relative;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: var(--project-column);
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  column-gap: var(--project-gutter);
  width: 100%;
  height: 100vh;
  height: 100dvh;
  padding: max(16px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  scrollbar-color: #c0bdbe transparent;
  scroll-padding: 20px;
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.project-gallery:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
}
.project-item {
  --media-scale: 1;
  --media-columns: 4;
  --after-columns: 0;
  --caption-columns: 0;
  --media-slot: calc(var(--project-unit) * var(--media-columns) - var(--project-gutter));
  /* Narrower originals fit the same preset height as the reference 4:5 media. */
  --media-width: min(var(--media-slot), calc(var(--media-slot) / 0.8 * var(--media-ratio)));
  --media-height: calc(var(--media-width) / var(--media-ratio));
  --caption-width: clamp(180px, calc(var(--project-unit) * 2 - var(--project-gutter) - 2px), 374px);
  --caption-slot: calc(var(--project-unit) * var(--caption-columns) - var(--project-gutter));
  position: relative;
  display: flex;
  align-items: flex-end;
  grid-column: span calc(var(--media-columns) + var(--after-columns) + var(--caption-columns));
  min-width: 0;
  gap: var(--project-gutter);
  margin: 0;
}
.project-item--small { --media-columns: 2; --after-columns: 1; }
.project-item--medium { --media-columns: 3; --after-columns: 1; }
.project-item--large { --media-width: min(calc(var(--media-slot) - var(--project-room) / 964), calc((var(--media-slot) - var(--project-room) / 964) / 0.8 * var(--media-ratio))); }
.project-item--wide { --media-columns: 5; --media-width: var(--media-slot); }
.project-item--tall {
  /* Match the existing large 4:5 photographs, regardless of this media's ratio. */
  --media-height: calc((4 * var(--project-unit) - var(--project-gutter) - var(--project-room) / 964) / 0.8);
  --media-width: calc(var(--media-height) * var(--media-ratio));
}
.project-item--custom {
  --media-height: min(calc(var(--project-room) * var(--media-scale)), calc(90vw / var(--media-ratio)));
  --media-width: calc(var(--media-height) * var(--media-ratio));

}
.project-item--center { align-items: center; }
.project-item--top { align-items: flex-start; }
.project-media {
  position: relative;
  flex: 0 0 auto;
  width: var(--media-width);
  height: var(--media-height);
  transform: translateY(var(--media-offset, 0px));
}
.project-media img,
.project-media video {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}
.project-caption {
  position: absolute;
  bottom: calc(var(--media-height) + 15px - var(--media-offset, 0px));
  left: 0;
  width: min(var(--caption-width), var(--media-width));
  color: var(--color-black);
  font-family: "Ugly Dave", cursive;
  font-size: 20px;
  font-weight: 400;
  line-height: calc(22px * 5 / 6);
  overflow-wrap: anywhere;
}
.project-item--center .project-caption { bottom: calc(50% + var(--media-height) / 2 + 15px - var(--media-offset, 0px)); }
.project-item.is-caption-side { --caption-columns: var(--readable-caption-columns, 3); }
.project-item.is-caption-side .project-caption {
  order: -1;
  position: relative;
  inset: auto;
  align-self: auto;
  flex: 0 0 var(--caption-slot);
  width: var(--caption-slot);
  padding-left: calc(var(--caption-slot) - var(--caption-width));
  padding-right: 0;
  margin-bottom: calc(var(--media-height) / 2);
  transform: translateY(calc(50% + var(--media-offset, 0px) + var(--caption-offset, 0px)));
}
.project-item--center.is-caption-side .project-caption { margin-bottom: 0; transform: translateY(calc(var(--media-offset, 0px) + var(--caption-offset, 0px))); }
@media (min-aspect-ratio: 1/1) {
  .project-item--top.is-caption-side .project-caption {
    margin-bottom: 0;
    margin-top: calc(var(--media-height) / 2);
    transform: translateY(calc(-50% + var(--media-offset, 0px) + var(--caption-offset, 0px)));
  }
}
.project-video-pending {
  position: absolute;
  bottom: 12px;
  left: 12px;
  padding: 6px 8px;
  background: var(--color-white);
  font-size: 12px;
}
body.template-project .site-footer {
  position: fixed;
  inset: 0;
  display: block;
  padding: 0;
  margin: 0;
  background: transparent;
  color: var(--color-black);
  pointer-events: none;
}
body.template-project .site-footer__copyright {
  position: fixed;
  left: max(20px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom));
  font-size: clamp(32px, 7.2vh, 72px);
  transform: none;
}
body.template-project .site-footer__email { position: absolute; left: var(--grid-start-4); bottom: 20px; }
body.template-project .site-footer__socials { position: absolute; left: var(--grid-start-6); right: var(--grid-margin); bottom: 20px; flex-wrap: wrap; gap: 4px 12px; }

/* Blend the transparent overlay as a whole with the actual photo/video below.
   Applying this only to links would trap blending inside the footer's stacking context. */
@supports (mix-blend-mode: difference) {
  @media (min-aspect-ratio: 1/1) {
    body.template-project .site-footer,
    .project-title {
      color: var(--color-inverse-ink);
      mix-blend-mode: difference;
    }
  }
}

@media (max-height: 500px) and (min-aspect-ratio: 1/1) {
  .project-caption { font-size: 17px; line-height: calc(19px * 5 / 6); }
  .project-gallery { padding-bottom: 44px; }
  .project-page { --project-room: calc(100dvh - 60px); }
}
@media (aspect-ratio < 1/1) {
  body.template-project { overflow: visible; }
  .project-title {
    position: relative;
    top: auto;
    left: auto;
    max-width: calc(100% - 64px);
    margin: 0 64px 8px 0;
    font-size: clamp(36px, 6vw, 72px);
  }
  .project-gallery {
    display: flex;
    flex-direction: column;
    gap: clamp(48px, 8vw, 100px);
    height: auto;
    padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 40px max(20px, env(safe-area-inset-left));
    overflow: visible;
  }
  .project-item,
  .project-item.is-caption-side {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  .project-media { width: 100%; height: auto; aspect-ratio: var(--media-ratio); transform: none; }
  .project-gallery::after { display: none; }
  .project-caption,
  .project-item--center .project-caption,
  .project-item.is-caption-side .project-caption {
    position: static;
    flex: none;
    width: min(100%, 374px);
    font-size: 18px;
    line-height: calc(1.1 * 5 / 6);
    padding: 0;
    margin: 0;
    transform: none;
  }
  body.template-project .site-footer {
    position: relative;
    inset: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px 16px;
    padding: 24px 20px max(20px, env(safe-area-inset-bottom));
  }
  body.template-project .site-footer__copyright { position: static; flex-basis: 100%; font-size: 48px; }
  body.template-project .site-footer__email,
  body.template-project .site-footer__socials { position: static; width: auto; font-size: 12px; }
}

/* Editorial controls from the project's Kirby Panel. */
@media (min-aspect-ratio: 1/1) {
  .project-item[data-spacing="tight"] { --after-columns: 0; }
  .project-item[data-spacing="regular"] { --after-columns: 1; }
  .project-item[data-spacing="wide"] { --after-columns: 2; }
  .project-item[data-spacing="airy"] { --after-columns: 3; }
  .project-item:last-child { --after-columns: 0; }
  .project-item:last-child.is-caption-side {
    --caption-width: clamp(120px, calc((100vw - var(--media-width)) / 2 - 2 * var(--grid-margin)), 374px);
  }
}
@media (aspect-ratio < 1/1) {
  .project-item[data-portrait-spacing="wide"] { margin-bottom: clamp(24px, 5vw, 80px); }
  .project-item[data-portrait-spacing="airy"] { margin-bottom: clamp(48px, 10vw, 160px); }
}
@media (aspect-ratio < 1/1) {
  .project-item[data-portrait-width="centered"] { width: 80%; }
  .project-item[data-portrait-width="medium"] { width: 75%; }
  .project-item[data-portrait-width="small"] { width: 60%; }
  .project-item[data-portrait-align="center"] { align-self: center; }
  .project-item[data-portrait-align="left"] { align-self: flex-start; }
  .project-item[data-portrait-align="right"] { align-self: flex-end; }
}

@media (max-width: 600px) and (min-aspect-ratio: 1/1) {
  .project-page { --project-room: calc(100dvh - 104px); }
  .project-gallery { padding-bottom: 88px; }
  body.template-project .site-footer__email { left: 20px; bottom: 56px; }
  body.template-project .site-footer__socials { left: auto; right: 20px; bottom: 20px; }
}

/* Preserve title interstitials without translating the lettering. */
.project-intro {
  position: fixed;
  inset: 0;
  z-index: 4000;
  background: var(--color-white);
  pointer-events: none;
  opacity: 1;
  transition: opacity 1000ms cubic-bezier(.25,.1,.25,1);
  animation: entry-surface-in 400ms ease both, project-intro-fallback 1000ms cubic-bezier(.25,.1,.25,1) 5.6s forwards;
}
/* Internal navigation already fades the outgoing page into this opaque surface. */
.internal-page-entry .project-intro {
  animation: project-intro-fallback 1000ms cubic-bezier(.25,.1,.25,1) 5.6s forwards;
}
.project-intro__title {
  position: absolute;
  top: calc(50% + var(--overlay-center-offset));
  left: 50%;
  transform: translate(-50%, -50%);
  width: max-content;
  max-width: calc(100vw - 40px);
  overflow: visible;
  /* Keep font overshoots inside the mask without moving the text baseline. */
  clip-path: inset(var(--title-mask-top, -0.25em) -0.1em var(--title-mask-bottom, -0.35em) -0.1em);
  font-size: clamp(32px, 7.2vh, 72px);
  font-weight: 600;
  line-height: 1.08;
  text-align: center;
}
.project-intro__title > span {
  display: block;
  opacity: 0;
  transition: opacity 300ms ease;
}
body.project-title-is-visible .project-intro__title > span {
  opacity: 1;
}
body.project-intro-is-exiting .project-intro__title > span {
  opacity: 0;
  transition-duration: 600ms;
}
body.project-backdrop-is-revealing .project-intro__title > span {
  animation: none;
  opacity: 0;
  transition: none;
}
body.template-project .project-title {
  position: fixed;
  z-index: 40;
  top: max(20px, env(safe-area-inset-top));
  left: max(20px, env(safe-area-inset-left));
  width: max-content;
  max-width: calc(100vw - 40px);
  margin: 0;
  text-align: left;
  overflow-wrap: anywhere;
  overflow: visible;
  /* Keep font overshoots inside the mask without moving the text baseline. */
  clip-path: inset(var(--title-mask-top, -0.25em) -0.1em var(--title-mask-bottom, -0.35em) -0.1em);
  font-size: var(--font-size-medium);
  pointer-events: none;
  transition: font-size 600ms cubic-bezier(0.22, 1, 0.36, 1);
}
.project-title > span {
  display: block;
}
@media (aspect-ratio < 1/1) {
  .project-intro__title { font-size: clamp(36px, 6vw, 72px); }
  body.template-project .project-title {
    top: max(20px, env(safe-area-inset-top));
    font-size: var(--font-size-medium);
  }
  .project-gallery {
    padding-top: calc(max(20px, env(safe-area-inset-top)) + clamp(36px, 6vw, 72px) * 1.08 + 56px);
  }
}
@supports (mix-blend-mode: difference) {
  body.template-project .project-title { color: var(--color-inverse-ink); mix-blend-mode: difference; }
}
body.project-backdrop-is-revealing .project-intro { animation: none; opacity: 0; }
body.project-has-scrolled .project-title { font-size: var(--font-size-small); }
@keyframes entry-surface-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes project-intro-fallback { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) {
  .project-intro { transition-duration: 0ms; animation-duration: 0ms; }
  body.template-project .project-title { transition-duration: 0ms; }
  .project-intro__title > span,
  .project-title > span { transition-duration: 0ms; }
}

/* The document carries the horizontal gallery into the vertical project notes. */
body.template-project { overflow: visible; }
@media (min-aspect-ratio: 1/1) {
  .project-page.is-scroll-track { height: calc(100dvh + var(--gallery-travel, 0px)); }
  .project-page.is-scroll-track .project-gallery { position: sticky; top: 0; }
}
.project-info {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  grid-template-rows: auto 1fr;
  column-gap: var(--grid-gutter);
  min-height: 100svh;
  padding: max(100px, 10.6svh) var(--grid-margin) 130px;
  background: var(--color-white);
  color: var(--color-black);
}
.project-info__inquiry { grid-column: 1; }
.project-info__inquire { display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-small); }
.project-info__inquire::before { content: none; }
.project-info__inquiry img { display: block; width: 100%; height: auto; margin-top: 19px; }
.project-info__about { grid-column: 3 / -1; }
.project-info__about h2 { margin: 0 0 13px; font-size: var(--font-size-small); line-height: var(--line-height-text); font-weight: 600; }
.project-info__text { font-size: var(--font-size-medium); line-height: var(--line-height-text); }
.project-info__text p { margin: 0 0 1em; }
.project-related { grid-column: 3 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gutter); align-self: end; margin-top: 200px; }
.project-related__link { position: relative; display: flex; align-items: baseline; gap: 6px; width: fit-content; max-width: 100%; font-size: var(--font-size-small); line-height: var(--line-height-text); text-decoration: none; }
.project-related__number { flex-shrink: 0; }
.project-related__title { display: block; text-transform: uppercase; }
.project-related__subtitle { display: block; }
.project-related__preview { position: absolute; left: 0; bottom: calc(100% + 14px); width: 113px; max-width: none; height: auto; max-height: none; object-fit: contain; object-position: left bottom; visibility: hidden; pointer-events: none; }@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.project-related__link:hover .project-related__preview,
.project-related__link:focus-visible .project-related__preview { visibility: visible; }
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.project-related__link:focus-visible { outline: 1px solid currentColor; outline-offset: 5px; }
}
@media (aspect-ratio < 1/1) {
  .project-info { min-height: 85svh; padding-bottom: 64px; }
  .project-info__inquiry { grid-column: 1 / 3; }
  .project-info__about { grid-column: 4 / -1; }
  .project-related { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .project-info { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 40px; }
  .project-info__inquiry { grid-column: 1 / 3; max-width: 178px; }
  .project-info__about { grid-column: 1 / -1; }
  .project-related { grid-template-columns: 1fr; gap: 180px; margin-top: 160px; }
}
@media (hover: none) {
  .project-related__preview { visibility: visible; }
}


/* Shared six-column geometry on every page; responsive items span columns. */
.site-footer__socials { right: var(--grid-margin); flex-wrap: wrap; gap: 4px 12px; }
.art-tile { grid-column: span 2; }
@media (min-width: 1101px) {
  .about-page__image-frame { left: 0; width: calc(var(--grid-start-4) - var(--grid-gutter)); }
  .exhibitions-page__media { width: calc(var(--grid-start-4) - var(--grid-gutter)); }
  .exhibitions-page__content,
  .press-page__content { left: var(--grid-start-4); padding-left: 0; }
  body:is(.template-art, .home-art-active) .art-page { padding-left: var(--grid-margin); }
  .art-grid { grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); }
  .art-tile { grid-column: span 1; }
  .text-page { padding-left: var(--grid-start-2); }
  .text-block { max-width: calc(4 * var(--grid-unit) - var(--grid-gutter)); }
}
@media (max-width: 1100px) {
  .exhibition-meta,
  .exhibition-row { grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); column-gap: var(--grid-gutter); }
  .exhibition-meta > :nth-child(1),
  .exhibition-row > :nth-child(1) { grid-column: span 2; }
  .exhibition-meta > :nth-child(2),
  .exhibition-row > :nth-child(2) { grid-column: span 2; text-align: left; }
  .exhibition-meta > :nth-child(3),
  .exhibition-row > :nth-child(3) { grid-column: span 2; }
  body.template-press .press-row { grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); column-gap: var(--grid-gutter); }
  body.template-press .press-row__preview,
  body.template-press .press-row__title { grid-column: 4 / -1; }
  body.template-press .press-row__category { grid-column: 1 / 2; padding-right: 0; }
  body.template-press .press-row__source { grid-column: 2 / 4; padding-right: 0; }
  .art-filters-shell,
  .press-filters-shell,
  .filter-toggle,
  body:is(.template-art, .home-art-active) .art-filters-shell,
  body:is(.template-art, .home-art-active) .filter-toggle { left: var(--grid-start-4); }
  .art-filters-shell,
  .press-filters-shell,
  body:is(.template-art, .home-art-active) .art-filters-shell { width: var(--grid-half-width); }
  .art-filters,
  .press-filters,
  body:is(.template-art, .home-art-active) .art-filters { padding-left: var(--grid-start-4); }
  body:not(.template-home):not(.template-project) .site-footer { display: grid; grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); column-gap: var(--grid-gutter); }
  body:not(.template-home):not(.template-project) .site-footer__email { grid-column: 1 / 4; }
  body:not(.template-home):not(.template-project) .site-footer__socials { grid-column: 4 / -1; justify-self: start; }
}
@media (max-width: 700px) {
  .art-tile { grid-column: span 3; }
  .exhibition-meta > :nth-child(1),
  .exhibition-row > :nth-child(1),
  .exhibition-meta > :nth-child(2),
  .exhibition-row > :nth-child(2) { grid-column: span 3; }
  .exhibition-meta > :nth-child(3),
  .exhibition-row > :nth-child(3) { grid-column: 1 / -1; }
}
@media (max-width: 359px) {
  .art-tile { grid-column: 1 / -1; }
}
@media (max-width: 1100px) and (aspect-ratio < 1/1) {
  body.template-project .site-footer { display: grid; grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); column-gap: var(--grid-gutter); }
  body.template-project .site-footer__copyright { grid-column: 1 / -1; }
  body.template-project .site-footer__email { grid-column: 1 / 4; }
  body.template-project .site-footer__socials { grid-column: 4 / -1; justify-self: start; }
  body.template-home .site-footer__socials { left: var(--grid-start-4); max-width: var(--grid-half-width); }
}

@media (min-aspect-ratio: 1/1) and (min-width: 601px) {
  .project-info__about { grid-column: 2 / -1; }
  .project-related { grid-column: 2 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .project-related__link:nth-child(1) { grid-column: 1 / 3; }
  .project-related__link:nth-child(2) { grid-column: 3 / 5; }
  .project-related__link:nth-child(3) { grid-column: 5; }
}
@media (max-width: 600px) {
  .project-info { grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); }
  .project-info__inquiry { grid-column: 1 / 4; }
}


/* Full-screen navigation, shared by desktop and mobile. */
body .site-header {
  width: 100%;
  height: 0;
  z-index: 3000;
  pointer-events: none;
}
body .site-menu-toggle {
  position: fixed;
  top: var(--first-row-top);
  left: var(--grid-margin);
  z-index: 32;
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: var(--font-size-small);
  font-weight: 600;
  line-height: var(--line-height-text);
  pointer-events: auto;
}
body.template-home .site-menu-toggle {
  font-size: var(--font-size-small);
  color: var(--color-white);
}

/* Project navigation and heading share the same anchors as Art and its filters. */
body.template-project .site-header {
  color: var(--color-black);
  opacity: 0;
  visibility: hidden;
  transition: none;
}
body.template-inquire .site-header { color: var(--color-white); }
body.template-project.project-backdrop-is-revealing .site-header {
  opacity: 1;
  visibility: visible;
}
@media (prefers-reduced-motion: reduce) {
  body.template-project .site-header { transition: none; }
}
body.template-project .site-menu-toggle {
  left: var(--project-menu-left, var(--grid-start-4));
  right: auto;
}
body.template-project .project-title {
  top: var(--first-row-top);
  left: var(--grid-start-4);
  max-width: calc(var(--grid-half-width) - 80px);
}
.project-header__inquire {
  position: fixed;
  top: var(--first-row-top);
  right: var(--grid-margin);
  pointer-events: auto;
}
body.is-menu-open .project-header__inquire { visibility: hidden; }

body .site-nav {
  position: fixed;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 6vw, 112px);
  width: 100%;
  height: 100dvh;
  padding: 64px var(--grid-margin);
  overflow-y: auto;
  background: rgb(224 224 224 / 0%);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  color: var(--color-black);
  visibility: hidden;
  clip-path: none;
  transform: none;
  transition: backdrop-filter 300ms ease 80ms, -webkit-backdrop-filter 300ms ease 80ms, background 300ms ease 80ms, visibility 0s linear 380ms;
  pointer-events: none;
}
body .site-nav a {
  position: static;
  display: block;
  font-size: min(var(--font-size-large), 5.5vw);
  line-height: 1.08;
  transform: translateY(var(--overlay-center-offset));
  opacity: 1;
  transition: none;
}body .site-nav a,
body .site-nav a[aria-current="page"] { text-decoration: none; }
@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
body .site-nav a:hover { text-decoration: none; }
}
@media (hover: hover) and (pointer: fine) {@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
body.is-menu-open .site-nav:has(a:hover) a:not(:hover) {
    opacity: 0.18;
  }
}
}
body .site-nav__dot,
body .site-menu-dismiss { display: none; }
html.is-menu-open:not(.template-project),
body.is-menu-open:not(.template-project) { overflow: hidden !important; }
/* Keep the project's sticky scroll container unchanged behind the menu. */
body.template-project.is-menu-open .site-menu-toggle {
  left: var(--grid-margin);
  right: auto;
  opacity: 1 !important;
}
body .site-nav { overscroll-behavior: contain; }
body.is-menu-open .site-nav {
  visibility: visible;
  background: rgb(224 224 224 / 5%);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  pointer-events: auto;
}
body .site-nav a {
  visibility: hidden;
  transition: visibility 0s;
}
body.is-menu-open .site-nav {
  transition-delay: 0s;
}
body.is-menu-open .site-nav a {
  visibility: visible;
  transition: visibility 0s linear 300ms;
}
body.template-home .site-nav { color: var(--color-white); }
body.is-menu-open .site-menu-toggle,
body.template-home.is-menu-open .site-menu-toggle {
  color: var(--color-black);
  opacity: 1;
  pointer-events: auto;
}
body.template-home.is-menu-open .site-menu-toggle { color: var(--color-white); }
/* An empty homepage has a light backdrop, so its open menu uses dark ink. */
body.template-home:not(:has(.home-hero__image, .home-hero__video)) .site-nav,
body.template-home:not(:has(.home-hero__image, .home-hero__video)).is-menu-open .site-menu-toggle {
  color: var(--color-black);
}
body.is-menu-open .filter-toggle { visibility: hidden; }
body.is-menu-open .home-hero,
body.is-menu-open .about-page,
body.is-menu-open .exhibitions-page,
body.is-menu-open .press-page,
body.is-menu-open .art-filters-shell,
body.is-menu-open .text-page,
body.is-menu-open .site-footer__email,
body.is-menu-open .site-footer__socials { transform: none; }
body.is-menu-open .art-grid { --menu-content-x: 0px; }
body.is-menu-open .site-footer__copyright { --footer-logo-menu-x: 0px; }
@media (aspect-ratio < 1/1) {
  body .site-nav {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    gap: 16px clamp(24px, 6vw, 56px);
    text-align: center;
  }
  body .site-nav a { font-size: clamp(32px, 10vw, 72px); }
}
@media (prefers-reduced-motion: reduce) {
  body .site-nav { transition: none; }
  body.is-menu-open .site-nav a { transition: none; }
}

.home-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Full-bleed homepage signature: SVG baseline y=46.32, viewBox bottom=47.04.
   The 0.72-unit optical overshoot falls below the viewport, including G. */
body.template-home .site-footer--home-logo {
  position: fixed;
  inset: auto 0 calc(-100vw * 0.72 / 238.85);
  display: block;
  width: auto;
  height: auto;
  padding: 0;
  color: var(--color-white);
}
body .site-footer .home-footer-logo {
  display: block;
  width: 100%;
  pointer-events: auto;
}
.home-footer-logo img {
  display: block;
  width: 100%;
  height: auto;
}


/* Four stationary quadrants blink, resolve into the complete mark, then fade out. */
.home-entry-screen { display: none; }
.home-entry .home-entry-screen {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: grid;
  place-items: center;
  background: var(--color-black);
  transition: opacity 1.5s 1s;
}
.home-entry-symbol {
  position: relative;
  width: 120px;
  aspect-ratio: 1;
  color: var(--color-white);
}
.home-entry .home-entry-symbol { transition: opacity 1s .3s; }
.home-entry-symbol__quarter {
  position: absolute;
  inset: 0;
  background: currentColor;
  mask: url('../img/trinity-grey-symbol.svg') center / contain no-repeat;
  -webkit-mask: url('../img/trinity-grey-symbol.svg') center / contain no-repeat;
  opacity: 0;
}
.home-entry .home-entry-symbol__quarter {
  animation: home-entry-quadrant-blink var(--blink-period, 2s) steps(1, end) var(--blink-delay) infinite paused;
}
.home-entry-screen.animation-start .home-entry-symbol__quarter { animation-play-state: running; }
.home-entry-screen.show .home-entry-symbol__quarter { animation-play-state: paused; opacity: 1 !important; }
.home-entry-screen.finished { opacity: 0; pointer-events: none; }
.home-entry-screen.finished .home-entry-symbol { opacity: 0; }
.home-entry-symbol__quarter:nth-child(1) {
  clip-path: inset(0 50% 50% 0);
  --blink-delay: 1500ms;
}
.home-entry-symbol__quarter:nth-child(2) {
  clip-path: inset(0 0 50% 50%);
  --blink-delay: 500ms;
}
.home-entry-symbol__quarter:nth-child(3) {
  clip-path: inset(50% 50% 0 0);
  --blink-delay: 1000ms;
  --blink-period: 3s;
}
.home-entry-symbol__quarter:nth-child(4) {
  clip-path: inset(50% 0 0 50%);
  --blink-delay: 0ms;
}
@keyframes home-entry-quadrant-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .home-entry .home-entry-screen { display: none; }
  .home-entry .home-entry-symbol__quarter { animation: none; opacity: 1; }
}

/* Compact brand mark on inner pages; inherits each footer's contrast color. */
body .site-footer__copyright--symbol {
  bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  line-height: 1;
}
.site-footer__symbol {
  display: block;
  width: 1em;
  height: 1em;
  flex: none;
  background: currentColor;
  mask: url('../../assets/img/trinity-grey-symbol.svg') center / contain no-repeat;
  -webkit-mask: url('../../assets/img/trinity-grey-symbol.svg') center / contain no-repeat;
}

/* Footer stays visible while scrolling; contact shares the top controls' column. */
body:not(.template-home) .site-footer {
  position: fixed;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  pointer-events: none;
}
body:not(.template-home) .site-footer__copyright {
  position: absolute;
  font-size: var(--footer-logo-size);
  top: auto;
  left: var(--grid-margin);
  bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  transform: none;
  pointer-events: auto;
}
body:not(.template-home) .site-footer__email {
  position: absolute;
  top: auto;
  left: var(--grid-start-4);
  bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  max-width: var(--grid-half-width);
  pointer-events: auto;
}

/* Blend the footer against underlying media on every inner page and orientation. */
@supports (mix-blend-mode: difference) {
  body:not(.template-home) .site-footer {
    color: var(--color-inverse-ink);
    mix-blend-mode: difference;
  }
  body:not(.template-home) .site-footer__copyright,
  body:not(.template-home) .site-footer__email {
    color: var(--color-inverse-ink);
  }
}

/* Leave the last content row clear of the fixed footer on mobile and tablet. */
@media (max-width: 1100px) {
  body:not(.template-home) {
    --footer-content-clearance: calc(var(--footer-logo-size) + max(var(--grid-margin), env(safe-area-inset-bottom)) + 24px);
  }
  body:not(.template-home) .about-page__copy,
  body:not(.template-home) .exhibitions-page__content,
  body:not(.template-home) .press-page__content,
  body:not(.template-home) .art-page,
  body:not(.template-home) .text-page,
  body:not(.template-home) .project-info {
    padding-bottom: var(--footer-content-clearance);
  }
  body:not(.template-home) main {
    scroll-padding-bottom: var(--footer-content-clearance);
  }
}

@media (min-width: 601px) and (max-width: 1100px) {
  :root { --footer-logo-size: 108px; }
}

@media (min-width: 1101px) {
  :root { --footer-logo-size: clamp(144px, 9vw, 180px); }
  body:is(.template-art, .home-art-active) .art-page {
    padding-bottom: calc(var(--footer-logo-size) + max(var(--grid-margin), env(safe-area-inset-bottom)) + var(--art-row-gap));
  }
}

/* A white navigation label and the corner logo form one consistent identity. */
body.template-about .site-footer,
body:not(.template-home):has(.site-header.is-on-dark) .site-footer {
  mix-blend-mode: normal;
}
body.template-about .site-footer__copyright,
body:not(.template-home):has(.site-header.is-on-dark) .site-footer__copyright {
  color: var(--color-white);
}
body.template-about .site-footer__email,
body:not(.template-home):has(.site-header.is-on-dark) .site-footer__email {
  color: var(--color-black);
}

/* About scrolls as a page, without a cropped text viewport above the footer. */
@media (min-width: 1101px) {
  body.template-about { overflow: visible; }
  body.template-about .about-page { overflow: visible; }
  body.template-about .about-page__image-frame { position: fixed; }
  body.template-about .about-page__copy {
    position: relative;
    top: auto;
    left: auto;
    margin-left: var(--grid-start-4);
    height: auto;
    min-height: 100svh;
    overflow: visible;
    padding-top: calc(var(--first-row-top) - var(--first-row-ink-offset));
    padding-bottom: calc(var(--footer-logo-size) + max(var(--grid-margin), env(safe-area-inset-bottom)) + 24px);
  }
}

/* Blend each fixed footer item independently so a white logo does not disable the contact effect. */
@supports (mix-blend-mode: difference) {
  body:not(.template-home) .site-footer {
    display: contents;
    mix-blend-mode: normal;
  }
  body:not(.template-home) .site-footer__copyright,
  body:not(.template-home) .site-footer__email {
    position: fixed;
    z-index: 20;
    color: var(--color-inverse-ink);
    mix-blend-mode: difference;
  }
  body.template-about .site-footer__copyright,
  body:not(.template-home):has(.site-header.is-on-dark) .site-footer__copyright {
    color: var(--color-white);
    mix-blend-mode: normal;
  }
}

/* Selection inverts the site's two ink colors for each text context. */
::selection {
  background-color: var(--color-black);
  color: var(--color-white);
  text-shadow: none;
}
body.template-home ::selection,
body.template-about .site-header ::selection,
.site-header.is-on-dark ::selection,
.is-on-dark::selection,
.is-on-dark ::selection,
.art-tile__badge.is-on-dark::selection,
.art-tile__badge.is-on-dark ::selection {
  background-color: var(--color-white);
  color: var(--color-black);
}
/* The open menu on About has dark text even though its closed toggle is white. */
body.template-about.is-menu-open .site-header ::selection {
  background-color: var(--color-black);
  color: var(--color-white);
}
/* Keep selected lettering in the exact brand colors rather than blending it again. */
body .site-footer__email.has-text-selection,
body.template-project .project-title.has-text-selection {
  mix-blend-mode: normal;
}

/* Align the first project media with the heading and Art's filter column. */
body.template-project .project-gallery {
  padding-left: var(--grid-margin);
}
@media (min-aspect-ratio: 1/1) {
  .project-page {
    --project-opening-width: min(800px, calc(100vw - 2 * var(--grid-margin)));
  }
  body.template-project .project-gallery {
    padding-left: calc(var(--grid-margin) + var(--project-opening-width) + var(--project-unit) + var(--project-gutter));
  }
}

.project-intro.project-navigation-transition {
  z-index: 5000;
  animation: none;
  transition: none;
  pointer-events: auto;
}

html.template-inquire,
body.template-inquire,
body.template-inquire .text-page {
  background: var(--color-black);
  color: var(--color-white);
}
body.template-inquire .site-nav,
body.template-inquire.is-menu-open .site-menu-toggle,
body.template-inquire .site-footer__copyright,
body.template-inquire .site-footer__email {
  color: var(--color-white);
  mix-blend-mode: normal;
}
body.template-inquire ::selection {
  background-color: var(--color-white);
  color: var(--color-black);
}

/* At the end of the horizontal project, related titles share the logo's top edge. */
@media (min-aspect-ratio: 1/1) and (min-width: 601px) {
  body.template-project .project-info {
    padding-bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  }
  .project-related {
    min-height: var(--footer-logo-size);
    align-items: start;
  }
}

/* Project description opens beneath Menu, before the first media. */
.project-opening-text {
  position: absolute;
  top: calc(var(--first-row-top) - var(--first-row-ink-offset));
  left: var(--grid-margin);
  width: calc(var(--grid-start-4) - var(--grid-margin) - var(--grid-gutter));
  font-size: calc(var(--font-size-medium) * 11 / 12);
  line-height: var(--line-height-text);
}
.project-opening-text p { margin: 0 0 1em; }
@media (min-aspect-ratio: 1/1) {
  .project-opening-text {
    width: var(--project-opening-width);
  }
}
.project-opening-title {
  margin: 0 0 1.08em;
  font-size: inherit;
  line-height: inherit;
  font-weight: 600;
}
body.template-project .project-info--related-only {
  min-height: 0;
  grid-template-rows: 1fr;
  padding-top: 108px;
}
.project-info--related-only .project-related { margin-top: 0; }
@media (aspect-ratio < 1/1) {
  .project-opening-text {
    position: relative;
    top: auto;
    left: auto;
    flex: none;
    width: 100%;
    margin-left: 0;
  }
}

/* The next project belongs to the gallery, with no overlay or scroll interception. */
@media (min-aspect-ratio: 1/1) {
  .project-page.is-scroll-track .project-stage { position: sticky; top: 0; height: 100dvh; }
  .project-page.is-scroll-track .project-gallery { position: relative; }
}
.project-next {
  position: relative;
  width: max-content;
  grid-column: span 5;
  align-self: center;
  margin-left: var(--next-project-space, 50vw);
  color: var(--color-black);
}
@media (min-aspect-ratio: 1/1) {
  .project-next::after {
    content: "";
    position: absolute;
    left: 100%;
    width: var(--next-project-end-space, 50vw);
    height: 1px;
    pointer-events: none;
  }
}
.project-next__link {
  display: grid;
  width: max-content;
  max-width: 100%;
  grid-template-columns: 70px 280px;
  column-gap: 24px;
  align-items: start;
  color: inherit;
  text-decoration: none;
}
.project-next__label {
  position: absolute;
  right: calc(100% + 24px);
  top: calc(50% - 6px);
  transform: translateY(-50%);
  white-space: nowrap;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
}
.project-next__link > .art-tile__picture { grid-column: 2; grid-row: 1; }
.project-next__title { grid-column: 2; grid-row: 2; margin-top: 0; }
.project-next__image {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
}
@media (aspect-ratio < 1/1) {
  .project-next {
    width: auto;
    align-self: stretch;
    margin: 0;
    padding: var(--next-project-space, 50svh) 0 max(48px, env(safe-area-inset-bottom));
  }
  .project-next__link {
    display: block;
    width: min(280px, 100%);
    margin-inline: auto;
  }
  .project-next__title { display: block; }
  .project-next__label { right: calc(100% + 20px); }
}

@media (max-width: 700px) {
  .project-next__link { grid-template-columns: 70px calc(280px * 2 / 3); }
}
@media (max-width: 700px) and (aspect-ratio < 1/1) {
  .project-next__link { width: min(calc(280px * 2 / 3), calc(100% * 2 / 3)); }
}

.project-next.is-label-above .project-next__label {
  top: auto;
  right: auto;
  bottom: calc(100% + 20px);
  left: 50%;
  transform: translateX(-50%);
}

/* The new document is fully visible underneath; only the outgoing snapshot animates. */
@view-transition { navigation: none; }
::view-transition-group(root) { animation: none; }
::view-transition-image-pair(root) { isolation: isolate; }
::view-transition-old(root) {
  z-index: 2;
  mix-blend-mode: normal;
  animation: page-departure-blur 1200ms cubic-bezier(.25,.1,.25,1) both,
             page-departure-opacity 1000ms cubic-bezier(.25,.1,.25,1) both;
}
::view-transition-new(root) {
  z-index: 1;
  animation: none;
  opacity: 1;
  filter: none;
  mix-blend-mode: normal;
}
@keyframes page-departure-blur {
  from { filter: blur(0px); }
  to { filter: blur(12px); }
}
@keyframes page-departure-opacity {
  from { opacity: 1; }
  to { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* Contact shares the navigation anchors, six-column grid and type of the site. */
.contact-page {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  column-gap: var(--grid-gutter);
  align-content: start;
  padding: var(--first-row-top) var(--grid-margin) calc(var(--footer-logo-size) + 108px);
  min-height: 100svh;
  color: var(--color-white);
}
.contact-page__intro, .contact-page__conversation { grid-column: 4 / 7; min-width: 0; }
.contact-page__conversation { margin-top: 108px; }
.contact-page h1, .contact-page h2, .contact-page p { margin: 0; }
.contact-page h1 {
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  font-weight: 600;
}
.contact-page__thanks h2, .contact-page__thanks p {
  font-size: var(--font-size-medium);
  line-height: var(--line-height-text);
  font-weight: 600;
}
.contact-page .contact-page__text {
  font-size: var(--font-size-medium);
  line-height: var(--line-height-text);
  margin-bottom: 48px;
}
.contact-details { display: grid; gap: 8px; font-size: var(--font-size-medium); line-height: var(--line-height-text); }
.contact-details__row { display: flex; align-items: baseline; gap: 10px; }
.contact-details button, .contact-details > a {
  width: fit-content;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.contact-details__status { flex: none; font-size: var(--font-size-small); white-space: nowrap; }
@media (max-width: 600px) {
  .contact-details { font-size: clamp(16px, 4.5vw, 24px); }
  .contact-details__status { font-size: 10px; }
}
.contact-form { display: grid; gap: 12px; }
.contact-form__field { display: grid; gap: 0; }
.contact-form label {
  font-size: var(--font-size-medium);
  line-height: var(--line-height-text);
}
.contact-form__end p, .contact-form__error, .contact-form__notice {
  font-size: var(--font-size-small);
  line-height: 1.4;
}
.contact-form input:not([type="hidden"]), .contact-form textarea {
  width: 100%; min-width: 0; border: 0;
  border-radius: 0; padding: 0; background: transparent; display: block;
  color: var(--color-white); font: inherit; font-size: var(--font-size-medium);
  line-height: var(--line-height-text); box-shadow: none; color-scheme: dark;
}
.contact-form textarea { resize: none; min-height: 1.08em; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; }
.contact-form input:focus-visible, .contact-form textarea:focus-visible { outline: none; }
.contact-form__end { display: flex; align-items: baseline; flex-wrap: wrap; gap: 20px 32px; }
.contact-form button {
  border: 0; border-radius: 0; background: none; padding: 0; text-align: left; width: fit-content;
  color: inherit; font: inherit; font-size: var(--font-size-medium); line-height: var(--line-height-text); cursor: pointer;
}
.contact-form button:disabled { opacity: .45; cursor: default; }@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.contact-form button:focus-visible,
.contact-page__thanks a:focus-visible { outline: 1px solid currentColor; outline-offset: 6px; }
}
.contact-page__thanks { display: grid; gap: 24px; }
.contact-page__thanks a { margin-top: 24px; width: fit-content; }
body.is-menu-open .contact-page { pointer-events: none; }
@media (max-width: 700px), (aspect-ratio < 1/1) {
  .contact-page__conversation { grid-column: 1 / -1; margin-top: 80px; }
  .contact-form { gap: 12px; }
}

.contact-form button { opacity: .45; transition: opacity 200ms ease; }@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.contact-form button:hover,
.contact-form button:focus-visible { opacity: 1; }
}
.contact-form button:disabled { opacity: .3; }
.contact-form__panel-inner { min-height: 0; padding-top: 0; }
.contact-form.is-accordion .contact-form__panel {
  display: grid; grid-template-rows: 0fr; visibility: hidden;
  transition: grid-template-rows 300ms ease, visibility 0s linear 300ms;
}
.contact-form.is-accordion .contact-form__panel-inner { overflow: hidden; padding-top: 0; }
.contact-form.is-accordion .contact-form__panel-inner > :first-child { margin-top: 0; }
.contact-form.is-accordion .is-open .contact-form__panel {
  grid-template-rows: 1fr; visibility: visible;
  transition: grid-template-rows 300ms ease, visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .contact-form button, .contact-form.is-accordion .contact-form__panel { transition: none; }
}

/* Keep browser autofill in the contact page's brand colors. */
.contact-form input:autofill,
.contact-form textarea:autofill {
  background-color: var(--color-black);
  color: var(--color-white);
  caret-color: var(--color-white);
  box-shadow: 0 0 0 1000px var(--color-black) inset;
}
.contact-form input:-webkit-autofill,
.contact-form input:-webkit-autofill:hover,
.contact-form input:-webkit-autofill:focus,
.contact-form textarea:-webkit-autofill,
.contact-form textarea:-webkit-autofill:hover,
.contact-form textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--color-white);
  caret-color: var(--color-white);
  -webkit-box-shadow: 0 0 0 1000px var(--color-black) inset;
  box-shadow: 0 0 0 1000px var(--color-black) inset;
}

.contact-form__field > button { opacity: .45; }
.contact-form .is-filled > button { opacity: .45; }@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.contact-form .is-filled > button:hover,
.contact-form .is-filled > button:focus-visible { opacity: 1; }
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.contact-form__field > button:hover,
.contact-form__field > button:focus-visible { opacity: 1; }
}

.contact-form__privacy {
  font-size: var(--font-size-small);
  line-height: 1.2;
}

.contact-form__end {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  align-items: flex-start;
}
.contact-form__end .contact-form__privacy { min-width: 0; text-decoration: none; }
.contact-form__end button { flex: 0 0 auto; }

.contact-form__end .contact-form__privacy {
  opacity: .45;
  transition: opacity 200ms ease;
}@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.contact-form__end .contact-form__privacy:hover,
.contact-form__end .contact-form__privacy:focus-visible,
.contact-form__end:has(button[type="submit"]:hover) .contact-form__privacy,
.contact-form__end:has(button[type="submit"]:focus-visible) .contact-form__privacy {
  opacity: 1;
}
}
@media (prefers-reduced-motion: reduce) {
  .contact-form__end .contact-form__privacy { transition: none; }
}

html.template-privacy, body.template-privacy { background: var(--color-black); color: var(--color-white); }
body.template-privacy .site-header,
body.template-privacy .site-nav,
body.template-privacy.is-menu-open .site-menu-toggle,
body.template-privacy .site-footer__copyright,
body.template-privacy .site-footer__email { color: var(--color-white); mix-blend-mode: normal; }
body.template-privacy ::selection { background: var(--color-white); color: var(--color-black); }
.privacy-copy { font-size: var(--font-size-medium); line-height: 1.2; }
.template-privacy .contact-page__intro { display: flex; align-items: baseline; justify-content: space-between; gap: var(--grid-gutter); }
.privacy-close { flex: none; color: inherit; font-size: var(--font-size-small); line-height: var(--line-height-text); text-decoration: none; }
.privacy-copy h2 { font: inherit; margin: 48px 0 12px; }
.privacy-copy h2:first-child { margin-top: 0; }
.privacy-copy p + p { margin-top: 24px; }
.privacy-copy a { opacity: .45; text-decoration: none; }@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.privacy-copy a:hover,
.privacy-copy a:focus-visible { opacity: 1; }
}

/* The homepage intro and Art share one reversible document scroll. */
body.template-home { overflow-x: clip; overflow-y: auto; }
html.template-home, body.template-home { overflow-anchor: none; }
/* Cover the area behind Safari's retracting toolbar without moving the signature. */
/* Include the signature's overshoot in the section, not in a clipped viewport.
   The existing logo anchor stays at the baseline; Art starts after the whole G. */
body.template-home .home-hero {
  height: calc(100lvh + 100vw * 0.72 / 238.85);
  min-height: calc(100lvh + 100vw * 0.72 / 238.85);
}
body.template-home .home-hero .site-footer--home-logo {
  position: absolute;
  bottom: calc(100% - 100svh - 100vw * 0.72 / 238.85);
}
body.template-home:not(.home-art-active) > .site-footer--home-art,
body.template-home:not(.home-art-active) .filter-toggle,
body.template-home:not(.home-art-active) .home-art .art-filters { visibility: hidden; pointer-events: none; }
body.home-art-active .site-menu-toggle,
body.home-art-active.is-menu-open .site-menu-toggle,
body.home-art-active .site-nav { color: var(--color-black); }
body.template-home .home-art { background: var(--color-white); }
body.template-home .home-art .art-page {
  padding-left: var(--grid-margin);
  padding-bottom: calc(var(--footer-logo-size) + max(var(--grid-margin), env(safe-area-inset-bottom)) + var(--art-row-gap));
}
body.template-home > .site-footer--home-art {
  position: fixed; inset: 0; display: block; width: 100%; height: 100%;
  padding: 0; margin: 0; pointer-events: none; background: transparent;
  color: var(--color-inverse-ink); mix-blend-mode: difference;
}
body.template-home > .site-footer--home-art .site-footer__copyright {
  position: fixed; top: auto; left: var(--grid-margin);
  bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  font-size: var(--footer-logo-size); transform: none; pointer-events: auto;
  color: var(--color-inverse-ink);
}
body.template-home > .site-footer--home-art .site-footer__email {
  position: fixed; top: auto; left: var(--grid-start-4);
  bottom: max(var(--grid-margin), env(safe-area-inset-bottom));
  color: var(--color-inverse-ink); pointer-events: auto;
}


/* A group's members share a tight gap; each new block has a full column of air. */
@media (aspect-ratio < 1/1) {
  body.template-project .project-gallery { gap: 0; }
  .project-opening-text { margin-bottom: clamp(96px, 16vw, 200px); }
  .project-item[data-portrait-spacing="group-inner"] { margin-bottom: var(--grid-gutter); }
  .project-item[data-portrait-spacing="group-end"] { margin-bottom: clamp(144px, 20vw, 216px); }
  .project-item:last-child { margin-bottom: 0; }
}

/* Preview overlays preserve all existing media geometry and link hit areas. */

/* Long project descriptions open without changing the gallery scroll geometry. */
.project-read-more { padding: 0; border: 0; background: none; color: inherit; font: inherit; opacity: .27; cursor: pointer; transition: opacity 180ms ease; }
@media (hover: hover) and (pointer: fine) {@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
.project-read-more:hover,
.project-read-more:focus-visible { opacity: 1; }
}
}
.project-read-more,
.project-read-more:is(:hover, :focus, :focus-visible, :active) {
  border: 0;
  outline: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}
@media (hover: none), (pointer: coarse) {
  .project-read-more:is(:hover, :focus, :focus-visible, :active) { opacity: .27; }
}
.project-reading { position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: var(--color-black); overflow: hidden; }
.project-reading[open] { display: block; }
.project-reading::backdrop { background: rgb(224 224 224 / 65%); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.project-reading__text { position: absolute; box-sizing: border-box; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; padding: 0 0 .3em; font-size: calc(var(--font-size-medium) * 11 / 12); line-height: var(--line-height-text); }
.project-reading__text h2 { margin: 0 0 1.08em; font: inherit; }
.project-reading__text p { margin: 0 0 1em; }
.project-reading__text p:last-child { margin-bottom: 0; }
.project-reading__close { position: absolute; top: var(--grid-margin); right: var(--grid-margin); border: 0; padding: 0; color: inherit; background: none; font: inherit; cursor: pointer; }
.project-reading__text::-webkit-scrollbar { display: none; }
.project-reading:focus,
.project-reading__text:focus { outline: none; }

/* Room to scroll the last paragraph clear of the lower edge on phones/tablets. */
@media (max-width: 1100px), (pointer: coarse) {
  .project-reading__text { padding-bottom: max(48px, 7.333svh, env(safe-area-inset-bottom)); }
}

.project-read-more:focus { outline: none; box-shadow: none; }

/* Touch layouts end with a real footer, after the content rather than over it. */
@media (max-width: 1100px), (pointer: coarse) {
  body:not(.template-home) > .site-footer,
  body.template-home > .site-footer--home-art {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: end;
    gap: var(--grid-gutter);
    width: 100%;
    height: auto;
    margin: 108px 0 0;
    padding: 0 var(--grid-margin) calc(max(var(--grid-margin), env(safe-area-inset-bottom)) / 2);
    color: var(--color-black);
    background: var(--color-white);
    mix-blend-mode: normal;
    pointer-events: auto;
  }
  body:not(.template-home) > .site-footer .site-footer__copyright,
  body:not(.template-home) > .site-footer .site-footer__email,
  body.template-home > .site-footer--home-art .site-footer__copyright,
  body.template-home > .site-footer--home-art .site-footer__email {
    position: static;
    inset: auto;
    transform: none;
    margin: 0;
    max-width: 100%;
    color: inherit;
    mix-blend-mode: normal;
    z-index: auto;
    justify-self: start;
  }
  body > .site-footer .site-footer__copyright { grid-column: 1; }
  body > .site-footer .site-footer__email { grid-column: 2; }
  body:not(.template-home) .about-page__copy,
  body:not(.template-home) .exhibitions-page__content,
  body:not(.template-home) .press-page__content,
  body:not(.template-home) .art-page,
  body:not(.template-home) .text-page,
  body:not(.template-home) .project-info,
  body.template-home .home-art .art-page { padding-bottom: 0; }
  body.template-project > .site-footer { display: none; }
  body:is(.template-inquire, .template-privacy) > .site-footer {
    color: var(--color-white);
    background: var(--color-black);
  }
}

/* Touch layouts keep their resting appearance after taps and focus restoration. */
@media (max-width: 1100px), (pointer: coarse), (hover: none) {
  *:focus, *:focus-visible { outline: none !important; box-shadow: none !important; }
  .project-read-more, .project-read-more:is(:hover, :focus, :focus-visible, :active) {
    opacity: .27; border: 0; outline: none; box-shadow: none;
  }
}

/* Body-only project excerpts follow the site's mobile and tablet breakpoints. */
.project-description-preview--tablet,
.project-description-preview--mobile { display: none; }
@media (min-width: 601px) and (max-width: 1100px), (min-width: 601px) and (pointer: coarse) {
  .project-description-preview--desktop { display: none; }
  .project-description-preview--tablet { display: block; }
}
@media (max-width: 600px) {
  .project-description-preview--desktop { display: none; }
  .project-description-preview--mobile { display: block; }
}

/* Extend the actual hero media below Safari's translucent controls. The signature
   remains anchored to 100svh by its existing bottom calculation. */
@media (max-width: 1100px), (pointer: coarse) {
  body.template-home .home-hero {
    height: calc(100lvh + max(120px, env(safe-area-inset-bottom, 0px)));
    min-height: calc(100lvh + max(120px, env(safe-area-inset-bottom, 0px)));
  }
  html.template-home:has(body:not(.home-art-active)),
  body.template-home:not(.home-art-active) { background-color: var(--color-black); }
}

@media (max-width: 1100px), (pointer: coarse) {
  body.template-home .home-hero .site-footer--home-logo {
    bottom: calc(100% - 100svh - 100vw * 0.72 / 238.85 - max(var(--grid-margin), env(safe-area-inset-bottom, 0px)) / 2);
  }
}

@media (max-width: 1100px), (pointer: coarse) {
  .project-reading__text h2 { padding-right: 80px; }
  .project-reading__close { z-index: 1; }
}

/* One shared footer row overrides the legacy six-column inner-page layout. */
@media (max-width: 1100px), (pointer: coarse) {
  body:not(.template-home):not(.template-project) > .site-footer,
  body.template-home > .site-footer--home-art {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto;
    align-items: end;
    overflow: visible;
  }
  body:not(.template-home):not(.template-project) > .site-footer .site-footer__copyright,
  body.template-home > .site-footer--home-art .site-footer__copyright {
    grid-column: 1;
    grid-row: 1;
    width: var(--footer-logo-size);
    height: var(--footer-logo-size);
    max-width: none;
    overflow: visible;
    font-size: var(--footer-logo-size);
    line-height: 1;
  }
  body:not(.template-home):not(.template-project) > .site-footer .site-footer__email,
  body.template-home > .site-footer--home-art .site-footer__email {
    grid-column: 2;
    grid-row: 1;
    width: auto;
    white-space: nowrap;
  }
}

/* Art controls invert the artwork beneath them without a frosted header strip. */
body:is(.template-art, .home-art-active) .site-header::before {
  content: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body:is(.template-art, .home-art-active):not(.is-menu-open):not(.is-filter-layer-open) .site-header {
  mix-blend-mode: difference;
}
body:is(.template-art, .home-art-active):not(.is-menu-open):not(.is-filter-layer-open) .site-header :is(.site-menu-toggle, .filter-toggle) {
  color: var(--color-inverse-ink);
}
@media (min-width: 1101px) and (pointer: fine) {
  body:is(.template-art, .home-art-active) .art-filters { mix-blend-mode: difference; }
  body:is(.template-art, .home-art-active) .art-filter { color: var(--color-inverse-ink); }
}

/* Touch navigation follows the actual background throughout the page. */
@media (max-width: 1100px), (pointer: coarse) {
  body:not(.is-menu-open):not(.is-filter-layer-open) .site-header {
    mix-blend-mode: difference;
    color: var(--color-inverse-ink);
    background: transparent;
  }
  body:not(.is-menu-open):not(.is-filter-layer-open) .site-header::before { content: none; }
  body:not(.is-menu-open):not(.is-filter-layer-open) .site-header :is(.site-menu-toggle, .filter-toggle, .project-header__inquire) {
    color: var(--color-inverse-ink);
    mix-blend-mode: normal;
  }
}

/* No frosted strip behind any page header, on any viewport. */
body:is(.template-art, .home-art-active, .template-press)::before,
body .site-header.site-header::before {
  content: none;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body:not(.is-menu-open):not(.is-filter-layer-open) .site-header {
  mix-blend-mode: difference;
  color: var(--color-inverse-ink);
  background: transparent;
}
body:not(.is-menu-open):not(.is-filter-layer-open) .site-header :is(.site-menu-toggle, .filter-toggle, .project-header__inquire) {
  color: var(--color-inverse-ink);
  mix-blend-mode: normal;
}
@media (min-width: 1101px) and (pointer: fine) {
  body .press-filters { mix-blend-mode: difference; }
  body .press-filter { color: var(--color-inverse-ink); }
}

/* Keep Contact/Privacy's labels at the navigation anchors during page scroll. */
body:is(.template-inquire, .template-privacy) .contact-page__intro {
  min-height: calc(var(--font-size-small) * var(--line-height-text));
}
body:is(.template-inquire, .template-privacy) .contact-page__intro h1,
body.template-privacy .privacy-close {
  position: fixed;
  top: var(--first-row-top);
  z-index: 3001;
  color: var(--color-inverse-ink);
  mix-blend-mode: difference;
}
body:is(.template-inquire, .template-privacy) .contact-page__intro h1 {
  left: var(--grid-start-4);
}
body.template-privacy .privacy-close { right: var(--grid-margin); }
body:is(.template-inquire, .template-privacy).is-menu-open .contact-page__intro {
  visibility: hidden;
}

/* Align visible capitals, accounting for Brillume's different font sizes.
   Its ink starts .2405em below a 1.08 line box, or .2005em at line-height 1. */
.contact-form__end .contact-form__privacy {
  line-height: 1;
  margin-top: calc(var(--font-size-medium) * (var(--line-height-text) / 2 - .2995) - var(--font-size-small) * .2005);
}

@media (max-width: 700px) {
  .art-page { padding-top: 180px; }
  .art-grid { row-gap: 96px; }
}

@media (max-width: 700px) {
  .project-intro__title .project-intro__cycle { display: block; white-space: nowrap; }
}

/* Project details have no footer on mobile or tablet. */
@media (max-width: 1100px), (pointer: coarse) {
  body.template-project > .site-footer { display: none; }
}

/* Editable homepage media; the signature uses only the two brand inks. */
body.template-home .home-hero {
  --home-logo-ink: var(--color-black);
  background: var(--color-white);
}
body.template-home .home-hero__image-frame { left: 0; width: 100%; }
body.template-home .home-hero__image {
  inset: 0; width: 100%; height: 100%; object-fit: cover;
}
body.template-home .home-hero .site-footer--home-logo {
  color: var(--home-logo-ink); mix-blend-mode: normal;
}
.home-hero .home-footer-logo {
  position: relative;
  color: inherit;
}
.home-hero .home-footer-logo img { visibility: hidden; }
.home-hero .home-footer-logo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: currentColor;
  mask: url('../img/trinity-grey-logo.svg') center / 100% 100% no-repeat;
  -webkit-mask: url('../img/trinity-grey-logo.svg') center / 100% 100% no-repeat;
}

/* Availability belongs to the project heading, never its entrance interstitial. */
.project-availability {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  margin-left: .6em;
  font-family: inherit;
  font-weight: inherit;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  color: inherit;
  white-space: nowrap;
}
.project-availability::before {
  content: "";
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: currentColor;
}

.art-tile__badge.has-count::before,
.project-availability.has-count::before { content: none; }

.empty-page {
  position: relative;
  min-height: 100svh;
  background: var(--color-white);
  color: var(--color-black);
}
.empty-page__title { margin: 0; clip-path: none; }

/* All brand marks invert against their own backdrop, including About's portrait. */
body.template-home > .site-footer--home-art { mix-blend-mode: normal; }
@media (min-width: 1101px) and (pointer: fine) {
  /* Match Art: let each fixed item blend directly with the page backdrop. */
  body.template-home > .site-footer--home-art { display: contents; }
}
body.template-home > .site-footer--home-art .site-footer__email { mix-blend-mode: difference; }
body .site-footer .site-footer__copyright--symbol {
  color: var(--color-inverse-ink) !important;
  mix-blend-mode: difference !important;
}
body.template-home .home-hero .site-footer--home-logo {
  color: var(--color-inverse-ink);
  mix-blend-mode: difference;
}
body.template-home:not(:has(.home-hero__image, .home-hero__video)) .home-hero .site-footer--home-logo {
  color: var(--color-black);
  mix-blend-mode: normal;
}
.home-entry-symbol {
  color: var(--color-white);
  mix-blend-mode: normal;
}
@media (max-width: 1100px), (pointer: coarse) {
  /* In-flow footers have their own solid background, so use its text color. */
  body > .site-footer .site-footer__copyright--symbol,
  body > .site-footer .site-footer__email {
    color: inherit !important;
    mix-blend-mode: normal !important;
  }
}

.project-audio-toggle {
  position: absolute;
  left: 8px;
  top: calc(50% + var(--overlay-center-offset));
  transform: translateY(-50%);
  z-index: 3;
  padding: 0;
  border: 0;
  background: none;
  color: var(--color-black);
  mix-blend-mode: normal;
  font: inherit;
  font-size: var(--font-size-small);
  line-height: var(--line-height-text);
  cursor: pointer;
}
.project-audio-toggle.is-on-dark { color: var(--color-white); }

.project-media-label {
  position: absolute;
  left: -5px;
  bottom: 0;
  transform: rotate(-90deg);
  transform-origin: bottom left;
  font-size: var(--font-size-small);
  line-height: 1;
  white-space: nowrap;
  color: var(--color-black);
}
@media (aspect-ratio >= 1/1) {
  .project-item.is-caption-side:has(.project-media-label) .project-caption {
    padding-right: calc(var(--font-size-small) + 10px);
  }
}
.project-media.has-audio { cursor: pointer; }
.project-audio-toggle {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
}
.project-audio-dot {
  display: block;
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  margin-top: calc(var(--art-badge-dot-y) - 1px);
  border-radius: 50%;
  background: currentColor;
  animation: audio-dot-pulse 1800ms ease-in-out infinite;
}
.project-audio-toggle[aria-pressed="true"] .project-audio-dot { animation: none; }
@keyframes audio-dot-pulse {
  0%, 100% { transform: scale(1.14); }
  50% { transform: scale(.93); }
}
@media (prefers-reduced-motion: reduce) {
  .project-audio-dot { animation: none; }
}

/* Solid dark pages use the exact brand white without backdrop inversion. */
body:is(.template-inquire, .template-privacy) .site-header,
body:is(.template-inquire, .template-privacy) .site-header :is(.site-menu-toggle, .site-menu-dismiss, .project-header__inquire, .site-nav),
body:is(.template-inquire, .template-privacy) > .site-footer,
body:is(.template-inquire, .template-privacy) > .site-footer :is(.site-footer__copyright--symbol, .site-footer__email) {
  color: var(--color-white) !important;
  mix-blend-mode: normal !important;
}

/* Portrait project pages share the standard in-flow footer row. */
@media (aspect-ratio < 1/1) {
  body.template-project .project-gallery { padding-bottom: 0; }
  body.template-project .project-next { padding-bottom: 0; }
  body.template-project > .site-footer {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto;
    align-items: end;
    gap: var(--grid-gutter);
    width: 100%;
    height: auto;
    margin: 108px 0 0;
    padding: 0 var(--grid-margin) calc(max(var(--grid-margin), env(safe-area-inset-bottom)) / 2);
    overflow: visible;
    color: var(--color-black);
    background: var(--color-white);
    mix-blend-mode: normal;
    pointer-events: auto;
  }
  body.template-project > .site-footer :is(.site-footer__copyright, .site-footer__email) {
    position: static;
    inset: auto;
    transform: none;
    margin: 0;
    max-width: none;
    color: inherit !important;
    mix-blend-mode: normal !important;
    z-index: auto;
    justify-self: start;
    grid-row: 1;
  }
  body.template-project > .site-footer .site-footer__copyright {
    grid-column: 1;
    width: var(--footer-logo-size);
    height: var(--footer-logo-size);
    overflow: visible;
    font-size: var(--footer-logo-size);
    line-height: 1;
  }
  body.template-project > .site-footer .site-footer__email {
    grid-column: 2;
    width: auto;
    white-space: nowrap;
  }
}
