.swd-wrap {
  width: min(calc(100% - 32px), var(--swd-wrap));
  margin-inline: auto;
}

.swd-section { padding: var(--swd-space-7) 0; }
.swd-section--muted { background: var(--swd-colour-surface-alt); }
.swd-section--dark { color: #fff; background: var(--swd-colour-black); }

.swd-section-heading {
  max-width: 760px;
  margin: 0 auto var(--swd-space-5);
  text-align: center;
}
.swd-section-heading h2 { font-size: clamp(1.9rem, 4vw, 3rem); }
.swd-section-heading p { color: var(--swd-colour-muted); }

.swd-grid { display: grid; gap: var(--swd-space-4); }
.swd-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.swd-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 820px) {
  .swd-section { padding: 3.4rem 0; }
  .swd-grid--three, .swd-grid--four { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .swd-wrap { width: min(calc(100% - 24px), var(--swd-wrap)); }
  .swd-section { padding: 2.9rem 0; }
}