/* Size each row to its content; keep editorial covers in their uploaded ratio. */
.news-page .news-list { display: grid; grid-auto-rows: auto; }
.news-page .news { width: 100%; height: auto; max-width: none; align-items: flex-start; }
.news-page .news__cover { width: 36%; max-width: 240px; aspect-ratio: auto; }
.news-page .news__image { height: auto; object-fit: contain; }
.news-page .news__body { min-width: 0; }
.news-page .news__tags { flex-wrap: wrap; }
.news-page .news__tag { overflow-wrap: anywhere; }

/* Mobile News uses the same image-first reading order as More news. */
@media (max-width: 768px) {
  .news-page .news-list { grid-auto-rows: auto; gap: 32px; }
  .news-page .news-list__item + .news-list__item { padding-top: 0; border-top: 0; }
  .news-page .news {
    flex-direction: column;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    gap: 12px;
    border: 0;
    font-family: var(--v2-font);
  }
  .news-page .news__cover { width: 100%; max-width: none; flex: none; aspect-ratio: auto; }
  .news-page .news__body { width: 100%; min-width: 0; gap: 8px; }
  .news-page .news__meta { align-items: baseline; justify-content: space-between; gap: 4px 12px; }
  .news-page .news__author + .news__date::before { content: none; }
  .news-page .news__title { font-size: 20px; line-height: 28px; overflow-wrap: anywhere; }
  .news-page .news__description {
    display: -webkit-box;
    font-size: 16px;
    line-height: 28px;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow-wrap: anywhere;
  }
  .news-page .news__tags { flex-wrap: wrap; align-items: baseline; }
  .news-page .news__tag { overflow-wrap: anywhere; }
}
