/* Section vidéo de l'accueil (6 novembre 2026, voir docs/SITE_VITRINE.md).
   Ordinateur et tablette : la vidéo de présentation en 16:9. Téléphone : le Short 9:16.
   Un seul des deux est affiché ; le lecteur YouTube ne se charge qu'au clic (video.js). */
.video-intro{padding-bottom:40px}
.video-intro .section-heading{margin-bottom:44px}
.video-stage{display:flex;justify-content:center}
.video-facade,.video-frame{position:relative;display:block;width:100%;overflow:hidden;border-radius:28px;background:#0f0f10;box-shadow:0 30px 70px #1515151f}
.video-facade.is-wide,.video-frame.is-wide{aspect-ratio:16/9;max-width:1100px}
.video-facade.is-tall,.video-frame.is-tall{display:none;aspect-ratio:9/16;width:min(80vw,360px)}
.video-facade img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.video-facade:hover img{transform:scale(1.02)}
/* Pastille « Voir la vidéo » en bas de l'aperçu : elle ne cache pas le texte de l'image. */
.video-cta{position:absolute;left:28px;bottom:28px;display:inline-flex;align-items:center;gap:14px;background:#fff;color:var(--ink);font-weight:600;font-size:15px;line-height:1.3;padding:8px 24px 8px 8px;border-radius:99px;box-shadow:0 10px 30px #1515152e;white-space:nowrap}
.video-play{width:52px;height:52px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;flex:none;box-shadow:0 0 0 6px #e11d2a26;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.video-play .icon{width:22px;height:22px;fill:currentColor;margin-left:3px}
.video-facade:hover .video-play,.video-facade:focus-visible .video-play{transform:scale(1.08);box-shadow:0 0 0 10px #e11d2a2b}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-note{text-align:center;font-size:12px;color:#77777f;margin-top:22px}
@media(max-width:700px){
  .video-intro{padding-bottom:20px}
  .video-intro .section-heading{margin-bottom:28px}
  .video-facade.is-wide,.video-frame.is-wide{display:none}
  .video-facade.is-tall,.video-frame.is-tall{display:block}
  .video-facade,.video-frame{border-radius:24px}
  .video-cta{left:50%;bottom:22px;transform:translateX(-50%);font-size:14px;padding:6px 20px 6px 6px;gap:12px}
  .video-play{width:46px;height:46px}
  .video-play .icon{width:20px;height:20px}
}
@media(prefers-reduced-motion:reduce){.video-facade img,.video-play{transition:none}.video-facade:hover img{transform:none}}
.motion-reduced .video-facade img,.motion-reduced .video-play{transition:none}
.motion-reduced .video-facade:hover img{transform:none}
