* { box-sizing: border-box; }
:root { color-scheme: dark; }
body { margin: 0; background: #121214; color: #f4f1eb; font-family: "Barlow Condensed", sans-serif; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 2px solid #f4f1eb; outline-offset: 8px; }
.gallery-nav { padding: 34px 5vw; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.wordmark { font-size: 20px; letter-spacing: .25em; }
.wordmark span { display: block; font-size: 9px; letter-spacing: .55em; margin-top: 9px; opacity: .6; }
.back-link, .return-link { display: inline-flex; align-items: center; gap: 16px; font-size: 14px; letter-spacing: .08em; }
a svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1; }
main { padding: 0 5vw; }
.gallery-intro { padding: 70px 2vw 64px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px 8vw; align-items: end; }
.eyebrow { grid-column: 1 / -1; text-transform: uppercase; font-size: 11px; letter-spacing: .22em; color: #dedbd3b3; }
h1 { margin: 0; font: 500 clamp(60px, 8vw, 120px)/.95 "Cormorant Garamond", Georgia, serif; letter-spacing: -.035em; }
.gallery-summary { max-width: 340px; padding-bottom: 4px; font-size: 20px; line-height: 1.6; color: #dedbd3bf; }
.gallery-summary .concept-note { font-size: 13px; color: #dedbd38f; margin-top: 28px; }
.gallery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px 32px; }
figure { margin: 0; min-width: 0; }
figure.wide { grid-column: 1 / -1; }
figure img { display: block; width: 100%; height: 65vw; max-height: 850px; object-fit: cover; }
.wide img { height: auto; max-height: none; }
.detail-left img { object-position: 10% center; }
.detail-right img { object-position: 90% center; }
.closing img { height: 42vw; object-position: center 70%; }
figcaption { display: flex; gap: 22px; margin-top: 16px; color: #dedbd3a3; font-size: 13px; letter-spacing: .08em; }
figcaption span { opacity: .55; }
.return-link { margin: 80px 0; padding-bottom: 14px; border-bottom: 1px solid #ffffff40; }
footer { padding: 24px 5vw 36px; background: transparent; color: #c9c6c0; font-size: 12px; line-height: 1.6; }
@media (max-width: 600px) {
  .gallery-nav { padding: 26px 24px; }
  .wordmark { font-size: 14px; }
  .back-link { font-size: 12px; gap: 8px; }
  main { padding: 0 20px; }
  .gallery-intro { padding: 50px 6px 40px; grid-template-columns: 1fr; }
  .gallery-summary { font-size: 18px; }
  .gallery-grid { gap: 36px; grid-template-columns: 1fr; }
  figure img { height: 115vw; }
  .closing img { height: 70vw; }
  .return-link { margin: 56px 0; }
}