/* ---------------------------------------------------------------
    LAYOUT - Basic Layouts
--------------------------------------------------------------- */

/* --- Container --- */
.container {
  width: 100%;
  max-width: var( --max-w-container);
  margin-inline: auto;
  padding-inline: var(--section-inline-padding);
  position: relative;
}

.container--narrow {
  max-width: var(--max-w-narrow);
}

.container--medium {
  max-width: var(--max-w-medium);
}

.container--wide {
  max-width: var(--max-w-wide);
}

/* --- Sections --- */
.section {
  padding-block: var(--section-block-padding);
}