/*
 * Section « vidéos en libre accès » (R-VID1, 20/09/2026).
 *
 * Ne vit ici QUE ce qu'aucune classe du design system ne porte. Les cartes, la
 * grille, les titres et le bouton viennent de `mist-ds.css`, servie sur tout le
 * site : les recopier ici ferait deux sources pour une même apparence, et la
 * première retouche de charte n'en toucherait qu'une.
 *
 * ⚠️ ET SURTOUT PAS LES CLASSES DU KIT (`mist-v4-*`). Le CSS des classes
 * globales est généré PAR PAGE, et seulement pour celles vues dans son
 * `_elementor_data`. Ce balisage-ci sort d'un widget PHP, donc AU RENDU :
 * Elementor ne sait pas que ces classes servent, et la section sortirait sans
 * aucun style — 53 écarts mesurés le 07/09 sur l'accueil, 8 critères de sonde
 * verts et compte d'éléments identique à la référence.
 */

/* ============================================================================
   LE DÉCALAGE D'ANCRE — la raison d'être principale de ce fichier.
   ==========================================================================*/

/* 🔴 L'EN-TÊTE SE DÉCLARE COLLANT ET NE COLLE PAS — mesuré le 20/09, sur la
   page 370 elle-même. `mist-chrome.css:85` pose bien
   `.elementor .site-header{position:sticky;top:0}`, mais après un défilement
   de 900 px la barre est à `top:-860` (1440) et `-822` (390) : elle part avec
   la page. Un ancêtre neutralise le collage. La hauteur, elle, est bien de
   79 px aux deux largeurs.

   ⚠️ LE DÉCALAGE RESTE, ET IL EST DÉLIBÉRÉ. Il couvre les deux cas : si la
   barre se remet à coller un jour (une règle d'ancêtre corrigée suffirait),
   l'ancre dépose le titre EXACTEMENT sous elle — le saut a lieu, la page
   répond 200, aucune sonde ne bronche, et le visiteur atterrit sur un titre
   qu'il ne voit pas. Aujourd'hui, ces 104 px se lisent comme une respiration ;
   mesuré après clic, le titre visé arrive à y=140. 104 = 79 + 25.
   ⚠️ `scroll-margin-top` et NON `scroll-padding-top` sur `html` : la seconde
   forme s'ajouterait aux `scroll-margin-top:90px` déjà posés sur les titres
   des articles (`mist-article.css:217`), qui atterriraient 194 px trop bas. */
.mist-ancre-section,
/* L'autre cible d'ancre de la page 370 est la grille des replays. Son widget
   appartient au lot B1 livré le matin même : on ne le modifie pas pour lui
   ajouter une classe. On vise donc celle qu'Elementor émet toujours pour lui. */
.elementor-widget-mist_replays {
	scroll-margin-top: 104px;
}

/* ============================================================================
   LA FAÇADE DANS SA CARTE
   ==========================================================================*/

/* `mist-videos-pdp.css:21` donne à toute façade un `border-radius:30px` sur ses
   QUATRE coins — c'est juste quand elle est posée seule, comme sur la page 366.
   Ici elle coiffe une carte qui rogne (`overflow:hidden`) : ses coins bas
   doivent être carrés, sinon on voit la courbe du média se détacher à
   l'intérieur de la courbe de la carte.
   ⚠️ SÉLECTEUR EN (0,3,0) DÉLIBÉRÉMENT. La règle d'en face sort en (0,2,0)
   (`.elementor [data-mist-video]`) et les deux feuilles sont mises en file par
   des chemins différents — `mist-videos-pdp` sans condition, celle-ci par
   `get_style_depends()`. À spécificité égale c'est l'ORDRE qui tranche, et cet
   ordre n'est garanti par rien. */
.elementor .mist-videos-libre-media[data-mist-video] {
	border-radius: var(--r-l) var(--r-l) 0 0;
}

@media (max-width: 767px) {
	.elementor .mist-videos-libre-media[data-mist-video] {
		border-radius: var(--r-m) var(--r-m) 0 0;
	}
}

/* Le titre de la vidéo est le seul texte de la carte : il ne doit pas être
   collé au média ni tomber sous la carte quand il est long. `text-wrap` reste
   en repli silencieux sur les navigateurs qui l'ignorent. */
.mist-videos-libre-titre {
	margin: 0;
	text-wrap: pretty;
}
