/* Wall art: each piece is a transparency in the lightbox. The diffuser behind it is evenly lit, so the
   panel reads brighter than the tiled wall around it; nothing spills outside the case. Sizes follow the door. */
.wallart { position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden;
  background: var(--diffuser); color: var(--ink); box-shadow: 0 0 0 1px rgba(0,0,0,.6), 0 0 0 2px rgba(255,255,255,.25); }
/* A transparency on a lit diffuser: shadows lift a touch, colour reads luminous. */
.wallart-img { display: block; width: 100%; flex: 1 1 auto; min-height: 0; object-fit: cover; filter: brightness(1.1) contrast(.94) saturate(1.1); }
.wallart-title { display: block; overflow-wrap: anywhere; font: 700 calc(var(--wu, 1cqw) * 1.7)/.9 var(--font-display); text-transform: uppercase; }
.wallart-line { display: block; font: 500 calc(var(--wu, 1cqw) * .7)/1.2 var(--font-text); }

/* "has its own poster image, in the EPK": the one-sheet shows whole, date line and all (Hayden, 2026-10-20),
   on black where it is narrower than the window, so it reads as the poster's own dark border. */
.wallart--epk-poster, .wallart--bts-poster { background: #000; }
.wallart--epk-poster .wallart-img, .wallart--bts-poster .wallart-img { object-fit: contain; }

/* "the cover image turned into a travel ad": photograph above; beneath it, set like First Light's ad, the title
   on one line, a rule, and the year along the foot. */
/* The title card prints on the door's section colour, as First Light's does on green (Hayden, 2026-10-20). */
.wallart--travel-ad { background: var(--door-colour, var(--diffuser)); color: var(--door-ink, var(--ink)); }
.wallart--travel-ad .wallart-img { flex: 0 0 72%; object-position: 62% 40%; }
.wallart--travel-ad .wallart-text { flex: 1; display: flex; flex-direction: column; padding: calc(var(--wu, 1cqw) * 1) calc(var(--wu, 1cqw) * 1.05); }
.wallart--travel-ad .wallart-title { font-size: calc(var(--wu, 1cqw) * 1.85); line-height: .9; white-space: nowrap; letter-spacing: .02em; }
.wallart--travel-ad .wallart-line { margin-top: auto; padding-top: calc(var(--wu, 1cqw) * .5); border-top: 1px solid rgba(17, 17, 16, .55);
  font: 600 calc(var(--wu, 1cqw) * .8)/1 var(--font-display); letter-spacing: .42em; color: var(--ink); }

/* "use the thumbnail, it's like an Ad": an ad on the AI section's green stock. The frame is its
   photograph; the title is set as big as the stock allows, the year along the foot. */
.wallart--thumbnail-ad { background: var(--organization-green); color: var(--white); }
.wallart--thumbnail-ad .wallart-photo { display: block; flex: none; }
.wallart--thumbnail-ad .wallart-img { aspect-ratio: 16 / 9; height: auto; }
.wallart--thumbnail-ad .wallart-copy { flex: 1; display: flex; flex-direction: column; padding: calc(var(--wu, 1cqw) * 1.1) calc(var(--wu, 1cqw) * 1.05) calc(var(--wu, 1cqw) * 1); }
.wallart--thumbnail-ad .wallart-title { font-size: calc(var(--wu, 1cqw) * 4); line-height: .84; letter-spacing: .005em; } /* two lines, with the year still on the stock */
.wallart--thumbnail-ad .wallart-line { margin-top: auto; padding-top: calc(var(--wu, 1cqw) * .5); border-top: 1px solid rgba(244,244,241,.55);
  font: 600 calc(var(--wu, 1cqw) * .8)/1 var(--font-display); letter-spacing: .42em; }

/* Treatments not on the current wall keep sensible defaults. */
.wallart--poster-from-thumbnail { background: var(--reese); }
.wallart--poster-from-thumbnail .wallart-title { padding: calc(var(--wu, 1cqw) * .6) calc(var(--wu, 1cqw) * .6) calc(var(--wu, 1cqw) * .3); }
.wallart--poster-from-thumbnail .wallart-line { padding: calc(var(--wu, 1cqw) * .3) calc(var(--wu, 1cqw) * .6) calc(var(--wu, 1cqw) * .5); }
.wallart--art-piece { padding: calc(var(--wu, 1cqw) * 1.2); }
.wallart--art-piece .wallart-placard { padding-top: calc(var(--wu, 1cqw) * .5); }
.wallart--art-piece .wallart-placard > * { display: inline; font-size: calc(var(--wu, 1cqw) * .7); }
