/* TNG Framer-Inspired — curated museum patterns (Phase 1)
   Scope: text mask, hover lens, image ticker, shatter logo
   Register: Monocle / Tom Ford editorial — not flashy SaaS */

:root {
  --fi-luxe-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --fi-lens-size: clamp(5rem, 14vw, 9rem);
  --fi-lens-zoom: 2.1;
}

/* ── Text Video Mask — room title aperture ── */
.fi-text-mask {
  position: relative;
  display: inline-block;
  margin: 0;
  line-height: 0.92;
  isolation: isolate;
}
.fi-text-mask__fill {
  display: block;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: transparent;
  background-size: cover;
  background-position: center 40%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  filter: saturate(0.92) contrast(1.08);
  transition: filter 1.2s var(--fi-luxe-ease);
}
.fi-text-mask__video {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}
.fi-text-mask.is-ready .fi-text-mask__fill {
  animation: fi-text-mask-breathe 14s var(--fi-luxe-ease) infinite alternate;
}
@keyframes fi-text-mask-breathe {
  0% { filter: saturate(0.88) contrast(1.04) brightness(0.96); }
  100% { filter: saturate(0.98) contrast(1.1) brightness(1.02); }
}
/* Fallback stroke when texture not loaded */
.fi-text-mask:not(.is-ready) .fi-text-mask__fill {
  color: var(--pair-text, #f5f0e8);
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
}

/* Exhibitions index hero band */
.exi-hero .fi-text-mask {
  display: block;
}
.exi-hero .fi-text-mask__fill {
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 700;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

/* ── Hover Lens — signature evidence craft reveal ── */
.fi-hover-lens {
  --fi-lens-x: 50%;
  --fi-lens-y: 50%;
  --fi-lens-opacity: 0;
}
.fi-hover-lens .exhibition-hover-luxe__media,
.fi-hover-lens > .tng-picture,
.fi-hover-lens > img {
  position: relative;
}
.fi-hover-lens .fi-lens-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  overflow: hidden;
  opacity: var(--fi-lens-opacity);
  transition: opacity 0.35s var(--fi-luxe-ease);
  border-radius: inherit;
}
.fi-hover-lens.is-lens-active .fi-lens-layer {
  opacity: 1;
}
.fi-hover-lens .fi-lens-layer__glass {
  position: absolute;
  width: var(--fi-lens-size);
  height: var(--fi-lens-size);
  left: var(--fi-lens-x);
  top: var(--fi-lens-y);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 45%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, #fff 8%, transparent),
    inset 0 0 1.5rem color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 12%, transparent);
  background: radial-gradient(
    circle at center,
    color-mix(in srgb, #fff 6%, transparent) 0%,
    transparent 70%
  );
  overflow: hidden;
}
.fi-hover-lens .fi-lens-layer__zoom {
  position: absolute;
  inset: -50%;
  width: 200%;
  height: 200%;
  object-fit: cover;
  transform-origin: var(--fi-lens-x) var(--fi-lens-y);
  transform: scale(var(--fi-lens-zoom));
  filter: saturate(1.05) contrast(1.08);
  pointer-events: none;
}

/* ── Image Ticker — slow editorial marquee ── */
.fi-image-ticker {
  position: relative;
  overflow: hidden;
  padding: clamp(1.25rem, 3vw, 2rem) 0;
  border-top: 1px solid color-mix(in srgb, var(--pair-text, #f5f0e8) 6%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--pair-text, #f5f0e8) 6%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.fi-image-ticker__header {
  padding: 0 clamp(1.25rem, 4vw, 2.5rem) 0.85rem;
  max-width: 72rem;
  margin: 0 auto;
}
.fi-image-ticker__kicker {
  font-size: 0.54rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--exhibition-room-accent, var(--pair-amber, #c47a00));
  margin: 0 0 0.35rem;
}
.fi-image-ticker__title {
  font-family: var(--pair-display-font, inherit);
  font-size: clamp(0.95rem, 2vw, 1.25rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin: 0;
  color: var(--pair-text, #f5f0e8);
}
.fi-image-ticker__marquee {
  display: flex;
  width: max-content;
  animation: fi-ticker-scroll 48s linear infinite;
  padding: 0.25rem 0;
}
.fi-image-ticker__marquee:hover {
  animation-play-state: paused;
}
.fi-image-ticker__track {
  display: flex;
  gap: clamp(0.65rem, 1.5vw, 1rem);
  flex-shrink: 0;
}
@keyframes fi-ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.fi-image-ticker__item {
  flex: 0 0 clamp(140px, 22vw, 200px);
  margin: 0;
  opacity: 0.82;
  transition: opacity 0.4s var(--fi-luxe-ease);
}
.fi-image-ticker__item:hover {
  opacity: 1;
}
.fi-image-ticker__item img,
.fi-image-ticker__item .tng-picture {
  width: 100%;
  height: clamp(100px, 16vw, 140px);
  object-fit: cover;
  display: block;
  filter: saturate(0.88) contrast(1.04);
  border-radius: 1px;
}

/* ── Shatter Glass Logo — Escher mark reveal ── */
.fi-shatter-logo {
  position: relative;
  display: inline-block;
  cursor: pointer;
  max-width: min(280px, 60vw);
  margin: 1.5rem 0;
  touch-action: manipulation;
}
.fi-shatter-logo__hint {
  display: block;
  margin-top: 0.65rem;
  font-size: 0.52rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--pair-amber, #c47a00) 70%, var(--pair-muted, #9a958c));
}
.fi-shatter-logo__canvas {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid color-mix(in srgb, var(--pair-text, #f5f0e8) 10%, transparent);
  background: color-mix(in srgb, var(--pair-bg, #050609) 80%, #12141a);
}
.fi-shatter-logo.is-shattered {
  cursor: default;
}
.fi-shatter-logo.is-shattered .fi-shatter-logo__hint {
  opacity: 0.4;
}

/* Reduced motion — static museum register */
@media (prefers-reduced-motion: reduce) {
  .fi-text-mask.is-ready .fi-text-mask__fill {
    animation: none;
  }
  .fi-image-ticker__marquee {
    animation: none;
    flex-wrap: wrap;
    width: auto;
    justify-content: center;
    padding: 0 clamp(1rem, 4vw, 2rem);
  }
  .fi-hover-lens .fi-lens-layer {
    display: none;
  }
}

/* ── Masterpiece Signatures — hallmark vitrine (Audacity) ── */
.masterpiece-sig {
  padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pair-atmo-left) 55%, transparent) 0%,
    color-mix(in srgb, var(--pair-atmo-deep) 90%, transparent) 100%
  );
  border-bottom: 1px solid color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 12%, transparent);
}
body.pair-threshold .masterpiece-sig {
  background: linear-gradient(
    180deg,
    var(--pair-interior-bg) 0%,
    color-mix(in srgb, var(--pair-interior-bg) 92%, #1a1612) 100%
  );
}
.masterpiece-sig__header {
  max-width: 72rem;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  text-align: center;
}
.masterpiece-sig__title {
  font-family: var(--pair-display-font);
  font-size: clamp(1.5rem, 3.5vw, 2.35rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  margin: 0.5rem 0 1rem;
}
.masterpiece-sig__lede {
  max-width: 42rem;
  margin: 0 auto;
  font-style: italic;
  line-height: 1.55;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.masterpiece-sig__hero-vitrine {
  max-width: 88rem;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}
.masterpiece-sig__item {
  display: grid;
  gap: 0;
  border: 1px solid color-mix(in srgb, var(--pair-text) 8%, transparent);
  background: color-mix(in srgb, var(--pair-atmo-left) 35%, transparent);
  overflow: hidden;
}
body.pair-threshold .masterpiece-sig__item {
  background: color-mix(in srgb, var(--pair-interior-bg) 88%, #e8e2d8);
  border-color: color-mix(in srgb, var(--pair-interior-text) 10%, transparent);
}
.masterpiece-sig__item--hero {
  grid-template-columns: 1fr;
}
.masterpiece-sig__item--spread .exhibition-hover-luxe__media {
  min-height: clamp(52vh, 68vw, 72vh);
}
.masterpiece-sig__item--spread .masterpiece-sig__img,
.masterpiece-sig__item--spread .exhibition-hover-luxe__media img,
.masterpiece-sig__item--spread .exhibition-hover-luxe__media .tng-picture {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: center 35%;
}
.masterpiece-sig__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.85rem, 2vw, 1.35rem);
  max-width: 88rem;
  margin: 0 auto;
}
.masterpiece-sig__item:not(.masterpiece-sig__item--hero) .exhibition-hover-luxe__media {
  aspect-ratio: 4 / 5;
  overflow: hidden;
}
.masterpiece-sig__img,
.masterpiece-sig__item .exhibition-hover-luxe__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.9) contrast(1.05);
}
.masterpiece-sig__caption {
  padding: clamp(1rem, 2.5vw, 1.5rem);
}
.masterpiece-sig__wall-label {
  margin-top: 0.75rem;
  text-align: left;
}
.masterpiece-sig__fabric,
.masterpiece-sig__texture,
.masterpiece-sig__color,
.masterpiece-sig__curator {
  margin: 0.35rem 0 0;
  font-size: 0.72rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.masterpiece-sig__curator {
  font-style: italic;
  margin-top: 0.65rem;
}
.masterpiece-sig__edition-strip {
  margin: 0.35rem 0 0.5rem;
  font-size: 0.52rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--exhibition-room-accent, var(--pair-amber));
}
.masterpiece-sig__edition-philosophy {
  margin: 0.75rem auto 0;
  font-size: 0.58rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--exhibition-room-accent, var(--pair-amber));
}
.masterpiece-mark-rationale {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 22%, transparent);
}
.masterpiece-mark-rationale__kicker {
  margin: 0 0 0.35rem;
  font-size: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--exhibition-room-accent, var(--pair-amber));
}
.masterpiece-mark-rationale__body {
  margin: 0;
  font-size: 0.72rem;
  font-style: italic;
  line-height: 1.55;
  letter-spacing: 0.02em;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
/* Barnes-style pedagogical ensemble labels */
.masterpiece-ensemble-label {
  margin: 0.85rem 0 0.65rem;
  padding: 0.85rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 18%, transparent);
}
.masterpiece-ensemble-label__kicker {
  margin: 0 0 0.45rem;
  font-size: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--exhibition-room-accent, var(--pair-amber));
}
.masterpiece-ensemble-label__ref {
  margin: 0 0 0.5rem;
  font-size: 0.68rem;
  font-weight: 600;
  font-style: italic;
  line-height: 1.45;
  letter-spacing: 0.01em;
  color: var(--pair-text, inherit);
}
.masterpiece-ensemble-label__why {
  margin: 0 0 0.55rem;
  font-size: 0.74rem;
  line-height: 1.62;
  letter-spacing: 0.015em;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.masterpiece-ensemble-label__neighbor {
  margin: 0;
  font-size: 0.68rem;
  line-height: 1.5;
  font-style: italic;
  color: color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 75%, var(--pair-muted));
}
.masterpiece-ensemble-label__neighbor-kicker {
  display: block;
  font-style: normal;
  font-size: 0.48rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  margin-bottom: 0.2rem;
  color: var(--exhibition-room-accent, var(--pair-amber));
}
.masterpiece-ensemble-label__source {
  position: absolute;
  top: 0.65rem;
  left: 0.65rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  max-width: 5.5rem;
  padding: 0.35rem;
  background: color-mix(in srgb, var(--pair-interior-bg, #f5f0e8) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--exhibition-room-accent, #c47a00) 25%, transparent);
  box-shadow: 0 2px 8px color-mix(in srgb, #000 12%, transparent);
}
.masterpiece-ensemble-label__plate-caption {
  font-size: 0.42rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.35;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.masterpiece-ensemble-label__plate,
.masterpiece-ensemble-label__plate.tng-picture img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  filter: saturate(0.85) contrast(1.05);
}
.exhibition-hover-luxe__media {
  position: relative;
}
.exhibition-wall-label__why {
  margin: 0.35rem 0 0;
  font-size: 0.65rem;
  line-height: 1.48;
  font-style: italic;
  letter-spacing: 0.02em;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.masterpiece-sig__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40vh;
  background: color-mix(in srgb, var(--pair-atmo-deep) 80%, transparent);
  color: var(--pair-muted);
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
@media (min-width: 900px) {
  .masterpiece-sig__item--spread {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: stretch;
  }
  .masterpiece-sig__item--spread .masterpiece-sig__caption {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(2rem, 4vw, 3rem);
  }
}
@media (max-width: 809px) {
  .masterpiece-sig__grid {
    grid-template-columns: 1fr;
  }
}

/* ── Barnes Room Envelope — Dr. Barnes pedagogical atmosphere ── */
.barnes-room {
  position: relative;
  isolation: isolate;
}
.barnes-room::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(
    ellipse 85% 70% at 50% 38%,
    transparent 35%,
    color-mix(in srgb, var(--barnes-vignette, #0d0a08) 72%, transparent) 100%
  );
  opacity: 0.55;
}
.barnes-room::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  border: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 18%, transparent);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--barnes-hardware, #c47a00) 8%, transparent),
    inset 0 1.5rem 3rem -1rem color-mix(in srgb, var(--barnes-window, #c47a00) 10%, transparent);
}
.barnes-room > * {
  position: relative;
  z-index: 1;
}
.barnes-room--caravaggio,
[data-barnes-room="caravaggio"] {
  --barnes-vignette: #0d0a08;
  --barnes-hardware: #c47a00;
  --barnes-window: rgba(196, 122, 0, 0.14);
  --barnes-crown-trim: rgba(196, 122, 0, 0.35);
}
.barnes-room--basquiat,
[data-barnes-room="basquiat"] {
  --barnes-vignette: #050609;
  --barnes-hardware: #e8c400;
  --barnes-window: rgba(232, 196, 0, 0.12);
  --barnes-crown-trim: rgba(200, 60, 80, 0.25);
}
.barnes-room--both,
[data-barnes-room="both"] {
  --barnes-vignette: #0a0c10;
  --barnes-hardware: #c47a00;
  --barnes-window: rgba(196, 122, 0, 0.1);
  --barnes-crown-trim: rgba(232, 196, 0, 0.2);
}
.barnes-room--threshold {
  --barnes-vignette: #1a1410;
}
.barnes-room--signatures {
  padding-top: clamp(1rem, 2vw, 1.5rem);
}
.barnes-room__envelope {
  position: relative;
  padding: clamp(0.5rem, 1.5vw, 1rem);
  background: var(--barnes-window, transparent);
  border-top: 2px solid color-mix(in srgb, var(--barnes-crown-trim, #c47a00) 40%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 22%, transparent);
}
.barnes-room__envelope::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--barnes-crown-trim, #c47a00) 20%,
    var(--barnes-crown-trim, #c47a00) 80%,
    transparent
  );
  opacity: 0.65;
}
.masterpiece-sig__item.barnes-room {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--barnes-hardware, #c47a00) 28%, transparent),
    0 0.75rem 2rem -0.5rem color-mix(in srgb, var(--barnes-vignette, #000) 55%, transparent);
}
.barnes-room__decoration-kicker {
  display: block;
  font-size: 0.46rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--barnes-hardware, var(--exhibition-room-accent));
  margin-bottom: 0.2rem;
}
.barnes-room__decoration-rationale {
  margin: 0.5rem 0 0.65rem;
  font-size: 0.68rem;
  font-style: italic;
  line-height: 1.5;
  color: var(--exhibition-label-muted, var(--pair-muted));
}

/* ── Ensemble strip — belt · shoes · square · suit ── */
.masterpiece-ensemble-strip {
  margin: 0.85rem 0 0.5rem;
  padding: 0.75rem 0 0;
  border-top: 1px dashed color-mix(in srgb, var(--barnes-hardware, #c47a00) 25%, transparent);
}
.masterpiece-ensemble-strip__kicker {
  margin: 0 0 0.65rem;
  font-size: 0.48rem;
  font-weight: 600;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--barnes-hardware, var(--exhibition-room-accent));
}
.masterpiece-ensemble-strip__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.55rem;
}
.masterpiece-ensemble-strip__item {
  margin: 0;
  padding: 0.35rem;
  border: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 20%, transparent);
  background: color-mix(in srgb, var(--pair-interior-bg, #f5f0e8) 75%, transparent);
}
.masterpiece-ensemble-strip__thumb,
.masterpiece-ensemble-strip__thumb.tng-picture img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  filter: saturate(0.82) contrast(1.05);
  margin-bottom: 0.35rem;
}
.masterpiece-ensemble-strip__role {
  display: block;
  font-size: 0.42rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--barnes-hardware, var(--exhibition-room-accent));
}
.masterpiece-ensemble-strip__label {
  display: block;
  font-size: 0.58rem;
  font-weight: 600;
  line-height: 1.35;
  margin: 0.15rem 0;
}
.masterpiece-ensemble-strip__why {
  margin: 0;
  font-size: 0.58rem;
  line-height: 1.45;
  font-style: italic;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
@media (max-width: 809px) {
  .masterpiece-ensemble-strip__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ── Natty Guru philosophy whisper ── */
.natty-guru-whisper {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: start;
  max-width: 52rem;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 3vw, 2rem);
}
.barnes-room--philosophy {
  border-bottom: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 15%, transparent);
}
.natty-guru-whisper__portrait {
  margin: 0;
  position: relative;
}
.natty-guru-whisper__portrait img {
  width: 100%;
  display: block;
  filter: saturate(0.75) contrast(1.12);
  border: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 35%, transparent);
  box-shadow: 0 0.5rem 1.5rem -0.25rem color-mix(in srgb, #000 45%, transparent);
}
.natty-guru-whisper__credit {
  margin-top: 0.45rem;
  font-size: 0.48rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--barnes-hardware, var(--exhibition-room-accent));
}
.natty-guru-whisper__quote {
  margin: 0;
  padding: 0;
  border: none;
}
.natty-guru-whisper__lead {
  margin: 0 0 0.85rem;
  font-family: var(--pair-display-font, inherit);
  font-size: clamp(1.05rem, 2.2vw, 1.45rem);
  font-weight: 600;
  font-style: italic;
  line-height: 1.45;
  letter-spacing: -0.02em;
  color: var(--pair-text, inherit);
}
.natty-guru-whisper__body {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  line-height: 1.62;
  color: var(--exhibition-label-muted, var(--pair-muted));
}
.natty-guru-whisper__whisper {
  margin: 0;
  font-size: 0.72rem;
  font-style: italic;
  line-height: 1.55;
  color: color-mix(in srgb, var(--barnes-hardware, #c47a00) 80%, var(--pair-muted));
}
@media (max-width: 640px) {
  .natty-guru-whisper {
    grid-template-columns: 1fr;
  }
  .natty-guru-whisper__portrait {
    max-width: 140px;
  }
}

/* ── Escher shatter teaser (inline on audacity) ── */
.escher-shatter-teaser {
  text-align: center;
  padding: clamp(2rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem);
  border-top: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 12%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 12%, transparent);
}
.escher-shatter-teaser .fi-shatter-logo {
  margin: 0 auto 1rem;
}
.escher-shatter-teaser__link {
  margin: 0;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
}

/* ── Cursor mask — DEPRECATED (use museum-cursor.mjs) ── */
.fi-cursor-mask {
  /* Stripped — stuck first-frame mask removed; use fi-hover-lens + museum-cursor */
}

/* ── Jacket reveal — one-side lapel peel → full lining (bc_sig_01 / Chesterfield) ── */
.fi-jacket-reveal {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  cursor: pointer;
  touch-action: manipulation;
  overflow: hidden;
  isolation: isolate;
}
.fi-jacket-reveal__stage {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
}
.fi-jacket-reveal__lining,
.fi-jacket-reveal__exterior {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: center 35%;
}
.fi-jacket-reveal__lining {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 0.55s var(--fi-luxe-ease), transform 0.65s var(--fi-luxe-ease), clip-path 0.55s var(--fi-luxe-ease);
  filter: saturate(1.05) contrast(1.06);
  pointer-events: none;
}
.fi-jacket-reveal__lining--left {
  z-index: 1;
}
.fi-jacket-reveal__lining--full {
  z-index: 0;
}
.fi-jacket-reveal__lining--fallback {
  clip-path: inset(0 38% 0 0);
}
.fi-jacket-reveal__shell {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
}
.fi-jacket-reveal__exterior {
  position: relative;
  z-index: 1;
  transition: opacity 0.45s var(--fi-luxe-ease);
}
.fi-jacket-reveal__lapel {
  position: absolute;
  top: 0;
  width: 52%;
  height: 100%;
  z-index: 2;
  background-size: 200% 100%;
  background-position: center 35%;
  background-repeat: no-repeat;
  transition: transform 0.65s var(--fi-luxe-ease), opacity 0.45s var(--fi-luxe-ease);
  pointer-events: none;
  mix-blend-mode: normal;
}
.fi-jacket-reveal__lapel--left {
  left: 0;
  transform-origin: top left;
  background-position: left center;
  clip-path: polygon(0 0, 100% 0, 72% 100%, 0 100%);
}
.fi-jacket-reveal__lapel--right {
  right: 0;
  transform-origin: top right;
  background-position: right center;
  clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%);
}
/* State 1 — left lapel peel, partial interior */
.fi-jacket-reveal.is-state-left .fi-jacket-reveal__lapel--left {
  transform: perspective(900px) rotateY(-58deg) translateX(-6%);
}
.fi-jacket-reveal.is-state-left .fi-jacket-reveal__lining--left {
  opacity: 1;
  transform: scale(1);
}
.fi-jacket-reveal.is-state-left .fi-jacket-reveal__exterior {
  opacity: 0.72;
}
/* State 2 — both lapels peel, full lining */
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__lapel--left {
  transform: perspective(900px) rotateY(-58deg) translateX(-6%);
}
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__lapel--right {
  transform: perspective(900px) rotateY(58deg) translateX(6%);
}
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__exterior {
  opacity: 0;
}
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__lining--left {
  opacity: 0;
}
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__lining--full {
  opacity: 1;
  transform: scale(1);
}
.fi-jacket-reveal__hint {
  position: absolute;
  bottom: 0.65rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
  font-size: 0.42rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.3rem 0.55rem;
  background: color-mix(in srgb, var(--pair-interior-bg, #f5f0e8) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--barnes-hardware, #c47a00) 30%, transparent);
  color: var(--exhibition-label-muted, var(--pair-muted));
  opacity: 0.85;
  transition: opacity 0.35s var(--fi-luxe-ease);
  pointer-events: none;
  white-space: nowrap;
}
.fi-jacket-reveal.is-state-left .fi-jacket-reveal__hint,
.fi-jacket-reveal.is-state-both .fi-jacket-reveal__hint {
  opacity: 0.45;
}
.exhibition-hover-luxe__media.fi-jacket-reveal {
  min-height: inherit;
}
.masterpiece-sig__item--spread .fi-jacket-reveal__stage {
  min-height: clamp(52vh, 68vw, 72vh);
}

@media (prefers-reduced-motion: reduce) {
  .fi-jacket-reveal__lining,
  .fi-jacket-reveal__exterior,
  .fi-jacket-reveal__lapel {
    transition: none;
  }
  .fi-jacket-reveal.is-state-left .fi-jacket-reveal__lapel--left,
  .fi-jacket-reveal.is-state-both .fi-jacket-reveal__lapel--left,
  .fi-jacket-reveal.is-state-both .fi-jacket-reveal__lapel--right {
    transform: none;
    opacity: 0;
  }
  .fi-jacket-reveal:not(.is-state-both) .fi-jacket-reveal__lining--full {
    opacity: 0;
  }
  .fi-jacket-reveal:not(.is-state-left):not(.is-state-both) .fi-jacket-reveal__lining--left {
    opacity: 0;
  }
  .fi-jacket-reveal.is-state-both .fi-jacket-reveal__exterior {
    opacity: 0;
  }
}

/* ── Exhibition component dividers — visible section breaks (Audacity) ── */
.exhibition-component-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  padding: clamp(1.25rem, 3vw, 2rem) clamp(1rem, 4vw, 2.5rem);
  margin: 0;
  border-top: 2px solid color-mix(in srgb, var(--pair-amber, #c47a00) 55%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--pair-amber, #c47a00) 18%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pair-amber, #c47a00) 8%, transparent) 0%,
    transparent 100%
  );
}
.exhibition-component-divider__chip {
  display: inline-block;
  padding: 0.35rem 0.85rem;
  font-size: 0.58rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--pair-amber, #c47a00);
  border: 1px solid color-mix(in srgb, var(--pair-amber, #c47a00) 45%, transparent);
  border-radius: 2px;
  background: color-mix(in srgb, var(--pair-bg, #050609) 70%, #1a1612);
}
.exhibition-component-divider__title {
  margin: 0;
  font-family: var(--pair-display-font);
  font-size: clamp(1rem, 2.2vw, 1.45rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  text-align: center;
}

/* fi-fluid-image — alias for exhibition-hover-luxe scale on gallery frames */
.fi-fluid-image.exhibition-hover-luxe .exhibition-hover-luxe__media img,
.fi-fluid-image.exhibition-hover-luxe .exhibition-hover-luxe__media .tng-picture img {
  transition: transform 0.65s var(--fi-luxe-ease, cubic-bezier(0.22, 1, 0.36, 1)),
    filter 0.55s var(--fi-luxe-ease, cubic-bezier(0.22, 1, 0.36, 1));
}
.fi-fluid-image.exhibition-hover-luxe:hover .exhibition-hover-luxe__media img,
.fi-fluid-image.exhibition-hover-luxe:focus-within .exhibition-hover-luxe__media img {
  transform: scale(1.06);
  filter: saturate(0.94) contrast(1.06);
}

.natty-guru-whisper__title {
  margin: 0.35rem 0 1.25rem;
  font-family: var(--pair-display-font);
  font-size: clamp(1.35rem, 3vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  text-align: center;
}