.block-articles {
  --padding-inline: calc(
    var(--article-card-shadow-offset-x) + var(--article-card-shadow-blur)
  );
  flex: 1;
  position: relative;
  height: 100%;
  padding-block: calc(
    var(--article-card-shadow-offset-y) + var(--article-card-shadow-blur)
  );
  padding-inline: var(--padding-inline);
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--padding-inline);
  scrollbar-width: none;
  background-color: rgb(var(--color-background));
  scroll-behavior: smooth;

  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: space-between;
}

.block-articles > li {
  flex-shrink: 0;
  scroll-snap-align: start;
}

@media (max-width: 959px) {
  .block-articles {
    width: calc(100% + var(--page-padding) * 2);
    padding-inline: var(--page-padding);
    margin-inline: calc(-1 * var(--page-padding));
    overflow-y: hidden;
    scroll-padding-inline: var(--page-padding);
    flex-direction: var(--mobile-auto-flow);
  }
}