body {
  overflow-x: hidden;
}

.page-content ul {
  display: grid;
  grid-gap: 40px 0;
  gap: 40px 0;
  grid-template-columns: repeat(8, 1fr);
  margin-top: 70px;
  width: 100%;
}

@media screen and (min-width: 810px) {
  .page-content ul {
    display: grid;
    grid-gap: 140px 0;
    gap: 140px 0;
    grid-template-columns: repeat(14, 1fr);
    margin-top: 60px;
  }
}

img.bkg {
  filter: blur(8px);
  height: 110vh;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  left: -5%;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0;
  position: fixed;
  top: -5vh;
  transition: opacity 0.3s ease;
  width: 110%;
  z-index: -1;
}

img.cover:hover ~ img.bkg {
  opacity: 1;
}

@media screen and (min-width: 800px) {
  .page-content ul {
    gap: 20px;
  }
}

.page-content article {
  font-size: var(--text-size-sm);
  margin-top: 20px;
}

.page-content li h2, .page-content li p {
  font-family: var(--font-family-sans);
  font-size: inherit;
  letter-spacing: 0.0375rem;
}

.page-content li:nth-child(odd) {
  grid-column: 1 / span 5;
}

.page-content li:nth-child(even) {
  grid-column: 4 / span 5;
}

@media screen and (min-width: 800px) {
  .page-content li:nth-child(odd) {
    grid-column: 2 / span 4;
    margin-top: 140px;
  }

  .page-content li:nth-child(even) {
    align-self: flex-end;
    grid-column: 9 / span 4;
    margin-top: 20vw;
  }
}