.work-hero {
  padding: clamp(160px, 20vh, 220px) var(--side-padding) clamp(40px, 6vh, 72px);
}
.work-hero__label {
  margin-bottom: 24px;
}
.work-hero__subline {
  max-width: 560px;
  margin-top: 20px;
}

.filter-bar {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
  padding: 0 var(--side-padding) 48px;
}
.filter-btn {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--muted);
  padding-bottom: 6px;
  border-bottom: 2px solid transparent;
  transition: color 0.3s ease, border-color 0.3s ease;
}
.filter-btn:hover {
  color: var(--light);
}
.filter-btn.is-active {
  color: var(--amber);
  border-bottom-color: var(--amber);
}

/* ============ PROJECT POSTER GRID ============ */
.work-poster-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 24px;
  padding: 0 var(--side-padding) clamp(80px, 12vh, 160px);
}
.work-poster-grid .work-card {
  transition: opacity 0.4s ease;
}
.work-poster-grid .work-card.is-hidden {
  display: none;
}

@media (max-width: 1100px) {
  .work-poster-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px) {
  .work-poster-grid { grid-template-columns: repeat(2, 1fr); gap: 28px 16px; }
}
@media (max-width: 420px) {
  .work-poster-grid { grid-template-columns: 1fr; max-width: 320px; margin: 0 auto; }
}