/* Page layout primitives. */
.container {
  width: 100%;
  max-width: calc(var(--container) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.container--narrow { max-width: calc(var(--container-narrow) + 2 * var(--gutter)); }
/* Pages & listings: full container (left edge in line with the logo and the page title), text kept to a
   readable measure. Single posts/recipes keep the centred .container--narrow. */
.container--reading > * { max-width: var(--container-narrow); }

.section { padding-block: var(--section-y); }
.section--tight { padding-block: calc(var(--section-y) / 2); }
.section--yellow { background: var(--c-yellow); }
.section--cream { background: var(--c-cream); }
.section--black { background: var(--c-black); color: var(--c-white); }
.section--alt { background: var(--c-surface-alt); }

.site-main { min-height: 50vh; }

.stack > * + * { margin-top: var(--stack, var(--s-4)); }

.grid {
  display: grid;
  gap: var(--grid-gap, var(--s-6));
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--grid-min, 300px)), 1fr));
}

.split {
  display: grid;
  gap: var(--s-8);
}
@media (min-width: 1024px) {
  .split { grid-template-columns: 1fr 1fr; align-items: center; gap: var(--s-16); }
}

.page-title { font-size: var(--fs-h1); }

.plain-list { list-style: none; padding: 0; }