/* ── PAGE HEADER ── */
.page-header {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  padding: 1.2rem 2rem;
  background: var(--black);
  border-bottom: 1px solid #1f1f1f;
}

.page-header-logo {
  width: 48px;
  height: auto;
  opacity: 0.85;
}

.page-header h1 {
  font-size: 1.1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--light);
}

/* ── GALLERY GRID ── */
.gallery-grid {
  columns: 4 240px;
  gap: 6px;
  padding: 6px;
  background: var(--black);
}

.gallery-item {
  break-inside: avoid;
  margin-bottom: 6px;
  position: relative;
  overflow: hidden;
  cursor: zoom-in;
}

.gallery-item img {
  width: 100%;
  display: block;
  filter: brightness(0.85) saturate(0.85);
  transition: filter 0.4s, transform 0.5s;
}

.gallery-item:hover img {
  filter: brightness(1) saturate(1);
  transform: scale(1.03);
}

.gallery-item figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.4rem 0.6rem;
  font-size: 0.65rem;
  color: rgba(255,255,255,0.5);
  background: linear-gradient(transparent, rgba(0,0,0,0.65));
  letter-spacing: 0.05em;
  text-align: right;
  opacity: 0;
  transition: opacity 0.3s;
}

.gallery-item:hover figcaption {
  opacity: 1;
}