/* Layout (08 §5). Bootstrap grid handles columns; these are the page-level helpers. */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--space-4); }
.section { padding-block: var(--space-7); }
.section + .section { border-top: 1px solid var(--color-border); }
.section__title { margin-bottom: var(--space-5); }
.stack > * + * { margin-top: var(--space-4); }
.stack-lg > * + * { margin-top: var(--space-6); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.grid-auto { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }

@media (min-width: 768px) {
  .container { padding-inline: var(--space-5); }
  .section { padding-block: var(--space-8); }
}
.table-gap, .callout-gap { margin-top: var(--space-4); }