/* V14 WHITE TYPE — the three exhibitions only. White ground, type as the main form (Tendril-style offset images + light captions, principle only), with each work's signature form kept as thin line art. */
.wk-set .wk { --w-paper: #fff !important; --w-tint: #F3F2EE !important; box-shadow: 0 -40px 70px -34px rgba(0,0,0,.5); }
.wk-set .wk:first-of-type { box-shadow: none; }
.wk .rail { border-top-color: rgba(20,20,20,.16); }
/* reveal clip-path would crop big glyph descenders */
.wk .ax-title, .wk .cx-title, .wk .hx-kr, .wk .hx-title { clip-path: none !important; }
@media (min-width: 900px) {
  /* ---- 01 AURORE: huge serif wordmark, rings as line art, plate overlaps the last letters ---- */
  .wk-aurore .ax-fig { left: -7vw; top: -50px; width: min(62vw, 900px); }
  .wk-aurore .ax-ring { stroke-width: 1.2; } .wk-aurore .ax-sym { fill-opacity: .16; }
  .wk-aurore .ax-title { left: calc(var(--gut) - 10px); bottom: 4px; font-size: clamp(120px, 17.4vw, 268px); line-height: .8; letter-spacing: -.05em; z-index: 1; color: var(--w-accent); }
  .wk-aurore .ax-title span:last-child { padding-left: .55em; }
  .wk-aurore .ax-plate { right: calc(var(--gut) + 15.5vw); top: 34px; width: min(26vw, 370px); z-index: 3; box-shadow: 0 40px 80px -40px rgba(20,30,20,.5); }
  .wk-aurore .ax-no { left: auto; right: var(--gut); top: 30px; }
  .wk-aurore .ax-note { left: auto; right: var(--gut); width: min(12.6vw, 182px); bottom: 24px; }
  .wk-aurore .ax-ko::before { content: "Maison Aurore | Brand Identity"; display: block; margin-bottom: 8px; font: 400 13px/1.3 var(--f); letter-spacing: 0; color: var(--w-ink); }
  .wk-aurore .ax-ko { font-size: 14px; color: #666; line-height: 1.5; }
  /* ---- 02 CLARTÉ: giant thin title that inverts across the plate; a + hairline through the plate centre ---- */
  .wk-clarte { --tt: clamp(110px, 15.4vw, 226px); }
  .wk-clarte .cx-title { font-size: var(--tt); top: 12%; z-index: 5; mix-blend-mode: difference; color: #E6EEEE; letter-spacing: -.06em; pointer-events: none; }
  .wk-clarte .cx-title .b { color: #E6EEEE; }
  .wk-clarte .cx-ko { top: calc(12% + var(--tt) * 1.84 + 20px); font-size: 14px; color: #666; }
  .wk-clarte .cx-ko::before { content: "Clarté Clinic | Signage Identity"; display: block; margin-bottom: 8px; font: 400 13px/1.3 var(--f); color: var(--w-ink); }
  .wk-clarte::before, .wk-clarte::after { content: ""; position: absolute; background: color-mix(in srgb, var(--w-accent) 40%, transparent); z-index: 4; pointer-events: none; }
  .wk-clarte::before { left: 0; right: 0; top: calc(var(--sh) / 2); height: 1px; }
  .wk-clarte::after { top: 0; bottom: 90px; left: calc(100% - var(--ph) / 2); width: 1px; }
  .wk-clarte .cx-fig-wrap { width: 190px; left: calc(100% - var(--ph) - 236px); bottom: 104px; }
  /* ---- 03 HANGYEOL: giant Korean glyphs in clay, the diamond frame laps over them ---- */
  .wk-hangyeol .hx-t { position: static; width: auto; }
  .wk-hangyeol .hx-kr { position: absolute; left: calc(var(--gut) - 14px); bottom: 84px; font-size: clamp(180px, 28vw, 420px); line-height: .78; letter-spacing: -.04em; z-index: 1; color: var(--w-accent); }
  .wk-hangyeol .hx-frame { z-index: 3; }
  .wk-hangyeol .hx-title { position: absolute; left: var(--gut); top: 150px; margin: 0; font-size: clamp(22px, 2.4vw, 34px); letter-spacing: .12em; z-index: 4; }
  .wk-hangyeol .hx-ko { position: absolute; left: var(--gut); top: 244px; margin: 0; font-size: 14px; color: #666; z-index: 4; max-width: 18em; }
  .wk-hangyeol .hx-ko::before { content: "Hangyeol Tea House | Packaging Identity"; display: block; margin-bottom: 8px; font: 400 13px/1.3 var(--f); color: var(--w-ink); }
}
/* mobile: the same ideas, simply stacked */
@media (max-width: 899px) {
  .wk-aurore .ax-title { font-size: clamp(76px, 22vw, 130px); } .wk-aurore .ax-title span:last-child { padding-left: .3em; }
  .wk-clarte .cx-title { font-size: clamp(76px, 22vw, 130px); }
  .wk-hangyeol .hx-kr { font-size: clamp(120px, 42vw, 200px); line-height: .85; }
  .ax-ko, .cx-ko, .hx-ko { color: #6b6b6b; }
}