.container {
  max-width: var(--lbr-container);
  margin-inline: auto;
  padding-inline: var(--lbr-gutter);
}

.stack > * + * { margin-block-start: var(--lbr-space-6); }
.stack-sm > * + * { margin-block-start: var(--lbr-space-3); }
.stack-lg > * + * { margin-block-start: var(--lbr-space-12); }

.grid { display: grid; gap: var(--lbr-space-6); }
.grid-2 { grid-template-columns: 1fr; }
.grid-3 { grid-template-columns: 1fr; }
.grid-4 { grid-template-columns: 1fr; }

@media (min-width: 720px) {
  .grid-2 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
}

.site-main { padding-block: var(--lbr-space-12) var(--lbr-space-16); min-height: 60vh; }

.section { padding-block: var(--lbr-space-12); }
.section--accent { background: var(--lbr-peach); }