.container {
  width: min(100%, var(--container));
  margin: 0 auto;
  padding: 0 var(--space-6);
}

.container-wide { width: min(100%, var(--container-wide)); }

.section { padding: var(--space-9) 0; }
.section-muted { background: var(--color-surface-muted); }

.card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
}

.two-col,
.three-col { grid-template-columns: 1fr; }

@media (min-width: 760px) {
  .two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
  .three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}