.container {
  inline-size: min(100%, var(--container-wide));
  margin-inline: auto;
  padding-inline: var(--layout-gutter);
}

.content {
  max-inline-size: var(--container-content);
}

.reading {
  max-inline-size: var(--container-reading);
}

.full {
  max-inline-size: none;
}

.section {
  padding-block: var(--section-space);
}

.sectionMuted {
  background: var(--surface-muted);
}

.sectionStrong {
  background: var(--surface-strong);
}

.stack {
  display: flex;
  flex-direction: column;
}

.stackSmall {
  gap: var(--space-3);
}

.stackMedium {
  gap: var(--space-6);
}

.stackLarge {
  gap: var(--space-12);
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.clusterSmall {
  gap: var(--space-2);
}

.clusterMedium {
  gap: var(--space-4);
}

.clusterLarge {
  gap: var(--space-8);
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--space-6);
}

.bleed {
  inline-size: 100vw;
  margin-inline: calc(50% - 50vw);
}

.sticky {
  position: sticky;
  z-index: var(--layer-sticky);
  inset-block-start: 0;
}