/* ==========================================================================
   Avigail — couche éditoriale (charte §07)
   --------------------------------------------------------------------------
   POURQUOI CE FICHIER EXISTE
   Les widgets portent leur propre CSS : ils s'affichaient donc correctement.
   Mais la prose SEO qui les entoure utilise les classes WordPress standard
   (wp-block-heading, wp-block-paragraph, wp-block-list). Sur le VPS,
   GeneratePress les stylait ; Hello Elementor, volontairement minimal, ne les
   style pas du tout. D'où du texte pleine largeur, sans marges, en polices
   système, avec des liens bleus. Constat d'Amadou le 31/07.

   DEUX PIÈGES RENCONTRÉS, corrigés ici :

   1. SPÉCIFICITÉ. Les titres portent .wp-block-heading (0,2,0). Une règle
      « .elementor-widget > h2 » ne pèse que 0,1,1 et perdait donc contre la
      règle générique. Toutes les règles de titre ci-dessous ciblent la classe,
      pas la balise seule.

   2. LARGEUR DE COLONNE. --av-prose-max vaut 65ch, une mesure relative à la
      police de l'élément. Appliquée à un titre de 32px, elle produit ~1400px :
      le titre débordait à pleine largeur pendant que les paragraphes étaient
      bien contenus. --av-colonne ci-dessous fige la colonne en rem, donc
      indépendamment de la taille de police, pour que titres et paragraphes
      s'alignent exactement.

   Sélecteur vérifié dans un navigateur, pas supposé : la chaîne réelle est
   .elementor > section > .elementor-container > .elementor-column >
   .elementor-widget-wrap > .elementor-widget > h2.wp-block-heading.
   Le combinateur enfant direct protège l'en-tête et le pied, dont le contenu
   est imbriqué dans .avh / .avf.
   ========================================================================== */

.elementor-widget {
  /* Colonne de lecture. 44rem = 704px, soit exactement la largeur mesurée de
     --av-prose-max (65ch) en Manrope 17px. Exprimée en rem pour que les titres,
     plus gros, s'alignent sur la même colonne que le corps de texte. */
  --av-colonne: 44rem;
}

/* --- Colonne de lecture commune ------------------------------------------ */
.elementor-widget > .wp-block-heading,
.elementor-widget > .wp-block-paragraph,
.elementor-widget > .wp-block-list,
.elementor-widget > .wp-block-quote,
.elementor-widget > .wp-block-table,
.elementor-widget > h1, .elementor-widget > h2,
.elementor-widget > h3, .elementor-widget > h4,
.elementor-widget > p,  .elementor-widget > ul, .elementor-widget > ol {
  max-width: var(--av-colonne);
  margin-inline: auto;
  padding-inline: var(--av-sp-4);
  box-sizing: content-box;
}

/* --- Corps de texte ------------------------------------------------------- */
.elementor-widget > .wp-block-paragraph,
.elementor-widget > p {
  font-family: var(--av-font-text);
  font-size: var(--av-fs-body);
  line-height: var(--av-lh-body);
  color: var(--av-ink);
  margin-block: 0 var(--av-sp-5);
}

/* --- Titres — ciblent la classe pour l'emporter en spécificité ------------ */
.elementor-widget > h1.wp-block-heading, .elementor-widget > h1,
.elementor-widget > h2.wp-block-heading, .elementor-widget > h2,
.elementor-widget > h3.wp-block-heading, .elementor-widget > h3,
.elementor-widget > h4.wp-block-heading, .elementor-widget > h4 {
  font-family: var(--av-font-display);
  font-weight: 600;
  line-height: var(--av-lh-tight);
  color: var(--av-ink);
  letter-spacing: .005em;
  text-wrap: balance;
}
.elementor-widget > h1.wp-block-heading, .elementor-widget > h1 { font-size: var(--av-fs-h1); margin-block: var(--av-sp-14) var(--av-sp-5); }
.elementor-widget > h2.wp-block-heading, .elementor-widget > h2 { font-size: var(--av-fs-h2); margin-block: var(--av-sp-14) var(--av-sp-4); }
.elementor-widget > h3.wp-block-heading, .elementor-widget > h3 { font-size: var(--av-fs-h3); margin-block: var(--av-sp-10) var(--av-sp-3); }
.elementor-widget > h4.wp-block-heading, .elementor-widget > h4 { font-size: var(--av-fs-lead); margin-block: var(--av-sp-8) var(--av-sp-3); }

/* --- Listes --------------------------------------------------------------- */
.elementor-widget > .wp-block-list,
.elementor-widget > ul, .elementor-widget > ol {
  font-family: var(--av-font-text);
  font-size: var(--av-fs-body);
  line-height: var(--av-lh-body);
  color: var(--av-ink);
  margin-block: 0 var(--av-sp-6);
  padding-inline-start: calc(var(--av-sp-4) + var(--av-sp-6));
}
.elementor-widget > .wp-block-list li,
.elementor-widget > ul li, .elementor-widget > ol li { margin-block-end: var(--av-sp-2); }
.elementor-widget > .wp-block-list li::marker,
.elementor-widget > ul li::marker { color: var(--av-gold); }

/* --- Liens : or profond (6,3:1), jamais le bleu du navigateur ------------- */
.elementor-widget > .wp-block-paragraph a,
.elementor-widget > .wp-block-list a,
.elementor-widget > p a, .elementor-widget > ul a, .elementor-widget > ol a {
  color: var(--av-gold-deep);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color var(--av-ease);
}
.elementor-widget > .wp-block-paragraph a:hover,
.elementor-widget > p a:hover { color: var(--av-clay-deep); }

/* --- Respiration autour du widget et de la zone de contenu ---------------- */
.elementor-widget > [class$="-app"],
.elementor-widget > [class$="-wrap"] { margin-block: var(--av-sp-14); }
.elementor-widget > :first-child { margin-block-start: var(--av-sp-10); }
.elementor-widget > :last-child  { margin-block-end: var(--av-sp-14); }

/* --- Desktop : la prose passe à 17px (charte §07) ------------------------- */
@media (min-width: 768px) {
  .elementor-widget > .wp-block-paragraph, .elementor-widget > p,
  .elementor-widget > .wp-block-list, .elementor-widget > ul, .elementor-widget > ol {
    font-size: var(--av-fs-prose);
  }
  .elementor-widget > :first-child { margin-block-start: var(--av-sp-14); }
}

/* --- Composants éditoriaux nommés (charte §07) -----------------------------
   Classes av-* posées par la rédaction. Décision 31/07 (note d'intégration,
   correctif transverse n°1) : on les DÉFINIT plutôt que de les retirer — une
   page qui ne les emploie pas garde le style de base, une page qui les emploie
   gagne la finition. Jetons uniquement, aucune valeur en dur. */
.elementor-widget > .av-crumb { font-size: var(--av-fs-xs); color: var(--av-ink-muted); margin-block-end: var(--av-sp-2); }
.elementor-widget > .av-crumb a { color: var(--av-ink-muted); }
.elementor-widget > .av-overline { font-size: var(--av-fs-over); letter-spacing: .16em; text-transform: uppercase; color: var(--av-gold-deep); font-weight: 600; margin-block-end: var(--av-sp-2); }
.elementor-widget > .av-lede, .elementor-widget > .av-enbref {
  font-size: var(--av-fs-lead); color: var(--av-ink-soft); line-height: var(--av-lh-body);
  border-inline-start: 3px solid var(--av-gold); padding-inline-start: var(--av-sp-4);
}
.elementor-widget > .av-meta { font-size: var(--av-fs-xs); color: var(--av-ink-muted); }
.elementor-widget > .av-toc {
  background: var(--av-bg-soft); border: 1px solid var(--av-border);
  border-radius: var(--av-radius-md); padding: var(--av-sp-5) var(--av-sp-6);
  list-style: none; padding-inline-start: var(--av-sp-6);
}
.elementor-widget > .av-toc li { margin-block-end: var(--av-sp-1); }
.elementor-widget > .av-toc a { color: var(--av-ink); text-decoration: none; }
.elementor-widget > .av-toc a:hover { color: var(--av-gold-deep); text-decoration: underline; }
.elementor-widget > .av-callout-title { font-family: var(--av-font-display); font-weight: 600; font-size: var(--av-fs-h3); margin-block-end: var(--av-sp-2); }
.elementor-widget > .av-callout {
  background: var(--av-gold-soft); border-radius: var(--av-radius-md);
  padding: var(--av-sp-5) var(--av-sp-6); padding-inline-start: var(--av-sp-8); list-style: none;
}
.elementor-widget > .av-reassure { list-style: none; padding-inline-start: var(--av-sp-4); color: var(--av-ink-soft); font-size: var(--av-fs-sm); }
.elementor-widget > .av-links { padding-inline-start: var(--av-sp-6); }
.elementor-widget > .av-cta-title { font-family: var(--av-font-display); font-weight: 600; font-size: var(--av-fs-h3); text-align: center; margin-block-start: var(--av-sp-10); }
.elementor-widget > .av-btn, .elementor-widget > p > .av-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: var(--av-tap);
  padding: 0 var(--av-sp-8); background: var(--av-gold-deep); color: var(--av-bg);
  border-radius: var(--av-radius-pill); font-weight: 600; text-decoration: none;
}
.elementor-widget > .av-fine { font-size: var(--av-fs-xs); color: var(--av-ink-muted); text-align: center; }
.elementor-widget > .av-disclaimer { font-size: var(--av-fs-xs); color: var(--av-ink-muted); border-block-start: 1px solid var(--av-border); padding-block-start: var(--av-sp-4); }