/* ============================================================
   Sticky Section — alternative fluide au sticky d'Elementor
   ------------------------------------------------------------
   Usage : sur la section Elementor, Avancé > Classes CSS,
   ajouter `coteaux-sticky-top`.

   Variables disponibles (réglables via data-attr ou inline) :
     --coteaux-sticky-top : offset depuis le haut (default 0)

   Attributs HTML pris en charge par le JS :
     data-sticky-offset="80"  -> offset additionnel en px
   ============================================================ */

/* Double-classe + !important sur `position` : nécessaire car les sélecteurs
   d'Elementor (`.e-con`, `.elementor-element`) posent `position: relative`
   à spécificité équivalente et chargent leur feuille après la nôtre.
   Pas de z-index ici : on laisse celui défini dans Elementor (Avancé > Z-Index). */
.coteaux-sticky-top.coteaux-sticky-top {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: var(--coteaux-sticky-top, 0px);
    /* Indique au compositeur d'isoler la couche : pas de repaint au scroll. */
    will-change: transform;
}

/* Si Elementor a malgré tout laissé son sticky actif sur la même section,
   on neutralise pour éviter le double-positionnement (cause du saut). */
.coteaux-sticky-top.elementor-sticky--active,
.coteaux-sticky-top.elementor-sticky--effects {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: var(--coteaux-sticky-top, 0px) !important;
    transform: none !important;
    width: auto !important;
}

/* Le placeholder qu'Elementor injecte au-dessus d'une section sticky :
   on le neutralise (le JS le retire aussi mais ceinture + bretelles). */
.coteaux-sticky-top + .elementor-sticky__spacer,
.coteaux-sticky-top__spacer {
    display: none !important;
}
