/*
 * Accueil — surcharges des composants éditoriaux.
 *
 * IMPORTANT : cette feuille est chargée APRÈS layout.css. C'est indispensable :
 * layout.css définit les composants .flm-* et, chargé en dernier, il annulait
 * toute correction écrite dans style.css (même spécificité, il gagnait par
 * l'ordre). Toute retouche d'un composant .flm-* doit donc se faire ICI.
 */

/* ─── Cartes « Le tour des rubriques » ──────────────────────────────────────
 * BUG D'ORIGINE : .flm-band-img est une balise <a>, donc inline. aspect-ratio
 * ne s'applique pas aux éléments inline : l'image gardait sa hauteur naturelle
 * et repoussait le titre et le texte hors de l'écran.
 */
.flm-band-card .flm-band-img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.flm-band-card .flm-band-img img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.flm-band-card { display: flex; flex-direction: column; }
.flm-band-card .flm-band-body { padding: .9rem 1.1rem 1.15rem; }
.flm-band-card__title {
  font-size: 17px; line-height: 1.3; margin: .3rem 0 .45rem;
}
.flm-band-card__title a { color: #7c1622; }
.flm-band-card__title a:hover { color: #c8102e; text-decoration: none; }
.flm-band-card__excerpt {
  font-size: 14px; line-height: 1.45; color: var(--color-muted); margin-bottom: .55rem;
}
.flm-band-card__date { font-size: 12px; color: var(--color-muted); margin: 0; }

/* Grille : les cartes gardent une largeur lisible même s'il y en a peu. */
.flm-band-grid {
  display: grid; gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(240px, 300px));
  justify-content: center;
}

/* Fond de section : Brume Rosée (l'original gardait une teinte turquoise). */
.flm-band-section { background: var(--color-forest-50); }

/* ─── Carte « À la une » ────────────────────────────────────────────────── */
.flm-card-lead .flm-card-img { display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; }
.flm-card-lead .flm-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.flm-card-lead {
  background: #fff;
  border: 1px solid var(--color-sand-200);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(124, 22, 34, .08);
}
.flm-card-lead .flm-card-body { padding: 1.1rem 1.35rem 1.35rem; }
.flm-card-lead__title { font-size: 24px; line-height: 1.25; margin: .3rem 0 .5rem; }
.flm-card-lead__title a { color: #7c1622; }
.flm-card-lead__title a:hover { color: #c8102e; text-decoration: none; }
.flm-card-lead__excerpt { font-size: 15.5px; line-height: 1.55; color: var(--color-ink); margin-bottom: .6rem; }
.flm-card-lead__meta { font-size: 13px; color: var(--color-muted); }

/* ─── Miniatures « À la une » (colonne de droite) ───────────────────────── */
.cc-mini__img { display: block; }

/* ─── Liste numérotée ───────────────────────────────────────────────────── */
.flm-numbered-list .flm-num { color: rgba(200, 16, 46, .45); }
.flm-num-title { display: block; font-weight: 700; color: #7c1622; }
.flm-num-date { display: block; color: var(--color-muted); }

/* ─── Encart newsletter ─────────────────────────────────────────────────────
 * Le composant d'origine n'avait AUCUN fond et un texte blanc : illisible sur
 * la Brume Rosée. On lui donne le Bordeaux du pied de page.
 */
.flm-nl-inset {
  background: #7c1622;
  border-radius: 12px;
  padding: 2rem 2.25rem;
  display: grid; gap: 1.25rem; align-items: center;
}
@media (min-width: 900px) { .flm-nl-inset { grid-template-columns: 1.2fr 1fr; } }
.flm-nl-inset__title { color: #fff; font-size: 22px; line-height: 1.3; }
.flm-nl-inset__text { color: rgba(255, 255, 255, .82); }
.flm-nl-inset .site-footer-nl-form button { background: #fff; color: #7c1622; }
.flm-nl-inset .site-footer-nl-form button:hover { background: var(--color-forest-50); color: #c8102e; }
.flm-nl-inset .site-footer-nl-msg { color: rgba(255, 255, 255, .9); }

/* ─── Vignettes de rubriques ────────────────────────────────────────────── */
.cc-rubrique__img { display: block; }