.projects {
  padding: 100px var(--gutter) 160px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.filters { display: flex; gap: 12px; flex-wrap: wrap; }
.pill {
  padding: 12px 24px;
  min-height: 48px;
  border-radius: 999px;
  font: inherit;
  font-size: 18px;
  cursor: pointer;
  background: transparent;
  color: var(--ink);
  border: 1.5px solid var(--line);
  transition: background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease);
}
.pill:hover { border-color: var(--ink); }
.pill[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }

.projects__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 44px;
}
.projects__grid .project-card { height: auto; min-height: 520px; gap: 0; }
.projects__grid .project-card__cover { height: 340px; flex: none; }
.project-card__body { flex-grow: 1; padding: 24px 14px 8px; display: flex; flex-direction: column; gap: 10px; }
.project-card__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.project-card__body .project-card__name { font-size: 30px; letter-spacing: -0.03em; }
.project-card__year { font-size: 18px; color: var(--soft); }
.project-card__line { font-size: 19px; line-height: 1.5; color: var(--muted); }
.project-card__cat { margin-top: auto; font-size: 16px; color: var(--muted); }

.projects__grid > .project-card {
  transition: transform .7s var(--ease), box-shadow .7s var(--ease), opacity .45s var(--ease), border-color .7s var(--ease);
}
.projects__grid > .project-card.is-hiding { opacity: 0; transform: scale(.96); }
.projects__grid > .project-card[hidden] { display: none; }

@media (max-width: 1000px) {
  .projects__grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .projects__grid .project-card { height: auto; }
  .projects__grid .project-card__cover { height: 240px; }
}

.project-card__row .project-card__year { white-space: nowrap; }
.project-card__body .badge { align-self: flex-start; }
