section.page-section.header {
  justify-content: space-between;
}

section.page-section.header a.button {
  align-self: center;
}

section.page-section.articles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(18em, 1fr));
  gap: max(var(--theme-page-spacing-inline-primary) / 3.3, var(--theme-page-spacing-block-primary) / 1.75);
  padding-inline: var(--theme-page-spacing-inline-primary);
}

section.page-section.articles > a.article {
  display: contents;
}

section.page-section.articles article {
  display: flex;
  flex-direction: column;
  border-radius: 1em;
  border-block-start: 0.2em solid currentColor;
  background-color: var(--theme-background-color-secondary);
  box-shadow: 0.25em 0.25em 1em -0.5em var(--theme-box-shadow-color-primary);
}

section.page-section.articles article section:is(.header, .body, .footer) {
  display: flex;
  padding-block: max(var(--theme-page-spacing-block-primary) / 2, 1.25rem);
  padding-inline: max(var(--theme-page-spacing-inline-primary) / 2.75, 1.25rem);
}

section.page-section.articles article section.header:not(:empty) {
  height: 12em;
  border-radius: inherit;
  padding-block-end: 0;
}

section.page-section.articles article section.header:empty {
  display: none;
}

section.page-section.articles article section.header img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  box-shadow: 0 0 1em -0.25em var(--theme-box-shadow-color-primary);
}

section.page-section.articles article section.body {
  flex: 1 1 auto;
  flex-direction: column;
  gap: calc(var(--theme-page-spacing-block-primary) / 7.68 + 0.6em);
}

section.page-section.articles article section.body summary {
  font-size: 0.9em;
}

section.page-section.articles article section.footer {
  display: flex;
  justify-content: space-between;
  padding-block-start: 0;
}

section.page-section.articles article section.footer time {
  font-size: var(--theme-font-size-tertiary);
  font-weight: var(--theme-font-weight-secondary);
  color: var(--theme-text-color-teritary);
}
