/* ============================================================
   BLANC PC CLUB — gallery-style computer club
   Container scheme : A — boxed-1200
   Spacing scale    : monastic (160 / 96, 72 mobile)
   ============================================================ */

:root{
  /* palette */
  --c-bg:      #fcfcfa;   /* white cube, primary */
  --c-bg-dark: #1c1c1a;   /* the store room, single dark section */
  --c-ink:     #1c1c1a;   /* ink on light */
  --c-ink-inv: #fcfcfa;   /* ink on dark */
  --c-a1:      #8a8a86;   /* label grey — plays the accent role */
  --c-a2:      #8a8a86;   /* grey is the only accent */

  /* fonts */
  --f-display: "Figtree", "Inter", system-ui, sans-serif;
  --f-body:    "Inter", system-ui, -apple-system, sans-serif;

  /* form / shape */
  --r-card: 0px;
  --line:   0.5px solid rgba(28,28,26,0.25);
  --line-inv: 0.5px solid rgba(252,252,250,0.28);

  /* container */
  --w-container: 1200px;

  /* spacing scale (8px step) */
  --s-1: 8px;
  --s-2: 16px;
  --s-3: 24px;
  --s-4: 32px;
  --s-5: 40px;
  --s-6: 64px;

  /* monastic section rhythm */
  --sec-y: 160px;
  --blk-y: 96px;
}

@media (max-width: 768px){
  :root{ --sec-y: 72px; --blk-y: 56px; }
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--c-bg);
  color:var(--c-ink);
  font-family:var(--f-body);
  font-size:15.5px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

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

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

.container{
  max-width:var(--w-container);
  margin-inline:auto;
  padding-inline:32px;
}
@media (max-width:768px){ .container{ padding-inline:16px; } }

.u-skip{
  position:absolute; left:-9999px; top:0;
  background:var(--c-ink); color:var(--c-ink-inv);
  padding:10px 16px; z-index:200;
}
.u-skip:focus{ left:8px; top:8px; }

/* ---------- type ---------- */
h1,h2,h3{ font-family:var(--f-display); font-weight:300; margin:0; }

.section-h2{
  font-size:clamp(26px,4vw,44px);
  font-weight:300;
  letter-spacing:-0.01em;
  margin:0 0 var(--s-3);
}
.section-h2 strong{ font-weight:700; }
.section-h2--inv{ color:var(--c-ink-inv); }

.eyebrow{
  font-size:11px;
  line-height:1.5;
  color:var(--c-a1);
  text-transform:uppercase;
  letter-spacing:0.14em;
  margin:0 0 var(--s-2);
}
.eyebrow--inv{ color:rgba(252,252,250,0.6); }

.section-intro{
  max-width:60ch;
  color:var(--c-ink);
  margin:0 0 var(--s-5);
}
.section-intro--inv{ color:rgba(252,252,250,0.82); }

/* ---------- label motif ---------- */
.label-tag{
  display:block;
  font-size:11px;
  line-height:1.5;
  color:var(--c-a1);
  text-align:left;
}
.label-tag__no{
  display:block;
  font-family:var(--f-display);
  font-weight:700;
  font-size:11px;
  letter-spacing:0.12em;
  color:var(--c-ink);
  margin-bottom:4px;
}
.label-tag__name{
  display:block;
  font-weight:500;
  color:var(--c-ink);
  font-size:13px;
  margin-bottom:2px;
}
.label-tag__spec{ display:block; color:var(--c-a1); font-size:11px; }

/* passe-partout frame: 0.5px border + 8% white mat */
.label-frame{
  margin:0;
  border:var(--line);
  padding:8px;
  background:var(--c-bg);
}
.label-frame img{ width:100%; }
.label-frame figcaption{ padding:var(--s-2) 2px 2px; }

/* tros — thin gallery cable line above cards */
.troc{
  display:block;
  height:1px;
  width:100%;
  background:rgba(28,28,26,0.25);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 600ms ease;
  margin-bottom:var(--s-3);
}
.reveal.is-in .troc,
.is-in .troc{ transform:scaleX(1); }

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--f-body);
  font-weight:700;
  font-size:13px;
  letter-spacing:0.02em;
  color:var(--c-ink);
  background:transparent;
  border:0.5px solid rgba(28,28,26,0.5);
  border-radius:0;
  padding:13px 22px;
  cursor:pointer;
  transition:background-color 200ms ease, color 200ms ease, border-color 200ms ease;
}
.btn:hover{ background:rgba(28,28,26,0.05); }
.btn--primary{ font-weight:700; border-color:var(--c-ink); }
.btn--primary:hover{ background:rgba(28,28,26,0.08); }

/* =========================================================
   NAV — nav-transparent-frost
   ========================================================= */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(252,252,250,0.82);
  backdrop-filter:saturate(120%) blur(10px);
  -webkit-backdrop-filter:saturate(120%) blur(10px);
  border-bottom:var(--line);
}
.nav__inner{
  display:flex; align-items:center; gap:var(--s-3);
  min-height:66px;
}
.logo{ display:flex; align-items:baseline; gap:8px; line-height:1; }
.logo__mark{
  font-family:var(--f-display); font-weight:300;
  font-size:20px; letter-spacing:0.04em; color:var(--c-ink);
}
.logo__sub{
  font-family:var(--f-body); font-weight:500;
  font-size:10px; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--c-a1);
}
.nav__badge{
  font-size:11px; line-height:1.4; color:var(--c-a1);
  border-left:var(--line); padding-left:var(--s-2);
  max-width:220px;
}
.nav__links{ display:flex; gap:var(--s-3); margin-left:auto; }
.nav__link{
  font-size:12px; letter-spacing:0.06em; color:var(--c-ink);
  padding:4px 0; position:relative;
}
.nav__link::after{
  content:""; position:absolute; left:0; bottom:-2px;
  width:100%; height:0.5px; background:var(--c-ink);
  transform:scaleX(0); transform-origin:left; transition:transform 250ms ease;
}
.nav__link:hover::after,
.nav__link.is-active::after{ transform:scaleX(1); }
.nav__cta{ padding:9px 18px; }
.nav__toggle{
  display:none; flex-direction:column; gap:4px;
  background:none; border:none; cursor:pointer; padding:8px; margin-left:auto;
}
.nav__toggle span{ width:22px; height:1.5px; background:var(--c-ink); display:block; }
.nav__panel{
  border-top:var(--line);
  padding:var(--s-2) 32px var(--s-3);
  flex-direction:column; gap:var(--s-2);
  display:none;
}
.nav__panel:not([hidden]){ display:flex; }
.nav__panel .nav__link{ font-size:14px; }

@media (max-width:900px){
  .nav__badge{ display:none; }
  .nav__links{ display:none; }
  .nav__cta{ display:none; }
  .nav__toggle{ display:flex; }
}

/* Mobile dropdown never shows on desktop, even if toggled */
@media (min-width:901px){
  .nav__panel{ display:none !important; }
}

/* =========================================================
   HERO — hero-quote-framed / Label Fade
   ========================================================= */
.s-hero{ padding:var(--sec-y) 0 var(--blk-y); }
.s-hero .container{
  display:grid; grid-template-columns:1.05fr 0.95fr;
  gap:var(--s-6); align-items:center;
}
.hero__frame{ border:var(--line); padding:clamp(24px,4vw,56px); }
.hero__kicker{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--c-a1); margin:0 0 var(--s-3); }
.hero__title{
  font-size:clamp(36px,5.5vw,76px);
  font-weight:300; line-height:1.04; letter-spacing:-0.015em;
  margin:0 0 var(--s-3);
}
.hero__title strong{ font-weight:700; }
.hero__quote{
  margin:0 0 var(--s-3); padding-left:var(--s-2);
  border-left:var(--line);
  font-family:var(--f-display); font-weight:300; font-style:normal;
  font-size:clamp(16px,2vw,20px); color:var(--c-a1);
}
.hero__lead{ max-width:52ch; margin:0 0 var(--s-4); }
.hero__actions{ display:flex; gap:var(--s-2); flex-wrap:wrap; margin-bottom:var(--s-4); }
.hero__plate{ border-top:var(--line); padding-top:var(--s-2); display:flex; gap:var(--s-2); }
.hero__plate .label-tag__no{ margin-bottom:0; }
.hero__media{ align-self:stretch; }

@media (max-width:900px){
  .s-hero .container{ grid-template-columns:1fr; }
  .hero__media{ order:-1; }
}

/* Label Fade animation */
.fade-item, .fade-label{ opacity:0; }
[data-label-fade].is-in .fade-item{
  animation:labelFade 620ms ease forwards;
}
[data-label-fade].is-in .fade-item:nth-child(1){ animation-delay:0ms; }
[data-label-fade].is-in .fade-item:nth-child(2){ animation-delay:90ms; }
[data-label-fade].is-in .fade-item:nth-child(3){ animation-delay:180ms; }
[data-label-fade].is-in .fade-item:nth-child(4){ animation-delay:270ms; }
[data-label-fade].is-in .fade-item:nth-child(5){ animation-delay:360ms; }
[data-label-fade].is-in .fade-label{
  animation:labelFade 620ms ease forwards;
  animation-delay:660ms; /* labels arrive ~300ms after objects settle */
}
@keyframes labelFade{ from{opacity:0} to{opacity:1} }

/* =========================================================
   HALL divider
   ========================================================= */
.hall-mark{
  text-align:center; padding:var(--blk-y) 0;
}
.hall-mark span{
  font-size:11px; letter-spacing:0.3em; color:var(--c-a1);
  text-transform:uppercase;
}

/* =========================================================
   Generic sections + grid
   ========================================================= */
section[class^="s-"]{ padding-block:var(--sec-y); }
.s-hero{ padding-top:var(--sec-y); }

.grid{ display:grid; gap:var(--s-5); }
.grid--3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:900px){ .grid--3{ grid-template-columns:1fr; } }

/* Collection */
.exhibit__panel{
  border:var(--line);
  aspect-ratio:1/1;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:var(--s-4);
  background:var(--c-bg);
}
.exhibit__no{ font-family:var(--f-display); font-weight:300; font-size:clamp(28px,4vw,46px); color:var(--c-a1); }
.exhibit__panel-text{ font-family:var(--f-display); font-weight:300; font-size:22px; margin:0; }
.exhibit__label{ margin-top:var(--s-2); }
.exhibit__label .label-tag__spec{ margin-top:2px; }

/* Labels */
.labels__grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:var(--s-6); align-items:center; }
@media (max-width:900px){ .labels__grid{ grid-template-columns:1fr; } }

/* Hardware — dark store room */
.s-hardware{ background:var(--c-bg-dark); color:var(--c-ink-inv); }
.spec-table{ border-top:var(--line-inv); }
.spec-row{
  display:grid; grid-template-columns:1.3fr 1fr 1fr;
  gap:var(--s-3); padding:var(--s-2) 0;
  border-bottom:var(--line-inv);
  font-size:13px;
}
.spec-row--head{ color:rgba(252,252,250,0.6); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; }
.spec-row span:first-child{ color:rgba(252,252,250,0.7); }

/* Games */
.section-h2__accent{ color:var(--c-a1); font-weight:700; }
.games-list{ list-style:none; margin:0; padding:0; border-top:var(--line); }
.game-item{
  display:grid; grid-template-columns:24px 200px 1fr; gap:var(--s-3);
  align-items:center;
  padding:var(--s-2) 0; border-bottom:var(--line);
}
.game-item__icon{
  width:24px; height:24px; flex:none;
  color:var(--c-a1);
}
.game-item__genre{ font-family:var(--f-display); font-weight:700; font-size:13px; letter-spacing:0.02em; color:var(--c-ink); }
.game-item__desc{ color:var(--c-a1); font-size:13px; }
@media (max-width:600px){
  .game-item{
    grid-template-columns:24px 1fr;
    align-items:start; row-gap:2px; column-gap:var(--s-2);
  }
  .game-item__genre{ align-self:center; }
  .game-item__desc{ grid-column:2; }
}

/* Rates */
.rate{
  border:var(--line); padding:var(--s-4);
  display:flex; flex-direction:column; gap:6px;
  position:relative; min-height:210px;
}
.rate .troc{ margin-bottom:var(--s-3); }
.rate__title{ font-family:var(--f-display); font-weight:300; font-size:22px; color:var(--c-ink); }
.rate__price{ font-family:var(--f-display); font-weight:700; font-size:15px; color:var(--c-ink); }
.rate__spec{ color:var(--c-a1); font-size:12px; line-height:1.6; margin-top:auto; }
.rate--booked{ background:rgba(28,28,26,0.03); }
.rate__stamp{
  position:absolute; top:var(--s-4); right:var(--s-4);
  font-family:var(--f-display); font-weight:700; font-size:11px; letter-spacing:0.18em;
  color:var(--c-a1); border:0.5px solid rgba(28,28,26,0.35);
  padding:3px 8px;
  transform:rotate(-4deg) scale(1.12); opacity:0;
}
.is-in .rate__stamp{ animation:stampIn 500ms ease forwards 700ms; }
@keyframes stampIn{
  0%{ opacity:0; transform:rotate(-4deg) scale(1.25); }
  60%{ opacity:1; transform:rotate(-4deg) scale(0.96); }
  100%{ opacity:1; transform:rotate(-4deg) scale(1); }
}

/* Acquisitions */
.acq{ border:var(--line); padding:var(--s-4); }
.acq .troc{ margin-bottom:var(--s-3); }
.acq__title{ display:block; font-family:var(--f-display); font-weight:300; font-size:19px; color:var(--c-ink); margin:6px 0 var(--s-2); }
.acq__text{ margin:0; font-size:13px; color:var(--c-ink); }

/* Studies */
.study{ position:relative; }
.study .troc{ position:absolute; top:-1px; left:8px; right:8px; width:auto; margin:0; }

/* FAQ */
.faq__wrap{ max-width:820px; }
.faq__list{ border-top:var(--line); }
.faq__item{ border-bottom:var(--line); }
.faq__item summary{
  cursor:pointer; list-style:none;
  padding:var(--s-3) 0; font-family:var(--f-display); font-weight:300; font-size:19px;
  display:flex; justify-content:space-between; align-items:center; gap:var(--s-2);
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{ content:"+"; color:var(--c-a1); font-weight:300; font-size:22px; }
.faq__item[open] summary::after{ content:"\2212"; }
.faq__item p{ margin:0 0 var(--s-3); color:var(--c-ink); max-width:64ch; }

/* Reserve form */
.reserve__wrap{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:var(--s-6); align-items:start; }
@media (max-width:900px){ .reserve__wrap{ grid-template-columns:1fr; } }
.form{ display:grid; gap:var(--s-4); }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--c-a1); }
.field input,.field select{
  font-family:var(--f-body); font-size:15px; color:var(--c-ink);
  background:transparent; border:none; border-bottom:0.5px solid rgba(28,28,26,0.35);
  border-radius:0; padding:10px 2px;
  transition:border-color 200ms ease;
}
.field input:focus,.field select:focus{ outline:none; border-bottom-color:var(--c-ink); }
.form__submit{ justify-self:start; }
.form__status{ font-size:13px; margin:0; }
.form__status.success{ color:var(--c-ink); }
.form__status.error{ color:#8a2a24; }
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* =========================================================
   FOOTER — footer-link-columns
   ========================================================= */
.footer{ border-top:var(--line); padding-top:var(--blk-y); }
.footer__grid{
  display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:var(--s-5);
  padding-bottom:var(--blk-y);
}
@media (max-width:900px){ .footer__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer__grid{ grid-template-columns:1fr; } }
.footer__tag{ font-size:12px; color:var(--c-a1); max-width:26ch; margin:var(--s-2) 0 0; }
.footer__col{ display:flex; flex-direction:column; gap:8px; }
.footer__h{ font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--c-a1); font-weight:500; margin:0 0 4px; }
.footer__col a{ font-size:13px; color:var(--c-ink); width:max-content; }
.footer__col a:hover{ color:var(--c-a1); }
.footer__hours{ font-size:12px; color:var(--c-a1); margin:0; }
.footer__base{
  border-top:var(--line); padding:var(--s-3) 32px;
  display:flex; justify-content:space-between; gap:var(--s-2); flex-wrap:wrap;
}
@media (max-width:768px){ .footer__base{ padding-inline:16px; } }
.footer__disclaimer{ font-family:var(--f-display); font-weight:700; font-size:13px; margin:0; color:var(--c-ink); }
.footer__copy{ font-size:11px; color:var(--c-a1); margin:0; }

/* =========================================================
   Scroll reveal
   ========================================================= */
.reveal{ opacity:0; transform:translateY(14px); transition:opacity 560ms ease, transform 560ms ease; }
.reveal.is-in{ opacity:1; transform:none; }

/* =========================================================
   Legal pages (white-papers)
   ========================================================= */
.legal{ padding:var(--blk-y) 0; }
.legal__col{ max-width:760px; margin-inline:auto; }
.legal__back{ font-size:12px; color:var(--c-a1); display:inline-block; margin-bottom:var(--s-4); }
.legal h1{ font-size:clamp(28px,4vw,46px); font-weight:300; margin:0 0 var(--s-2); }
.legal h1 strong{ font-weight:700; }
.legal__updated{ font-size:11px; color:var(--c-a1); text-transform:uppercase; letter-spacing:0.1em; margin:0 0 var(--s-6); }
.legal__item{ border-top:var(--line); padding:var(--s-4) 0; }
.legal__item h2{ font-size:13px; font-weight:700; font-family:var(--f-display); letter-spacing:0.02em; margin:0 0 6px; }
.legal__item p{ font-size:13px; color:var(--c-ink); margin:0 0 var(--s-1); max-width:64ch; }
.legal__item .note{ color:var(--c-a1); }

/* =========================================================
   prefers-reduced-motion — silence everything
   ========================================================= */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:0.001ms !important;
    animation-delay:0ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
  }
  .reveal{ opacity:1 !important; transform:none !important; }
  .fade-item,.fade-label{ opacity:1 !important; }
  .troc{ transform:scaleX(1) !important; }
  .rate__stamp{ opacity:1 !important; transform:rotate(-4deg) !important; }
}

/* pages added */
.footer__address{font-style:normal;text-align:center;max-width:64ch;margin:1.75rem auto 0;
  padding-top:1.25rem;border-top:1px solid currentColor;line-height:1.6;font-size:.82rem;opacity:.75}
.footer__address strong{display:block;margin-bottom:.35rem;letter-spacing:.02em;opacity:.95}
.footer__address a{color:inherit;text-decoration:underline}
.legal__nav{display:flex;flex-wrap:wrap;gap:.6rem 1.15rem;margin:2.75rem 0 0;padding-top:1.4rem;
  border-top:1px solid currentColor;font-size:.9rem;line-height:1.4}
.legal__nav a{color:inherit;text-decoration:underline;opacity:.85}
.legal__nav a:hover{opacity:1}

/* legal2 */
.lg__kicker{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.6;margin:0 0 .4rem}
.lg__lead{font-size:1.18rem;line-height:1.6;max-width:60ch;margin:0 0 2.4rem}
.lg h2,.lg h3{line-height:1.25}
.lg p{line-height:1.65;max-width:66ch}
/* list */
.lg--list .lg-list__sec{margin:0 0 2rem}
.lg--list h2{display:flex;align-items:baseline;gap:.6rem;font-size:1.25rem;margin:0 0 .8rem}
.lg-list__n{font-size:.8rem;opacity:.5;font-variant-numeric:tabular-nums}
.lg-list__ul{list-style:none;padding:0;margin:0;border-top:1px solid currentColor}
.lg-list__ul li{padding:.7rem 0 .7rem 1.4rem;border-bottom:1px solid;border-color:color-mix(in srgb,currentColor 18%,transparent);position:relative;line-height:1.6}
.lg-list__ul li::before{content:"";position:absolute;left:0;top:1.05rem;width:.5rem;height:.5rem;border:1px solid currentColor}
/* tiles */
.lg-tiles__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.lg-tile{border:1px solid currentColor;padding:1.25rem 1.35rem}
.lg-tile h3{margin:0 0 .6rem;font-size:1.08rem}
.lg-tile p{margin:.5rem 0;font-size:.95rem}
@media(max-width:640px){.lg-tiles__grid{grid-template-columns:1fr}}
/* cards */
.lg--cards{display:flex;flex-direction:column;gap:1rem}
.lg-card{display:flex;gap:1.1rem;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-left:3px solid currentColor;padding:1.1rem 1.25rem}
.lg-card__badge{flex:0 0 auto;font-weight:700;font-size:.85rem;opacity:.6;padding-top:.15rem;white-space:nowrap}
.lg-card__body h3{margin:0 0 .5rem;font-size:1.1rem}
.lg-card__body p{margin:.4rem 0}
/* rules */
.lg--rules .lg-rule{padding:1.4rem 0;border-top:1px solid currentColor}
.lg--rules .lg-rule:first-child{border-top:2px solid currentColor}
.lg--rules h2{font-size:1.2rem;margin:0 0 .7rem;padding-left:1rem;border-left:4px solid currentColor}
.lg--rules p{margin:.5rem 0 .5rem 1rem}
/* panels */
.lg--panels{display:flex;flex-direction:column;gap:.6rem}
.lg-panel{display:flex;gap:1.4rem;align-items:flex-start;padding:1.5rem;background:color-mix(in srgb,currentColor 5%,transparent)}
.lg-panel__num{font-size:2.4rem;font-weight:800;line-height:1;opacity:.28;font-variant-numeric:tabular-nums}
.lg-panel__body h2{margin:0 0 .6rem;font-size:1.2rem}
.lg-panel__body p{margin:.45rem 0}
@media(max-width:560px){.lg-panel{flex-direction:column;gap:.5rem}}
/* def */
.lg--def .lg-def__row{display:grid;grid-template-columns:1fr 2fr;gap:1.5rem;padding:1.5rem 0;border-top:1px solid currentColor}
.lg--def h2{position:sticky;top:1rem;font-size:1.15rem;margin:0}
.lg--def .lg-def__desc p{margin:.4rem 0}
@media(max-width:640px){.lg--def .lg-def__row{grid-template-columns:1fr;gap:.5rem}.lg--def h2{position:static}}

/* ---------- compact gallery hero (added) ---------- */
.s-hero--compact{ padding-block: clamp(24px,4vw,52px); }
.s-hero--compact .container{ align-items:stretch; grid-template-columns:1fr 1fr; gap:var(--s-5); }
.s-hero--compact .hero__frame{
  padding:clamp(18px,2.4vw,34px); display:flex; flex-direction:column; justify-content:center;
}
.s-hero--compact .hero__title{ font-size:clamp(28px,3.6vw,48px); margin:0 0 var(--s-2); }
.s-hero--compact .hero__lead{ font-size:1rem; margin:0 0 var(--s-3); max-width:46ch; }
.s-hero--compact .hero__actions{ margin:0 0 var(--s-3); }
.s-hero--compact .hero__quote{ margin:0; font-size:clamp(14px,1.6vw,17px); }
.s-hero--compact .hero__media{ position:relative; overflow:hidden; }
.s-hero--compact .hero__media img{ width:100%; height:100%; min-height:320px; object-fit:cover; display:block; }
.s-hero--compact .hero__plate{
  position:absolute; left:14px; bottom:14px; margin:0;
  background:var(--c-bg); border:var(--line); padding:8px 12px;
  display:flex; gap:var(--s-2); max-width:calc(100% - 28px); box-shadow:0 6px 24px rgba(28,28,26,.12);
}
.s-hero--compact .hero__plate .label-tag__no{ margin-bottom:0; }
@media (max-width:900px){
  .s-hero--compact .container{ grid-template-columns:1fr; }
  .s-hero--compact .hero__media{ order:-1; }
  .s-hero--compact .hero__media img{ height:auto; min-height:0; }
}

/* two-up exhibits (added) */
.grid--2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:900px){ .grid--2{ grid-template-columns:1fr; } }

/* ---------- in-play visitors gallery (added) ---------- */
.s-inplay{ padding: var(--blk-y) 0; }
.grid--4{ grid-template-columns:repeat(4,1fr); gap:var(--s-3); }
@media (max-width:900px){ .grid--4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .grid--4{ grid-template-columns:1fr; } }
.play{ margin:0; }
.play img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.play figcaption{
  font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--c-a1); padding-top:var(--s-2);
}
