/* News overview — mosaic of .tile. Filter/pagination live in overview.css. */

.news-overview {
  gap: 1.5rem; /* same as .tiles / case-tiles — not --row-spacer */
}

.news-tiles {
  --tile-width: 22rem;
  display: grid;
  gap: 1.5rem;
  inline-size: 100%;
  grid-template-columns: repeat(
    auto-fit,
    minmax(min(100%, var(--tile-width)), 1fr)
  );
}

.news-tiles-mosaic {
  max-inline-size: 77.125rem; /* Figma ~1234 — same as .overview-filter */
  margin-inline: auto;
}

.news-tiles .tile {
  aspect-ratio: 5 / 3;
}

.news-tiles .news-tile-lg {
  aspect-ratio: 6 / 5;
}

.news-tiles .tile-overlay {
  background: radial-gradient(
    98% 59% at 54% 31%,
    rgb(0 28 64 / 0.2) 55%,
    rgb(0 28 64 / 0.9) 100%
  );
  mix-blend-mode: normal;
}

@media (min-width: 1000px) {
  .news-tiles-mosaic {
    grid-template-columns: repeat(12, 1fr);
  }

  .news-tiles-mosaic .news-tile-lg {
    grid-column: span 7;
    grid-row: span 2;
    aspect-ratio: auto;
    min-block-size: 0;
  }

  .news-tiles-mosaic .tile:not(.news-tile-lg) {
    grid-column: span 5;
  }

  .news-tiles-mosaic > :nth-child(6n + 4),
  .news-tiles-mosaic > :nth-child(6n + 5) {
    grid-column: 1 / span 5;
  }

  .news-tiles-mosaic > :nth-child(6n + 6) {
    grid-column: 6 / span 7;
  }
}