/* Styles custom du projet Clue - chargés après le style parent Divi. */
.mon-menu-sticky {
    position: sticky;
    top: 0;
    background-color: transparent;
    box-shadow: none;
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
    z-index: 999;
}

/* La classe ajoutée par le JavaScript */
.mon-menu-sticky.is-sticky {
    background-color: #ffffff00;
    box-shadow: 0 4px 20px #1c1c1cbd;
}

/* Curseur personnalisé en forme de loupe SVG (Uniquement sur Ordinateur / Desktop avec souris) */
@media (min-width: 981px) and (pointer: fine) {

    html,
    body {
        cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%20fill%3D%22rgba%28255%2C255%2C255%2C0.15%29%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%224%22/%3E%3Cline%20x1%3D%2217%22%20y1%3D%2217%22%20x2%3D%2228%22%20y2%3D%2228%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22/%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%20fill%3D%22rgba%28255%2C255%2C255%2C0.15%29%22%20stroke%3D%22%230f172a%22%20stroke-width%3D%222%22/%3E%3Cline%20x1%3D%2217%22%20y1%3D%2217%22%20x2%3D%2228%22%20y2%3D%2228%22%20stroke%3D%22%230f172a%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M%207%209%20A%205%205%200%200%201%2013%207%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.8%22/%3E%3C/svg%3E") 11 11, url('../images/loupe-curseur.svg') 11 11, auto;
    }

    a,
    button,
    input[type="submit"],
    input[type="button"],
    .et_pb_button {
        cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%20fill%3D%22rgba%28255%2C255%2C255%2C0.15%29%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%224%22/%3E%3Cline%20x1%3D%2217%22%20y1%3D%2217%22%20x2%3D%2228%22%20y2%3D%2228%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22/%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%20fill%3D%22rgba%28255%2C255%2C255%2C0.15%29%22%20stroke%3D%22%230f172a%22%20stroke-width%3D%222%22/%3E%3Cline%20x1%3D%2217%22%20y1%3D%2217%22%20x2%3D%2228%22%20y2%3D%2228%22%20stroke%3D%22%230f172a%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M%207%209%20A%205%205%200%200%201%2013%207%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.8%22/%3E%3C/svg%3E") 11 11, url('../images/loupe-curseur.svg') 11 11, pointer;
    }
}


/* Correction de l'affichage sur mobile (breakpoint <= 767px ou 980px selon Divi) */
@media (max-width: 767px) {

    /* 1. Sur la section Hero (remplacez le sélecteur par la classe de votre section) */
    .votre-section-hero {
        box-sizing: border-box;
        height: auto !important;       /* Permet à la section de s'agrandir selon le texte */
        min-height: 100vh;             /* Ou une hauteur min si vous voulez couvrir l'écran */
        padding-top: 40px !important;  /* Réduit le padding supérieur sur mobile */
        padding-bottom: 40px !important;
        display: flow-root;            /* BLOQUE la bande blanche (annule le margin collapse) */
    }

    /* 2. Réinitialiser la marge haute du premier élément texte/logo */
    .votre-section-hero > *:first-child,
    .votre-section-hero .et_pb_module:first-child {
        margin-top: 0 !important;
    }
}
