.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: 1.5rem;
}

.card {
  background: linear-gradient(
    140deg,
    color-mix(in srgb, var(--bg-secondary) 45%, var(--bg-primary)),
    var(--bg-primary)
  );
  border: 1px solid var(--border-color);
  border-radius: 20px;
  padding: 1.5rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
  color: var(--text-primary);
  min-width: 0;
}

.card h3 {
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-size: 1.35rem;
}