/* ============================================================
   TITRE HERO : VERSION STABLE & VISIBLE
   ============================================================ */

/* 1. ON FORCE LE PARENT EN FLEX POUR MAITRISER L'ÉCART */
#hero-title .elementor-heading-title {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    line-height: 1.1 !important; /* Hauteur de ligne naturelle */
    margin: 0 !important;
    padding: 0 !important;
}

/* 2. STYLE DES LIGNES */
#hero-title span {
    display: block !important;
    width: auto !important;
    /* On ne met PAS d'opacité 0 ici pour garantir la visibilité */
}

/* 3. L'ANIMATION (Légère et robuste) */
#hero-title span:nth-of-type(1) {
    animation: kainaFadeLeft 0.8s ease-out both;
}

#hero-title .mon-style-accent {
    color: #F2C300 !important;
    font-size: 3.2rem !important;
    
    /* --- RÉGLAGE DE L'ÉCART (Le fameux GAP) --- */
    /* Modifie cette valeur : -20px pour coller, 10px pour écarter */
    margin-top: -10px !important; 
    
    animation: kainaFadeRight 0.8s ease-out 0.2s both;
}

/* 4. DÉFINITION DES MOUVEMENTS (SANS BLOCAGE D'OPACITÉ) */
@keyframes kainaFadeLeft {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes kainaFadeRight {
    from { opacity: 0; transform: translateX(50px); }
    to { opacity: 1; transform: translateX(0); }
}

/* 5. RESPONSIVE */
@media (max-width: 1024px) {
    #hero-title .mon-style-accent { 
        font-size: 2.4rem !important; 
        margin-top: -10px !important; 
    }
}

@media (max-width: 767px) {
    #hero-title .mon-style-accent { 
        font-size: 1.5rem !important; 
        margin-top: -5px !important; 
    }
     /* On réduit la hauteur de ligne de chaque bloc de texte */
    #hero-title .elementor-heading-title span {
        line-height: 0.9 !important; /* Valeur serrée pour mobile. Teste 1.0 si besoin. */
    }

    #hero-title .mon-style-accent { 
        font-size: 1.5rem !important; /* Ta taille de police mobile */
        
        /* RÉGLAGE DE L'ÉCART : 
           Si après avoir réduit le line-height c'est encore trop grand, 
           augmente la valeur négative ici (ex: -8px ou -10px) */
        margin-top: 5px !important; 
    }
}