/* =========================================================
   11ᵉ feuille — héros des pages internes sous l'en-tête
   flottant + anneaux concentriques centrés du bloc contact
   ========================================================= */

:root{
  /* hauteur visuelle de la barre : entete.js publie la valeur réelle
     (mesurée en haut de page), celle-ci n'est qu'un repli */
  --cq-header-h:79px;
  --cq-anneau:rgba(29,29,27,.09);
}

/* ---------- L'en-tête passe PAR-DESSUS l'image du héros ----------
   L'en-tête est en « sticky top » d'Elementor Pro : il est en position
   fixed et laisse un INTERCALAIRE de sa hauteur dans le flux, d'où la
   bande claire au-dessus de l'image. Sur les pages à héros pleine image
   on annule cet intercalaire : le contenu démarre à 0 et la barre flotte
   par-dessus. Aucune mesure en jeu, donc aucun décalage possible — et le
   collage au scroll continue de fonctionner tel quel.
   (La hauteur de la barre change entre repos et scroll : une marge
   négative calculée dessus provoquerait un saut au défilement.)
   L'intercalaire recopie AUSSI le padding de l'en-tête : `height:0` seul
   en laisse 24 px. */
body:has(.cq-hpage) .elementor-sticky__spacer{
  height:0!important;min-height:0!important;
  padding:0!important;margin:0!important;border:0!important;
}

/* Le retrait haut, lui, se cale sur la hauteur de la barre : l'espace
   sous elle reste constant quelle que soit sa taille (deux lignes en
   mobile). Une imprécision de mesure n'ajoute ici que de l'air. */
.cq-hpage{padding-top:calc(var(--cq-header-h) + 160px)!important}
@media(max-width:1024px){
  .cq-hpage{padding-top:calc(var(--cq-header-h) + 110px)!important}
}
@media(max-width:767px){
  .cq-hpage{padding-top:calc(var(--cq-header-h) + 80px)!important}
}

/* ---------- Anneaux concentriques (bloc contact) ----------
   Quatre filets centrés horizontalement. Le sommet du plus grand reste
   à l'intérieur de la section ; le bas déborde et se fait couper par
   l'overflow. Un seul pseudo-élément porte les quatre cercles. */
.cq-anneaux,
.elementor-element-cqcont{position:relative;overflow:hidden}

.cq-anneaux > .e-con,
.elementor-element-cqcont > .e-con{position:relative;z-index:1}

.cq-anneaux::after,
.elementor-element-cqcont::after{
  content:""!important;
  position:absolute;left:50%;top:50px;transform:translateX(-50%);
  width:1400px;height:1400px;
  z-index:0;pointer-events:none;
  /* rayons 280 / 420 / 560 / 700 — filets de 1 px */
  background:
    radial-gradient(circle at 50% 50%, transparent 0 279.5px, var(--cq-anneau) 279.5px 280.5px, transparent 280.5px),
    radial-gradient(circle at 50% 50%, transparent 0 419.5px, var(--cq-anneau) 419.5px 420.5px, transparent 420.5px),
    radial-gradient(circle at 50% 50%, transparent 0 559.5px, var(--cq-anneau) 559.5px 560.5px, transparent 560.5px),
    radial-gradient(circle at 50% 50%, transparent 0 699.5px, var(--cq-anneau) 699.5px 700.5px, transparent 700.5px)!important;
  /* l'ancien motif répété était fondu par un masque : on l'annule */
  -webkit-mask:none!important;mask:none!important;
}

/* les anciens cercles de la page d'accueil (2ᵉ et 5ᵉ vagues) */
.elementor-element-cqcont::before,
.elementor-element-cqcontwrap::before{content:none!important}
.elementor-element-cqcontwrap > *{position:relative;z-index:1}

/* Sur fond sombre, filets clairs */
.cq-anneaux.cq-dark{--cq-anneau:rgba(255,255,255,.13)}

@media(max-width:767px){
  .cq-anneaux::after,
  .elementor-element-cqcont::after{width:1000px;height:1000px;top:34px;
    background:
      radial-gradient(circle at 50% 50%, transparent 0 199.5px, var(--cq-anneau) 199.5px 200.5px, transparent 200.5px),
      radial-gradient(circle at 50% 50%, transparent 0 299.5px, var(--cq-anneau) 299.5px 300.5px, transparent 300.5px),
      radial-gradient(circle at 50% 50%, transparent 0 399.5px, var(--cq-anneau) 399.5px 400.5px, transparent 400.5px),
      radial-gradient(circle at 50% 50%, transparent 0 499.5px, var(--cq-anneau) 499.5px 500.5px, transparent 500.5px)!important;
  }
}