.site-content--section,
.site-content--list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 0.2fr 1fr 0.2fr;
  grid-template-rows: auto auto auto;
  justify-items: center;
  align-items: center;
  grid-template-areas: 
    "list-page-header list-page-header list-page-header"
    "list-page-grid list-page-grid list-page-grid"
    "list-page-footer list-page-footer list-page-footer";
  margin-block-start: 5em;

  @include mq("large") {
    grid-template-areas: 
      ". list-page-header ."
      "list-page-grid list-page-grid list-page-grid"
      ". list-page-footer .";
  }

  & .site-content__header {
    grid-area: list-page-header;
    text-align: center;

    & .page-header__minor-links {
      text-align: center;
      overflow: auto;

      & ul {
        list-style: none;

        & li {
          float: inline-start;
          margin-block: 0;
          margin-inline: 1em;

          & * {
            display: inline-block;
          }
        }
      }

      & .minor-links {
        &__categories {
          inline-size: fit-content;
          margin: auto;
          display: block;
          overflow: auto;

          @include mq("large") {
            font-size: 1em !important;
          }
        }

        &__years {
          display: block;
          margin: auto;
          inline-size: fit-content;

          & li {
            inline-size: fit-content;
            min-inline-size: fit-content;
            padding: 0.5em;

            @include mq("large") {
              padding: 0;
            }
          }
        }
      }
    }
  }

  & .site-content__body {
    inline-size: 100%;
    display: grid;
    grid-gap: 10px;
    grid-area: list-page-grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(8, 1fr);
    justify-items: stretch;
    align-items: stretch;

    @include mq("medium") {
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(4, 1fr);
    }

    @include mq("large") {
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(2, 1fr);
    }

    &--list {
      grid-template-columns: 1fr auto 1fr;
      grid-template-rows: auto;
      grid-template-areas: ". sections-list .";
    }

    &--chart {
      grid-template-columns: 1em 100% 1fr;
      grid-template-rows: auto auto;
      grid-template-areas:
        ". section-chart ."
        ". section-content .";
    }
  }

  & .site-content__footer {
    grid-area: list-page-footer;
  }
}