/* ==========================================================================
   Skyloria — actualités (actualites.html)
   Chargé par cette page seulement, après base.css, components.css et pages.css.
   ========================================================================== */


/* ---------- Actualités ---------- */

.container--news {
  max-width: calc(1040px + 2 * var(--gutter));
}

.news-feed {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.news-feed > .board-empty,
.news-card--featured {
  grid-column: 1 / -1;
}

.news-card.is-highlighted {
  border-color: rgba(255, 212, 71, 0.5);
  box-shadow: 0 0 0 1px rgba(255, 212, 71, 0.35), var(--shadow-2);
}

.news-card--featured .news-card__cover {
  aspect-ratio: 21 / 8;
}

.news-card--featured .news-card__title {
  font-size: var(--fs-xl);
}

.news-card__body.is-clamped {
  max-height: 260px;
  overflow: hidden;
  mask-image: linear-gradient(180deg, #000 70%, transparent);
}

.news-card__gallery {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

.news-card__gallery img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: var(--r-sm);
}

.news-embed {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--r-sm);
  border-left: 4px solid var(--embed, var(--sky-400));
  background: rgba(6, 18, 41, 0.45);
}

.news-embed__title {
  font-weight: 800;
  color: var(--text-1);
}

a.news-embed__title:hover {
  color: var(--gold-300);
}

.news-embed__image {
  border-radius: var(--r-sm);
  max-height: 320px;
  width: auto;
}

.spoiler {
  border-radius: 3px;
  background: rgba(143, 211, 255, 0.18);
  color: transparent;
  filter: blur(2px);
  cursor: pointer;
  transition: filter var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out);
}

.spoiler:hover,
.spoiler:focus {
  color: inherit;
  filter: none;
}

/* ---------- Petits écrans ---------- */

@media (max-width: 720px) {
  .news-feed {
    grid-template-columns: 1fr;
  }
}