.frescoes-page em { color: var(--gold); }
.mural-visit { position: relative; }
.mural-visit__stage { position: relative; isolation: isolate; padding: calc(var(--site-top) + 58px) 9% 90px; background: #2c2921; overflow: clip; }
.mural-visit__world { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgb(8 9 7 / 30%), transparent 65%), url('images/fresco-room-close.webp') center / 100% 100%; }
.mural-visit__world::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(9 10 8 / 70%), transparent 160px); }
.mural-visit__heading { position: relative; max-width: 450px; margin-bottom: 50px; }
.mural-visit__heading h1 { font-size: clamp(42px, 4.4vw, 66px); line-height: 1.07; margin-block: 24px; }
.mural-visit__heading > p:not(.eyebrow) { font: 400 15px/1.85 var(--sans); color: var(--muted); }
.mural-visit__heading .text-link { margin-top: 24px; }
.mural-visit__gallery { display: grid; gap: 80px; }
.mural-visit__slide { min-width: 0; }
.fresco-photograph { position: relative; display: block; width: 100%; }
.fresco-photograph img { width: 100%; height: auto; box-shadow: 0 14px 28px rgb(0 0 0 / 35%); }
.fresco-photograph__observe { position: absolute; right: 16px; bottom: 16px; background: rgb(20 21 17 / 90%); color: var(--paper); padding: 12px 18px; display: flex; gap: 20px; align-items: center; font: 400 10px/1.4 var(--sans); letter-spacing: .1em; }
.fresco-photograph__observe > span { font: 20px/1 var(--serif); }
.mural-visit__cartel { margin-top: 25px; }
.mural-visit__cartel h2 { font-size: 30px; }
.mural-visit__cartel p { margin-top: 10px; color: var(--muted); font: 400 11px/1.8 var(--sans); }
.mural-visit__cartel .text-link { margin-top: 14px; }
.mural-visit__next { margin-top: 55px; display: flex; flex-direction: column; gap: 15px; align-items: center; font: 400 9px/1.7 var(--sans); text-transform: uppercase; letter-spacing: .14em; }
.mural-visit__next > span:last-child { font: 27px/1 var(--serif); color: var(--gold); }
.mural-visit__pagination { display: flex; gap: 18px; }
.mural-visit__pagination a { display: flex; align-items: center; gap: 12px; min-height: 44px; font: 400 10px/1 var(--sans); color: var(--muted); }
.mural-visit__pagination a > span:last-child { width: 28px; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 200ms var(--ease-out); }
.mural-visit__pagination [aria-current] { color: var(--gold); }
.mural-visit__pagination [aria-current] > span:last-child { transform: scaleX(1); }
.mural-projects { position: relative; isolation: isolate; overflow: clip; padding: 110px 10% 120px; scroll-margin-top: calc(-1 * (var(--site-top) + 20px)); }
/* The works collection wall: one screen of texture held still behind the projects, never stretched over the long grid. */
.mural-projects__world { position: absolute; z-index: -1; inset: 0; }
/* As tall as the largest viewport, so a phone hiding its toolbar never uncovers a band below the wall. */
.mural-projects__wall { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; height: 100lvh; overflow: hidden; }
.mural-projects__texture { position: absolute; inset: 0; background: linear-gradient(rgb(24 24 20 / 12%), rgb(24 24 20 / 12%)), url('images/collection-wall.webp') center / cover no-repeat; }
.mural-projects__intro { display: grid; grid-template-columns: 1fr 1fr; column-gap: 8%; margin-bottom: 80px; }
.mural-projects__intro .eyebrow { grid-column: 1 / -1; margin-bottom: 24px; }
.mural-projects__intro h2, .mural-commission h2 { font-size: clamp(37px, 3.9vw, 56px); line-height: 1.1; }
.mural-projects__intro .prose { align-self: center; }
.mural-projects__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 75px 7%; }
.mural-project { min-width: 0; scroll-margin-top: calc(var(--site-top) + 26px); }
.mural-project__picture { height: clamp(220px, 25vw, 430px); display: flex; align-items: center; }
.mural-project__picture .fresco-photograph { height: 100%; display: flex; align-items: center; justify-content: center; }
.mural-project__picture img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.mural-project__copy { position: relative; margin-top: 25px; padding-left: 38px; }
.mural-project__number { position: absolute; left: 0; top: 7px; font-size: 9px; }
.mural-project__copy h3 { margin: 0 0 11px; font: 400 28px/1.2 var(--serif); }
.mural-project__facts, .mural-project__context { font: 400 11px/1.8 var(--sans); color: var(--muted); }
.mural-project__context { font-size: 10px; margin-top: 4px; }
.mural-project__details { margin-top: 19px; padding-top: 13px; border-top: 1px solid var(--line); }
.mural-project__details summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 35px; font: 400 10px/1.5 var(--sans); color: var(--gold); }
.mural-project__details summary::-webkit-details-marker { display: none; }
.mural-project__details summary span { font: 24px/1 var(--serif); }
.mural-project__details[open] summary span { transform: rotate(45deg); }
.mural-project__details .prose { padding-top: 18px; }
.mural-project__details .text-link { margin-top: 16px; }
.mural-commission { position: relative; isolation: isolate; overflow: clip; min-height: 85svh; padding: 120px 10%; display: flex; align-items: center; }
.mural-commission__world { position: absolute; z-index: -1; inset: -3%; background: linear-gradient(90deg, rgb(19 18 14 / 70%), rgb(19 18 14 / 5%)), url('images/contact-room.webp') center top / cover; }
.mural-commission__copy { max-width: 610px; }
.mural-commission h2 { margin-block: 26px 32px; }
.mural-commission .gallery-collection-link { margin-top: 34px; }
@media (hover: hover) and (pointer: fine) {
  /* The Observe cursor shows over the fresco itself, never over the empty frame around a contained photograph. */
  .fresco-photograph { pointer-events: none; }
  .fresco-photograph img { pointer-events: auto; cursor: url('observer-cursor.svg?v=2') 26 26, zoom-in; }
  .fresco-photograph:not(:focus-visible) .fresco-photograph__observe { visibility: hidden; }
}
@media (min-width: 961px) and (min-height: 650px) {
  .mural-visit.has-mural-visit .mural-visit__stage { height: 100svh; padding: 0; }
  .has-mural-visit .mural-visit__heading { position: absolute; left: 10%; top: 46%; transform: translateY(-50%); width: 29%; margin: 0; }
  .has-mural-visit .mural-visit__heading h1 { font-size: clamp(42px, 4vw, 62px); }
  .has-mural-visit .mural-visit__gallery { position: absolute; inset: calc(var(--site-top) + 55px) 7% 120px 46%; display: block; }
  .has-mural-visit .mural-visit__slide { position: absolute; top: 0; bottom: 0; left: calc(var(--bay, 0) * 100vw); width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
  .has-mural-visit .mural-visit__slide > .fresco-photograph { height: calc(100% - 113px); max-width: 100%; display: flex; align-items: center; justify-content: center; }
  .has-mural-visit .mural-visit__slide img { width: auto; height: auto; max-height: 100%; max-width: 100%; }
  .has-mural-visit .mural-visit__cartel { width: 100%; text-align: center; }
  .has-mural-visit .mural-visit__cartel h2 { font-size: 30px; }
  .has-mural-visit .mural-visit__pagination { position: absolute; bottom: 86px; left: 10%; }
  .has-mural-visit .mural-visit__next { position: absolute; bottom: 33px; left: 50%; transform: translateX(-50%); margin: 0; }
}
/* Phones: the heading stays at the top while the three murals cross beneath it, as on the homepage. */
@media (min-width: 360px) and (max-width: 760px) and (min-height: 640px) {
  .mural-visit.has-mural-visit .mural-visit__stage { height: 100svh; padding: 0; overflow-x: clip; overflow-y: visible; }
  /* The room continues below the held stage when the phone toolbar hides. */
  .has-mural-visit .mural-visit__world { bottom: calc(-1 * var(--toolbar-gap)); background-color: #2c2921; }
  .has-mural-visit .mural-visit__heading { position: absolute; top: calc(var(--site-top) + 22px); left: 24px; right: 24px; max-width: none; margin: 0; }
  .has-mural-visit .mural-visit__heading h1 { font-size: 38px; margin-block: 14px 10px; }
  .has-mural-visit .mural-visit__heading > p:not(.eyebrow) { font-size: 13px; line-height: 1.7; }
  .has-mural-visit .mural-visit__heading .text-link { display: none; }
  .has-mural-visit .mural-visit__gallery { position: absolute; inset: calc(var(--site-top) + 235px) 24px 140px; display: block; }
  .has-mural-visit .mural-visit__slide { position: absolute; top: 0; bottom: 0; left: calc(var(--bay, 0) * 100vw); width: 100%; display: flex; flex-direction: column; justify-content: center; }
  .has-mural-visit .mural-visit__slide > .fresco-photograph { flex: 0 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; }
  .has-mural-visit .mural-visit__slide img { width: auto; height: auto; max-width: 100%; max-height: 100%; }
  .has-mural-visit .mural-visit__cartel { flex: 0 0 auto; margin-top: 16px; text-align: center; }
  .has-mural-visit .mural-visit__cartel h2 { font-size: 25px; }
  .has-mural-visit .mural-visit__cartel p { margin-top: 6px; }
  .has-mural-visit .mural-visit__cartel .text-link { display: none; }
  .has-mural-visit .mural-visit__pagination { position: absolute; bottom: 74px; left: 24px; }
  .has-mural-visit .mural-visit__next { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); margin: 0; }
}
@media (max-width: 760px) {
  .mural-visit__stage { padding: calc(var(--site-top) + 35px) 24px 65px; }
  .mural-visit__world { background-size: auto 100%; }
  .mural-visit__heading h1 { font-size: 43px; }
  .mural-visit__heading > p:not(.eyebrow), .frescoes-page .prose { font-size: 14px; }
  .mural-visit__cartel h2 { font-size: 27px; }
  .mural-projects { padding: 80px 24px; }
  .mural-projects__intro { display: block; margin-bottom: 45px; }
  .mural-projects__intro .prose { margin-top: 28px; }
  .mural-projects__grid { grid-template-columns: 1fr; gap: 58px; }
  .mural-project__picture { height: auto; max-height: none; }
  .mural-project__picture img { width: 100%; }
  .mural-project__copy h3 { font-size: 27px; }
  .mural-commission { min-height: 78svh; padding: 90px 24px; }
  .mural-commission__world { background-position: 58% top; }
  .mural-commission .gallery-collection-link { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .mural-visit__pagination a > span:last-child { transition: none; }
}
/* Phones: the Observe badge stays discreet on the fresco. */
@media (max-width: 760px) {
  .fresco-photograph__observe { right: 10px; bottom: 10px; padding: 7px 10px; gap: 10px; font-size: 9px; }
  .fresco-photograph__observe > span { font-size: 13px; }
}