/**
 * Neutralisation d'Elementor — chargée AVANT les feuilles du projet.
 *
 * Sa position dans la chaîne est tout l'intérêt du fichier, et la seule raison pour
 * laquelle il existe séparément d'`overrides.css`.
 *
 * Un conteneur Elementor n'arrive jamais nu : il apporte `display:flex`, 10 px de
 * remplissage et 20 px d'espacement entre widgets. Trois décisions de mise en page que
 * personne n'a prises, empilées sous celles qui, elles, sont validées. Il faut donc les
 * effacer — mais sans jamais effacer, du même geste, les décisions du projet.
 *
 * D'où le placement. Les feuilles se chargent dans cet ordre :
 *
 *     elementor/frontend.css  →  CE FICHIER  →  globals → utilities → components
 *                                            →  pages → overrides → premium
 *
 * Ce fichier arrive après Elementor, donc il le bat à spécificité égale. Il arrive avant
 * toutes les feuilles du projet, donc **elles** le battent à spécificité égale. Le
 * `.about-grid { display: flex }` de `pages.css` reprend la main sans avoir besoin d'être
 * réécrit, et il en va de même pour toute règle à venir.
 *
 * C'est pourquoi chaque sélecteur ici est enveloppé de `:where()` : cela annule la
 * spécificité de `.elementor` et laisse la règle peser 0,1,0 — le poids d'une simple
 * classe, exactement ce qu'il faut pour battre Elementor et perdre contre le projet.
 *
 * Une tentative précédente plaçait ces règles dans `overrides.css`, chargé après
 * `pages.css` : `display:block` y écrasait `.about-grid` et `.values-grid` et démolissait
 * la page À propos. Ne pas les y remettre.
 *
 * ⚠️ Aucune décision de design ici. Que des remises à zéro, et deux valeurs recopiées de
 * la règle de titres du thème parent — citées, pas choisies.
 */

/*
 * Le conteneur redevient une boîte ordinaire.
 *
 * `display` compte plus qu'il n'y paraît : entre deux frères, les marges fusionnent en
 * flux bloc et s'additionnent en flex. La carte de valeur de la page À propos y gagnait
 * 8 px — la marge basse de l'icône cessait de fusionner avec la marge haute du titre.
 */
:where(.elementor) .e-con {
	display: block;

	/* Le remplissage par défaut d'Elementor : 10 px sur les quatre côtés. */
	--container-default-padding-top: 0px;
	--container-default-padding-right: 0px;
	--container-default-padding-bottom: 0px;
	--container-default-padding-left: 0px;
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;

	--margin-top: 0px;
	--margin-right: 0px;
	--margin-bottom: 0px;
	--margin-left: 0px;

	/* L'espacement entre widgets : 20 px, invisible dans l'onglet Style. */
	--widgets-spacing: 0px;
	--widgets-spacing-row: 0px;
	--widgets-spacing-column: 0px;
	--kit-widget-spacing: 0px;
	--gap: 0px;
	--row-gap: 0px;
	--column-gap: 0px;

	/*
	 * La largeur redevient `auto`, celle d'un `<div>` ordinaire — et non le `100%`
	 * qu'Elementor impose.
	 *
	 * En flux bloc les deux se valent. En flux flex, non : `auto` s'ajuste au contenu,
	 * `100%` remplit. Le bloc de titre du blog, élément flex d'un hero centré, passait
	 * ainsi de 788 px à 1152 et cessait d'être centré sur son texte. Ce sont les feuilles
	 * du projet qui bornent les colonnes, par `max-width` ; le conteneur n'a pas à s'en
	 * mêler.
	 */
	--content-width: 100%;
	--width: auto;
	--min-height: initial;
}

/*
 * Les enveloppes que tout widget porte disparaissent de l'arbre de rendu.
 *
 * `display: contents` est le seul réglage qui règle **toute** la famille de problèmes
 * qu'elles créent, plutôt qu'un cas après l'autre. Une enveloppe n'est pas seulement une
 * boîte de trop : elle s'interpose entre un élément et son parent, et casse tout ce qui
 * dépend de cette relation directe. Trois exemples rencontrés, tous sur l'accueil :
 *
 * - `.pm-metier-visuel img { height: 100% }` — un pourcentage se résout contre le parent
 *   immédiat. Devenu une enveloppe à hauteur automatique, il rendait `auto`, et l'image
 *   reprenait son format naturel en poussant la carte.
 * - `.ouverture-card` est une grille dont `premium.css` place les enfants par
 *   `grid-column` et `grid-row`. Ces déclarations vivent sur les classes des éléments,
 *   mais ce sont les enveloppes qui étaient les cases : la composition se recomposait
 *   toute seule, en deux colonnes inversées.
 * - Une décoration masquée par `display: none` laissait son enveloppe visible, donc une
 *   case de grille vide et 48 px de gouttière que rien ne remplissait.
 *
 * Sans boîte du tout, l'élément redevient l'enfant direct de son parent, et les feuilles
 * du projet retrouvent exactement la structure pour laquelle elles ont été écrites. Les
 * marges fusionnent de nouveau, les pourcentages se résolvent, le placement de grille
 * s'applique, et un `display: none` emporte réellement ce qu'il masque.
 *
 * `display: block` a été essayé d'abord, avec `margin`, `padding` et `position: static`
 * remis à zéro : cela règle les marges, mais aucune des trois relations ci-dessus.
 *
 * L'exclusion de l'éditeur est nécessaire : Elementor a besoin des boîtes de ses
 * enveloppes pour placer ses poignées de sélection. La gérante garde donc un aperçu
 * cliquable, et seule la page publiée est neutralisée.
 */
:where(body:not(.elementor-editor-active)) :where(.elementor) .elementor-widget,
:where(body:not(.elementor-editor-active)) :where(.elementor) .elementor-widget-container,
:where(body:not(.elementor-editor-active)) :where(.elementor) .elementor-shortcode {
	display: contents;
}

/*
 * Le widget Titre impose `line-height: 1` et `margin: 0`, deux décisions typographiques
 * qui remplissent les silences des feuilles du projet.
 *
 * La hauteur de ligne revient à `normal`, c'est-à-dire à rien : `globals.css` ne fixe que
 * la police des titres, jamais leur hauteur de ligne. `inherit` a été essayé et rejeté —
 * il prend celle du corps de texte, 1,6, et rallongeait la page de 19 px.
 *
 * Les deux marges sont recopiées de `h1, h2, h3, h4, h5, h6 { margin-block-start: .5rem;
 * margin-block-end: 1rem }`, la règle du thème parent qu'Elementor écrasait : elle ne
 * pèse que 0,0,1 face à une classe. Le `<h2>` de la page À propos y perdait 8 px.
 *
 * Les titres dont une feuille du projet fixe déjà ces valeurs — `.pm-legal h1`,
 * `.about-content h2`, `.value-card h4` — les gardent : leurs sélecteurs passent devant.
 */
:where(.elementor) .elementor-heading-title {
	line-height: normal;
	margin-block-start: 0.5rem;
	margin-block-end: 1rem;
}