.website-types__grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  justify-content: center;
  max-width: 900px;
  margin-inline: auto;
}

.type-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 0.6rem 1.2rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--color-bg-border);
  background: var(--color-bg-surface);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text-secondary);
  cursor: default;
  transition: background var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-fast);
}
.type-pill:hover {
  background: var(--gradient-brand);
  border-color: transparent;
  color: #fff;
  transform: translateY(-2px);
}
.type-pill svg { opacity: 0.6; transition: opacity var(--transition-fast); }
.type-pill:hover svg { opacity: 1; }