/* Cases en tuiles vidéo (référence : Saint-Christol et Happyscope). Commun
   aux cases suivantes, chargé après case-elastic.css. Chaque tuile garde son
   format en mobile, sinon le fond autour de la capture serait rogné. Boutons
   dans le fond autour de la capture */
.pj-fig:not(.pj-mosaic) .pj-fig-zoom { right: 12px; bottom: 12px; }
.pj-fig:not(.pj-mosaic) .pj-fig-play { right: 68px; bottom: 12px; }
/* Résultats sans image de fond : pas de voile ni de pleine hauteur */
.pj-results { min-height: 0; padding-top: var(--pj-gap); }
.pj-results-veil { display: none; }
@media (max-width: 860px) {
  .pj-mosaic .pj-fig-btn { aspect-ratio: 1440 / 820; }
  .pjc-img1 .pj-fig-btn { aspect-ratio: 2 / 3; }
  .pjc-img2 .pj-fig-btn { aspect-ratio: 1 / 1; }
  .pjc-img3 .pj-fig-btn { aspect-ratio: 5 / 6; }
  .pj-fig:not(.pj-mosaic) .pj-fig-zoom { right: 4px; bottom: 4px; transform: scale(.75); transform-origin: 100% 100%; }
  .pj-fig:not(.pj-mosaic) .pj-fig-play { right: 44px; bottom: 4px; transform: scale(.75); transform-origin: 100% 100%; }
}
/* Bandes en grande image : voile léger, pour l'en-tête et la citation sur les images claires */
.pj-band-pin:has(video[data-src*="/bande-2-v"], video[data-src*="/bande-3-v"], video[src*="/bande-2-v"], video[src*="/bande-3-v"]) .pj-band-veil {
  background: linear-gradient(180deg, rgba(26, 26, 26, 0.5) 0, rgba(26, 26, 26, 0) 140px),
    linear-gradient(180deg, rgba(26, 26, 26, 0.14) 0, rgba(26, 26, 26, 0.14) 45%, rgba(26, 26, 26, 0.6) 74%, var(--night) 100%);
}

/* visuel de fin : pas de zoom au survol, il mangerait les marges de la grille */
.pj-fig.pj-mosaic .pj-fig-btn:hover,
.pj-fig.pj-mosaic .pj-fig-btn:focus-visible { transform: translateZ(0); }
