/* ==========================================================================
   pages/projetos.css — específico de projetos/index.html
   ========================================================================== */

.page-hero {
  background: var(--gradient-header);
  color: var(--color-white);
  padding-block: var(--space-7);
}

.page-hero__title {
  color: var(--color-white);
  margin-bottom: var(--space-3);
}

.page-hero__text {
  color: rgba(255, 255, 255, 0.85);
  max-width: 60ch;
}

.filters {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-bottom: var(--space-7);
}

.filter-btn {
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  padding: var(--space-2) var(--space-5);
  border-radius: 999px;
  border: 1.5px solid var(--color-gray-200);
  background: var(--color-white);
  color: var(--color-gray-700);
  transition: all var(--duration-fast) var(--ease-standard);
}

.filter-btn:hover {
  border-color: var(--color-blue-400);
}

.filter-btn[aria-pressed="true"] {
  background: var(--color-blue-600);
  border-color: var(--color-blue-600);
  color: var(--color-white);
}