/* Film de l'offre : une courte vidéo, sous l'en-tête de la page, qui montre le problème et sa solution. */
.offer-film { max-width: 960px; margin: 0 auto; }
.offer-film video {
  width: 100%; aspect-ratio: 16 / 9; display: block; /* garde son format pendant le chargement */
  background: var(--navy-800); border-radius: var(--r-lg); box-shadow: var(--shadow-lg);
}
.offer-film figcaption { margin-top: 14px; text-align: center; color: var(--text-soft); font-size: .95rem; line-height: 1.5; }
.offer-film figcaption strong { color: var(--text); }

/* Deux films courts côte à côte, sous le film principal */
.offer-films { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 36px); max-width: 960px; margin: clamp(32px, 5vw, 56px) auto 0; }
.offer-films .offer-film video { border-radius: var(--r-md); box-shadow: var(--shadow-md); }
@media (max-width: 760px) {
  .offer-films { grid-template-columns: 1fr; }
}