.categories {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 18px;
}

.categories button {
  padding: 6px 11px;
  border: 1px solid #263c58;
  border-radius: 999px;
  background: #101d2e;
  color: #9fb0c7;
  font-size: 12px;
  cursor: pointer;
}

.categories button:hover {
  border-color: #3b82c4;
  color: #d8ecff;
}

.categories button.active {
  border-color: #3182ce;
  background: #173b68;
  color: #fff;
  box-shadow: 0 0 0 1px #1d5f9b inset;
}

@media (max-width: 760px) {
  .categories {
    gap: 6px;
  }

  .categories button {
    padding: 6px 9px;
  }
}