/* House follows the selected reference, using the existing 1927 copy and photos.
   The shared navigation and page background remain in their own layers. */
.house-reference-page {
  --house-edge: rgb(233 217 183 / 27%);
  --house-gold-edge: rgb(209 176 110 / 66%);
  --house-radius: 21px;
  padding: 103px 28px 32px;
  color: var(--paper);
}
.house-reference-frame {
  position: relative;
  width: min(1988px, 100%);
  margin-inline: auto;
  padding: 38px clamp(36px, 5.2vw, 108px) 34px;
  border: 1px solid transparent;
  border-radius: 18px;
  background: transparent;
  box-shadow: none;
}
.house-reference-frame::before {
  display: none;
  content: '';
  position: absolute;
  inset: 5px;
  pointer-events: none;
  border: 1px solid rgb(233 217 183 / 7%);
  border-radius: 13px;
}
.house-reference-intro { margin-bottom: 42px; }
.house-reference-intro>.eyebrow {
  margin: 0 0 17px;
  color: var(--gold);
  font-size: .75rem;
  letter-spacing: .14em;
}
.house-reference-intro h1 {
  margin: 0;
  font-size: clamp(5.3rem, 6.3vw, 8.3rem);
  font-weight: 400;
  line-height: 1.01;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.house-reference-description {
  max-width: 48ch;
  margin: 23px 0 0;
  color: var(--paper);
  font-size: clamp(1rem, 1.04vw, 1.2rem);
  font-weight: 300;
  line-height: 1.65;
}
.house-reference-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(20px, 1.48vw, 31px);
  align-items: stretch;
}
.house-reference-card-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: inherit;
  min-width: 0;
}
.venue-directory {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 1.48vw, 31px);
}
.house-reference-card {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  min-width: 0;
  padding: 0;
  text-align: left;
  height: clamp(250px, 15.5vw, 320px);
  overflow: hidden;
  border: 1px solid var(--house-gold-edge);
  border-radius: var(--house-radius);
  background: #471414;
  box-shadow: inset 0 1px 0 rgb(255 240 198 / 20%), 0 6px 20px rgb(25 4 4 / 16%);
  color: var(--paper);
  text-decoration: none;
  transition: transform 220ms cubic-bezier(.2,.8,.2,1), border-color 180ms ease;
}
.house-reference-photo {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 360ms cubic-bezier(.2,.8,.2,1);
}
/* Blur only the photo below the title's midpoint; the text sits above both layers. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .house-reference-card::before {
    content: '';
    position: absolute;
    inset: auto 0 0;
    z-index: -1;
    height: var(--house-blur-height, 80px);
    max-height: 100%;
    pointer-events: none;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    -webkit-mask-image: linear-gradient(to bottom, transparent, rgb(0 0 0 / 35%) 40%, #000);
    mask-image: linear-gradient(to bottom, transparent, rgb(0 0 0 / 35%) 40%, #000);
  }
}
.house-reference-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, rgb(16 9 9 / 0%) 18%, rgb(16 9 9 / 8%) 38%, rgb(20 10 10 / 72%) 72%, #261010 100%);
}
.house-reference-card-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 31px clamp(20px, 1.43vw, 30px) 35px;
  transform: translateY(.5cm);
}
.house-reference-card-copy h2, .house-reference-card-copy .venue-name {
  min-width: 0;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(2rem, 2.35vw, 3.15rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.02em;
}
.house-reference-card-text { flex: 1; min-width: 0; }
.house-reference-card-hint {
  margin: 8px 0 0;
  color: var(--muted);
  font-family: var(--body);
  font-size: clamp(.75rem, .7vw, .8125rem);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.house-reference-arrow {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  color: var(--gold);
  background: transparent;
  box-shadow: none;
}
.house-reference-arrow-icon {
  display: block;
  flex-shrink: 0;
  width: 23px;
  height: 23px;
  background: currentColor;
  -webkit-mask: url('../icons/phosphor/arrow-up-right.svg') center / contain no-repeat;
  mask: url('../icons/phosphor/arrow-up-right.svg') center / contain no-repeat;
  transform: rotate(45deg);
}
.house-reference-membership {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  margin-top: 30px;
  min-height: 182px;
  padding: 30px 36px;
  border: 1px solid var(--house-edge);
  border-radius: var(--house-radius);
  background: rgb(71 20 20 / 58%);
  box-shadow: inset 0 1px 0 rgb(233 217 183 / 10%);
}
.house-reference-monogram { width: 43px; height: 63px; object-fit: contain; }
.house-reference-membership .eyebrow { margin: 0 0 7px; font-size: .7rem; letter-spacing: .18em; color: var(--gold); }
.house-reference-membership h2 { margin: 0; font-size: clamp(2rem, 2.13vw, 2.8rem); line-height: 1.08; font-weight: 400; }
.house-reference-membership-copy>p:last-child { max-width: 64ch; margin: 13px 0 0; font-size: .92rem; line-height: 1.8; color: var(--muted); }
.house-reference-membership-action {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  min-width: 290px;
  min-height: 64px;
  padding: 17px 25px;
  border: 1px solid var(--house-gold-edge);
  border-radius: 6px;
  background: rgb(71 20 20 / 48%);
  box-shadow: inset 0 1px 0 rgb(233 217 183 / 15%);
  color: var(--paper);
  font-family: var(--body);
  font-size: .77rem;
  font-weight: 400;
  letter-spacing: .11em;
  line-height: 1.6;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform 180ms cubic-bezier(.2,.8,.2,1), background 180ms ease;
}
.house-reference-card:focus-visible { outline: 2px solid var(--paper); outline-offset: 5px; }
.house-reference-membership-action:focus-visible { outline: 2px solid var(--paper); outline-offset: 5px; }
.house-reference-card:active, .house-reference-membership-action:active { transform: scale(.985); transition-duration: 70ms; }
@media (hover:hover) and (pointer:fine) {
  .house-reference-card:hover { transform: translateY(-3px); border-color: var(--paper); }
  .house-reference-card:hover .house-reference-photo { transform: scale(1.025); }
  .house-reference-membership-action:hover { background: rgb(233 217 183 / 10%); }
}
@media (max-width:1399px) {
  .house-reference-frame { padding-inline: 42px; }
  .house-reference-card-copy { padding-inline: 18px; gap: 8px; }
  .house-reference-membership { gap: 22px; padding-inline: 26px; }
  .house-reference-membership-action { min-width: 255px; padding-inline: 20px; gap: 20px; font-size: .71rem; }
}
@media (max-width:1199px) {
  .house-reference-page { padding-inline: 22px; }
  .house-reference-frame { padding: 35px 32px 30px; }
  .house-reference-intro { margin-bottom: 32px; }
  .house-reference-cards, .venue-directory { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
  .house-reference-card-row { display: contents; }
  .house-reference-card { height: 240px; }
  .house-reference-card-copy h2, .house-reference-card-copy .venue-name { font-size: 2.5rem; }
  .house-reference-membership { grid-template-columns: 43px minmax(0,1fr); gap: 20px; }
  .house-reference-membership-action { grid-column: 2; justify-self: start; min-width: 290px; }
}
@media (max-width:800px) {
  .house-reference-page { padding: 89px 16px 24px; }
  .house-reference-frame { padding: 29px 22px 24px; border-radius: 16px; }
  .house-reference-intro h1 { font-size: clamp(4rem, 9vw, 5.3rem); }
  .house-reference-description { margin-top: 18px; font-size: 1rem; }
  .house-reference-cards, .venue-directory { gap: 15px; }
  .house-reference-card-copy { padding: 24px 16px; gap: 8px; }
  .house-reference-card-copy h2, .house-reference-card-copy .venue-name { font-size: 2rem; }
  .house-reference-membership { margin-top: 22px; padding: 25px 22px; }
}
@media (max-width:700px) {
  .house-reference-cards, .venue-directory { grid-template-columns: 1fr; gap: 17px; }
  .house-reference-card { height: 210px; }
  .house-reference-card-copy { padding: 25px 23px; gap: 20px; }
  .house-reference-card-copy h2, .house-reference-card-copy .venue-name { font-size: 2.65rem; }
  .house-reference-card::after { background: linear-gradient(180deg, rgb(16 9 9 / 0%) 12%, rgb(16 9 9 / 16%) 38%, rgb(20 10 10 / 78%) 72%, #261010 100%); }
  .house-reference-card .house-reference-photo { object-position: center 42%; }
}
@media (max-width:480px) {
  .house-reference-page { padding-inline: 12px; }
  .house-reference-frame { padding: 26px 16px 18px; }
  .house-reference-frame::before { inset: 4px; }
  .house-reference-intro { margin-bottom: 27px; }
  .house-reference-intro>.eyebrow { margin-bottom: 12px; font-size: .72rem; }
  .house-reference-intro h1 { font-size: clamp(3.5rem, 15vw, 4.2rem); line-height: 1.02; }
  .house-reference-description { font-size: .97rem; line-height: 1.75; }
  .house-reference-card-copy { padding: 24px 20px; gap: 12px; }
  .house-reference-card-copy h2, .house-reference-card-copy .venue-name { font-size: 2.6rem; }
  .house-reference-membership { grid-template-columns: 32px minmax(0,1fr); gap: 16px; padding: 24px 18px; }
  .house-reference-monogram { width: 31px; height: 49px; align-self: start; margin-top: 4px; }
  .house-reference-membership h2 { font-size: 2.25rem; }
  .house-reference-membership-copy>p:last-child { margin-top: 12px; font-size: .87rem; line-height: 1.8; }
  .house-reference-membership-action { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 58px; gap: 16px; padding: 16px; font-size: .71rem; }
}
@media (max-width:350px) {
  .house-reference-frame { padding-inline: 13px; }
  .house-reference-card-copy { padding-inline: 17px; }
  .house-reference-membership { padding-inline: 14px; }
}
/* Each desktop row is an independent three-card accordion.
   Explicit tracks interpolate smoothly; keyboard changes remain immediate. */
@media (min-width:1200px) and (hover:hover) and (pointer:fine) {
  .house-reference-card-row { transition: grid-template-columns 800ms ease; }
  .house-reference-card-row:has(>.house-reference-card:nth-child(1):hover) { grid-template-columns: minmax(0,2.2fr) minmax(0,1fr) minmax(0,1fr); }
  .house-reference-card-row:has(>.house-reference-card:nth-child(2):hover) { grid-template-columns: minmax(0,1fr) minmax(0,2.2fr) minmax(0,1fr); }
  .house-reference-card-row:has(>.house-reference-card:nth-child(3):hover) { grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,2.2fr); }
  .keyboard-input .house-reference-card-row,
  .house-reference-cards:has(.house-reference-card:focus-visible) .house-reference-card-row { transition: none; }
  .house-reference-card-row:has(>.house-reference-card:nth-child(1):focus-visible) { grid-template-columns: minmax(0,2.2fr) minmax(0,1fr) minmax(0,1fr); }
  .house-reference-card-row:has(>.house-reference-card:nth-child(2):focus-visible) { grid-template-columns: minmax(0,1fr) minmax(0,2.2fr) minmax(0,1fr); }
  .house-reference-card-row:has(>.house-reference-card:nth-child(3):focus-visible) { grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,2.2fr); }
  .house-reference-cards .house-reference-card:hover,
  .house-reference-cards .house-reference-card:focus-visible {
    border-color: rgb(221 189 126 / 90%);
    box-shadow: inset 0 0 0 1px rgb(233 205 150 / 23%), 0 6px 20px rgb(25 4 4 / 16%);
  }
}
@media (prefers-reduced-motion:reduce) {
  .house-reference-card-row, .house-reference-card, .house-reference-photo, .house-reference-membership-action { transition: none; }
  .house-reference-card:hover, .house-reference-card:active,
  .house-reference-card:hover .house-reference-photo, .house-reference-membership-action:active { transform: none; }
}
@media (prefers-reduced-transparency:reduce) {
  .house-reference-card::before { display: none; }
  .house-reference-membership, .house-reference-membership-action { background: #471414; }
}
@media (prefers-contrast:more) {
  .house-reference-page { --house-edge: #d1b06e; --house-gold-edge: #e9d9b7; }
  .house-reference-membership, .house-reference-membership-action { background: #471414; }
  .house-reference-membership-copy>p:last-child { color: var(--paper); }
}

/* Align each plain arrow with the caption line beneath its title. */
.house-reference-cards .house-reference-arrow { align-self: flex-end; height: 20px; }

/* The member greeting keeps 1927's display face, with a quieter scale and clear spacing. */
.house-reference-intro.house-member-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(224px, 19.44vw, 384px);
  align-items: start;
  column-gap: clamp(24px, 4vw, 72px);
  margin-bottom: 72px;
}
.house-member-greeting { display: flex; flex-direction: column; align-self: start; min-width: 0; height: clamp(138.27px, 12vw, 237.04px); }
.house-member-intro .house-member-welcome {
  margin: 0 0 16px;
  color: var(--paper);
  font-family: var(--body);
  font-size: clamp(.875rem, 1.05vw, .9375rem);
  font-style: normal;
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: .045em;
  text-transform: lowercase;
}
.house-member-intro h1 {
  max-width: 100%;
  font-family: var(--display);
  font-size: clamp(3.25rem, 4.45vw, 4.8rem);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.house-member-salutation { color: rgb(233 217 183 / 88%); font-weight: 300; letter-spacing: .025em; text-transform: uppercase; }
.house-member-name { margin-left: .06em; white-space: nowrap; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; }
.house-member-badges {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  margin-top: auto;
}
.house-member-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid rgb(233 217 183 / 24%);
  border-radius: 8px;
  background: rgb(233 217 183 / 8%);
  color: var(--paper);
  font-family: var(--body);
  font-size: .6875rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.house-member-badge-pending {
  border-color: rgb(209 176 110 / 40%);
  background: rgb(209 176 110 / 10%);
  color: var(--gold);
}

/* The supplied monogram and quiet pattern belong to the card, not the page. */
.member-card-stage {
  container-type: inline-size;
  container-name: member-card-stage;
  display: grid;
  justify-items: stretch;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin: 0;
}
.member-card {
  position: relative;
  isolation: isolate;
  width: 100%;
  aspect-ratio: 1.62;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgb(209 176 110 / 62%);
  border-radius: 16px;
  background: linear-gradient(125deg, #471414, #361112 43%, #210b0d);
  color: var(--paper);
  box-shadow: inset 0 1px 0 rgb(251 228 173 / 24%), 0 12px 30px rgb(25 4 4 / 22%);
  transform-origin: center;
  animation: member-card-float 8s var(--ease-in-out) infinite;
  animation-play-state: paused;
}
.member-card::after {
  content: '';
  position: absolute;
  inset: 6px;
  z-index: 3;
  pointer-events: none;
  border: 1px solid rgb(209 176 110 / 18%);
  border-radius: 11px;
}
.member-card-surface {
  position: absolute;
  inset: 0;
  z-index: 0;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 22px;
}
.member-card-surface::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: url('../../images/brand/pattern-geometric.svg') right center / 70px auto;
  opacity: .25;
  -webkit-mask-image: linear-gradient(90deg, transparent 5%, #000);
  mask-image: linear-gradient(90deg, transparent 5%, #000);
}
.member-card-top, .member-card-bottom {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}
.member-card-top { align-items: flex-start; }
.member-card-bottom { align-items: flex-end; }
.member-card-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.member-card-monogram { display: block; width: 35px; height: 50px; object-fit: contain; flex-shrink: 0; }
.member-card-tier {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 5px 9px;
  border: 1px solid rgb(209 176 110 / 35%);
  border-radius: 4px;
  background: rgb(209 176 110 / 8%);
  color: var(--gold);
  font-family: var(--body);
  font-size: .5625rem;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.member-card-details { min-width: 0; padding-bottom: 2px; }
.member-card-name {
  display: block;
  font-family: var(--display);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.015em;
}
.member-card-number {
  display: block;
  margin-top: 8px;
  font-family: var(--body);
  font-size: .75rem;
  font-weight: 400;
  font-variant-numeric: lining-nums tabular-nums;
  line-height: 1.4;
  letter-spacing: .16em;
  color: var(--gold);
}
.member-card-validity {
  margin: 7px 0 0;
  color: var(--muted);
  font-family: var(--body);
  font-size: .625rem;
  font-weight: 300;
  line-height: 1.5;
}
.member-card-validity span { color: var(--paper); }
.member-card-code { flex-shrink: 0; text-align: center; }
.member-card-code img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: contain;
  border: 1px solid rgb(233 217 183 / 24%);
  border-radius: 4px;
  background: var(--paper);
}
.member-card-code-label {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-family: var(--body);
  font-size: .5rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.member-card-shine {
  position: absolute;
  top: -60%;
  left: -55%;
  z-index: 2;
  width: 42%;
  height: 220%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgb(255 235 191 / 14%), transparent);
  opacity: 0;
  transform: translate3d(0, 0, 0) rotate(18deg);
  animation: member-card-shine 12s var(--ease-in-out) infinite;
  animation-delay: -5s;
  animation-play-state: paused;
}
.member-card[data-card-motion=running], .member-card[data-card-motion=running] .member-card-shine { animation-play-state: running; }
.member-card[data-card-motion=paused], .member-card[data-card-motion=paused] .member-card-shine { animation-play-state: paused; }
.member-card-motion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  min-height: 32px;
  padding: 4px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-family: var(--body);
  font-size: .6875rem;
  font-weight: 300;
  line-height: 1.4;
  cursor: pointer;
}
.member-card-motion[hidden] { display: none; }
.member-card-motion:focus-visible { outline: 2px solid var(--paper); outline-offset: 2px; }
@media (hover:hover) and (pointer:fine) {
  .member-card-motion:hover { color: var(--paper); background: rgb(233 217 183 / 5%); }
}
@keyframes member-card-float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0); }
  50% { transform: translate3d(0, -5px, 0) rotate(.6deg); }
}
@keyframes member-card-shine {
  0%, 58% { opacity: 0; transform: translate3d(0, 0, 0) rotate(18deg); }
  65% { opacity: .55; }
  84%, 100% { opacity: 0; transform: translate3d(450%, 0, 0) rotate(18deg); }
}
@container member-card-stage (min-width:350px) {
  .member-card-surface { padding: 26px; }
  .member-card-name { font-size: 1.75rem; }
  .member-card-code img { width: 72px; height: 72px; }
  .member-card-tier { font-size: .625rem; }
  .member-card-number { font-size: .8125rem; }
  .member-card-validity { font-size: .6875rem; }
}
@media (max-width:1000px) {
  .member-card-surface { padding: 18px; }
  .member-card-monogram { width: 31px; height: 44px; }
  .member-card-brand { gap: 8px; }
  .member-card-top, .member-card-bottom { gap: 12px; }
  .member-card-code img { width: 58px; height: 58px; }
  .member-card-name { font-size: 1.375rem; }
}
@media (max-width:700px) {
  .house-reference-intro.house-member-intro { grid-template-columns: minmax(0, 1fr); row-gap: 30px; margin-bottom: 44px; }
  .house-member-greeting { height: auto; }
  .house-member-intro .house-member-welcome { margin-bottom: 14px; font-size: .875rem; letter-spacing: .035em; }
  .house-member-intro h1 { font-size: clamp(2.9rem, 8vw, 3.6rem); }
  .house-member-badges { margin-top: 18px; }
  .member-card-stage { width: 80%; max-width: 248px; justify-self: start; }
  .member-card-motion { min-height: 44px; padding: 8px; }
}
@media (max-width:480px) {
  .house-member-badge { padding-inline: 10px; letter-spacing: .1em; }
  .house-member-intro h1 { font-size: clamp(2.8rem, 11.5vw, 3.35rem); }
}
@media (max-width:350px) {
  .member-card-surface { padding: 16px; }
  .member-card-top, .member-card-bottom { gap: 9px; }
  .member-card-monogram { width: 28px; height: 40px; }
  .member-card-tier { padding-inline: 7px; font-size: .5rem; }
  .member-card-code img { width: 54px; height: 54px; }
  .member-card-name { font-size: 1.3rem; }
  .member-card-number { font-size: .6875rem; }
}
/* Readable details adapt to the physical card width rather than scaling the text. */
@container member-card-stage (max-width:300px) {
  .member-card-surface { padding: 18px; }
  .member-card-top, .member-card-bottom { gap: 12px; }
  .member-card-brand { gap: 8px; }
  .member-card-monogram { width: 31px; height: 44px; }
  .member-card-name { font-size: 1.375rem; }
  .member-card-code img { width: 58px; height: 58px; }
}
@container member-card-stage (max-width:250px) {
  .member-card-surface { padding: 13px; }
  .member-card-top, .member-card-bottom { gap: 9px; }
  .member-card-brand { gap: 7px; }
  .member-card-monogram { width: 25px; height: 34px; }
  .member-card-tier { min-height: 22px; padding: 4px 7px; font-size: .5rem; letter-spacing: .1em; }
  .member-card-name { font-size: 1.1875rem; }
  .member-card-number { margin-top: 4px; font-size: .65625rem; letter-spacing: .13em; }
  .member-card-validity { margin-top: 4px; font-size: .59375rem; line-height: 1.4; }
  .member-card-code img { width: 46px; height: 46px; }
  .member-card-code-label { margin-top: 4px; font-size: .5rem; letter-spacing: .1em; }
}
@media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
  .house-member-badge { background: #471414; border-color: var(--gold); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .member-card { background: #471414; }
  .member-card-surface::before { display: none; }
  .member-card-tier { background: #471414; }
  .member-card-validity, .member-card-code-label, .member-card-motion { color: var(--paper); }
}
@media (prefers-contrast:more) {
  .member-card, .member-card::after, .member-card-tier { border-color: var(--gold); }
  .member-card-shine { display: none; }
}
@media (prefers-reduced-motion:reduce) {
  .member-card { animation: none; transform: none; }
  .member-card-shine { animation: none; opacity: 0; }
}

/* A slow, small sway belongs to the artwork only; the page stays still. */
body:has(main[data-page=house]), body:has(main[data-page=dashboard]) {
  overflow-x: clip;
}
body:has(main[data-page=house])::before, body:has(main[data-page=dashboard])::before {
  inset-inline: -2%;
  animation: house-artwork-sway 56s var(--ease-in-out) infinite;
}
@keyframes house-artwork-sway {
  0%, 100% { transform: translate3d(-1.5%, 0, 0); }
  50% { transform: translate3d(1.5%, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  body:has(main[data-page=house])::before, body:has(main[data-page=dashboard])::before {
    inset-inline: 0;
    animation: none;
    transform: none;
  }
}
/* Official Venues directory and detail pages. */
.venues-frame, .venue-detail-frame { width: min(1680px, 100%); }
.venues-intro { max-width: 1050px; }
.venues-intro h1 { font-size: clamp(4rem, 6.2vw, 7.2rem); }
.venues-directory-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 2vw, 34px);
}
.venue-directory-card {
  overflow: hidden;
  border: 1px solid var(--house-edge);
  border-radius: var(--house-radius);
  background: rgb(71 20 20 / 58%);
  box-shadow: inset 0 1px 0 rgb(233 217 183 / 10%), 0 18px 50px rgb(12 3 3 / 18%);
  -webkit-backdrop-filter: blur(12px) saturate(115%);
  backdrop-filter: blur(12px) saturate(115%);
}
.venue-directory-media { display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #180808; }
.venue-directory-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 800ms var(--ease-out); }
.venue-directory-body { padding: clamp(24px, 2.15vw, 36px); }
.venue-directory-body h2 { margin: 0; font-size: clamp(2.4rem, 3vw, 4rem); line-height: 1.05; }
.venue-directory-capacity, .venue-detail-capacity {
  margin: 14px 0 0;
  color: var(--gold);
  font-family: var(--body);
  font-size: .72rem;
  font-weight: 400;
  letter-spacing: .13em;
  line-height: 1.6;
  text-transform: uppercase;
}
.venue-directory-description { min-height: 3.8em; margin: 16px 0 0; color: var(--muted); font-size: .94rem; line-height: 1.8; }
.venue-directory-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 25px; }
.venue-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 11px 20px;
  border: 1px solid var(--house-gold-edge);
  border-radius: 999px;
  background: rgb(71 20 20 / 35%);
  color: var(--paper);
  font: 400 .69rem/1.4 var(--body);
  letter-spacing: .13em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, transform 180ms var(--ease-out);
}
.venue-action-solid { background: var(--paper); color: var(--wine); border-color: var(--paper); }
.venue-action:focus-visible, .venue-directory-media:focus-visible, .venue-gallery-grid button:focus-visible, .venue-back-link:focus-visible { outline: 2px solid var(--paper); outline-offset: 4px; }
@media (hover:hover) and (pointer:fine) {
  .venue-directory-card:hover .venue-directory-media img { transform: scale(1.025); }
  .venue-action:hover { background: rgb(233 217 183 / 13%); transform: translateY(-2px); }
  .venue-action-solid:hover { background: #fff1cd; color: var(--wine); }
}
.venue-back-link { display: inline-flex; margin-bottom: 30px; color: var(--muted); font: 400 .75rem/1.5 var(--body); letter-spacing: .08em; text-decoration: none; }
.venue-detail-header { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 34px; }
.venue-detail-header h1 { margin: 0; font-size: clamp(4rem, 6.4vw, 8rem); line-height: .96; letter-spacing: -.025em; }
.venue-detail-capacity span { margin-inline: 8px; color: var(--muted); }
.venue-detail-hero { display: block; width: 100%; aspect-ratio: 2.2 / 1; max-height: 660px; object-fit: cover; border: 1px solid var(--house-edge); border-radius: var(--house-radius); background: #180808; }
.venue-detail-content { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .72fr); gap: clamp(45px, 7vw, 110px); margin-top: clamp(42px, 5vw, 76px); }
.venue-detail-description { max-width: 60ch; margin: 0; color: var(--paper); font-size: clamp(1.1rem, 1.3vw, 1.4rem); font-weight: 300; line-height: 1.9; }
.venue-detail-content h2, .venue-gallery>h2 { margin: 40px 0 20px; font-size: clamp(2rem, 2.5vw, 3rem); line-height: 1.1; }
.venue-detail-side>h2 { margin-top: 0; }
.venue-detail-content ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--house-edge); }
.venue-detail-content li { padding: 14px 0; border-bottom: 1px solid var(--house-edge); color: var(--muted); font: 300 .94rem/1.7 var(--body); }
.venue-detail-main li::before { content: '✦'; margin-right: 12px; color: var(--gold); }
.venue-detail-cta { display: grid; gap: 18px; margin-top: 30px; padding: 24px; border: 1px solid var(--house-edge); border-radius: 16px; background: rgb(71 20 20 / 48%); }
.venue-detail-cta strong { color: var(--gold); font: 400 .75rem/1.5 var(--body); letter-spacing: .14em; text-transform: uppercase; }
.venue-gallery { margin-top: clamp(52px, 7vw, 100px); }
.venue-gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.venue-gallery-grid button { overflow: hidden; padding: 0; aspect-ratio: 16 / 10; border: 1px solid var(--house-edge); border-radius: 16px; background: #180808; cursor: zoom-in; }
.venue-gallery-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease-out); }
.venue-gallery-grid button:hover img { transform: scale(1.02); }
.venue-page-note { margin: 62px 0 10px; color: var(--muted); font: 400 .7rem/1.6 var(--body); letter-spacing: .12em; text-transform: uppercase; }
@media (max-width:900px) {
  .venues-directory-grid, .venue-gallery-grid { grid-template-columns: 1fr; }
  .venue-directory-description { min-height: 0; }
  .venue-detail-content { grid-template-columns: 1fr; gap: 32px; }
  .venue-detail-header { align-items: flex-start; flex-direction: column; }
}
@media (max-width:600px) {
  .venues-intro h1 { font-size: clamp(3.35rem, 14vw, 4.6rem); }
  .venue-directory-body { padding: 23px 20px 26px; }
  .venue-directory-body h2 { font-size: 2.75rem; }
  .venue-directory-actions .venue-action { flex: 1; }
  .venue-detail-header h1 { font-size: clamp(3.6rem, 16vw, 5rem); }
  .venue-detail-header .venue-action { width: 100%; }
  .venue-detail-hero { aspect-ratio: 4 / 3; }
  .venue-detail-content { margin-top: 34px; }
  .venue-detail-description { font-size: 1.05rem; line-height: 1.8; }
  .venue-gallery-grid { gap: 14px; }
  .venue-gallery-grid button { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
  .venue-directory-card, .venue-detail-cta { background: #471414; -webkit-backdrop-filter: none; backdrop-filter: none; }
}