/* ============================================================
   06. LAYOUT PRIMITIVES
   ============================================================ */
.container {
  inline-size: min(100% - 2.5rem, var(--container-max));
  margin-inline: auto;
  /* Keeps content above the decorative calligraphy motifs */
  position: relative;
  z-index: 1;
}

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

.section-head {
  margin-block-end: clamp(2.25rem, 5vw, 3.5rem);
}

.section--alt {
  background: var(--color-surface);
  border-block: 1px solid var(--color-border);
}