/* Wiederverwendbare Layout-Bausteine für alle Seiten. */
main {
  min-height: 45vh;
}

.container {
  width: min(100% - (var(--content-padding) * 2), var(--content-width));
  margin-inline: auto;
}

.container--narrow {
  width: min(100% - (var(--content-padding) * 2), var(--content-width));
  margin-inline: auto;
}

.section {
  padding-block: clamp(var(--space-7), 8vw, var(--space-9));
}

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

.section-heading {
  display: grid;
  gap: var(--space-3);
  max-width: 42rem;
  margin-bottom: var(--space-7);
}

.section-heading--centered {
  width: 100%;
  margin-inline: auto;
  justify-items: center;
  text-align: center;
}

.eyebrow {
  color: var(--color-primary);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.content-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--grid-gap);
}

.content-grid > * {
  grid-column: span 12;
}

.two-column-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: clamp(var(--space-6), 6vw, var(--space-9));
}

.three-column-layout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--grid-gap);
}

.stack {
  display: grid;
  gap: var(--space-5);
}

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

.stack--loose {
  gap: var(--space-7);
}