@import url("@arc-ui/tokens-arc/dist/custom-media.css");

.PromoListingThumbnailSignpost {
  max-width: 1280px;
}

.PromoListingThumbnailSignpost ul,
.PromoListingThumbnailSignpost li {
  text-decoration: none;
  padding: 0;
  margin: 0;
}

.list {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--arc-size-grid-gutter-s);
  row-gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.list li {
  grid-column: span 12;
}

@media (--arc-custom-media-min-width-s-px) {
  .list {
    row-gap: 32px;
  }
}

@media (--arc-custom-media-min-width-m-px) {
  .list {
    column-gap: var(--arc-size-grid-gutter-m);
  }

  .list li {
    grid-column: span 6;
  }
}

@media (--arc-custom-media-min-width-l-px) {
  .list {
    row-gap: 40px;
  }
}

@media (--arc-custom-media-min-width-xl-px) {
  .list {
    column-gap: var(--arc-size-grid-gutter-l);
  }
}