/* ============================================
   MAIN.CSS - VERSION FINALE
   Site : CHEIKH Mohamed Hamin Haidra
   ============================================ */

/* ---------- 1. BASE ---------- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Montserrat', 'Inter', sans-serif;
    font-weight: 400;
    color: #2C2C2C;
    background-color: #FFFCF5;
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', 'Inter', sans-serif;
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 15px;
}

a {
    color: #FDD017;
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    color: #0A0A0A;
}

img {
    max-width: 100%;
    
}

/* ---------- 2. CONTAINERS ---------- */
.container-reg { 
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* ---------- 3. BOUTONS ---------- */
.btn {
    display: inline-block;
    padding: 12px 32px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    text-align: center;
}

.btn--primary {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    border-color: #FDD017;
    box-shadow: 0 4px 20px rgba(253, 208, 23, 0.35);
}

.btn--primary:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 35px rgba(253, 208, 23, 0.5);
    background: linear-gradient(135deg, #FFE033, #FDD017);
}

.btn--outline {
    background: transparent;
    border: 2px solid #FFFFFF;
    color: #FFFFFF;
}

.btn--outline:hover {
    background: #FFFFFF;
    color: #0A0A0A;
}







/* ---------- 4. HEADER ---------- */
.site-header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 9001;
    background: rgba(10, 10, 10, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(253, 208, 23, 0.12);
    box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}

/* Ligne lumineuse */
.site-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #FDD017, #2E8B57, #FDD017, transparent);
    background-size: 300% 100%;
    animation: headerGlow 4s ease-in-out infinite;
}

@keyframes headerGlow {
    0%, 100% { background-position: -300% 0; }
    50% { background-position: 300% 0; }
}

.site-header__main {
    display: flex;
    align-items: center;
    padding: 0 40px;
    min-height: 80px;
    gap: 40px;
}



/* ===== LOGO ===== */
.site-header__logo-link {
    display: block;
    width: 180px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: drop-shadow(0 0 15px rgba(253, 208, 23, 0.15));
    flex-shrink: 0;
    /* 👇 AJOUTE CES LIGNES POUR DESCENDRE LE LOGO */
    position: relative;
    top: 1px;  /* Ajuste cette valeur (5px, 8px, 10px...) pour descendre plus ou moins */
    transform: translateY(0);
}

.site-header__logo-link:hover {
    transform: scale(1.05) rotate(-2deg);
    filter: drop-shadow(0 0 30px rgba(253, 208, 23, 0.4));
}

.site-header__logo {
    width: 100%;
    height: auto;
    display: block;
}








/* ===== MENU ===== */
.site-header__links-container {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 1;
}

.site-header__links-container a {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 8px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

/* Soulignement animé */
.site-header__links-container a::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 50%;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transform: translateX(-50%);
    border-radius: 50px;
}

.site-header__links-container a:hover::after {
    width: 60%;
}

.site-header__links-container a:hover {
    color: #FDD017;
    transform: translateY(-2px);
}

.site-header__links-container a.active {
    color: #FDD017;
}
.site-header__links-container a.active::after {
    width: 60%;
}

/* ===== BOUTON CONTACT US SPÉCIAL ===== */
.site-header__links-container a.contact-btn {
    margin-left: auto;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A !important;
    padding: 14px 36px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.35);
    border: 2px solid transparent;
    overflow: hidden;
    /* On supprime les marges et padding par défaut */
    margin-top: 0;
    margin-bottom: 0;
}

.site-header__links-container a.contact-btn::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.35) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.5s ease;
    transform: scale(0.5);
}

.site-header__links-container a.contact-btn:hover::before {
    opacity: 1;
    transform: scale(1);
}

.site-header__links-container a.contact-btn::after {
    display: none;
}

.site-header__links-container a.contact-btn:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.5);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .site-header__main {
        padding: 0 20px;
        gap: 20px;
    }
    
    .site-header__links-container {
        gap: 8px;
    }
    
    .site-header__links-container a {
        font-size: 14px;
        padding: 6px 12px;
    }
    
    .site-header__links-container a.contact-btn {
        padding: 10px 24px;
        font-size: 14px;
    }
}

@media (max-width: 992px) {
    .site-header__main {
        display: none !important;
    }
    
    .mobile-header {
        display: flex !important;
    }
}

@media (max-width: 768px) {
    .site-header__links-container a {
        font-size: 13px;
        padding: 6px 10px;
    }
    
    .site-header__links-container a.contact-btn {
        padding: 8px 18px;
        font-size: 12px;
    }
}





/* ---------- 5. MENU MOBILE ---------- */
.mobile-header {
    display: none;
    background: #0A0A0A;
    color: #FDD017;
    padding: 15px 20px;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 1px solid rgba(253, 208, 23, 0.1);
}

.mobile-header .logo {
    font-weight: 800;
    font-size: 22px !important;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    /* ✅ text-shadow ne fonctionne pas sur un texte transparent, on utilise filter à la place */
    filter: drop-shadow(0 0 15px rgba(253, 208, 23, 0.20));
}

.mobile-header .hamburger {
    display: block !important;
    font-size: 28px;
    color: #FDD017;
    cursor: pointer;
    padding: 5px 15px;
    border-radius: 50%;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: none;
    border: none;
}

.mobile-header .hamburger:hover {
    background: rgba(253, 208, 23, 0.1);
    transform: rotate(90deg);
}

.mobile-nav {
    display: none;
    background: #0A0A0A;
    flex-direction: column;
    padding: 10px 0;
    border-bottom: 2px solid rgba(253, 208, 23, 0.15);
}

.mobile-nav.active {
    display: flex;
}

.mobile-nav a {
    color: #FDD017;
    padding: 14px 25px;
    border-bottom: 1px solid rgba(253, 208, 23, 0.08);
    text-align: center;
    font-weight: 500;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.mobile-nav a:last-child {
    border-bottom: none;
}

.mobile-nav a:hover {
    background: rgba(253, 208, 23, 0.1);
    color: #FFFFFF;
    padding-left: 35px;
}

.mobile-nav a.active {
    color: #0A0A0A;
    background-color: #FDD017;
    border-radius: 5px;
}

/* ---------- 6. RESPONSIVE ---------- */
@media (max-width: 992px) {
    .site-header__main {
        display: none !important;
    }
    
    .mobile-header {
        display: flex !important;
    }
}

@media (max-width: 768px) {
    .site-header__links-container a {
        padding: 6px 10px;
    }
    
    .site-header__links-container a.contact-btn {
        padding: 8px 18px;
        font-size: 12px;
    }
}

/* ---------- 7. UTILITAIRES ---------- */
.text-center { text-align: center; }
.text-gold { color: #FDD017; }
.text-green { color: #2E8B57; }
.bg-black { background-color: #0A0A0A; }

/* ---------- 8. CONTACT INFO ---------- */
.contact-info {
    float: right;
    width: 380px;
    margin-left: 30px;
    margin-top: -590px;
}

.contact-info h3 {
    color: #2E8B57;
    font-size: 18px;
    font-weight: 600;
    margin: 25px 0 8px 0;
}

.contact-info h3::after {
    content: '';
    display: block;
    width: 30px;
    height: 2px;
    background: #2E8B57;
    margin-top: 6px;
    opacity: 0.4;
}

.contact-info p {
    margin: 5px 0;
    color: #2C2C2C;
    font-size: 15px;
}

.contact-info a {
    color: #2E8B57;
    border-bottom: 1px dotted #2E8B57;
    padding-bottom: 2px;
}

.contact-info a:hover {
    color: #0A0A0A;
    border-bottom: 1px solid #0A0A0A;
}

@media (max-width: 768px) {
    .contact-info {
        float: none !important;
        width: 100% !important;
        margin: 20px 0 !important;
        text-align: center !important;
    }
}




/* ============================================
   LANGUAGE SELECTOR - HEADER
   ============================================ */

.language-selector {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: 15px;
}

.lang-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 11px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.lang-btn:hover {
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.08);
}

.lang-btn.active {
    color: #FDD017;
    background: rgba(253, 208, 23, 0.12);
    border-color: rgba(253, 208, 23, 0.2);
}

.lang-btn span {
    font-size: 14px;
}

/* ============================================
   LANGUAGE DROPDOWN - MOBILE
   ============================================ */

.mobile-language-dropdown {
    padding: 10px 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin-top: 10px;
}

.mobile-lang-dropdown-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 16px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.mobile-lang-dropdown-btn:hover {
    background: rgba(255, 255, 255, 0.08);
}

.mobile-lang-arrow {
    margin-left: auto;
    transition: transform 0.3s ease;
    font-size: 10px;
}

.mobile-lang-dropdown-btn.open .mobile-lang-arrow {
    transform: rotate(180deg);
}

.mobile-lang-dropdown-content {
    display: none;
    margin-top: 8px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.mobile-lang-dropdown-content.open {
    display: block;
}

.mobile-lang-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s ease;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.mobile-lang-option:last-child {
    border-bottom: none;
}

.mobile-lang-option:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #FFFFFF;
}

.mobile-lang-option.active {
    color: #FDD017;
    background: rgba(253, 208, 23, 0.05);
}

.mobile-lang-option span:first-child {
    font-size: 18px;
}








/* ======================================================================================== ============================================ 
   HERO - SECTION 1 HOME
   ============================================ ============================================ ============================================ */

.hero--home {
    top: -10px;
    position: relative;
    padding: 0 0 80px;
    background-image: url('mes-images/accueil/mosque-principale.png');
    background-size: 100% 74%;
    background-position: top center;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 750px;
    display: flex;
    align-items: flex-end;
    border-radius: 0 0 30px 30px; /* ✅ Bords arrondis en bas */
}

/* Overlay avec coins arrondis */
.hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.15) 0%,
        rgba(0, 0, 0, 0.25) 40%,
        rgba(0, 0, 0, 0.40) 70%,
        rgba(0, 0, 0, 0.50) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px; /* ✅ Même arrondi que l'image */
}

.hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}


/* ===== CONTENU ===== */
.hero__content {
    max-width: 550px;
    background: rgba(0, 0, 0, 0.30);
    padding: 40px 45px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 16px;
    position: relative;
    top: -135px;
    margin-top: 0;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.25);
}

/* ===== TITRE ===== */
.hero__title {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 15px;
    line-height: 1.1;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #E8E8E8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== SOUS-TITRE ===== */
.hero__subtitle {
    color: #FFFFFF;
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.25rem);
    text-shadow: 0 0 20px rgba(253, 208, 23, 0.15), 0 2px 15px rgba(0, 0, 0, 0.6);
    margin-bottom: 25px;
    line-height: 1.7;
    font-weight: 400;
    background: linear-gradient(135deg, #FFFFFF, #F0EDE8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    opacity: 0.95;
}

/* ===== BOUTON ===== */
.hero__btn {
    display: inline-block;
    border-radius: 50px;
    padding: 14px 40px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.40);
    transition: all 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

.hero__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.60);
    background: linear-gradient(135deg, #FFE033, #FDD017);
}


/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .hero--home {
        min-height: 600px;
        background-size: 110% 80%;
        
        border-radius: 0 0 25px 25px;
    }
    .hero__overlay {
        border-radius: 0 0 25px 25px;
        
    }
    .hero__content {
        min-height: 300px !important;
        height: 300px !important;
        margin-bottom: 70px;
        top: -161px !important;
        padding: 2px 35px !important;
        
    }
}

@media (max-width: 992px) {
    .hero--home {
        min-height: 600px;
        padding: 0 0 60px;
        margin-bottom: 70px;
        background-size: 130% 74% !important;
        background-position: top 0% center !important;
        border-radius: 0 0 20px 20px;
    }

    .hero__overlay {
        border-radius: 0 0 20px 20px;
        
    }

    .hero__title {
        font-size: 2.2rem;
    }

    .hero__subtitle {
        font-size: 1rem;
    }

    .hero__content {
         
        padding: 25px 28px;
        max-width: 340px !important;
        top: -60px;
        
        border-radius: 14px;
    }

    .hero__btn {
        padding: 8px 13px !important;
        font-size: 13px;
        
    }
}

@media (max-width: 768px) {
    .hero--home {
        min-height: 500px;
        padding: 0 0 40px;
        margin-bottom: 70px;
        background-size: 160% 50%;
        background-position: top 25% center;
        border-radius: 16px 16px 16px 16px;
        
    }

    .hero__overlay {
        margin-top: 54px;
        border-radius: 0 0 16px 16px; 
    }
   

    .hero__title {
        font-size: 1.8rem;
    }

    .hero__subtitle {
        font-size: 0.9rem;
    }

    .hero__content {
        top: -50px !important;
        max-width: 100%;
        padding: 0px 20px;
        
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero__btn {
        padding: 10px 24px;
        font-size: 12px;
    }
}
/* ============================================
   OVERLAY - REDUCTION EN MOBILE
   ============================================ */

@media (max-width: 768px) {
    .hero__overlay {
        height: 63%; /* Réduit de 74% à 50% */
    }
}

@media (max-width: 480px) {
    .hero--home {
        min-height: 400px;
        padding: 0 0 30px;
        background-size: 200% 45%;
        background-position: top 30% center;
        border-radius: 0 0 12px 12px;
    }

    .hero__overlay {
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(10, 10, 10, 0.20) 0%,
            rgba(0, 0, 0, 0.35) 40%,
            rgba(0, 0, 0, 0.55) 70%,
            rgba(0, 0, 0, 0.70) 100%
            
        );
    }

  

    .hero__title {
        font-size: 1.5rem;
    }

    .hero__subtitle {
        font-size: 0.85rem;
    }

    .hero__content {
        padding: 18px 15px;
        top: -30px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.40);
        backdrop-filter: blur(2px);
    }

    .hero__btn {
        font-size: 11px;
        padding: 8px 18px;
        width: 100%;
        text-align: center;
    }
}




/* ============================================
   REDUIRE L'ESPACE ENTRE HERO ET BARAKA
   ============================================ 
/* Alternative avec transform */
.hero--home + .section--baraka {
    position: relative;
    top: -200px; /* ⬅️ AJUSTE CETTE VALEUR */
    margin-bottom: -60px;
}





/* ============================================
   BARAKA SECTION - AMÉLIORÉE
   ============================================ */

/* ===== SECTION PRINCIPALE ===== */
.section--baraka {
    margin-top: 8px;
    padding: 80px 0;
    background: linear-gradient(180deg, #ffefc9 0%, #fcf5e4 100%);
    position: relative; /* ✅ ESSENTIEL : permet aux cercles de se positionner */
    overflow: hidden;
    z-index: 1;
    border-radius: 30px 30px 30px 30px ;
}

/* Décoration de fond - cercle lumineux */
.section--baraka::before {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.20) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0; /* Derrière le contenu */
    pointer-events: none;
}

.section--baraka::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.20) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0; /* Derrière le contenu */
    pointer-events: none;
}

/* Contenu de la section qui doit être au-dessus des cercles */
.section--baraka .container-reg {
    position: relative;
    z-index: 1; /* Au-dessus des cercles */
}

/* ===== TITRE AVEC DÉCORATION ===== */
.section__title--baraka {
    font-size: clamp(2.8rem, 5vw + 1rem, 4.5rem);
    font-weight: 800;
    letter-spacing: 6px;
    text-align: center;
    color: #2E8B57;
    margin-bottom: 50px;
    position: relative;
    text-shadow: 0 4px 30px rgba(46, 139, 87, 0.10);
    z-index: 1;
}

/* Ligne décorative sous le titre */
.section__title--baraka::after {
    content: '';
    display: block;
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.3);
}

/* ===== GRILLE ===== */
.baraka__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

/* ===== IMAGE AVEC CONTAINER DÉCORATIF ===== */
.baraka__image {
    flex: 0 0 auto;
    max-width: 320px;
    position: relative;
}

/* Anneau décoratif autour de l'image */
.baraka__image::before {
    content: '';
    position: absolute;
    top: -12px;
    left: -12px;
    right: -12px;
    bottom: -12px;
    border: 2px solid rgba(253, 208, 23, 0.15);
    border-radius: 28px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.baraka__image::after {
    content: '';
    position: absolute;
    top: -24px;
    left: -24px;
    right: -24px;
    bottom: -24px;
    border: 1px solid rgba(46, 139, 87, 0.06);
    border-radius: 36px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.baraka__image:hover::before {
    border-color: rgba(253, 208, 23, 0.30);
    transform: scale(1.02);
}

.baraka__image:hover::after {
    border-color: rgba(46, 139, 87, 0.12);
    transform: scale(1.02);
}

.baraka__img {
    width: 100%;
    height: auto;
    max-width: 320px;
    display: block;
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    z-index: 1;
}

.baraka__img:hover {
    transform: scale(1.03);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.15);
}

/* ===== CARTES ===== */
.baraka__cards {
    flex: 1 1 400px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 40px;
    align-content: start;
}

.baraka__card {
    background: #FFFFFF;
    padding: 22px 22px;
    border-radius: 14px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-left: 4px solid #FDD017;
    cursor: default;
    min-height: 50px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}

/* Petit point décoratif en haut à droite des cartes */
.baraka__card::before {
    content: '✦';
    position: absolute;
    top: 6px;
    right: 12px;
    font-size: 10px;
    color: rgba(253, 208, 23, 0.15);
    transition: all 0.4s ease;
}

.baraka__card:hover::before {
    color: rgba(253, 208, 23, 0.60);
    transform: rotate(90deg) scale(1.2);
}

.baraka__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.10);
    border-left-color: #2E8B57;
}

.baraka__card-title {
    color: #2E8B57;
    font-size: clamp(1rem, 1.2vw + 0.3rem, 1.15rem);
    font-weight: 600;
    margin: 0;
    transition: color 0.3s ease;
}

.baraka__card:hover .baraka__card-title {
    color: #FDD017;
}

/* ============================================
   RESPONSIVE - MOBILE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--baraka {
        padding: 60px 0;
    }

    .section--baraka::before,
    .section--baraka::after {
        width: 300px;
        height: 300px;
    }

    .section__title--baraka {
        font-size: clamp(2.2rem, 4vw + 1rem, 3rem);
        margin-bottom: 35px;
        letter-spacing: 4px;
    }

    .section__title--baraka::after {
        width: 60px;
        height: 3px;
    }

    .baraka__grid {
        flex-direction: column;
        gap: 35px;
    }

    .baraka__image {
        max-width: 280px;
    }

    .baraka__image::before {
        top: -10px;
        left: -10px;
        right: -10px;
        bottom: -10px;
        border-radius: 24px;
    }

    .baraka__image::after {
        top: -20px;
        left: -20px;
        right: -20px;
        bottom: -20px;
        border-radius: 32px;
    }

    .baraka__img {
        max-width: 280px;
    }

    .baraka__cards {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
        flex: 1 1 100%;
        width: 100%;
    }

    .baraka__card {
        padding: 18px 20px;
    }

    .baraka__card-title {
        font-size: clamp(0.95rem, 1.5vw + 0.3rem, 1.05rem);
    }

    .baraka__card::before {
        font-size: 8px;
        top: 5px;
        right: 10px;
    }
}

/* ----- MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--baraka {
        padding: 40px 0;
    }

    .section--baraka::before {
        top: -161px;
        right: -100px;
        width: 200px;
        height: 200px;
    }

    .section--baraka::after {
        bottom: -80px;
        left: -80px;
        width: 180px;
        height: 180px;
    }

    .section__title--baraka {
        font-size: clamp(1.8rem, 5vw + 0.5rem, 2.2rem);
        letter-spacing: 2px;
        margin-bottom: 25px;
    }

    .section__title--baraka::after {
        width: 50px;
        height: 3px;
        margin-top: 10px;
    }

    .baraka__grid {
        gap: 25px;
    }

    .baraka__image {
        max-width: 200px;
    }

    .baraka__image::before {
        top: -8px;
        left: -8px;
        right: -8px;
        bottom: -8px;
        border-radius: 20px;
        border-width: 1.5px;
    }

    .baraka__image::after {
        display: none;
    }

    .baraka__img {
        max-width: 200px;
        border-radius: 16px;
    }

    .baraka__cards {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .baraka__card {
        padding: 15px 18px;
        border-radius: 12px;
        border-left-width: 3px;
        min-height: 44px;
    }

    .baraka__card-title {
        font-size: clamp(0.9rem, 2vw + 0.3rem, 1rem);
    }

    .baraka__card:hover {
        transform: translateY(-4px);
    }

    .baraka__card::before {
        font-size: 7px;
        top: 4px;
        right: 8px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--baraka {
        padding: 30px 0;
    }

    .section__title--baraka {
        font-size: 1.6rem;
        letter-spacing: 1px;
    }

    .baraka__image {
        max-width: 160px;
    }

    .baraka__image::before {
        top: -6px;
        left: -6px;
        right: -6px;
        bottom: -6px;
        border-radius: 16px;
    }

    .baraka__img {
        max-width: 160px;
    }

    .baraka__card {
        padding: 12px 15px;
        min-height: 38px;
    }

    .baraka__card-title {
        font-size: 0.85rem;
    }

    .baraka__card::before {
        display: none;
    }
}




/* ============================================
   REDUIRE L'ESPACE ENTRE BARAKA ET SLIDES
   ============================================ 
/* Alternative avec transform */
.section--baraka + .section--slides {
    position: relative;
    top: -140px; /* ⬅️ AJUSTE CETTE VALEUR */
    margin-top: -60px;
}





/* ============================================
   SLIDE CARDS SECTION - MODERNISÉ
   ============================================ */

.section--slides {
    padding: 80px 0;
    background: linear-gradient(180deg, #fcf5e4 0%, #ffefc9 100%);
    position: relative;
    overflow: hidden;
    border-radius: 30px 30px 30px 30px;
}

/* Décoration de fond */
.section--slides::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--slides::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--slides .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.slides__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* ===== SLIDE CARD ===== */
/* ============================================
   ORNEMENTS COMPLETS POUR SLIDE CARDS
   ============================================ */

.slideCard {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: #FFFFFF;
    cursor: pointer;
    aspect-ratio: 2/3;
    border-radius: 30px 30px 30px 30px;
}

/* 1. Ligne dorée en haut */
.slideCard::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #fae389, #4d8b68, #fae389, transparent);
    background-size: 200% 100%;
    animation: goldLine 4s ease-in-out infinite;
    z-index: 4;
    pointer-events: none;
}

/* 2. Ornement en haut à droite */
.slideCard::after {
    content: '✦';
    position: absolute;
    top: 18px;
    right: 20px;
    font-size: 24px;
    color: rgba(253, 208, 23, 0.08);
    z-index: 4;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
}

.slideCard:hover::after {
    color: rgba(253, 208, 23, 0.25);
    transform: rotate(180deg) scale(1.2);
}

/* 3. Petit motif en haut à gauche */
.slideCard .slideCard-image::before {
    content: '◇';
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 16px;
    color: rgba(46, 139, 87, 0.06);
    z-index: 4;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
}

.slideCard:hover .slideCard-image::before {
    color: rgba(46, 139, 87, 0.20);
    transform: rotate(90deg) scale(1.3);
    transition: transform 20s cubic-bezier(0.2, 0.5, 0.3, 0.9);
    /*           👆 4.5s = ultra lent */
    /*           👆 cubic-bezier plus doux et naturel */
}

/* Animation de la ligne dorée */
@keyframes goldLine {
    0%, 100% { background-position: -200% 0; }
    50% { background-position: 200% 0; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .slideCard::after {
        font-size: 18px;
        top: 14px;
        right: 16px;
    }

    .slideCard .slideCard-image::before {
        font-size: 12px;
        top: 16px;
        left: 16px;
    }

    .slideCard::before {
        height: 2.5px;
    }
}

@media (max-width: 576px) {
    .slideCard::after {
        font-size: 16px;
        top: 12px;
        right: 14px;
    }

    .slideCard .slideCard-image::before {
        font-size: 10px;
        top: 14px;
        left: 14px;
    }

    .slideCard::before {
        height: 2px;
    }
}

@media (max-width: 380px) {
    .slideCard::after {
        font-size: 12px;
        top: 10px;
        right: 10px;
    }

    .slideCard .slideCard-image::before {
        display: none;
    }
}

.slideCard:hover {
    transform: translateY(-10px) scale(1.01);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

/* ===== IMAGE ===== */
.slideCard-image {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.slideCard-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slideCard:hover .slideCard-image img {
    transform: scale(1.10);
}


/* ============================================
   H3 SUR L'IMAGE (TITRE SUR L'IMAGE)
   ============================================ */

.slideCard-image h3 {
    position: absolute;
    bottom: 25px;
    left: 22px;
    right: 22px;
    color: #FFFFFF;
    font-size: clamp(1rem, 1.3vw + 0.3rem, 1.25rem);
    font-weight: 700;
    text-shadow: 0 2px 25px rgba(0, 0, 0, 0.7), 0 4px 10px rgba(0, 0, 0, 0.3);
    margin: 0;
    line-height: 1.3;
    z-index: 2;
    letter-spacing: 0.3px;
    transition: all 0.3s ease;
}

/* Petit effet au survol sur le titre de l'image */
.slideCard:hover .slideCard-image h3 {
    transform: translateY(-5px);
    text-shadow: 0 4px 35px rgba(0, 0, 0, 0.9), 0 0 20px rgba(253, 208, 23, 0.10);
}

/* ============================================
   H3 DANS LE CONTENU (au survol)
   ============================================ */

.slideCard-content h3 {
    color: #FDD017;
    font-size: clamp(1.1rem, 1.3vw + 0.4rem, 1.3rem);
    font-weight: 700;
    margin: 0 0 10px 0;
    line-height: 1.3;
    letter-spacing: 0.5px;
    text-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
    position: relative;
    padding-bottom: 12px;
}

/* Ligne décorative sous le h3 du contenu */
.slideCard-content h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2.5px;
    background: linear-gradient(90deg, #FDD017, rgba(253, 208, 23, 0.20));
    border-radius: 50px;
    transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slideCard:hover .slideCard-content h3::after {
    width: 60px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .slideCard-image h3 {
        font-size: clamp(0.9rem, 1.2vw + 0.3rem, 1.05rem);
        bottom: 20px;
        left: 18px;
        right: 18px;
    }

    .slideCard-content h3 {
        font-size: clamp(1rem, 1.2vw + 0.3rem, 1.15rem);
        padding-bottom: 10px;
    }

    .slideCard-content h3::after {
        width: 35px;
        height: 2px;
    }

    .slideCard:hover .slideCard-content h3::after {
        width: 50px;
    }
}

@media (max-width: 768px) {
    .slideCard-image h3 {
        font-size: clamp(0.8rem, 1.5vw + 0.2rem, 0.95rem);
        bottom: 16px;
        left: 15px;
        right: 15px;
    }

    .slideCard-content h3 {
        font-size: clamp(0.9rem, 1.5vw + 0.2rem, 1rem);
        padding-bottom: 8px;
    }

    .slideCard-content h3::after {
        width: 30px;
        height: 2px;
    }

    .slideCard:hover .slideCard-content h3::after {
        width: 40px;
    }

    .slideCard:hover .slideCard-image h3 {
        transform: translateY(-3px);
    }
}

@media (max-width: 576px) {
    .slideCard-image h3 {
        font-size: clamp(0.85rem, 2vw + 0.2rem, 0.95rem);
        bottom: 15px;
        left: 15px;
        right: 15px;
    }

    .slideCard-content h3 {
        font-size: clamp(0.9rem, 2vw + 0.2rem, 1rem);
        padding-bottom: 8px;
    }

    .slideCard-content h3::after {
        width: 30px;
        height: 2px;
    }

    .slideCard:hover .slideCard-content h3::after {
        width: 40px;
    }
}

@media (max-width: 380px) {
    .slideCard-image h3 {
        font-size: clamp(0.7rem, 1.8vw + 0.2rem, 0.8rem);
        bottom: 12px;
        left: 12px;
        right: 12px;
        letter-spacing: 0;
    }

    .slideCard-content h3 {
        font-size: clamp(0.8rem, 1.8vw + 0.2rem, 0.9rem);
        padding-bottom: 6px;
    }

    .slideCard-content h3::after {
        width: 25px;
        height: 1.5px;
    }

    .slideCard:hover .slideCard-content h3::after {
        width: 35px;
    }
}



/* Gradient overlay */
.slideCard-image::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 65%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.70) 0%, transparent 100%);
    z-index: 1;
}

/* ===== CONTENU AU SURVOL - COUVRE TOUTE LA PHOTO ===== */

/* Desktop */
.slideCard-content {
    position: absolute;
    top: 0; /* ⬅️ AJOUTE : colle en haut */
    left: 0;
    right: 0;
    bottom: 0; /* ⬅️ AJOUTE : colle en bas */
    background: linear-gradient(to top, #0A0A0A 0%, rgba(10, 10, 10, 0.90) 50%, rgba(10, 10, 10, 0.85) 100%);
    padding: 40px 28px 25px;
    transform: translateY(100%);
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 3;
    border-top: 2px solid rgba(253, 208, 23, 0.10);
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* Contenu en bas */
}

.slideCard:hover .slideCard-content {
    transform: translateY(0);
}

.slideCard-content h3 {
    color: #FDD017;
    font-size: clamp(0.95rem, 1.1vw + 0.3rem, 1.15rem);
    font-weight: 700;
    margin: 0 0 8px 0;
    line-height: 1.3;
}

.slideCard-content span {
    color: rgba(255, 255, 255, 0.85);
    font-size: clamp(0.8rem, 0.9vw + 0.2rem, 0.9rem);
    line-height: 1.6;
    display: block;
    margin: 0 0 15px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.slideCard-link {
    color: #FDD017;
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    padding: 0 !important;
    background: transparent !important;
    text-decoration: none !important;
}

.slideCard-link::after {
    content: '→';
    transition: transform 0.3s ease;
}

.slideCard-link:hover::after {
    transform: translateX(6px);
}

.slideCard-link:hover {
    border-bottom-color: #FDD017;
    color: #FFE033 !important;
}

/* ===== LINE-HIDE ===== */
.line-hide {
    display: none;
}



/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--slides {
        padding: 60px 0;
    }

    .slides__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .slideCard {
        aspect-ratio: 2/3; /* ✅ Reste vertical sur tablette */
    }

    .slideCard-content {
        padding: 28px 22px 20px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--slides {
        padding: 40px 0;
    }

    .section--slides::before,
    .section--slides::after {
        width: 300px;
        height: 300px;
    }

    .slides__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }

    .slideCard {
        border-radius: 14px;
        aspect-ratio: 2/3; /* ✅ Reste vertical sur mobile */
    }

    .slideCard-image h3 {
        font-size: 0.8rem;
        bottom: 15px;
        left: 15px;
        right: 15px;
    }

    .slideCard-content {
        padding: 20px 16px 16px;
    }

    .slideCard-content h3 {
        font-size: 0.85rem;
        margin-bottom: 5px;
    }

    .slideCard-content span {
        font-size: 0.75rem;
        -webkit-line-clamp: 2;
        margin-bottom: 10px;
    }

    .slideCard-link {
        font-size: 0.7rem;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--slides {
        padding: 30px 0;
    }

    .slides__grid {
        grid-template-columns: 1fr;
        gap: 20px;
        max-width: 380px;
        margin: 0 auto;
    }

    .slideCard {
        aspect-ratio: 2/3; /* ✅ Reste vertical sur petit mobile */
        border-radius: 12px;
    }

    .slideCard-image h3 {
        font-size: 0.85rem;
        bottom: 15px;
        left: 15px;
        right: 15px;
    }

    .slideCard-content {
        padding: 22px 18px 18px;
    }

    .slideCard-content h3 {
        font-size: 0.9rem;
    }

    .slideCard-content span {
        font-size: 0.8rem;
        -webkit-line-clamp: 2;
    }

    .slideCard-link {
        font-size: 0.75rem;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--slides {
        padding: 20px 0;
    }

    .slides__grid {
        gap: 15px;
        max-width: 100%;
    }

    .slideCard {
        aspect-ratio: 2/3;
        border-radius: 10px;
    }

    .slideCard-image h3 {
        font-size: 0.7rem;
        bottom: 10px;
        left: 12px;
        right: 12px;
    }

    .slideCard-content {
        padding: 16px 14px 14px;
    }

    .slideCard-content h3 {
        font-size: 0.8rem;
    }

    .slideCard-content span {
        font-size: 0.7rem;
        -webkit-line-clamp: 2;
        margin-bottom: 8px;
    }

    .slideCard-link {
        font-size: 0.65rem;
    }
}





/* ============================================
   INSIGHTS SECTION
   ============================================ */

.section--insights {
    padding: 80px 0;
    top: -200px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SLIDES */
    background: linear-gradient(180deg, #FFFCF5 0%, #F8F6F0 100%);
    position: relative;
    overflow: hidden;
}

/* Décoration de fond */
.section--insights::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--insights .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE H2 ===== */
.section__title--insights {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #2E8B57;
    text-align: center;
    margin-bottom: 40px;
    position: relative;
    letter-spacing: 2px;
}

/* Ligne décorative sous le H2 */
.section__title--insights::after {
    content: '';
    display: block;
    width: 150px !important;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 0;
    border-radius: 50px;
}

/* ===== CARD INSIGHTS ===== */
.insights__card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: #FFFFFF;
    border-radius: 40px;
    overflow: hidden;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.insights__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.10);
    transform: translateY(-5px);
}

/* ===== CONTENU GAUCHE ===== */
.insights__content {
    flex: 1 1 45%;
    padding: 40px 45px;
}

.insights__title {
    font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.2rem);
    font-weight: 700;
    color: #2E8B57;
    line-height: 1.2;
    margin: 0;
    letter-spacing: -0.5px;
    position: relative;
    padding-left: 20px;
    border-left: 4px solid #FDD017;
    transition: border-color 0.4s ease;
}

.insights__card:hover .insights__title {
    border-left-color: #2E8B57;
}

/* ===== IMAGE DROITE ===== */
.insights__image {
    flex: 1 1 45%;
    overflow: hidden;
    min-height: 280px;
}

.insights__img {
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: block;
}

.insights__card:hover .insights__img {
    transform: scale(1.04);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--insights {
        top: -150px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SLIDES */
        padding: 60px 0;
    }

    .section__title--insights {
        font-size: clamp(2rem, 3vw + 1rem, 2.6rem);
        margin-bottom: 30px;
    }

    .insights__content {
        padding: 30px 35px;
    }

    .insights__title {
        font-size: clamp(1.3rem, 2vw + 0.5rem, 1.8rem);
        padding-left: 15px;
    }

    .insights__image {
        min-height: 220px;
    }

    .insights__img {
        min-height: 220px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--insights {
        top: -120px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SLIDES */
        padding: 40px 0;
    }

    .section__title--insights {
        font-size: clamp(1.8rem, 4vw + 0.5rem, 2.2rem);
        margin-bottom: 25px;
    }

    .section__title--insights::after {
        width: 50px;
        height: 2.5px;
    }

    .insights__card {
        flex-direction: column;
        border-radius: 16px;
    }

    .insights__content {
        padding: 25px 28px;
        width: 100%;
        order: 2;
    }

    .insights__title {
        font-size: clamp(1.2rem, 2.5vw + 0.5rem, 1.5rem);
        padding-left: 12px;
        border-left-width: 3px;
    }

    .insights__image {
        width: 100%;
        min-height: 200px;
        order: 1;
    }

    .insights__img {
        min-height: 200px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--insights {
        top: -100px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SLIDES */
        padding: 30px 0;
    }

    .section__title--insights {
        font-size: clamp(1.5rem, 4vw + 0.3rem, 1.8rem);
        margin-bottom: 20px;
    }

    .section__title--insights::after {
        width: 40px;
        height: 2px;
        margin-top: 8px;
    }

    .insights__card {
        border-radius: 14px;
    }

    .insights__content {
        padding: 20px 20px;
    }

    .insights__title {
        font-size: clamp(1rem, 2vw + 0.3rem, 1.2rem);
        padding-left: 10px;
        border-left-width: 3px;
    }

    .insights__image {
        min-height: 160px;
    }

    .insights__img {
        min-height: 160px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--insights {
        padding: 20px 0;
        top: -100px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SLIDES */
    }

    .section__title--insights {
        font-size: 1.3rem;
        margin-bottom: 15px;
    }

    .section__title--insights::after {
        width: 35px;
        height: 2px;
    }

    .insights__content {
        padding: 16px 16px;
    }

    .insights__title {
        font-size: 0.95rem;
        padding-left: 8px;
        border-left-width: 2px;
    }

    .insights__image {
        min-height: 130px;
    }

    .insights__img {
        min-height: 130px;
    }
}



/* ============================================
   FIGURES SECTION
   ============================================ */

.section--figures {
    padding: 80px 0;
    top: -190px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC INSIGHTS */
    background: linear-gradient(180deg, #fcf5e4 0%, #fcf5e4 100%);
    position: relative;
    overflow: hidden;
}

/* Décoration de fond */
.section--figures::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--figures::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--figures .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE H2 ===== */
.section__title--figures {
    font-size: clamp(2rem, 3.5vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    text-align: center;
    margin-bottom: 50px;
    position: relative;
    letter-spacing: 2px;
}

.section__title--figures::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 0;
    border-radius: 50px;
}

/* ===== GRILLE ===== */
.figures__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

/* ===== ITEM ===== */
.figures__item {
    text-align: center;
    background: #FFFFFF;
    padding: 35px 20px 30px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-bottom: 3px solid transparent;
    border-bottom-color: #FDD017;
}

.figures__item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.08);
    border-bottom-color: #2E8B57;
}

/* ===== NOMBRE ===== */
.figures__number {
    font-size: clamp(2.8rem, 4vw + 1rem, 4.5rem);
    font-weight: 800;
    color: #2E8B57;
    line-height: 1;
    margin-bottom: 12px;
    display: block;
    transition: color 0.4s ease;
}

.figures__item:hover .figures__number {
    color: #FDD017;
}

/* ===== LABEL ===== */
.figures__label {
    font-size: clamp(0.85rem, 1vw + 0.2rem, 1rem);
    color: #555;
    font-weight: 500;
    line-height: 1.4;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--figures {
        top: -150px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC INSIGHTS */
        padding: 60px 0;
    }

    .section__title--figures {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.5rem);
        margin-bottom: 35px;
    }

    .figures__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .figures__number {
        font-size: clamp(2.5rem, 3.5vw + 1rem, 3.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--figures {
        top: -120px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC INSIGHTS */
        padding: 40px 0;
    }

    .section__title--figures {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
        margin-bottom: 25px;
    }

    .section__title--figures::after {
        width: 50px;
        height: 2.5px;
    }

    .figures__grid {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .figures__item {
        padding: 25px 15px 22px;
        border-radius: 14px;
    }

    .figures__number {
        font-size: clamp(2rem, 4vw + 0.5rem, 2.8rem);
    }

    .figures__label {
        font-size: clamp(0.8rem, 1.2vw + 0.2rem, 0.9rem);
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--figures {
        top: -100px;
        padding: 30px 0;
    }

    .section__title--figures {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.6rem);
        margin-bottom: 20px;
    }

    .section__title--figures::after {
        width: 40px;
        height: 2px;
        margin-top: 8px;
    }

    .figures__grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }

    .figures__item {
        padding: 20px 12px 18px;
        border-radius: 12px;
        border-bottom-width: 2px;
    }

    .figures__number {
        font-size: clamp(1.6rem, 3.5vw + 0.3rem, 2.2rem);
        margin-bottom: 8px;
    }

    .figures__label {
        font-size: clamp(0.7rem, 1.2vw + 0.2rem, 0.8rem);
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--figures {
        top: -100px;
        padding: 20px 0;
    }

    .section__title--figures {
        font-size: 1.2rem;
        margin-bottom: 15px;
    }

    .section__title--figures::after {
        width: 35px;
        height: 2px;
    }

    .figures__grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .figures__item {
        padding: 15px 10px 14px;
        border-radius: 10px;
        border-bottom-width: 2px;
    }

    .figures__number {
        font-size: 1.4rem;
        margin-bottom: 5px;
    }

    .figures__label {
        font-size: 0.65rem;
    }
}

/* ============================================
   COMMITMENT SECTION
   ============================================ */

.section--commitment {
    top: -150px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC FIGURES */
    padding: 70px 0;
    background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 50%, #0A0A0A 100%);
    position: relative;
    overflow: hidden;
    text-align: center;
}

/* ===== DÉCORATION DE FOND ===== */
.section--commitment::before {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--commitment::after {
    content: '';
    position: absolute;
    bottom: -200px;
    left: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

/* ===== ORNEMENT DÉCORATIF ===== */
.section--commitment .container-reg::before {
    content: '✦';
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 32px;
    color: rgba(253, 208, 23, 0.08);
    z-index: 1;
    pointer-events: none;
}

.section--commitment .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== CONTENU ===== */
.commitment__content {
    max-width: 750px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* ===== TITRE ===== */
.commitment__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 800;
    letter-spacing: 3px;
    color: #FFFFFF;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
}

/* Ligne décorative sous le titre */
.commitment__title::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
}

/* ===== TEXTE ===== */
.commitment__text {
    color: rgba(255, 255, 255, 0.80);
    font-size: clamp(1rem, 1.2vw + 0.3rem, 1.2rem);
    line-height: 1.8;
    margin-bottom: 35px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* ===== BOUTON ===== */
.commitment__btn {
    display: inline-block;
    border-radius: 50px;
    padding: 14px 40px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.30);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    text-decoration: none;
}

.commitment__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--commitment {
        margin-top: 30px;
        padding: 55px 0;
    }

    .commitment__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.6rem);
        letter-spacing: 2px;
    }

    .commitment__text {
        font-size: clamp(0.95rem, 1.2vw + 0.3rem, 1.1rem);
        padding: 0 15px;
    }

    .commitment__btn {
        padding: 12px 32px;
        font-size: 13px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--commitment {
        padding: 40px 0;
    }

    .section--commitment::before {
        width: 300px;
        height: 300px;
        top: -100px;
        right: -100px;
    }

    .section--commitment::after {
        width: 300px;
        height: 300px;
        bottom: -100px;
        left: -100px;
    }

    .commitment__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
        letter-spacing: 1.5px;
    }

    .commitment__title::after {
        width: 50px;
        height: 2.5px;
        margin-top: 12px;
    }

    .commitment__text {
        font-size: clamp(0.9rem, 1.5vw + 0.2rem, 1rem);
        padding: 0 10px;
        margin-bottom: 25px;
    }

    .commitment__btn {
        padding: 10px 28px;
        font-size: 12px;
        letter-spacing: 1px;
    }

    .section--commitment .container-reg::before {
        font-size: 24px;
        top: -5px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--commitment {
        padding: 30px 0;
    }

    .section--commitment .container-reg::before {
        font-size: 20px;
    }

    .commitment__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.6rem);
        letter-spacing: 1px;
    }

    .commitment__title::after {
        width: 40px;
        height: 2px;
        margin-top: 10px;
    }

    .commitment__text {
        font-size: clamp(0.85rem, 1.5vw + 0.2rem, 0.95rem);
        padding: 0 5px;
        margin-bottom: 20px;
        line-height: 1.6;
    }

    .commitment__btn {
        padding: 10px 24px;
        font-size: 11px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--commitment {
        padding: 25px 0;
    }

    .section--commitment .container-reg::before {
        font-size: 16px;
        top: -3px;
    }

    .commitment__title {
        font-size: 1.1rem;
        letter-spacing: 0.5px;
    }

    .commitment__title::after {
        width: 35px;
        height: 2px;
        margin-top: 8px;
    }

    .commitment__text {
        font-size: 0.8rem;
        margin-bottom: 15px;
    }

    .commitment__btn {
        padding: 8px 18px;
        font-size: 10px;
    }
}




/* ============================================
   FOOTER
   ============================================ */

.site-footer {
    background: linear-gradient(180deg, #0A0A0A 0%, #050505 100%);
    padding: 0;
    margin: 0;
    margin-top: -145px; /* ⬅️ REMPLACE top par margin-top */
    border-top: 1px solid rgba(253, 208, 23, 0.05);
    position: relative;
    overflow: hidden;
}

/* Ornement décoratif */
.site-footer::before {
    content: '';
    position: absolute;
    top: -100px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.02) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.site-footer::after {
    content: '';
    position: absolute;
    bottom: -100px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.02) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

/* ===== CONTAINER ===== */
.footer__inner {
    background: rgba(19, 19, 19, 0.80);
    padding: 50px 20px;
    width: 100%;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    position: relative;
    z-index: 1;
}

.footer__container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px;
}

/* ===== LOGO ===== */
.footer__logo {
    flex: 0 0 auto;
}

.footer__logo-link {
    display: block;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.footer__logo-link:hover {
    opacity: 0.80;
    transform: scale(1.02);
}

.footer__logo-img {
    max-height: 70px;
    width: auto;
    filter: brightness(1) drop-shadow(0 0 15px rgba(253, 208, 23, 0.05));
}

/* ===== ABOUT US ===== */
.footer__about {
    flex: 0 0 auto;
}

.footer__about-link {
    color: #FDD017;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    position: relative;
    padding: 5px 0;
}

.footer__about-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    transition: width 0.3s ease;
    border-radius: 50px;
}

.footer__about-link:hover::after {
    width: 100%;
}

.footer__about-link:hover {
    color: #FFFFFF;
}

/* ===== RÉSEAUX SOCIAUX ===== */
.footer__social {
    flex: 0 0 auto;
}

.footer__social-list {
    display: flex;
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer__social-link {
    color: #FDD017;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: rgba(253, 208, 23, 0.04);
    border: 1px solid rgba(253, 208, 23, 0.05);
}

.footer__social-link svg {
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease;
}

.footer__social-link:hover {
    color: #FFFFFF;
    background: rgba(253, 208, 23, 0.10);
    border-color: rgba(253, 208, 23, 0.20);
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(253, 208, 23, 0.08);
}

.footer__social-link:hover svg {
    transform: scale(1.10);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .footer__inner {
        padding: 40px 20px;
    }

    .footer__container {
        justify-content: center;
        text-align: center;
        gap: 25px;
    }

    .footer__logo-img {
        max-height: 65px;
        max-height: 60px;
    }

    .footer__about-link {
        font-size: 19px !important;
        left: -3px;
    }

    .footer__social-link {
        width: 40px;
        height: 40px;
    }

    .footer__social-link svg {
        width: 18px;
        height: 18px;
    }

    .footer__social-list {
        gap: 15px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .footer__inner {
        padding: 30px 15px;
    }

    .footer__container {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    .footer__logo-img {
        margin-right: 30px;
        max-height: 55px;
    }

    .footer__about-link {
        font-size: 14px;
    }

    .footer__social-list {
        gap: 12px;
    }

    .footer__social-link {
        width: 38px;
        height: 38px;
    }

    .footer__social-link svg {
        width: 16px;
        height: 16px;
    }

    .site-footer::before,
    .site-footer::after {
        width: 250px;
        height: 250px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .footer__inner {
        padding: 25px 12px;
    }

    .footer__container {
        gap: 15px;
    }

    .footer__logo-img {
        max-height: 50px;
        max-height: 45px;
    }

    .footer__about-link {
        font-size: 13px;
    }

    .footer__social-list {
        gap: 10px;
    }

    .footer__social-link {
        width: 34px;
        height: 34px;
    }

    .footer__social-link svg {
        width: 14px;
        height: 14px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .footer__inner {
        padding: 20px 10px;
    }

    .footer__container {
        gap: 12px;
    }

    .footer__logo-img {
        max-height: 50px;
        max-height: 40px;
    }

    .footer__about-link {
        font-size: 12px;
    }

    .footer__social-list {
        gap: 8px;
    }

    .footer__social-link {
        width: 30px;
        height: 30px;
    }

    .footer__social-link svg {
        width: 12px;
        height: 12px;
    }

    .site-footer::before,
    .site-footer::after {
        display: none;
    }
}



/* ============================================
   FOOTER - LIENS LÉGAUX
   ============================================ */

.footer__legal {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #FDD017;
}

.footer__legal-link {
    color: #FDD017;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer__legal-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

.footer__legal-separator {
    color: rgba(255, 255, 255, 0.2);
}

/* Responsive */
@media (max-width: 768px) {
    .footer__legal {
        font-size: 0.75rem;
        flex-wrap: wrap;
        justify-content: center;
    }
}












/* ============================================
   MASQUER LA LIGNE DU SITE-HEADER EN MOBILE
   ============================================ */

@media (max-width: 992px) {
    .site-header::after {
        display: none !important; /* ✅ Cache la ligne du desktop en mobile */
    }
}


/* ====================================================================================================================================
   HERO - INDUSTRY PAGE (IMAGE COLLÉE EN HAUT)
   ==================================================================================================================================== */



.hero--industry {
    position: relative;
    padding: 20px 0 170px;
    overflow: hidden;
    min-height: 650px;
    display: flex;
    align-items: flex-start;
}

/* ✅ IMAGE COLLÉE EN HAUT */
.hero--industry .hero__image-bg {
    top: 0;
    position: absolute;
    left: 0;
    width: 100%;
    height: 74%;
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
}

/* ✅ OVERLAY COLLÉ EN HAUT */
.hero--industry .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background: linear-gradient(180deg, 
        rgba(0, 0, 0, 0.10) 0%,
        rgba(0, 0, 0, 0.15) 30%,
        rgba(0, 0, 0, 0.25) 60%,
        rgba(0, 0, 0, 0.40) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

/* Conteneur du contenu */
.hero--industry .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU ===== */
.hero--industry .hero__content {
    top: -90px;
    max-width: 550px;
    background: rgba(0, 0, 0, 0.15);
    padding: 40px 45px;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 16px;
    position: relative;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.15);
}

/* ===== TITRE ===== */
.hero--industry .hero__title {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.2rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.1;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== SOUS-TITRE ===== */
.hero--industry .hero__subtitle {
    color: #FFFFFF;
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.25rem);
    text-shadow: 0 0 20px rgba(253, 208, 23, 0.08), 0 2px 15px rgba(0, 0, 0, 0.6);
    line-height: 1.7;
    font-weight: 400;
    opacity: 0.95;
}

/* ============================================
   RESPONSIVE - CORRIGÉ
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--industry {
        min-height: 650px;
        padding: 100px 0 120px;
    }

    .hero--industry .hero__image-bg {
        height: 65%;
        border-radius: 0 0 25px 25px;
        background-size: 100% 100%;
        background-position: center top;
    }

    .hero--industry .hero__overlay {
        height: 65%;
        border-radius: 0 0 25px 25px;
    }

    .hero--industry .hero__content {
        padding: 30px 35px;
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--industry {
        min-height: 600px;
        padding: 80px 0 100px;
    }

    .hero--industry .hero__image-bg {
        height: 60%;
        border-radius: 0 0 20px 20px;
        background-size: 100% 100%;
        background-position: center top;
    }

    .hero--industry .hero__overlay {
        height: 60%;
        border-radius: 0 0 20px 20px;
    }

    .hero--industry .hero__title {
        font-size: 2.5rem;
    }

    .hero--industry .hero__subtitle {
        font-size: 1rem;
    }

    .hero--industry .hero__content {
        top: -145px !important;
        padding: 25px 28px;
        max-width: 65%;
        background: rgba(0, 0, 0, 0.25);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--industry {
        min-height: 600px;
        padding: 140px 0 130px !important;
        margin-bottom: -70%;
    }

    .hero--industry .hero__image-bg {
        height: 60%;
        border-radius: 0 0 16px 16px;
        background-size: 100% 100%;
        background-position: center top;
    }

    .hero--industry .hero__overlay {
        margin-top:1px;
        height: 50% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.25) 0%,
            rgba(0, 0, 0, 0.30) 30%,
            rgba(0, 0, 0, 0.40) 60%,
            rgba(0, 0, 0, 0.55) 100%
        );
    }

    .hero--industry .hero__title {
        padding-top: 30px;
        font-size: 2rem;
    }

    .hero--industry .hero__subtitle {
        font-size: 0.9rem;
    }

    .hero--industry .hero__content {
        top: -135px !important;
        height: 50%!important;
        max-width: 65% !important;
        padding: 20px 20px !important;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--industry {
        min-height: 480px;
        padding: 50px 0 60px;
    }

    .hero--industry .hero__image-bg {
        height: 50%;
        border-radius: 0 0 12px 12px;
        background-size: 100% 100%;
        background-position: center top;
    }

    .hero--industry .hero__overlay {
        height: 50%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--industry .hero__title {
        font-size: 1.8rem;
    }

    .hero--industry .hero__subtitle {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .hero--industry .hero__content {
        padding: 20px 18px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--industry {
        min-height: 420px;
        padding: 40px 0 50px;
    }

    .hero--industry .hero__image-bg {
        height: 45%;
        border-radius: 0 0 10px 10px;
        background-size: 100% 100%;
        background-position: center top;
    }

    .hero--industry .hero__overlay {
        height: 45%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--industry .hero__title {
        font-size: 1.4rem;
    }

    .hero--industry .hero__subtitle {
        font-size: 0.8rem;
    }

    .hero--industry .hero__content {
        padding: 16px 14px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.40);
    }
}



/* ============================================
   SACRED SOLUTIONS - SLIDE CARDS
   ============================================ */

.section--sacred-solutions {
    margin-top: -160px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC COMMITMENT */
    margin-bottom: 80px;
    padding: 80px 0;
    background: linear-gradient(180deg, #fcf5e4 0%, #ffefc9 100%);
    position: relative;
    overflow: hidden;
    border-radius: 30px 30px 0 0;
}

/* Décoration de fond */
.section--sacred-solutions::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--sacred-solutions::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--sacred-solutions .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.section__title--sacred {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 800;
    letter-spacing: 4px;
    text-align: center;
    color: #2E8B57;
    margin-bottom: 50px;
    top: -20px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LE CONTENU */
    position: relative;
    text-shadow: 0 4px 30px rgba(46, 139, 87, 0.05);
}

/* Ligne décorative sous le titre */
.section__title--sacred::after {
    content: '';
    display: block;
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== GRILLE ===== */
.sacred__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* ===== SACRED CARD ===== */
.sacred-card {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: #FFFFFF;
    cursor: pointer;
    aspect-ratio: 3/4;
}

.sacred-card:hover {
    transform: translateY(-10px) scale(1.01);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
}

/* ===== IMAGE ===== */
.sacred-card__image {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.sacred-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sacred-card:hover .sacred-card__image img {
    transform: scale(1.08);
}

/* Titre sur l'image */
.sacred-card__image h3 {
    position: absolute;
    bottom: 25px;
    left: 22px;
    right: 22px;
    color: #FFFFFF;
    font-size: clamp(1rem, 1.2vw + 0.3rem, 1.2rem);
    font-weight: 700;
    text-shadow: 0 2px 25px rgba(0, 0, 0, 0.6), 0 4px 10px rgba(0, 0, 0, 0.3);
    margin: 0;
    line-height: 1.3;
    z-index: 2;
    letter-spacing: 0.3px;
}

/* Gradient overlay */
.sacred-card__image::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 65%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.70) 0%, transparent 100%);
    z-index: 1;
}

/* ===== CONTENU AU SURVOL ===== */
.sacred-card__content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, #0A0A0A 0%, rgba(10, 10, 10, 0.90) 50%, rgba(10, 10, 10, 0.85) 100%);
    padding: 40px 28px 25px;
    transform: translateY(100%);
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 3;
    border-top: 2px solid rgba(253, 208, 23, 0.10);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.sacred-card:hover .sacred-card__content {
    transform: translateY(0);
}

.sacred-card__content h3 {
    color: #FDD017;
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.2rem);
    font-weight: 700;
    margin: 0 0 10px 0;
    line-height: 1.3;
    position: relative;
    padding-bottom: 12px;
}

/* Ligne décorative sous le titre du contenu */
.sacred-card__content h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2.5px;
    background: linear-gradient(90deg, #FDD017, rgba(253, 208, 23, 0.20));
    border-radius: 50px;
    transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sacred-card:hover .sacred-card__content h3::after {
    width: 60px;
}

.sacred-card__content span {
    color: rgba(255, 255, 255, 0.85);
    font-size: clamp(0.8rem, 0.9vw + 0.2rem, 0.9rem);
    line-height: 1.6;
    display: block;
    margin: 0 0 15px 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sacred-card__link {
    color: #FDD017;
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    text-decoration: none;
}

.sacred-card__link:hover {
    border-bottom-color: #FDD017;
    color: #FFE033;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--sacred-solutions {
        margin-top: -220px;
        padding: 60px 0;
    }

    .section__title--sacred {
        font-size: clamp(2rem, 3vw + 1rem, 2.8rem);
        margin-bottom: 35px;
        letter-spacing: 3px;
    }

    .section__title--sacred::after {
        width: 55px;
        height: 2.5px;
    }

    .sacred__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .sacred-card {
        aspect-ratio: 3/4;
    }

    .sacred-card__content {
        padding: 30px 22px 20px;
    }

    .sacred-card__content span {
        -webkit-line-clamp: 3;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--sacred-solutions {
        padding: 40px 0;
    }

    .section--sacred-solutions::before,
    .section--sacred-solutions::after {
        width: 300px;
        height: 300px;
    }

    .section__title--sacred {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
        margin-bottom: 25px;
        letter-spacing: 2px;
    }

    .section__title--sacred::after {
        width: 45px;
        height: 2px;
    }

    .sacred__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }

    .sacred-card {
        border-radius: 14px;
        aspect-ratio: 3/4;
    }

    .sacred-card__image h3 {
        font-size: clamp(0.8rem, 1.2vw + 0.2rem, 0.9rem);
        bottom: 15px;
        left: 15px;
        right: 15px;
    }

    .sacred-card__content {
        padding: 20px 16px 16px;
    }

    .sacred-card__content h3 {
        font-size: clamp(0.85rem, 1.2vw + 0.2rem, 0.95rem);
        padding-bottom: 8px;
    }

    .sacred-card__content h3::after {
        width: 30px;
    }

    .sacred-card:hover .sacred-card__content h3::after {
        width: 45px;
    }

    .sacred-card__content span {
        font-size: clamp(0.7rem, 1vw + 0.2rem, 0.8rem);
        -webkit-line-clamp: 3;
        margin-bottom: 10px;
    }

    .sacred-card__link {
        font-size: 0.7rem;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--sacred-solutions {
        padding: 30px 0;
    }

    .section__title--sacred {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
        letter-spacing: 1.5px;
        margin-bottom: 20px;
    }

    .section__title--sacred::after {
        width: 40px;
        height: 2px;
    }

    .sacred__grid {
        grid-template-columns: 1fr;
        gap: 20px;
        max-width: 380px;
        margin: 0 auto;
    }

    .sacred-card {
        aspect-ratio: 3/4;
        border-radius: 12px;
    }

    .sacred-card__image h3 {
        font-size: 0.9rem;
        bottom: 15px;
        left: 15px;
        right: 15px;
    }

    .sacred-card__content {
        padding: 22px 18px 18px;
    }

    .sacred-card__content h3 {
        font-size: 0.95rem;
    }

    .sacred-card__content h3::after {
        width: 30px;
        height: 2px;
    }

    .sacred-card:hover .sacred-card__content h3::after {
        width: 40px;
    }

    .sacred-card__content span {
        font-size: 0.8rem;
        -webkit-line-clamp: 3;
    }

    .sacred-card__link {
        font-size: 0.75rem;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--sacred-solutions {
        padding: 20px 0;
    }

    .section__title--sacred {
        font-size: 1.2rem;
        letter-spacing: 1px;
        margin-bottom: 15px;
    }

    .section__title--sacred::after {
        width: 30px;
        height: 1.5px;
    }

    .sacred__grid {
        gap: 15px;
        max-width: 100%;
    }

    .sacred-card {
        border-radius: 10px;
        aspect-ratio: 3/4;
    }

    .sacred-card__image h3 {
        font-size: 0.75rem;
        bottom: 12px;
        left: 12px;
        right: 12px;
    }

    .sacred-card__content {
        padding: 16px 14px 14px;
    }

    .sacred-card__content h3 {
        font-size: 0.8rem;
        padding-bottom: 6px;
    }

    .sacred-card__content h3::after {
        width: 25px;
        height: 1.5px;
    }

    .sacred-card:hover .sacred-card__content h3::after {
        width: 35px;
    }

    .sacred-card__content span {
        font-size: 0.7rem;
        -webkit-line-clamp: 2;
        margin-bottom: 8px;
    }

    .sacred-card__link {
        font-size: 0.65rem;
    }
}




/* ============================================
   SECTION : TÉMOIGNAGES + CHIFFRES + CTA
   ============================================ */

.section--testimonials-cta {
    margin-top: -100px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC SACRED SOLUTIONS */
    margin-bottom: 100px;
    padding: 80px 0 60px;
    background: linear-gradient(180deg, #ffefc9 0%, #fcf5e4 100%);
    position: relative;
    overflow: hidden;
}

/* Décoration de fond */
.section--testimonials-cta::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--testimonials-cta::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--testimonials-cta .container-reg {
    position: relative;
    z-index: 1;
}

/* ============================================
   TÉMOIGNAGES
   ============================================ */

.testimonials__header {
    text-align: center;
    margin-bottom: 40px;
}

.section__title--testimonials {
    font-size: clamp(2rem, 3.5vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    letter-spacing: 2px;
    position: relative;
    display: inline-block;
}

.section__title--testimonials::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 0;
    border-radius: 50px;
}

.testimonials__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 60px;
}

/* Carte témoignage */
.testimonial-card {
    background: #FFFFFF;
    padding: 30px 28px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-left: 4px solid #FDD017;
}

.testimonial-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    border-left-color: #2E8B57;
}

.testimonial-card__quote {
    font-size: clamp(0.95rem, 1vw + 0.3rem, 1.05rem);
    line-height: 1.7;
    color: #333;
    font-style: italic;
    margin-bottom: 15px;
}

.testimonial-card__quote::before {
    content: '"';
    color: #FDD017;
    font-size: 1.8rem;
    font-weight: 700;
    margin-right: 4px;
}

.testimonial-card__quote::after {
    content: '"';
    color: #FDD017;
    font-size: 1.8rem;
    font-weight: 700;
    margin-left: 4px;
}

.testimonial-card__author {
    display: flex;
    flex-direction: column;
}

.testimonial-card__name {
    font-weight: 700;
    color: #2E8B57;
    font-size: 1rem;
}

.testimonial-card__location {
    font-size: 0.85rem;
    color: #888;
}

/* ============================================
   CHIFFRES CLÉS
   ============================================ */

.stats__container {
    background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 100%);
    border-radius: 20px;
    padding: 50px 40px;
    margin-bottom: 60px;
    border: 1px solid rgba(253, 208, 23, 0.05);
}

.stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.stats__item {
    text-align: center;
    padding: 10px;
}

.stats__number {
    font-size: clamp(2.5rem, 4vw + 1rem, 4rem);
    font-weight: 800;
    color: #FDD017;
    display: block;
    line-height: 1;
    margin-bottom: 8px;
}

.stats__label {
    font-size: clamp(0.85rem, 1vw + 0.2rem, 1rem);
    color: rgba(255, 255, 255, 0.80);
    font-weight: 400;
}

/* ============================================
   CTA CONSULTATION
   ============================================ */

.cta__container {
    background: linear-gradient(135deg, #2E8B57 0%, #1A6B3F 100%);
    border-radius: 20px;
    padding: 50px 45px;
    text-align: center;
    box-shadow: 0 8px 30px rgba(46, 139, 87, 0.20);
}

.cta__title {
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 15px;
    letter-spacing: 1px;
}

.cta__text {
    font-size: clamp(1rem, 1.2vw + 0.3rem, 1.2rem);
    color: rgba(255, 255, 255, 0.90);
    margin-bottom: 30px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
}

.cta__btn {
    display: inline-block;
    border-radius: 50px;
    padding: 16px 45px;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.35);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    text-decoration: none;
}

.cta__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--testimonials-cta {
        margin-bottom: 120px;
        padding: 60px 0 40px;
    }

    .testimonials__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .stats__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .stats__container {
        padding: 40px 30px;
    }

    .cta__container {
        padding: 40px 30px;
    }

    .cta__title {
        font-size: clamp(1.6rem, 2.5vw + 1rem, 2.2rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--testimonials-cta {
        padding: 40px 0 30px;
    }

    .testimonials__grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 40px;
    }

    .testimonial-card {
        padding: 25px 20px;
        border-radius: 14px;
    }

    .testimonial-card__quote {
        font-size: 0.95rem;
    }

    .stats__container {
        padding: 30px 20px;
        border-radius: 16px;
        margin-bottom: 40px;
    }

    .stats__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    .stats__number {
        font-size: clamp(2rem, 3vw + 1rem, 2.8rem);
    }

    .stats__label {
        font-size: 0.8rem;
    }

    .cta__container {
        margin-bottom: 10px;
        padding: 30px 20px;
        border-radius: 16px;
    }

    .cta__title {
        font-size: clamp(1.3rem, 2.5vw + 0.5rem, 1.8rem);
    }

    .cta__text {
        font-size: 0.95rem;
        padding: 0 5px;
    }

    .cta__btn {
        padding: 14px 35px;
        font-size: 14px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--testimonials-cta {
        padding: 30px 0 20px;
    }

    .section__title--testimonials {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 1.8rem);
    }

    .section__title--testimonials::after {
        width: 45px;
        height: 2px;
    }

    .testimonials__grid {
        gap: 15px;
        margin-bottom: 30px;
    }

    .testimonial-card {
        padding: 20px 16px;
        border-radius: 12px;
        border-left-width: 3px;
    }

    .testimonial-card__quote {
        font-size: 0.85rem;
    }

    .testimonial-card__name {
        font-size: 0.9rem;
    }

    .testimonial-card__location {
        font-size: 0.75rem;
    }

    .stats__container {
        padding: 25px 15px;
        border-radius: 14px;
        margin-bottom: 30px;
    }

    .stats__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .stats__number {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
    }

    .stats__label {
        font-size: 0.7rem;
    }

    .cta__container {
        padding: 25px 16px;
        border-radius: 14px;
    }

    .cta__title {
        font-size: clamp(1.1rem, 2.5vw + 0.3rem, 1.5rem);
    }

    .cta__text {
        font-size: 0.85rem;
        margin-bottom: 20px;
    }

    .cta__btn {
        padding: 12px 28px;
        font-size: 12px;
        letter-spacing: 1px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--testimonials-cta {
        padding: 20px 0 15px;
    }

    .section__title--testimonials {
        font-size: 1.3rem;
    }

    .section__title--testimonials::after {
        width: 35px;
        height: 1.5px;
    }

    .testimonial-card {
        padding: 16px 14px;
        border-radius: 10px;
    }

    .testimonial-card__quote {
        font-size: 0.8rem;
    }

    .testimonial-card__quote::before,
    .testimonial-card__quote::after {
        font-size: 1.2rem;
    }

    .stats__container {
        padding: 20px 12px;
        border-radius: 12px;
    }

    .stats__grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .stats__number {
        font-size: 1.4rem;
    }

    .stats__label {
        font-size: 0.65rem;
    }

    .cta__container {
        padding: 20px 12px;
        border-radius: 12px;
    }

    .cta__title {
        font-size: 1rem;
    }

    .cta__text {
        font-size: 0.8rem;
    }

    .cta__btn {
        padding: 10px 22px;
        font-size: 11px;
    }
}





/* ============================================
   HERO - EXPERTISE PAGE MASTER
   ============================================ */

.hero--expertise {

    position: relative;
    padding: 100px 0 184px;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* ✅ IMAGE */
.hero--expertise .hero__bg-image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
    /* ✅ POUR REMONTER L'IMAGE : utiliser top négatif ou transform */
    top: 59px; /* ⬅️ AJUSTE CETTE VALEUR (négative = remonte) */
}

/* ✅ ALTERNATIVE : Utiliser transform: translateY */
.hero--expertise .hero__bg-image {
    transform: translateY(-30px); /* ⬅️ AJUSTE CETTE VALEUR */
}

/* ✅ ALTERNATIVE 2 : Utiliser margin-top négatif */
.hero--expertise .hero__bg-image {
    margin-top: -30px; /* ⬅️ AJUSTE CETTE VALEUR */
}

/* Overlay */
.hero--expertise .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.30) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.50) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--expertise .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--expertise .hero__content--center {
    top: -60px;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--expertise .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--expertise .hero__title {
    color: #FFFFFF;
    font-size: clamp(2.2rem, 4vw + 2rem, 4.2rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--expertise .hero__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--expertise .hero__subtitle {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 750px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--expertise {
        top: -50px;
        min-height: 550px;
        padding: 80px 0 120px;
        border-radius: 0 0 25px 25px;
    }

    .hero--expertise .hero__bg-image {    
        height: 85%;
        border-radius: 0 0 25px 25px;
        top: -30px;
    }

    .hero--expertise .hero__overlay {
        height: 85%;
        border-radius: 0 0 25px 25px;
        
    }

    .hero--expertise .hero__content--center {
        padding: 40px 40px;
        border-radius: 16px;
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--expertise {
        top: -50px;
        min-height: 480px;
        padding: 60px 0 100px;
        border-radius: 0 0 20px 20px;
        margin-bottom: 53px;
    }

    .hero--expertise .hero__bg-image {
        height: 60%;
        border-radius: 0 0 20px 20px;
        top: -30px;
    }

    .hero--expertise .hero__overlay {
        height: 75.5% !important; /* ⬅️ AUGMENTE POUR COUVRIR PLUS */
        border-radius: 0 0 20px 20px;
    }

    .hero--expertise .hero__content--center {
        padding: 35px 30px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--expertise .hero__title {
        font-size: 2.5rem;
    }

    .hero--expertise .hero__subtitle {
        font-size: 1rem;
        margin-top: 8px;
        margin-bottom: 26px;
    }

    .hero--expertise .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }

    .hero--expertise .hero__divider {
        width: 55px;
        height: 2.5px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--expertise {
        top: -50px;
        min-height: 480px; /* ⬅️ AUGMENTE LÉGÈREMENT */
        padding: 80px 0 90px !important; /* ⬅️ RÉDUIT LE PADDING */
        border-radius: 0 0 16px 16px;
        margin-bottom: 53px;
    }

    .hero--expertise .hero__bg-image {
        height: 75% !important; /* ⬅️ AUGMENTE POUR COUVRIR PLUS */
        border-radius: 0 0 16px 16px;
        top: 110px !important;
    }

    .hero--expertise .hero__overlay {
        height: 74.5% !important; /* ⬅️ AUGMENTE POUR COUVRIR PLUS */
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--expertise .hero__content--center {
        top: 0 !important;
        padding: 20px 18px; /* ⬅️ RÉDUIT LE PADDING */
        border-radius: 12px;
        left: -12%;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(3px);
        max-width: 90%; /* ⬅️ LIMITE LA LARGEUR */
        margin: 0 auto;
    }

    .hero--expertise .hero__title {
        
        font-size: 1.4rem; /* ⬅️ RÉDUIT LA TAILLE */
        margin-bottom: 12px;
        
    }

    .hero--expertise .hero__subtitle {
        font-size: 0.75rem;
        line-height: 1.5;
    }

    .hero--expertise .hero__label {
        font-size: 0.55rem;
        letter-spacing: 1.5px;
        margin-top: 6px;
        margin-bottom: 16px;
    }

    .hero--expertise .hero__divider {
        width: 40px;
        height: 2px;
        margin-bottom: 14px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--expertise {
        min-height: 350px;
        padding: 30px 0 60px;
        border-radius: 0 0 12px 12px;
    }

    .hero--expertise .hero__bg-image {
        height: 50%;
        border-radius: 0 0 12px 12px;
        top: -10px;
    }

    .hero--expertise .hero__overlay {
        height: 50%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--expertise .hero__content--center {
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--expertise .hero__title {
        font-size: 1.6rem;
    }

    .hero--expertise .hero__subtitle {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--expertise .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }

    .hero--expertise .hero__divider {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--expertise {
        min-height: 300px;
        padding: 20px 0 50px;
        border-radius: 0 0 10px 10px;
    }

    .hero--expertise .hero__bg-image {
        height: 45%;
        border-radius: 0 0 10px 10px;
        top: -8px;
    }

    .hero--expertise .hero__overlay {
        height: 45%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--expertise .hero__content--center {
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--expertise .hero__title {
        font-size: 1.3rem;
    }

    .hero--expertise .hero__subtitle {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--expertise .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
        margin-bottom: 5px;
    }

    .hero--expertise .hero__divider {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }
}



/* ============================================
   SECTION : WHO IS CHEIKH MOHAMED HAMIN HAIDRA?
   ============================================ */

.section--who {
    margin-top: -160px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LE HERO */
    padding: 80px 0;
    background: radial-gradient(ellipse at 50% 30%, #6B4423 0%, #3D2010 50%, #1A0E05 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--who::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--who .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.who__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== SLIDER IMAGE ===== */
.who__slider {
    flex: 1 1 45%;
    min-width: 300px;
}

/* ✅ WRAPPER AVEC OMBRE ET MOUVEMENT AU SURVOL */
.who__slider-wrapper {
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    background: #0A0A0A;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ✅ AU SURVOL : OMBRE FORTE + LÉGER MOUVEMENT */
.who__slider-wrapper:hover {
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
    transform: translateY(-6px) scale(1.01);
}

.who__slider-container {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    border-radius: 20px;
}

/* ✅ IMAGE AVEC ZOOM */
.who__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transform: scale(1);
}

.who__slide--active {
    opacity: 1;
    animation: zoomIn 8s ease-in-out infinite alternate;
}

/* ✅ ANIMATION ZOOM LENT */
@keyframes zoomIn {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.08);
    }
}

/* ===== DOTS (indicateurs) ===== */
.who__dots {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 12px;
    z-index: 10;
}

.who__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.40);
    display: inline-block;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.who__dot--active {
    background: #FDD017;
    transform: scale(1.2);
    box-shadow: 0 0 20px rgba(253, 208, 23, 0.30);
}

/* ===== CONTENU TEXTE ===== */
.who__content {
    flex: 1 1 45%;
    min-width: 300px;
}

.who__label {
    color: #FDD017;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    display: block;
    margin-bottom: 10px;
    font-weight: 600;
}

.who__title {
    color: #a8a8a8;
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    
}

.who__text {
    color: #aab1bd;
    font-size: clamp(0.95rem, 1vw + 0.3rem, 1.05rem);
    line-height: 1.8;
    margin-bottom: 30px;
}

/* ===== BOUTON ===== */
.who__btn {
    display: inline-block;
    background: #0A0A0A;
    padding: 12px 30px;
    border-radius: 50px;
    color: #FDD017;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 2px solid transparent;
}

.who__btn:hover {
    background: #FDD017;
    color: #0A0A0A;
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(253, 208, 23, 0.30);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--who {
        padding: 60px 0;
    }

    .who__grid {
        flex-direction: column;
        gap: 40px;
    }

    .who__slider {
        flex: 1 1 100%;
        max-width: 500px;
        margin: 0 auto;
    }

    .who__slider-container {
        height: 400px;
    }

    .who__content {
        flex: 1 1 100%;
        text-align: center;
    }

    .who__title {
        font-size: clamp(1.6rem, 2.5vw + 1rem, 2.2rem);
    }

    .who__slider-wrapper:hover {
        transform: translateY(-4px) scale(1.005);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--who {
        padding: 40px 0;
    }

    .who__grid {
        gap: 30px;
    }

    .who__slider {
        max-width: 100%;
    }

    .who__slider-container {
        height: 320px;
    }

    .who__slider-wrapper {
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
    }

    .who__slider-wrapper:hover {
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.18);
        transform: translateY(-4px) scale(1.005);
    }

    .who__title {
        font-size: clamp(1.4rem, 3vw + 0.5rem, 1.8rem);
    }

    .who__text {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .who__btn {
        padding: 10px 24px;
        font-size: 13px;
    }

    .who__dots {
        gap: 10px;
        bottom: 15px;
    }

    .who__dot {
        width: 8px;
        height: 8px;
    }

    @keyframes zoomIn {
        0% { transform: scale(1); }
        100% { transform: scale(1.05); }
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--who {
        padding: 30px 0;
    }

    .who__slider-container {
        height: 260px;
    }

    .who__slider-wrapper:hover {
        transform: translateY(-3px) scale(1);
    }

    .who__title {
        font-size: 1.3rem;
    }

    .who__text {
        font-size: 0.85rem;
    }

    .who__btn {
        padding: 8px 20px;
        font-size: 12px;
    }

    .who__dots {
        gap: 8px;
        bottom: 12px;
    }

    .who__dot {
        width: 7px;
        height: 7px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--who {
        padding: 20px 0;
    }

    .who__slider-container {
        height: 200px;
    }

    .who__slider-wrapper:hover {
        transform: translateY(-2px) scale(1);
    }

    .who__title {
        font-size: 1.1rem;
    }

    .who__text {
        font-size: 0.8rem;
    }

    .who__btn {
        padding: 6px 16px;
        font-size: 11px;
    }

    .who__dots {
        gap: 6px;
        bottom: 10px;
    }

    .who__dot {
        width: 6px;
        height: 6px;
    }

    @keyframes zoomIn {
        0% { transform: scale(1); }
        100% { transform: scale(1.03); }
    }
}


/* ============================================
   SECTION : HOW I HELP
   ============================================ */

.section--how {
    padding: 80px 0;
    margin-top: 10px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LA SECTION PRÉCÉDENTE */
    background: radial-gradient(ellipse at 50% 30%, #3a2413 0%, #6d391d 40%, #080502 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--how::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}


.section--how .container-reg {
    top: -20px;
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.how__header {
    text-align: center;
    margin-bottom: 50px;
}

.how__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    color: #a8a8a8;
    letter-spacing: 2px;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 0;
}

.how__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== GRILLE ===== */
.how__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* ===== CARTE ===== */
.how__card {
    background: #FFFFFF;
    padding: 35px 30px 30px;
    border-radius: 16px;
    /* ✅ OMBRE UNIFORME AUTOUR DE TOUTE LA CARTE */
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.02);
    position: relative;
}

/* ✅ AU SURVOL : OMBRE PLUS FORTE */
.how__card:hover {
    transform: translateY(-8px);
    /* ✅ OMBRE UNIFORME RENFORCÉE */
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    border-color: rgba(253, 208, 23, 0.10);
}

/* ===== ICÔNE ===== */
.how__card-icon {
    font-size: 2.5rem;
    display: block;
    margin-bottom: 15px;
    line-height: 1;
}

/* ===== TITRE DE LA CARTE ===== */
.how__card-title {
    font-size: clamp(1.1rem, 1.2vw + 0.3rem, 1.3rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 15px;
    line-height: 1.3;
    position: relative;
    padding-bottom: 12px;
}

/* Ligne décorative sous le titre */
.how__card-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2.5px;
    background: linear-gradient(90deg, #FDD017, rgba(253, 208, 23, 0.20));
    border-radius: 50px;
    transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.how__card:hover .how__card-title::after {
    width: 60px;
}

/* ===== TEXTE ===== */
.how__card-text {
    color: #4A5568;
    font-size: clamp(0.9rem, 0.9vw + 0.2rem, 0.95rem);
    line-height: 1.8;
    margin: 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--how {
        padding: 60px 0;
    }

    .how__header {
        margin-bottom: 35px;
    }

    .how__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .how__divider {
        width: 55px;
        height: 2.5px;
    }

    .how__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .how__card {
        padding: 28px 25px 25px;
        border-radius: 14px;
        box-shadow: 0 6px 25px rgba(0, 0, 0, 0.06);
    }

    .how__card:hover {
        box-shadow: 0 15px 45px rgba(0, 0, 0, 0.12);
    }

    .how__card-icon {
        font-size: 2.2rem;
    }

    .how__card-title {
        font-size: clamp(1rem, 1.2vw + 0.3rem, 1.15rem);
    }

    .how__card-text {
        font-size: 0.9rem;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--how {
        padding: 40px 0;
    }

    .section--how::before,
    .section--how::after {
        width: 300px;
        height: 300px;
    }

    .how__header {
        margin-bottom: 25px;
    }

    .how__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
        letter-spacing: 1.5px;
    }

    .how__divider {
        width: 45px;
        height: 2px;
    }

    /* ✅ PASSE À 1 COLONNE SUR MOBILE */
    .how__grid {
        grid-template-columns: 1fr;
        gap: 18px;
        max-width: 500px;
        margin: 0 auto;
    }

    .how__card {
        padding: 22px 20px 20px;
        border-radius: 12px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    }

    .how__card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.10);
    }

    .how__card-icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }

    .how__card-title {
        font-size: clamp(0.95rem, 1.2vw + 0.2rem, 1.05rem);
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    .how__card-title::after {
        width: 30px;
        height: 2px;
    }

    .how__card:hover .how__card-title::after {
        width: 45px;
    }

    .how__card-text {
        font-size: 0.85rem;
        line-height: 1.6;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--how {
        padding: 30px 0;
    }

    .section--how::before,
    .section--how::after {
        display: none;
    }

    .how__header {
        margin-bottom: 20px;
    }

    .how__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
        letter-spacing: 1px;
    }

    .how__divider {
        width: 40px;
        height: 2px;
    }

    /* ✅ 1 COLONNE (déjà défini mais je garde) */
    .how__grid {
        grid-template-columns: 1fr;
        gap: 20px;
        max-width: 400px;
        margin: 0 auto;
    }

    .how__card {
        padding: 25px 20px 22px;
        border-radius: 12px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    }

    .how__card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.10);
    }

    .how__card-icon {
        font-size: 2rem;
        margin-bottom: 12px;
    }

    .how__card-title {
        font-size: 1.05rem;
        padding-bottom: 10px;
    }

    .how__card-title::after {
        width: 35px;
    }

    .how__card:hover .how__card-title::after {
        width: 50px;
    }

    .how__card-text {
        font-size: 0.9rem;
        line-height: 1.7;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--how {
        padding: 20px 0;
    }

    .how__title {
        font-size: 1.2rem;
    }

    .how__divider {
        width: 35px;
        height: 1.5px;
    }

    .how__grid {
        grid-template-columns: 1fr;
        gap: 15px;
        max-width: 100%;
    }

    .how__card {
        padding: 18px 16px 16px;
        border-radius: 10px;
        box-shadow: 0 3px 15px rgba(0, 0, 0, 0.04);
    }

    .how__card:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    }

    .how__card-icon {
        font-size: 1.6rem;
        margin-bottom: 8px;
    }

    .how__card-title {
        font-size: 0.9rem;
        padding-bottom: 8px;
    }

    .how__card-title::after {
        width: 30px;
        height: 1.5px;
    }

    .how__card:hover .how__card-title::after {
        width: 40px;
    }

    .how__card-text {
        font-size: 0.8rem;
        line-height: 1.5;
    }
}











/* ============================================
   SECTION : TESTIMONIALS CAROUSEL
   ============================================ */

.section--testimonials {
    padding: 80px 0;
    background: radial-gradient(ellipse at 50% 30%, #22150b 0%, #572e17 40%, #000000 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--testimonials::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--testimonials::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--testimonials .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.testimonials__header {
    text-align: center;
    margin-bottom: 50px;
}

.testimonials__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    color: #a8a8a8;
    letter-spacing: 2px;
    margin-bottom: 0;
}

.testimonials__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== CARROUSEL ===== */
.testimonials__carousel {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    min-height: 420px;
}

.testimonials__slide {
    display: none;
    animation: testimonialsFade 0.6s ease-in-out;
}

.testimonials__slide.active {
    display: block;
}

@keyframes testimonialsFade {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* ===== CARTE TÉMOIGNAGE ===== */
.testimonials__card {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 24px;
    padding: 45px 50px 40px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.3);
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.testimonials__card:hover {
    box-shadow: 0 16px 60px rgba(0, 0, 0, 0.10);
    transform: translateY(-4px);
}

/* ===== GRAND GUILLEMET ===== */
.testimonials__quote-icon {
    position: absolute;
    top: 20px;
    left: 35px;
    font-size: 6rem;
    color: rgba(253, 208, 23, 0.10);
    font-family: Georgia, serif;
    line-height: 1;
    pointer-events: none;
}

/* ===== CONTENU ===== */
.testimonials__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
}

/* ===== PHOTO RONDE ===== */
.testimonials__image-wrapper {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #FDD017;
    box-shadow: 0 4px 20px rgba(253, 208, 23, 0.20);
    margin-bottom: 20px;
    flex-shrink: 0;
}

.testimonials__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ===== TEXTE ===== */
.testimonials__text {
    font-size: clamp(1.05rem, 1.2vw + 0.3rem, 1.2rem);
    line-height: 1.8;
    color: #2C2C2C;
    font-style: italic;
    margin-bottom: 20px;
    max-width: 650px;
}

/* ===== FOOTER ===== */
.testimonials__footer {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.testimonials__name {
    font-size: 1.1rem;
    font-weight: 700;
    color: #2E8B57;
    margin: 0;
}

.testimonials__role {
    font-size: 0.85rem;
    color: #888;
}

/* ===== ORNEMENT ===== */
.testimonials__ornament {
    text-align: center;
    margin-top: 20px;
    font-size: 0.7rem;
    letter-spacing: 6px;
    color: rgba(253, 208, 23, 0.20);
}

/* ===== CONTROLS ===== */
.testimonials__controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
    margin-top: 35px;
}

.testimonials__btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid rgba(253, 208, 23, 0.15);
    background: #FFFFFF;
    color: #2E8B57;
    font-size: 1.5rem;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

.testimonials__btn:hover {
    background: #FDD017;
    color: #0A0A0A;
    border-color: #FDD017;
    transform: scale(1.05);
    box-shadow: 0 4px 20px rgba(253, 208, 23, 0.25);
}

/* ===== DOTS ===== */
.testimonials__dots {
    display: flex;
    gap: 10px;
}

.testimonials__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(46, 139, 87, 0.15);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.testimonials__dot.active {
    background: #FDD017;
    transform: scale(1.2);
    box-shadow: 0 0 20px rgba(253, 208, 23, 0.25);
}

.testimonials__dot:hover {
    background: #FDD017;
    transform: scale(1.1);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--testimonials {
        padding: 60px 0;
    }

    .testimonials__header {
        margin-bottom: 35px;
    }

    .testimonials__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .testimonials__divider {
        width: 55px;
        height: 2.5px;
    }

    .testimonials__card {
        padding: 35px 30px 30px;
        border-radius: 20px;
    }

    .testimonials__text {
        font-size: 1rem;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--testimonials {
        padding: 40px 0;
    }

    .testimonials__header {
        margin-bottom: 25px;
    }

    .testimonials__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
        letter-spacing: 1.5px;
    }

    .testimonials__divider {
        width: 45px;
        height: 2px;
    }

    .testimonials__carousel {
        min-height: 380px;
    }

    .testimonials__card {
        padding: 30px 22px 25px;
        border-radius: 16px;
        backdrop-filter: blur(6px);
    }

    .testimonials__quote-icon {
        font-size: 4rem;
        top: 15px;
        left: 20px;
    }

    .testimonials__image-wrapper {
        width: 65px;
        height: 65px;
        border-width: 2.5px;
        margin-bottom: 15px;
    }

    .testimonials__text {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .testimonials__name {
        font-size: 1rem;
    }

    .testimonials__role {
        font-size: 0.8rem;
    }

    .testimonials__ornament {
        font-size: 0.6rem;
        letter-spacing: 4px;
        margin-top: 15px;
    }

    .testimonials__btn {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .testimonials__controls {
        gap: 15px;
        margin-top: 25px;
    }

    .testimonials__dot {
        width: 10px;
        height: 10px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--testimonials {
        padding: 30px 0;
    }

    .testimonials__header {
        margin-bottom: 20px;
    }

    .testimonials__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
        letter-spacing: 1px;
    }

    .testimonials__divider {
        width: 40px;
        height: 2px;
    }

    .testimonials__carousel {
        min-height: 350px;
    }

    .testimonials__card {
        padding: 25px 18px 20px;
        border-radius: 14px;
        backdrop-filter: blur(4px);
    }

    .testimonials__quote-icon {
        font-size: 3.2rem;
        top: 12px;
        left: 15px;
    }

    .testimonials__image-wrapper {
        width: 55px;
        height: 55px;
        border-width: 2px;
        margin-bottom: 12px;
    }

    .testimonials__text {
        font-size: 0.85rem;
        line-height: 1.5;
        margin-bottom: 15px;
    }

    .testimonials__name {
        font-size: 0.9rem;
    }

    .testimonials__role {
        font-size: 0.7rem;
    }

    .testimonials__ornament {
        font-size: 0.5rem;
        letter-spacing: 3px;
        margin-top: 12px;
    }

    .testimonials__btn {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }

    .testimonials__controls {
        gap: 12px;
        margin-top: 20px;
    }

    .testimonials__dot {
        width: 8px;
        height: 8px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--testimonials {
        padding: 20px 0;
    }

    .testimonials__title {
        font-size: 1.2rem;
    }

    .testimonials__divider {
        width: 35px;
        height: 1.5px;
    }

    .testimonials__carousel {
        min-height: 320px;
    }

    .testimonials__card {
        padding: 20px 14px 16px;
        border-radius: 12px;
    }

    .testimonials__quote-icon {
        font-size: 2.5rem;
        top: 10px;
        left: 12px;
    }

    .testimonials__image-wrapper {
        width: 45px;
        height: 45px;
        border-width: 1.5px;
        margin-bottom: 10px;
    }

    .testimonials__text {
        font-size: 0.8rem;
        line-height: 1.4;
        margin-bottom: 12px;
    }

    .testimonials__name {
        font-size: 0.8rem;
    }

    .testimonials__role {
        font-size: 0.65rem;
    }

    .testimonials__ornament {
        font-size: 0.4rem;
        letter-spacing: 2px;
        margin-top: 10px;
    }

    .testimonials__btn {
        width: 32px;
        height: 32px;
        font-size: 0.8rem;
    }

    .testimonials__controls {
        gap: 10px;
        margin-top: 15px;
    }

    .testimonials__dot {
        width: 7px;
        height: 7px;
    }
}




/* ============================================
   SECTION : LOVE PEACE SECURITY
   ============================================ */

.section--love {
    padding: 80px 0;
    margin-top: -25px !important; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LA SECTION PRÉCÉDENTE */
    background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 50%, #0A0A0A 100%);
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.05);
    border-bottom: 149px solid rgba(253, 208, 23, 0.05);
    border-radius: 25px 25px 0 0px;
}

/* Décoration de fond - cercles lumineux */
.section--love::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -100px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--love::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -100px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--love .container-reg {
    margin-bottom: 125px;
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.love__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE ===== */
.love__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.love__icon {
    font-size: 2.5rem;
    color: #FDD017;
    margin-bottom: 10px;
    opacity: 0.6;
}

.love__title {
    font-size: clamp(2.5rem, 5vw + 1rem, 4.5rem);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.1;
    margin-bottom: 0;
    letter-spacing: -0.5px;
}

.love__title-highlight {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.love__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 20px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== DROITE : TEXTE + BOUTON ===== */
.love__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.love__text {
    font-size: clamp(1rem, 1.2vw + 0.3rem, 1.2rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.80);
    margin-bottom: 30px;
}

/* ===== BOUTON ===== */
.love__btn {
    display: inline-block;
    padding: 14px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.30);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.love__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--love {
        padding: 60px 0;
    }

    .love__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .love__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .love__icon {
        font-size: 2.2rem;
    }

    .love__title {
        font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    }

    .love__divider {
        margin: 20px auto 0;
    }

    .love__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .love__text {
        max-width: 600px;
        margin: 0 auto 30px;
    }

    .section--love::before,
    .section--love::after {
        width: 300px;
        height: 300px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--love {
        padding: 40px 0;
    }

    .love__grid {
        gap: 25px;
    }

    .love__icon {
        font-size: 2rem;
    }

    .love__title {
        font-size: clamp(1.8rem, 4vw + 0.5rem, 2.8rem);
    }

    .love__divider {
        width: 50px;
        height: 2.5px;
        margin-top: 15px;
    }

    .love__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 25px;
    }

    .love__btn {
        padding: 12px 32px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--love {
        padding: 30px 0;
    }

    .section--love::before,
    .section--love::after {
        display: none;
    }

    .love__grid {
        gap: 20px;
    }

    .love__icon {
        font-size: 1.6rem;
    }

    .love__title {
        font-size: clamp(1.5rem, 4vw + 0.3rem, 2.2rem);
    }

    .love__divider {
        width: 40px;
        height: 2px;
        margin-top: 12px;
    }

    .love__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 20px;
    }

    .love__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--love {
        padding: 20px 0;
    }

    .love__icon {
        font-size: 1.3rem;
    }

    .love__title {
        font-size: 1.3rem;
    }

    .love__divider {
        width: 35px;
        height: 1.5px;
        margin-top: 10px;
    }

    .love__text {
        font-size: 0.8rem;
        line-height: 1.4;
        margin-bottom: 15px;
    }

    .love__btn {
        padding: 8px 18px;
        font-size: 11px;
    }
}










/* ============================================
   SECTION : PROFIL - EXPERT PAGE
   ============================================ */

.section--profile {
    padding: 60px 0;
    margin-top: -70px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LA SECTION PRÉCÉDENTE */
    background: radial-gradient(ellipse at 50% 30%, #fff2e9 0%, #fff2e9 40%, #ffdecc 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--profile::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--profile::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--profile .container-reg {
    position: relative;
    z-index: 1;
}

/* ============================================
   BLOC PROFIL
   ============================================ */

.profile__block {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 40px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.profile__block:last-child {
    border-bottom: none;
}

/* ✅ AU SURVOL : OMBRE JAUNE + TRANSLATION */
.profile__block:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 60px rgba(253, 208, 23, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.40);
    padding: 40px 30px;
    margin: 0 -15px;
}

/* ===== IMAGE ===== */
.profile__image {
    flex: 0 0 300px;
    max-width: 300px;
}

.profile__image img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.profile__block:hover .profile__image img {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
    transform: scale(1.02);
}

/* ===== CONTENU ===== */
.profile__content {
    flex: 1;
}

/* ===== BADGE ===== */
.profile__badge {
    display: inline-block;
    color: #FDD017;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 8px;
}

/* ===== TITRE (dégradé blanc comme le H1) ===== */
.profile__title {
    font-size: clamp(1.6rem, 2.5vw + 1rem, 2.5rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #2E8B57, #3CB371);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE SOUS LE TITRE ===== */
.profile__divider {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 18px;
    border-radius: 50px;
    transition: width 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.profile__block:hover .profile__divider {
    width: 70px;
}

/* ===== TEXTE ===== */
.profile__text {
    color: #4A5568;
    font-size: clamp(0.95rem, 0.9vw + 0.3rem, 1.05rem);
    line-height: 1.8;
    margin-bottom: 15px;
}

.profile__text:last-child {
    margin-bottom: 0;
}

/* ===== LISTE ===== */
.profile__list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
}

.profile__list li {
    position: relative;
    padding-left: 25px;
    color: #4A5568;
    font-size: clamp(0.95rem, 0.9vw + 0.3rem, 1.05rem);
    line-height: 1.8;
    margin-bottom: 8px;
}

.profile__list li::before {
    content: '✦';
    position: absolute;
    left: 0;
    top: 0;
    color: #FDD017;
    font-size: 0.8rem;
}

/* ============================================
   ALTERNANCE IMAGE GAUCHE / DROITE
   ============================================ */

.profile__block--left {
    flex-direction: row;
}

.profile__block--right {
    flex-direction: row-reverse;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--profile {
        padding: 40px 0;
    }

    .profile__block {
        gap: 30px;
        padding: 30px 0;
    }

    .profile__block--left,
    .profile__block--right {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .profile__image {
        flex: 0 0 auto;
        max-width: 280px;
        width: 100%;
    }

    .profile__image img {
        height: 280px;
    }

    .profile__content {
        text-align: center;
    }

    .profile__divider {
        margin: 12px auto 18px;
    }

    .profile__title {
        font-size: clamp(1.4rem, 2.5vw + 0.5rem, 2rem);
    }

    .profile__list li {
        text-align: left;
        padding-left: 25px;
    }

    .profile__block:hover {
        transform: translateY(-4px);
        padding: 30px 20px;
        margin: 0;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--profile {
        padding: 30px 0;
    }

    .profile__block {
        gap: 20px;
        padding: 25px 0;
    }

    .profile__image {
        max-width: 220px;
    }

    .profile__image img {
        height: 220px;
        border-radius: 16px;
    }

    .profile__title {
        font-size: clamp(1.2rem, 2vw + 0.5rem, 1.6rem);
    }

    .profile__text {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .profile__list li {
        font-size: 0.9rem;
        line-height: 1.6;
        padding-left: 22px;
    }

    .profile__badge {
        font-size: 11px;
        letter-spacing: 1.5px;
    }

    .profile__divider {
        width: 40px;
        height: 2.5px;
    }

    .profile__block:hover {
        transform: translateY(-3px);
        padding: 20px 15px;
    }

    .profile__block:hover .profile__divider {
        width: 50px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--profile {
        padding: 20px 0;
    }

    .profile__block {
        gap: 15px;
        padding: 20px 0;
    }

    .profile__image {
        max-width: 180px;
    }

    .profile__image img {
        height: 180px;
        border-radius: 14px;
    }

    .profile__title {
        font-size: clamp(1rem, 2vw + 0.3rem, 1.3rem);
    }

    .profile__text {
        font-size: 0.85rem;
        line-height: 1.5;
        margin-bottom: 10px;
    }

    .profile__list li {
        font-size: 0.85rem;
        line-height: 1.5;
        padding-left: 20px;
        margin-bottom: 5px;
    }

    .profile__badge {
        font-size: 10px;
        letter-spacing: 1px;
        margin-bottom: 5px;
    }

    .profile__divider {
        width: 35px;
        height: 2px;
        margin: 10px auto 14px;
    }

    .profile__block:hover {
        transform: translateY(-2px);
        padding: 15px 10px;
    }

    .profile__block:hover .profile__divider {
        width: 45px;
    }

    .profile__block:hover .profile__image img {
        transform: scale(1.01);
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .profile__image {
        max-width: 150px;
    }

    .profile__image img {
        height: 150px;
        border-radius: 12px;
    }

    .profile__title {
        font-size: 0.95rem;
    }

    .profile__text {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .profile__list li {
        font-size: 0.8rem;
        line-height: 1.4;
        padding-left: 18px;
    }

    .profile__badge {
        font-size: 9px;
        letter-spacing: 0.5px;
    }

    .profile__divider {
        width: 30px;
        height: 1.5px;
        margin: 8px auto 10px;
    }

    .profile__block:hover {
        padding: 12px 8px;
    }
}





/* ============================================
   SECTION : OUR QUALITIES
   ============================================ */

.section--qualities {
    padding: 80px 0;
    background: radial-gradient(ellipse at 50% 30%, #ffdecc 0%, #fff2e9 40%, #fff2e9 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--qualities::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--qualities::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--qualities .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.qualities__header {
    text-align: center;
    margin-bottom: 50px;
}

.qualities__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    color: #2E8B57;
    letter-spacing: 2px;
    margin-bottom: 0;
}

.qualities__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== GRILLE ===== */
.qualities__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

/* ===== CARTE ===== */
.quality__card {
    background: #FFFFFF;
    padding: 35px 25px 30px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    text-align: center;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.02);
    position: relative;
    overflow: hidden;
}

/* ✅ Petit ornement décoratif en haut */
.quality__card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #FDD017, #2E8B57, #FDD017, transparent);
    background-size: 200% 100%;
    animation: qualityLine 4s ease-in-out infinite;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.quality__card:hover::before {
    opacity: 1;
}

@keyframes qualityLine {
    0%, 100% { background-position: -200% 0; }
    50% { background-position: 200% 0; }
}

/* ✅ SURVOL */
.quality__card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.10);
    border-color: rgba(253, 208, 23, 0.10);
}

/* ===== ICÔNE ===== */
.quality__icon {
    font-size: 3.2rem;
    display: block;
    margin-bottom: 18px;
    line-height: 1;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.quality__card:hover .quality__icon {
    transform: scale(1.15) rotate(-5deg);
}

/* ===== TITRE ===== */
.quality__title {
    font-size: clamp(1.1rem, 1.2vw + 0.3rem, 1.25rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 12px;
    line-height: 1.3;
}

/* ===== TEXTE ===== */
.quality__text {
    color: #4A5568;
    font-size: clamp(0.85rem, 0.9vw + 0.2rem, 0.95rem);
    line-height: 1.6;
    margin: 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--qualities {
        padding: 60px 0;
    }

    .qualities__header {
        margin-bottom: 35px;
    }

    .qualities__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .qualities__divider {
        width: 55px;
        height: 2.5px;
    }

    .qualities__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .quality__card {
        padding: 30px 22px 25px;
        border-radius: 14px;
    }

    .quality__icon {
        font-size: 2.8rem;
    }

    .quality__title {
        font-size: clamp(1rem, 1.2vw + 0.3rem, 1.1rem);
    }

    .quality__text {
        font-size: 0.9rem;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--qualities {
        padding: 40px 0;
    }

    .section--qualities::before,
    .section--qualities::after {
        width: 300px;
        height: 300px;
    }

    .qualities__header {
        margin-bottom: 25px;
    }

    .qualities__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
        letter-spacing: 1.5px;
    }

    .qualities__divider {
        width: 45px;
        height: 2px;
    }

    .qualities__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }

    .quality__card {
        padding: 22px 18px 20px;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
    }

    .quality__card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08);
    }

    .quality__icon {
        font-size: 2.4rem;
        margin-bottom: 12px;
    }

    .quality__title {
        font-size: clamp(0.95rem, 1.2vw + 0.2rem, 1rem);
        margin-bottom: 8px;
    }

    .quality__text {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .quality__card::before {
        height: 2.5px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--qualities {
        padding: 30px 0;
    }

    .section--qualities::before,
    .section--qualities::after {
        display: none;
    }

    .qualities__header {
        margin-bottom: 20px;
    }

    .qualities__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
        letter-spacing: 1px;
    }

    .qualities__divider {
        width: 40px;
        height: 2px;
    }

    .qualities__grid {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
        max-width: 380px;
        margin: 0 auto;
    }

    .quality__card {
        padding: 20px 14px 18px;
        border-radius: 12px;
    }

    .quality__card:hover {
        transform: translateY(-3px);
    }

    .quality__icon {
        font-size: 2rem;
        margin-bottom: 10px;
    }

    .quality__title {
        font-size: 0.9rem;
        margin-bottom: 6px;
    }

    .quality__text {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .quality__card::before {
        height: 2px;
    }

    .quality__card:hover .quality__icon {
        transform: scale(1.08) rotate(-3deg);
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--qualities {
        padding: 20px 0;
    }

    .qualities__title {
        font-size: 1.2rem;
    }

    .qualities__divider {
        width: 35px;
        height: 1.5px;
    }

    .qualities__grid {
        gap: 12px;
        max-width: 100%;
    }

    .quality__card {
        padding: 16px 10px 14px;
        border-radius: 10px;
    }

    .quality__icon {
        font-size: 1.6rem;
        margin-bottom: 8px;
    }

    .quality__title {
        font-size: 0.8rem;
        margin-bottom: 4px;
    }

    .quality__text {
        font-size: 0.7rem;
        line-height: 1.3;
    }

    .quality__card::before {
        height: 1.5px;
    }

    .quality__card:hover .quality__icon {
        transform: scale(1.05);
    }
}





/*============================================
   SECTION : TIMELINE + QUOTE + CTA
   ============================================ */

.section--timeline {
    padding: 80px 0;
    top: -130px; /* ⬅️ AJUSTE CETTE VALEUR POUR RÉDUIRE L'ESPACE AVEC LA SECTION PRÉCÉDENTE */
    background: radial-gradient(ellipse at 50% 30%, #fff2e9 0%, #fff2e9 40%, #ffdecc 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 0 0;
}

/* Décoration de fond */
.section--timeline::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--timeline::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--timeline .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.timeline__header {
    text-align: center;
    margin-bottom: 50px;
}

.timeline__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    color: #2E8B57;
    letter-spacing: 2px;
    margin-bottom: 0;
}

.timeline__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 15px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ============================================
   TIMELINE - ALIGNÉE À GAUCHE
   ============================================ */

.timeline__container {
    position: relative;
    padding: 20px 0 40px;
    max-width: 650px;
    margin: 0; /* ✅ ALIGNÉ À GAUCHE */
}

/* Ligne verticale */
.timeline__container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 100px;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, #FDD017, #2E8B57, #FDD017);
    border-radius: 50px;
}

/* ===== ITEM TIMELINE ===== */
.timeline__item {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    padding: 20px 0;
    position: relative;
    opacity: 0;
    transform: translateX(-20px);
    animation: timelineFadeIn 0.6s ease forwards;
}

.timeline__item:nth-child(1) { animation-delay: 0.1s; }
.timeline__item:nth-child(2) { animation-delay: 0.3s; }
.timeline__item:nth-child(3) { animation-delay: 0.5s; }
.timeline__item:nth-child(4) { animation-delay: 0.7s; }

@keyframes timelineFadeIn {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* ===== ANNÉE ===== */
.timeline__year {
    flex: 0 0 80px;
    font-size: 1.4rem;
    font-weight: 700;
    color: #FDD017;
    text-align: right;
    padding-right: 20px;
    letter-spacing: 0.5px;
}

/* ===== POINT ===== */
.timeline__dot {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #FDD017;
    border: 3px solid #FFFFFF;
    box-shadow: 0 0 0 2px #FDD017, 0 4px 15px rgba(253, 208, 23, 0.30);
    position: relative;
    z-index: 2;
    margin-top: 5px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.timeline__item:hover .timeline__dot {
    transform: scale(1.3);
    box-shadow: 0 0 0 4px rgba(253, 208, 23, 0.20), 0 4px 20px rgba(253, 208, 23, 0.40);
}

/* ===== CONTENU ===== */
.timeline__content {
    flex: 1;
    font-size: clamp(0.95rem, 1vw + 0.2rem, 1.05rem);
    line-height: 1.7;
    color: #4A5568;
    padding: 5px 0 5px 10px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.timeline__item:hover .timeline__content {
    color: #2C2C2C;
}

/* ============================================
   CITATION
   ============================================ */

.timeline__quote {
    max-width: 450px;
    margin: -420px auto 130px;
    padding: 40px 50px 35px;
    background: rgba(255, 255, 255, 0.70);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 20px;
    border: 1px solid rgba(253, 208, 23, 0.08);
    text-align: center;
    position: relative;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.timeline__quote {
    left: 30%;
    
}

.timeline__quote:hover {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
    transform: translateY(-3px);
}

.timeline__quote-icon {
    font-size: 5rem;
    color: rgba(253, 208, 23, 0.12);
    font-family: Georgia, serif;
    line-height: 1;
    margin-bottom: -20px;
}

.timeline__quote-text {
    font-size: clamp(1.1rem, 1.3vw + 0.5rem, 1.4rem);
    font-style: italic;
    line-height: 1.8;
    color: #2C2C2C;
    margin-bottom: 20px;
}

.timeline__quote-author {
    color: #FDD017;
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.5px;
}

/* ============================================
   BOUTON CTA
   ============================================ */

.timeline__cta {
    text-align: center;
    margin-top: 20px;
}

.timeline__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.30);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.timeline__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--timeline {
        margin-top: 26%;
        padding: 60px 0;
    }

    .timeline__header {
        margin-bottom: 35px;
    }

    .timeline__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .timeline__divider {
        width: 55px;
        height: 2.5px;
    }

    .timeline__container::before {
        left: 80px;
    }

    .timeline__year {
        flex: 0 0 65px;
        font-size: 1.2rem;
    }

    .timeline__content {
        font-size: 0.95rem;
    }

    .timeline__quote {
        padding: 30px 35px 28px;
        border-radius: 16px;
        margin: 40px auto 30px !important;
        left: 0%;
    }

  

    .timeline__quote-text {
        font-size: clamp(1rem, 1.2vw + 0.4rem, 1.2rem);
    }

    .timeline__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--timeline {
        margin-top: 20%;
        padding: 40px 0;
    }

    .section--timeline::before,
    .section--timeline::after {
        width: 300px;
        height: 300px;
    }

    .timeline__header {
        margin-bottom: 25px;
    }

    .timeline__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2.2rem);
        letter-spacing: 1.5px;
    }

    .timeline__divider {
        width: 45px;
        height: 2px;
    }

    .timeline__container {
        padding: 10px 0 30px;
    }

    .timeline__container::before {
        left: 60px;
    }

    .timeline__item {
        gap: 20px;
        padding: 15px 0;
    }

    .timeline__year {
        flex: 0 0 50px;
        font-size: 1rem;
        padding-right: 10px;
    }

    .timeline__dot {
        flex: 0 0 14px;
        width: 14px;
        height: 14px;
        border-width: 2px;
        margin-top: 3px;
    }

    .timeline__content {
        font-size: 0.9rem;
        line-height: 1.5;
        padding: 3px 0 3px 8px;
    }

    .timeline__quote {
        padding: 25px 20px 22px;
        border-radius: 14px;
        margin: 15px auto 25px;
        backdrop-filter: blur(4px);
    }

    .timeline__quote-icon {
        font-size: 3.5rem;
        margin-bottom: -15px;
    }

    .timeline__quote-text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 15px;
    }

    .timeline__quote-author {
        font-size: 0.9rem;
    }

    .timeline__btn {
        padding: 10px 28px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--timeline {
        padding: 30px 0;
    }

    .section--timeline::before,
    .section--timeline::after {
        display: none;
    }

    .timeline__header {
        margin-bottom: 20px;
    }

    .timeline__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
        letter-spacing: 1px;
    }

    .timeline__divider {
        width: 40px;
        height: 2px;
    }

    .timeline__container::before {
        left: 45px;
    }

    .timeline__item {
        gap: 15px;
        padding: 12px 0;
    }

    .timeline__year {
        flex: 0 0 38px;
        font-size: 0.85rem;
        padding-right: 8px;
    }

    .timeline__dot {
        flex: 0 0 12px;
        width: 12px;
        height: 12px;
        border-width: 2px;
        margin-top: 2px;
    }

    .timeline__content {
        font-size: 0.85rem;
        line-height: 1.4;
        padding: 2px 0 2px 6px;
    }

    .timeline__quote {
        padding: 20px 16px 18px;
        border-radius: 12px;
        margin: 10px auto 20px;
    }

    .timeline__quote-icon {
        font-size: 2.8rem;
        margin-bottom: -12px;
    }

    .timeline__quote-text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .timeline__quote-author {
        font-size: 0.8rem;
    }

    .timeline__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--timeline {
        padding: 20px 0;
    }

    .timeline__title {
        font-size: 1.2rem;
    }

    .timeline__divider {
        width: 35px;
        height: 1.5px;
    }

    .timeline__container::before {
        left: 35px;
    }

    .timeline__item {
        gap: 12px;
        padding: 10px 0;
    }

    .timeline__year {
        flex: 0 0 30px;
        font-size: 0.75rem;
        padding-right: 5px;
    }

    .timeline__dot {
        flex: 0 0 10px;
        width: 10px;
        height: 10px;
        border-width: 1.5px;
        margin-top: 1px;
    }

    .timeline__content {
        font-size: 0.8rem;
        line-height: 1.3;
        padding: 2px 0 2px 5px;
    }

    .timeline__quote {
        padding: 16px 12px 14px;
        border-radius: 10px;
    }

    .timeline__quote-icon {
        font-size: 2.2rem;
        margin-bottom: -10px;
    }

    .timeline__quote-text {
        font-size: 0.8rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .timeline__quote-author {
        font-size: 0.7rem;
    }

    .timeline__btn {
        padding: 8px 18px;
        font-size: 11px;
    }
}






/* ============================================
   HERO - CONTACT US PAGE
   ============================================ */

.hero--contact {    
    position: relative;
    margin-top: -17%;
    padding: 240px 0 260px !important;
    margin-bottom: -10px;
    background-size: 100% 74%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 750px !important;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}



/* ✅ IMAGE VIA PSEUDO-ÉLÉMENT (avec margin-top) */
.hero--contact::before {
    content: '';
    position: absolute;
    bottom: 40px;
    left: 0;
    width: 100%;
    height: 100%; /* ⬅️ MÊME HAUTEUR QUE L'OVERLAY */
    background-image: url('/Laboanglais/le-site/mes-images/contact-us/contact-us.png');
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
    /* ✅ AJUSTE ICI POUR REMONTER L'IMAGE */
    margin-top: -120px !important; /* ⬅️ Négatif = remonte */
}

/* Overlay */
.hero--contact .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 95%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--contact .hero__container {
    
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--contact .hero__content--center {
    top: 60px;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== TITRE ===== */
.hero--contact .hero__title--contact {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--contact .hero__divider--contact {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--contact .hero__subtitle--contact {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--contact {
        min-height: 290px;
        padding: 100px 0 140px;
        background-size: 110% 60%;
        border-radius: 0 0 25px 25px;
    }

    .hero--contact .hero__overlay {
        height: 60%;
        border-radius: 0 0 25px 25px;
    }

    .hero--contact .hero__content--center {
        padding: 40px 40px;
        border-radius: 16px;
    }

    .hero--contact .hero__title--contact {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--contact {
        min-height: 280px;
        padding: 80px 0 120px;
        background-size: 130% 55%;
        background-position: top 20% center;
        border-radius: 0 0 20px 20px;
    }

    .hero--contact .hero__overlay {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--contact .hero__content--center {
        padding: 35px 30px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--contact .hero__title--contact {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--contact .hero__subtitle--contact {
        font-size: 1rem;
    }

    .hero--contact .hero__divider--contact {
        width: 55px;
        height: 2.5px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--contact {
        min-height: 270px !important;
        padding: 90px 0 100px !important;
        background-size: 160% 50%;
        background-position: top 25% center;
        border-radius: 0 0 16px 16px;
    }

    .hero--contact::before {
        margin-top: 120px !important;
        
        margin-bottom: 40px;
    }

    .hero--contact .hero__overlay {
        height: 77.5% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    


    .hero--contact .hero__content--center {
        
        padding: 28px 22px; 
        margin-top: 30px;      
        border-radius: 12px;
        left: -13%;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--contact .hero__title--contact {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-top: 95px;
    }

    .hero--contact .hero__subtitle--contact {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--contact .hero__divider--contact {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--contact {
        min-height: 320px;
        padding: 40px 0 70px;
        background-size: 200% 45%;
        background-position: top 30% center;
        border-radius: 0 0 12px 12px;
    }

    .hero--contact .hero__overlay {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--contact .hero__content--center {
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--contact .hero__title--contact {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--contact .hero__subtitle--contact {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--contact .hero__divider--contact {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--contact {
        min-height: 280px;
        padding: 30px 0 60px;
        background-size: 220% 40%;
        background-position: top 35% center;
        border-radius: 0 0 10px 10px;
    }

    .hero--contact .hero__overlay {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--contact .hero__content--center {
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--contact .hero__title--contact {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--contact .hero__subtitle--contact {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--contact .hero__divider--contact {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }
}






/* ============================================
   SECTION : CONTACT FORM
   ============================================ */

.section--contact-form {
    padding: 80px 0;
    background: linear-gradient(180deg, #F8F6F0 0%, #FFFCF5 100%);
    position: relative;
    overflow: hidden;
    top: -29px;
    
}

/* Décoration de fond */
.section--contact-form::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--contact-form::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--contact-form .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== WRAPPER ===== */
.contact__wrapper {
    display: flex;
    gap: 40px;
    align-items: stretch;
}

/* ============================================
   FORMULAIRE (GAUCHE)
   ============================================ */

.contact__form {
    flex: 2;
    min-width: 300px;
}

.contact__form-bg {
    background-size: cover;
    background-position: center;
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
    position: relative;
}

.contact__form-glass {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    padding: 40px 35px 35px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    height: 100%;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.contact__form-glass:hover {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(6px);
}

/* ===== TITRE ===== */
.contact__form-title {
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    color: #2E8B57;
    text-align: center;
    margin-bottom: 30px;
    letter-spacing: 1px;
    position: relative;
}

.contact__form-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 0;
    border-radius: 50px;
}

/* ===== CHAMPS ===== */
.contact__field {
    margin-bottom: 20px;
}

.contact__row {
    display: flex;
    gap: 20px;
}

.contact__field--half {
    flex: 1;
}

.contact__label {
    display: block;
    font-weight: 600;
    font-size: 14px;
    color: #2C2C2C;
    margin-bottom: 6px;
}

.contact__input {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    font-size: 15px;
    font-family: 'Montserrat', sans-serif;
    background: rgba(255, 255, 255, 0.80);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    color: #2C2C2C;
}

.contact__input:focus {
    border-color: #FDD017;
    box-shadow: 0 0 0 4px rgba(253, 208, 23, 0.12);
    outline: none;
    background: #FFFFFF;
}

.contact__input:hover {
    border-color: rgba(253, 208, 23, 0.30);
}

.contact__select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%232C2C2C' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    cursor: pointer;
}

.contact__textarea {
    resize: vertical;
    min-height: 120px;
}

/* ============================================
   CHECKBOX
   ============================================ */

.contact__checkbox {
    margin-bottom: 28px;
}

.contact__checkbox label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
    color: #4A5568;
}

.contact__checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #FDD017;
    border-radius: 4px;
    flex-shrink: 0;
}

.contact__checkbox a {
    color: #2E8B57;
    text-decoration: underline;
    transition: color 0.3s ease;
}

.contact__checkbox a:hover {
    color: #FDD017;
}

/* ============================================
   BOUTON
   ============================================ */

.contact__submit {
    text-align: center;
}

.contact__btn {
    display: inline-block;
    padding: 16px 50px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    border: none;
    box-shadow: 0 4px 25px rgba(253, 208, 23, 0.30);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.contact__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   CONTACT INFO + MAP (DROITE)
   ============================================ */

.contact__info {
    flex: 1.2;
    min-width: 250px;
    background: rgba(255, 255, 255, 0.80);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 20px;
    padding: 35px 30px 30px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.contact__info:hover {
    box-shadow: 0 12px 45px rgba(0, 0, 0, 0.06);
    transform: translateY(-3px);
}

.contact__info-block {
    margin-bottom: 22px;
}

.contact__info-block:last-of-type {
    margin-bottom: 20px;
}

.contact__info-title {
    font-size: 15px;
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 8px;
}

.contact__info-text {
    font-size: 14px;
    line-height: 1.7;
    color: #4A5568;
    margin: 0;
}

.contact__info-link {
    color: #2E8B57;
    text-decoration: none;
    border-bottom: 1px dotted #2E8B57;
    transition: all 0.3s ease;
}

.contact__info-link:hover {
    color: #FDD017;
    border-bottom-color: #FDD017;
}

/* ===== MAP ===== */
.contact__map {
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    margin-top: auto;
    flex-shrink: 0;
}

.contact__map:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    transform: scale(1.01);
}

.contact__map iframe {
    width: 100%;
    height: 200px;
    border: 0;
    display: block;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--contact-form {
        padding: 60px 0;
    }

    .contact__wrapper {
        flex-direction: column;
        gap: 30px;
    }

    .contact__form {
        flex: 1 1 auto;
    }

    .contact__form-glass {
        padding: 35px 28px 30px;
        border-radius: 16px;
    }

    .contact__form-title {
        font-size: clamp(1.6rem, 2.5vw + 1rem, 2.2rem);
    }

    .contact__info {
        flex: 1 1 auto;
        padding: 30px 25px 25px;
        border-radius: 16px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 20px;
    }

    /* Address - colonne gauche, ligne 1 */
    .contact__info-block:first-child {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        margin-bottom: 0;
    }

    /* Phone - colonne droite, ligne 1 */
    .contact__info-block:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        margin-bottom: 0;
        text-align: right;
    }

    /* Email - colonne gauche, ligne 2 (en dessous d'Address) */
    .contact__info-block:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        margin-bottom: 0;
    }

    /* Map - colonne droite, ligne 2 (en dessous de Phone) */
    .contact__map {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        margin-top: 0;
    }

    .contact__map iframe {
        height: 120px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--contact-form {
        padding: 40px 0;
        top: -70px !important;
        margin-bottom: -70px;
    }

    .section--contact-form::before,
    .section--contact-form::after {
        width: 300px;
        height: 300px;
    }

    .contact__wrapper {
        gap: 25px;
    }

    .contact__form-glass {
        padding: 28px 20px 25px;
        border-radius: 14px;
        backdrop-filter: blur(3px);
    }

    .contact__form-title {
        font-size: 1.6rem;
        margin-bottom: 20px;
    }

    .contact__form-title::after {
        width: 45px;
        height: 2.5px;
        margin-top: 10px;
    }

    .contact__row {
        flex-direction: column;
        gap: 0;
    }

    .contact__field--half {
        flex: 1 1 auto;
    }

    .contact__input {
        padding: 12px 16px;
        font-size: 14px;
        border-radius: 10px;
    }

    .contact__btn {
        padding: 14px 35px;
        font-size: 14px;
    }

    .contact__info {
        padding: 25px 20px 20px;
        border-radius: 14px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 15px 20px;
    }

    /* Address - colonne gauche, ligne 1 */
    .contact__info-block:first-child {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        margin-bottom: 0;
    }

    /* Phone - colonne droite, ligne 1 */
    .contact__info-block:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        margin-bottom: 0;
        text-align: right;
    }

    /* Email - colonne gauche, ligne 2 (en dessous d'Address) */
    .contact__info-block:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        margin-bottom: 0;
    }

    /* Map - colonne droite, ligne 2 (en dessous de Phone) */
    .contact__map {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        margin-top: 0;
    }

    .contact__map iframe {
        height: 120px;
    }

    .contact__checkbox label {
        font-size: 13px;
        align-items: flex-start;
    }

    .contact__checkbox input[type="checkbox"] {
        margin-top: 2px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--contact-form {
        padding: 30px 0;
    }

    .section--contact-form::before,
    .section--contact-form::after {
        display: none;
    }

    .contact__form-glass {
        padding: 22px 16px 20px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.85);
        backdrop-filter: blur(2px);
    }

    .contact__form-title {
        font-size: 1.3rem;
        margin-bottom: 18px;
    }

    .contact__form-title::after {
        width: 40px;
        height: 2px;
    }

    .contact__input {
        padding: 11px 14px;
        font-size: 13px;
        border-radius: 8px;
    }

    .contact__label {
        font-size: 13px;
    }

    .contact__textarea {
        min-height: 100px;
    }

    .contact__btn {
        padding: 12px 28px;
        font-size: 13px;
        letter-spacing: 1px;
    }

    .contact__info {
        padding: 20px 16px 16px;
        border-radius: 12px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 12px 16px;
    }

    /* Address - colonne gauche, ligne 1 */
    .contact__info-block:first-child {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        margin-bottom: 0;
    }

    /* Phone - colonne droite, ligne 1 */
    .contact__info-block:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        margin-bottom: 0;
        text-align: right;
    }

    /* Email - colonne gauche, ligne 2 (en dessous d'Address) */
    .contact__info-block:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        margin-bottom: 0;
    }

    /* Map - colonne droite, ligne 2 (en dessous de Phone) */
    .contact__map {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        margin-top: 0;
    }

    .contact__map iframe {
        height: 100px;
    }

    .contact__info-title {
        font-size: 14px;
    }

    .contact__info-text {
        font-size: 13px;
    }

    .contact__checkbox label {
        font-size: 12px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--contact-form {
        padding: 20px 0;
    }

    .contact__form-glass {
        padding: 18px 12px 16px;
        border-radius: 10px;
    }

    .contact__form-title {
        font-size: 1.1rem;
        margin-bottom: 15px;
    }

    .contact__form-title::after {
        width: 35px;
        height: 1.5px;
    }

    .contact__input {
        padding: 10px 12px;
        font-size: 12px;
        border-radius: 6px;
    }

    .contact__btn {
        padding: 10px 22px;
        font-size: 12px;
    }

    .contact__info {
        padding: 16px 12px 14px;
        border-radius: 10px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 10px 12px;
    }

    /* Address - colonne gauche, ligne 1 */
    .contact__info-block:first-child {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        margin-bottom: 0;
    }

    /* Phone - colonne droite, ligne 1 */
    .contact__info-block:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        margin-bottom: 0;
        text-align: right;
    }

    /* Email - colonne gauche, ligne 2 (en dessous d'Address) */
    .contact__info-block:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        margin-bottom: 0;
    }

    /* Map - colonne droite, ligne 2 (en dessous de Phone) */
    .contact__map {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        margin-top: 0;
    }

    .contact__map iframe {
        height: 90px;
    }

    .contact__info-title {
        font-size: 13px;
    }

    .contact__info-text {
        font-size: 12px;
    }
}



/* ============================================
   SECTION : CTA FINALE STYLÉE
   ============================================ */

.section--cta-final {
    padding: 70px 0 80px;
    background: linear-gradient(135deg, #0A0A0A 0%, #1A1208 30%, #0A0A0A 70%, #1A0E05 100%);
    margin-bottom: 150px;
    position: relative;
    overflow: hidden;
    text-align: center;
    border-top: 2px solid rgba(253, 208, 23, 0.06);
    border-bottom: 2px solid rgba(253, 208, 23, 0.06);
}

/* ===== DÉCORATION DE FOND ===== */

/* Grand cercle doré flou */
.section--cta-final::before {
    content: '';
    position: absolute;
    top: -200px;
    left: -100px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.06) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: ctaGlow 8s ease-in-out infinite alternate;
}

/* Grand cercle vert flou */
.section--cta-final::after {
    content: '';
    position: absolute;
    bottom: -200px;
    right: -100px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.06) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: ctaGlow 8s ease-in-out infinite alternate-reverse;
}

@keyframes ctaGlow {
    0% { transform: scale(1) rotate(0deg); }
    100% { transform: scale(1.1) rotate(10deg); }
}

/* Petites étoiles décoratives */
.section--cta-final .container-reg::before {
    content: '✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦';
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 10px;
    letter-spacing: 15px;
    color: rgba(253, 208, 23, 0.04);
    z-index: 0;
    pointer-events: none;
    white-space: nowrap;
}

.section--cta-final .container-reg::after {
    content: '✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦ ✦';
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 10px;
    letter-spacing: 15px;
    color: rgba(253, 208, 23, 0.04);
    z-index: 0;
    pointer-events: none;
    white-space: nowrap;
}

.section--cta-final .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== CONTENU ===== */
.cta-final__content {
    max-width: 750px;
    margin: 0 auto;
    position: relative;
    padding: 0 20px;
}

/* ===== ORNEMENTS ===== */
.cta-final__ornament-top {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 25px;
}

.cta-final__ornament-bottom {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 35px;
}

.cta-final__ornament-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.15);
    display: inline-block;
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.cta-final__ornament-dot:nth-child(1) { animation: dotPulse 2.5s ease-in-out infinite 0s; }
.cta-final__ornament-dot:nth-child(2) { animation: dotPulse 2.5s ease-in-out infinite 0.5s; }
.cta-final__ornament-dot:nth-child(3) { animation: dotPulse 2.5s ease-in-out infinite 1s; }

@keyframes dotPulse {
    0%, 100% { opacity: 0.15; transform: scale(1); }
    50% { opacity: 0.60; transform: scale(1.5); background: #FDD017; }
}

/* ===== BADGE ===== */
.cta-final__badge {
    display: inline-block;
    color: #FDD017;
    font-size: 13px;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-weight: 600;
    padding: 6px 20px;
    border: 1px solid rgba(253, 208, 23, 0.10);
    border-radius: 50px;
    margin-bottom: 20px;
    background: rgba(253, 208, 23, 0.04);
    backdrop-filter: blur(4px);
    transition: all 0.4s ease;
}

.cta-final__badge:hover {
    background: rgba(253, 208, 23, 0.08);
    border-color: rgba(253, 208, 23, 0.20);
    transform: translateY(-2px);
}

/* ===== TITRE ===== */
.cta-final__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.8rem);
    font-weight: 800;
    color: #FFFFFF;
    margin-bottom: 12px;
    line-height: 1.1;
    letter-spacing: -1px;
}

.cta-final__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    position: relative;
}

.cta-final__title span::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #FDD017, transparent);
    border-radius: 50px;
    opacity: 0.30;
}

/* ===== LIGNE DÉCORATIVE ===== */
.cta-final__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57, #FDD017);
    margin: 18px auto 20px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.10);
    background-size: 200% 100%;
    animation: dividerShine 3s ease-in-out infinite;
}

@keyframes dividerShine {
    0%, 100% { background-position: -200% 0; }
    50% { background-position: 200% 0; }
}

/* ===== TEXTE ===== */
.cta-final__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.2rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.65);
    margin-bottom: 35px;
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 300;
    letter-spacing: 0.3px;
}

/* ===== BOUTON AVEC ICÔNE ===== */
.cta-final__btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

/* Effet de brillance sur le bouton */
.cta-final__btn::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.30) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.6s ease;
    transform: scale(0.5);
    pointer-events: none;
}

.cta-final__btn:hover::before {
    opacity: 1;
    transform: scale(1);
}

.cta-final__btn:hover {
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 12px 50px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

.cta-final__btn:active {
    transform: translateY(0px) scale(0.97);
}

.cta-final__btn-icon {
    width: 20px;
    height: 20px;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    flex-shrink: 0;
}

.cta-final__btn:hover .cta-final__btn-icon {
    transform: translateX(6px);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--cta-final {
        padding: 40px 0 50px;
    }

    .section--cta-final::before {
        width: 400px;
        height: 400px;
        top: -150px;
        left: -80px;
    }

    .section--cta-final::after {
        width: 400px;
        height: 400px;
        bottom: -150px;
        right: -80px;
    }

    .cta-final__title {
        font-size: clamp(1.8rem, 3vw + 1rem, 3rem);
    }

    .cta-final__btn {
        padding: 14px 35px;
        font-size: 14px;
    }

    .cta-final__ornament-top {
        gap: 10px;
        margin-bottom: 20px;
    }

    .cta-final__ornament-bottom {
        gap: 10px;
        margin-top: 30px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--cta-final {
        padding: 30px 0 30px;
    }

    .section--cta-final::before,
    .section--cta-final::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .section--cta-final .container-reg::before,
    .section--cta-final .container-reg::after {
        font-size: 8px;
        letter-spacing: 10px;
    }

    .cta-final__ornament-top {
        gap: 8px;
        margin-bottom: 18px;
    }

    .cta-final__ornament-bottom {
        gap: 8px;
        margin-top: 25px;
    }

    .cta-final__ornament-dot {
        width: 5px;
        height: 5px;
    }

    .cta-final__badge {
        font-size: 11px;
        letter-spacing: 2px;
        padding: 5px 16px;
        margin-bottom: 15px;
    }

    .cta-final__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2.2rem);
        margin-bottom: 10px;
    }

    .cta-final__title span::after {
        bottom: -3px;
        height: 1.5px;
    }

    .cta-final__divider {
        width: 55px;
        height: 2.5px;
        margin: 15px auto 18px;
    }

    .cta-final__text {
        font-size: 0.95rem;
        line-height: 1.6;
        padding: 0 10px;
        margin-bottom: 28px;
    }

    .cta-final__btn {
        padding: 12px 30px;
        font-size: 13px;
        gap: 10px;
    }

    .cta-final__btn-icon {
        width: 18px;
        height: 18px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--cta-final {
        padding: 20px 0 30px;
    }

    .section--cta-final::before,
    .section--cta-final::after {
        display: none;
    }

    .section--cta-final .container-reg::before,
    .section--cta-final .container-reg::after {
        font-size: 6px;
        letter-spacing: 8px;
    }

    .cta-final__ornament-top {
        gap: 6px;
        margin-bottom: 15px;
    }

    .cta-final__ornament-bottom {
        gap: 6px;
        margin-top: 20px;
    }

    .cta-final__ornament-dot {
        width: 4px;
        height: 4px;
    }

    .cta-final__badge {
        font-size: 10px;
        letter-spacing: 1.5px;
        padding: 4px 14px;
        margin-bottom: 12px;
    }

    .cta-final__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.8rem);
    }

    .cta-final__title span::after {
        display: none;
    }

    .cta-final__divider {
        width: 45px;
        height: 2px;
        margin: 12px auto 15px;
    }

    .cta-final__text {
        font-size: 0.9rem;
        line-height: 1.5;
        padding: 0 5px;
        margin-bottom: 22px;
    }

    .cta-final__btn {
        padding: 10px 24px;
        font-size: 12px;
        gap: 8px;
        letter-spacing: 1px;
    }

    .cta-final__btn-icon {
        width: 16px;
        height: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--cta-final {
        padding: 10px 0 20px;
    }

    .section--cta-final .container-reg::before,
    .section--cta-final .container-reg::after {
        font-size: 5px;
        letter-spacing: 5px;
    }

    .cta-final__title {
        font-size: 1.2rem;
    }

    .cta-final__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 18px;
    }

    .cta-final__btn {
        padding: 8px 20px;
        font-size: 11px;
        gap: 6px;
    }

    .cta-final__btn-icon {
        width: 14px;
        height: 14px;
    }

    .cta-final__badge {
        font-size: 9px;
        letter-spacing: 1px;
        padding: 3px 10px;
    }

    .cta-final__ornament-top,
    .cta-final__ornament-bottom {
        gap: 5px;
    }

    .cta-final__ornament-dot {
        width: 3px;
        height: 3px;
    }
}






/* ============================================
   HERO - ANCESTRAL HEALING
   ============================================ */

.hero--ancestral {
    margin-top: -50px;
    position: relative;
    padding: 100px 0 8%;
    background-size: 100% 100%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--ancestral .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--ancestral .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--ancestral .hero__content--center {
    top: 70px !important;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--ancestral .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--ancestral .hero__title--ancestral {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--ancestral .hero__divider--ancestral {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--ancestral .hero__subtitle--ancestral {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--ancestral {
        margin-top: 0%;
        min-height: 500px;
        padding: 80px 0 120px;
        background-size: 110% 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--ancestral .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--ancestral .hero__content--center {
        top: 10px !important;
        padding: 40px 40px !important;
        border-radius: 16px;
    }

    .hero--ancestral .hero__title--ancestral {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--ancestral {
        margin-top: 0%;
        min-height: 450px;
        padding: 10px 0 20px !important;
        background-size: 130% 55%;
        background-position: top 20% center;
        border-radius: 0 0 20px 20px;
    }

    .hero--ancestral .hero__overlay {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--ancestral .hero__content--center {
        margin-top: 90px !important;
        padding: 35px 30px;
        left: -12%;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--ancestral .hero__title--ancestral {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--ancestral .hero__subtitle--ancestral {
        font-size: 1rem;
    }

    .hero--ancestral .hero__divider--ancestral {
        width: 55px;
        height: 2.5px;
    }

    .hero--ancestral .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--ancestral {
        margin-top: -10%;
        min-height: 380px;   
        padding: 0px 0 10px !important;
        background-size: 160% 45%;
        background-position: top 15% center;
        border-radius: 0 0 16px 16px;
    }

    .hero--ancestral .hero__overlay {
        padding: 58px 22px !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--ancestral .hero__content--center {
        padding: 58px 22px !important;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
        margin-top: 70px;
    }

    .hero--ancestral .hero__title--ancestral {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-bottom: 15px;
    }

    .hero--ancestral .hero__subtitle--ancestral {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--ancestral .hero__divider--ancestral {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--ancestral .hero__label {
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-bottom: 8px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--ancestral {
        min-height: 320px;
        padding: 30px 0 60px;
        background-size: 200% 40%;
        background-position: top 30% center;
        border-radius: 0 0 12px 12px;
    }

    .hero--ancestral .hero__overlay {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--ancestral .hero__content--center {
        top: 79px !important;
        top: -60px !important;
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--ancestral .hero__title--ancestral {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--ancestral .hero__subtitle--ancestral {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--ancestral .hero__divider--ancestral {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--ancestral .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--ancestral {
        min-height: 280px;
        padding: 20px 0 50px;
        background-size: 220% 35%;
        background-position: top 35% center;
        border-radius: 0 0 10px 10px;
    }

    .hero--ancestral .hero__overlay {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--ancestral .hero__content--center {
        top: -50px !important;
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--ancestral .hero__title--ancestral {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--ancestral .hero__subtitle--ancestral {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--ancestral .hero__divider--ancestral {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--ancestral .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
    }
}



/* ============================================
   SECTION : WHO I SERVE
   ============================================ */

.section--serve {
    padding: 70px 0 80px;
    background: linear-gradient(180deg, #FFFCF5 0%, #F8F6F0 100%);
    position: relative;
    overflow: hidden;
}

/* Décoration de fond */
.section--serve::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.serve__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
}

/* ===== LISTE ===== */
.serve__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.serve__list li {
    position: relative;
    padding: 10px 0 10px 32px;
    font-size: clamp(0.95rem, 1vw + 0.3rem, 1.05rem);
    line-height: 1.6;
    color: #4A5568;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.3s ease;
}

.serve__list li:last-child {
    border-bottom: none;
}

.serve__list li::before {
    content: '✦';
    position: absolute;
    left: 0;
    top: 10px;
    color: #FDD017;
    font-size: 14px;
    transition: all 0.3s ease;
}

.serve__list li:hover {
    color: #2E8B57;
    padding-left: 38px;
}

.serve__list li:hover::before {
    color: #2E8B57;
    transform: scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve__card {
    background: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.10);
    transform: translateY(-5px);
}

.serve__image-wrapper {
    overflow: hidden;
}

.serve__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve__card:hover .serve__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve {
        padding: 60px 0 70px;
    }

    .serve__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve__divider {
        margin: 12px auto 25px;
    }

    .serve__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve {
        padding: 40px 0 50px;
    }

    .section--serve::before,
    .section--serve::after {
        width: 300px;
        height: 300px;
    }

    .serve__grid {
        gap: 30px;
    }

    .serve__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve__list li {
        padding: 8px 0 8px 30px;
        font-size: 0.9rem;
    }

    .serve__list li::before {
        top: 8px;
        font-size: 12px;
    }

    .serve__right {
        max-width: 100%;
    }

    .serve__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve {
        padding: 30px 0 40px;
    }

    .section--serve::before,
    .section--serve::after {
        display: none;
    }

    .serve__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve__divider {
        width: 40px;
        height: 2px;
    }

    .serve__list {
        max-width: 100%;
    }

    .serve__list li {
        padding: 7px 0 7px 26px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve__list li::before {
        top: 7px;
        font-size: 11px;
    }

    .serve__list li:hover {
        padding-left: 30px;
    }

    .serve__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve {
        padding: 20px 0 30px;
    }

    .serve__title {
        font-size: 1.2rem;
    }

    .serve__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve__list li {
        padding: 6px 0 6px 22px;
        font-size: 0.8rem;
    }

    .serve__list li::before {
        top: 6px;
        font-size: 10px;
    }

    .serve__list li:hover {
        padding-left: 26px;
    }

    .serve__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve__card {
        border-radius: 14px;
    }
}



/* ============================================
   SECTION : FIND YOUR PATH BELOW (ACCORDÉON)
   ============================================ */

.section--accordion {
    padding: 70px 0 80px;
    background: linear-gradient(180deg, #FFFCF5 0%, #F8F6F0 100%);
    position: relative;
    overflow: hidden;
}

/* Décoration de fond */
.section--accordion::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--accordion::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--accordion .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.accordion__header {
    text-align: center;
    margin-bottom: 50px;
}

.accordion__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.accordion__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 0;
    border-radius: 50px;
}

/* ===== ACCORDÉON ===== */
.accordion__container {
    max-width: 850px;
    margin: 0 auto;
}

/* ===== ITEM ===== */
.accordion__item {
    background: #FFFFFF;
    border-radius: 12px;
    margin-bottom: 12px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.accordion__item:hover {
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
}

.accordion__item.active {
    box-shadow: 0 6px 35px rgba(0, 0, 0, 0.08);
}

/* ===== TRIGGER (titre de l'item) ===== */
.accordion__trigger {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 24px;
    cursor: pointer;
    transition: all 0.3s ease;
    user-select: none;
}

.accordion__trigger:hover {
    background: rgba(253, 208, 23, 0.04);
}

.accordion__item.active .accordion__trigger {
    background: rgba(253, 208, 23, 0.06);
    border-bottom: 1px solid rgba(253, 208, 23, 0.08);
}

/* Icône ▶ */
.accordion__icon {
    font-size: 12px;
    color: #FDD017;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.accordion__item.active .accordion__icon {
    transform: rotate(90deg);
}

/* Label */
.accordion__label {
    flex: 1;
    font-size: clamp(0.95rem, 1vw + 0.3rem, 1.05rem);
    font-weight: 600;
    color: #2C2C2C;
}

.accordion__item.active .accordion__label {
    color: #2E8B57;
}

/* Flèche ▼ */
.accordion__arrow {
    font-size: 12px;
    color: #999;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    flex-shrink: 0;
}

.accordion__item.active .accordion__arrow {
    transform: rotate(180deg);
    color: #FDD017;
}

/* ===== CONTENU (caché par défaut) ===== */
.accordion__content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.accordion__item.active .accordion__content {
    max-height: 900px;
}

.accordion__content-inner {
    padding: 25px 28px 30px;
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

/* ===== IMAGE ===== */
.accordion__image {
    flex: 0 0 180px;
    max-width: 180px;
}

.accordion__image img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    transition: transform 0.4s ease;
}

.accordion__item.active .accordion__image img {
    transform: scale(1.02);
}

/* ===== TEXTE ===== */
.accordion__text {
    flex: 1;
}

.accordion__text p {
    font-size: clamp(0.9rem, 0.9vw + 0.2rem, 0.95rem);
    line-height: 1.7;
    color: #4A5568;
    margin-bottom: 12px;
}

.accordion__text p:last-of-type {
    margin-bottom: 16px;
}

.accordion__text strong {
    color: #2E8B57;
}

/* ===== BOUTON ===== */
.accordion__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.85rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.accordion__btn:hover {
    color: #2E8B57;
    border-bottom-color: #2E8B57;
}

/* ============================================
   CTA : YOU ARE NOT ALONE
   ============================================ */

.accordion__cta {
    margin-top: 10% !important;
    margin-bottom: 22%;
    padding: 40px 45px;
    background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 100%);
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(253, 208, 23, 0.05);
}

.accordion__cta-title {
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.accordion__cta-divider {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 18px;
    border-radius: 50px;
}

.accordion__cta-text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    max-width: 600px;
    margin: 0 auto;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--accordion {
        padding: 60px 0 70px;
        bottom: 40px;
    }

    .accordion__header {
        margin-bottom: 35px;
    }

    .accordion__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .accordion__content-inner {
        flex-direction: column;
        gap: 20px;
        padding: 20px 22px 25px;
    }

    .accordion__image {
        flex: 0 0 auto;
        max-width: 100%;
    }

    .accordion__image img {
        height: 200px;
        width: 100%;
    }

    .accordion__cta {
        padding: 30px 25px;
        margin-top: 40px;
    }

    .accordion__cta-title {
        font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.2rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--accordion {
        padding: 40px 0 50px;
        bottom: 30px;
    }

    .section--accordion::before,
    .section--accordion::after {
        width: 300px;
        height: 300px;
    }

    .accordion__header {
        margin-bottom: 25px;
    }

    .accordion__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .accordion__divider {
        width: 50px;
        height: 2.5px;
    }

    .accordion__trigger {
        padding: 14px 18px;
        gap: 10px;
    }

    .accordion__label {
        font-size: 0.9rem;
    }

    .accordion__icon,
    .accordion__arrow {
        font-size: 10px;
    }

    .accordion__content-inner {
        padding: 16px 16px 20px;
        gap: 15px;
    }

    .accordion__image img {
        height: 160px;
    }

    .accordion__text p {
        font-size: 0.85rem;
        line-height: 1.6;
        margin-bottom: 10px;
    }

    .accordion__btn {
        font-size: 0.8rem;
    }

    .accordion__cta {
        padding: 25px 20px;
        margin-top: 30px;
        border-radius: 16px;
    }

    .accordion__cta-title {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
    }

    .accordion__cta-divider {
        width: 40px;
        height: 2px;
    }

    .accordion__cta-text {
        font-size: 0.9rem;
    }

    .accordion__item.active .accordion__content {
        max-height: 1200px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--accordion {
        padding: 30px 0 40px;
        bottom: 20px;
    }

    .section--accordion::before,
    .section--accordion::after {
        display: none;
    }

    .accordion__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .accordion__divider {
        width: 40px;
        height: 2px;
    }

    .accordion__trigger {
        padding: 12px 14px;
        gap: 8px;
    }

    .accordion__label {
        font-size: 0.85rem;
    }

    .accordion__content-inner {
        padding: 14px 14px 18px;
        gap: 12px;
    }

    .accordion__image img {
        height: 130px;
        border-radius: 10px;
    }

    .accordion__text p {
        font-size: 0.8rem;
        line-height: 1.5;
        margin-bottom: 8px;
    }

    .accordion__btn {
        font-size: 0.75rem;
    }

    .accordion__cta {
        padding: 20px 16px;
        border-radius: 14px;
    }

    .accordion__cta-title {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
    }

    .accordion__cta-divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 12px;
    }

    .accordion__cta-text {
        font-size: 0.85rem;
    }

    .accordion__item.active .accordion__content {
        max-height: 1400px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--accordion {
        padding: 20px 0 30px;
    }

    .accordion__title {
        font-size: 1.2rem;
    }

    .accordion__divider {
        width: 35px;
        height: 1.5px;
    }

    .accordion__trigger {
        padding: 10px 12px;
        gap: 6px;
    }

    .accordion__label {
        font-size: 0.8rem;
    }

    .accordion__icon,
    .accordion__arrow {
        font-size: 9px;
    }

    .accordion__content-inner {
        padding: 10px 10px 14px;
        gap: 10px;
    }

    .accordion__image img {
        height: 100px;
        border-radius: 8px;
    }

    .accordion__text p {
        font-size: 0.75rem;
        line-height: 1.4;
        margin-bottom: 6px;
    }

    .accordion__btn {
        font-size: 0.7rem;
    }

    .accordion__cta {
        padding: 16px 12px;
    }

    .accordion__cta-title {
        font-size: 1rem;
    }

    .accordion__cta-text {
        font-size: 0.8rem;
    }
}






/* ============================================
   HERO - CLEANSING PROTECTION PAGE
   ============================================ */

.hero--cleansing {
    position: relative;
    padding: 100px 0 140px;
    background-size: 100% 84%;
    top: -120PX;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--cleansing .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--cleansing .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--cleansing .hero__content--center {
    max-width: 800px;
    margin: 0 auto;
    top: 60px;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--cleansing .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--cleansing .hero__title--cleansing {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--cleansing .hero__divider--cleansing {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--cleansing .hero__subtitle--cleansing {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}




/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--cleansing {
        position: relative;
        min-height: 85vh !important;
        height: auto !important;
        padding: 50px 0 30px !important;
        margin-top: -15px !important;
        background-size: cover !important;
        background-position: center center !important;
        border-radius: 0 0 16px 16px;
        display: flex;
        align-items: flex-end;
        overflow: hidden;
    }

    .hero--cleansing .hero__overlay {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.15) 0%,
            rgba(0, 0, 0, 0.25) 30%,
            rgba(0, 0, 0, 0.45) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
        z-index: 1;
    }

    .hero--cleansing .hero__container {
        position: relative !important;
        z-index: 2 !important;
        width: 100% !important;
        padding: 0 15px !important;
    }

    .hero--cleansing .hero__content--center {
        position: relative !important;
        top: 0 !important;
        padding: 20px 18px;
        border-radius: 12px;
        left: -13%;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        max-width: 70% !important;
        margin: 0 auto 20px;
        text-align: center;
    }

    .hero--cleansing .hero__content--center {
        position: relative !important;
        top: 0 !important;
        padding: 20px 18px;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        max-width: 70% !important;
        margin: 0 auto 20px;
        text-align: center;
    }

    .hero--cleansing .hero__title {
        font-size: 1.8rem !important;
        margin-bottom: 10px !important;
    }

    .hero--cleansing .hero__subtitle {
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
    }

    .hero--cleansing .hero__label {
        margin-top: 25%;
        font-size: 0.8rem !important;
        margin-bottom: 15px !important;
    }

    .hero--cleansing .hero__divider {
        width: 50px !important;
        height: 2px !important;
        margin: 10px auto !important;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--cleansing {
        min-height: 400px;
        padding: 5px 0 25px;
        margin-top: -70px;
        background-size: 100% 50%;
        background-position: center bottom;
        border-radius: 0 0 12px 12px;
        align-items: flex-end;
    }

    .hero--cleansing .hero__overlay {
        height: 50%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.20) 0%,
            rgba(0, 0, 0, 0.30) 30%,
            rgba(0, 0, 0, 0.45) 60%,
            rgba(0, 0, 0, 0.60) 100%
        );
    }

    .hero--cleansing .hero__content--center {
        padding: 16px 14px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
        max-width: 98%;
        margin: 0 auto 10px auto;
    }

    .hero--cleansing .hero__title--cleansing {
        font-size: clamp(1.1rem, 2.5vw + 0.3rem, 1.5rem);
        margin-bottom: 8px;
    }

    .hero--cleansing .hero__subtitle--cleansing {
        font-size: 0.8rem;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.92);
    }

    .hero--cleansing .hero__divider--cleansing {
        width: 35px;
        height: 2px;
        margin-bottom: 10px;
    }

    .hero--cleansing .hero__label {
        font-size: 0.55rem;
        letter-spacing: 1px;
        margin-bottom: 4px;
    }
}








/* ============================================
   SECTION : WHO I SERVE (NEGATIVE ENERGY)
   ============================================ */

.section--serve-negative {
    top: -100px;
    padding: 70px 0 40px;
    background: linear-gradient(180deg, #FFFCF5 0%, #F8F6F0 100%);
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--serve-negative::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-negative::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.03) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-negative .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve-negative__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve-negative__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve-negative__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.serve-negative__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
}

/* ===== LISTE AVEC ICÔNES ===== */
.serve-negative__list {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 100px;
}

.serve-negative__list li {
    position: relative;
    padding: 12px 0 12px 45px;
    top: -60px;
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.6;
    color: #4A5568;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-negative__list li:last-child {
    border-bottom: none;
}

/* ✅ PUCE SPÉCIALE AVEC CERCLE DORÉ */
.serve-negative__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid #FDD017;
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-negative__list li::after {
    content: '✦';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: #FDD017;
    font-size: 10px;
    transition: all 0.3s ease;
}

/* ✅ SURVOL DE LA LISTE */
.serve-negative__list li:hover {
    color: #2E8B57;
    padding-left: 55px;
}

.serve-negative__list li:hover::before {
    background: #FDD017;
    border-color: #2E8B57;
    transform: translateY(-50%) scale(1.1);
}

.serve-negative__list li:hover::after {
    color: #0A0A0A;
    transform: translateY(-50%) scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve-negative__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve-negative__card {
    background: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    top: -30px;
}

.serve-negative__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.10);
    transform: translateY(-5px);
}

.serve-negative__image-wrapper {
    overflow: hidden;
}

.serve-negative__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-negative__card:hover .serve-negative__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve-negative__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve-negative__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve-negative {
        padding: 60px 0 70px;
    }

    .serve-negative__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve-negative__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve-negative__divider {
        margin: 12px auto 25px;
    }

    .serve-negative__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve-negative__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve-negative__card {
        top: 0;
    }

    .serve-negative__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve-negative {
        padding: 40px 0 50px;
    }

    .section--serve-negative::before,
    .section--serve-negative::after {
        width: 300px;
        height: 300px;
    }

    .serve-negative__grid {
        gap: 30px;
    }

    .serve-negative__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve-negative__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve-negative__list li {
        top: -10px;
        padding: 10px 0 10px 40px;
        font-size: 0.9rem;
    }

    .serve-negative__list li::before {
        width: 24px;
        height: 24px;
    }

    .serve-negative__list li::after {
        left:11px;
        font-size: 8px;
    }

    .serve-negative__list li:hover {
        padding-left: 45px;
    }

    .serve-negative__right {
        max-width: 100%;
    }

    .serve-negative__card {
        top: 0;
    }

    .serve-negative__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve-negative {
        padding: 30px 0 40px;
    }

    .section--serve-negative::before,
    .section--serve-negative::after {
        display: none;
    }

    .serve-negative__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve-negative__divider {
        width: 40px;
        height: 2px;
    }

    .serve-negative__list {
        max-width: 100%;
    }

    .serve-negative__list li {
        padding: 8px 0 8px 35px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve-negative__list li::before {
        width: 20px;
        height: 20px;
    }

    .serve-negative__list li::after {
        left: 5px;
        font-size: 7px;
    }

    .serve-negative__list li:hover {
        padding-left: 38px;
    }

    .serve-negative__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve-negative__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve-negative {
        padding: 20px 0 30px;
    }

    .serve-negative__title {
        font-size: 1.2rem;
    }

    .serve-negative__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve-negative__list li {
        padding: 6px 0 6px 30px;
        font-size: 0.8rem;
    }

    .serve-negative__list li::before {
        width: 18px;
        height: 18px;
        border-width: 1.5px;
    }

    .serve-negative__list li::after {
        left: 4px;
        font-size: 6px;
    }

    .serve-negative__list li:hover {
        padding-left: 32px;
    }

    .serve-negative__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve-negative__card {
        border-radius: 14px;
    }
}






 
/* ============================================
   SECTION : RESTORING PEACE
   ============================================ */



.section--peace {
    padding: 40px 0 60px;
    margin-top: -40px; /* ⬅️ Remonte légèrement pour chevaucher */
    background: linear-gradient(180deg, 
        rgba(248, 246, 240, 1) 0%,
        rgba(248, 246, 240, 0.95) 15%,
        rgba(235, 225, 210, 0.80) 35%,
        rgba(200, 180, 160, 0.60) 55%,
        rgba(100, 80, 60, 0.40) 75%,
        rgba(30, 25, 20, 0.20) 90%,
        rgba(10, 10, 10, 0) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* ✅ Dégradé de transition vers le noir (en bas) */
.section--peace::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background: linear-gradient(180deg, 
        transparent 0%,
        rgba(10, 10, 10, 0.10) 30%,
        rgba(10, 10, 10, 0.40) 60%,
        rgba(10, 10, 10, 0.80) 85%,
        rgba(10, 10, 10, 1) 100%
    );
    z-index: 0;
    pointer-events: none;
}

.section--peace .container-reg {
    position: relative;
    z-index: 1;
}

/* Décoration de fond - cercles lumineux */
.section--peace::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.05) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--peace::after {
    content: '';
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.05) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--peace .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.peace__header {
    text-align: center;
    margin-bottom: 40px;
}

.peace__ornament {
    color: rgba(253, 208, 23, 0.15);
    font-size: 12px;
    letter-spacing: 6px;
    display: block;
    margin-bottom: 15px;
}

.peace__title {
    font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.peace__title span {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.peace__divider {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.15);
}

/* ===== TEXTE ===== */
.peace__content {
    max-width: 820px;
    margin: 0 auto 40px;
}

.peace__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: #4A5568;
    margin-bottom: 0;
}

.peace__text--highlight {
    color: #2C2C2C;
    font-weight: 500;
    position: relative;
    padding-left: 30px;
    border-left: 4px solid #FDD017;
}

.peace__text--highlight::before {
    content: '"';
    position: absolute;
    left: -20px;
    top: -10px;
    font-size: 4rem;
    color: rgba(253, 208, 23, 0.10);
    font-family: Georgia, serif;
}

.peace__separator {
    text-align: center;
    color: rgba(253, 208, 23, 0.10);
    font-size: 10px;
    letter-spacing: 4px;
    padding: 20px 0;
}

/* ===== FEATURES (ICÔNES) ===== */
.peace__features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width:800px;
    margin: 0 auto 45px;
}

.peace__feature {
    text-align: center;
    background: #FFFFFF;
    padding: 30px 20px 25px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.02);
}

.peace__feature:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    border-color: rgba(253, 208, 23, 0.10);
}

.peace__feature-icon {
    font-size: 2.8rem;
    display: block;
    margin-bottom: 12px;
    transition: transform 0.4s ease;
}

.peace__feature:hover .peace__feature-icon {
    transform: scale(1.10) rotate(-3deg);
}

.peace__feature-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 8px;
}

.peace__feature-text {
    font-size: 0.9rem;
    line-height: 1.5;
    color: #4A5568;
    margin: 0;
}

/* ===== BOUTON ===== */
.peace__cta {
    text-align: center;
}

.peace__btn {
    display: inline-block;
    padding: 16px 50px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.35);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

/* Effet de brillance sur le bouton */
.peace__btn::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.30) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.6s ease;
    transform: scale(0.5);
}

.peace__btn:hover::before {
    opacity: 1;
    transform: scale(1);
}

.peace__btn:hover {
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 10px 50px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--peace {
        padding: 40px 0 50px;
    }

    .section--peace::before,
    .section--peace::after {
        width: 250px;
        height: 250px;
    }

    .peace__ornament {
        font-size: 10px;
        letter-spacing: 4px;
        margin-bottom: 10px;
    }

    .peace__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2.2rem);
    }

    .peace__divider {
        width: 45px;
        height: 2px;
        margin-top: 12px;
    }

    .peace__text {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .peace__text--highlight {
        padding-left: 20px;
        border-left-width: 3px;
    }

    .peace__text--highlight::before {
        font-size: 3rem;
        left: -15px;
        top: -5px;
    }

    .peace__separator {
        font-size: 8px;
        padding: 15px 0;
    }

    /* ✅ Features en 3 colonnes sur mobile */
    .peace__features {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        margin-bottom: 30px;
        max-width: 100%;
    }

    .peace__feature {
        padding: 14px 8px 14px;
        border-radius: 12px;
        text-align: center;
    }

    .peace__feature-icon {
        font-size: 1.6rem;
        margin-bottom: 4px;
    }

    .peace__feature-title {
        font-size: 0.7rem;
        margin-bottom: 2px;
    }

    .peace__feature-text {
        font-size: 0.65rem;
        line-height: 1.3;
        display: none; /* ✅ Cache le texte sur mobile pour gagner de l'espace */
    }

    .peace__btn {
        padding: 12px 32px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--peace {
        padding: 30px 0 40px;
    }

    .section--peace::before,
    .section--peace::after {
        display: none;
    }

    .peace__ornament {
        font-size: 8px;
        letter-spacing: 3px;
        margin-bottom: 8px;
    }

    .peace__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.8rem);
    }

    .peace__divider {
        width: 40px;
        height: 2px;
        margin-top: 10px;
    }

    .peace__content {
        margin-bottom: 25px;
    }

    .peace__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .peace__text--highlight {
        padding-left: 16px;
    }

    .peace__text--highlight::before {
        font-size: 2.5rem;
        left: -12px;
    }

    /* ✅ Features en 3 colonnes sur petit mobile */
    .peace__features {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        max-width: 100%;
        margin: 0 auto 20px;
    }

    .peace__feature {
        padding: 12px 6px 12px;
        border-radius: 10px;
    }

    .peace__feature-icon {
        font-size: 1.4rem;
        margin-bottom: 2px;
    }

    .peace__feature-title {
        font-size: 0.65rem;
    }

    .peace__feature-text {
        display: none;
    }

    .peace__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--peace {
        padding: 20px 0 30px;
    }

    .peace__title {
        font-size: 1.1rem;
    }

    .peace__divider {
        width: 35px;
        height: 1.5px;
        margin-top: 8px;
    }

    .peace__text {
        font-size: 0.85rem;
    }

    .peace__text--highlight {
        padding-left: 14px;
        border-left-width: 2px;
    }

    .peace__text--highlight::before {
        font-size: 2rem;
        left: -10px;
    }

    /* ✅ Features en 3 colonnes sur très petit mobile */
    .peace__features {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 6px;
    }

    .peace__feature {
        padding: 10px 4px 10px;
        border-radius: 8px;
    }

    .peace__feature-icon {
        font-size: 1.2rem;
        margin-bottom: 2px;
    }

    .peace__feature-title {
        font-size: 0.6rem;
    }

    .peace__feature-text {
        display: none;
    }

    .peace__btn {
        padding: 8px 18px;
        font-size: 11px;
    }
}










/* ============================================
   SECTION : FIND YOUR PATH BELOW (SLIDER)
   ============================================ */



.section--path-slider {
    padding: 60px 0 80px;
    margin-top: -50px;
    background: #0A0A0A;
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 0 0;
}

.section--path-slider::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 200px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0) 0%,
        rgba(10, 10, 10, 0.20) 20%,
        rgba(10, 10, 10, 0.60) 50%,
        rgba(10, 10, 10, 0.90) 75%,
        rgba(10, 10, 10, 1) 100%
    );
    z-index: 0;
    pointer-events: none;
}

.section--path-slider::after {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: ctaGlow 8s ease-in-out infinite alternate;
}

.section--path-slider .container-reg {
    position: relative;
    z-index: 1;
}

/* ✅ TRANSITION DOUCE VERS LE NOIR */
.section--path-slider::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 250px;
    background: linear-gradient(180deg, 
        rgba(248, 246, 240, 0.95) 0%,
        rgba(248, 246, 240, 0.60) 25%,
        rgba(248, 246, 240, 0.20) 50%,
        rgba(248, 246, 240, 0.05) 75%,
        transparent 100%
    );
    z-index: 0;
    pointer-events: none;
}

/* ✅ Décoration de fond (cercles lumineux) */
.section--path-slider::after {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: ctaGlow 8s ease-in-out infinite alternate;
}

.section--path-slider .container-reg {
    position: relative;
    z-index: 1;
}

.section--path-slider .container-reg {
    position: relative;
    z-index: 1;
}


/* Décoration de fond */


.section--path-slider::after {
    content: '';
    position: absolute;
    bottom: -200px;
    left: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: ctaGlow 8s ease-in-out infinite alternate-reverse;
}

@keyframes ctaGlow {
    0% { transform: scale(1) rotate(0deg); }
    100% { transform: scale(1.1) rotate(10deg); }
}

.section--path-slider .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.path-slider__header {
    text-align: center;
    margin-bottom: 45px;
}

.path-slider__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.path-slider__title span {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.path-slider__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 14px auto 0;
    border-radius: 50px;
}

/* ===== SLIDER ===== */
.path-slider__container {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.04);
    padding: 40px 35px;
}

.path-slider__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.path-slider__item {
    display: none;
    grid-template-columns: 1fr 1.5fr;
    gap: 40px;
    align-items: center;
    animation: sliderFade 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__item.active {
    display: grid;
}

@keyframes sliderFade {
    0% { opacity: 0; transform: translateX(20px); }
    100% { opacity: 1; transform: translateX(0); }
}

/* ===== IMAGE ===== */
.path-slider__media {
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.30);
}

.path-slider__image {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__item.active .path-slider__image {
    animation: imageZoom 8s ease-in-out infinite alternate;
}

@keyframes imageZoom {
    0% { transform: scale(1); }
    100% { transform: scale(1.06); }
}

/* ===== BODY ===== */
.path-slider__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.path-slider__title-item {
    font-size: clamp(1.4rem, 1.8vw + 0.5rem, 2rem);
    font-weight: 700;
    color: #FDD017;
    margin-bottom: 8px;
}

.path-slider__text {
    font-size: clamp(0.9rem, 0.9vw + 0.3rem, 1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.80);
    margin: 0;
}

.path-slider__text strong {
    color: #FDD017;
}

.path-slider__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    margin-top: 8px;
    align-self: flex-start;
}

.path-slider__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ===== CONTROLS ===== */
.path-slider__controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}

.path-slider__btn-prev,
.path-slider__btn-next {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px solid rgba(253, 208, 23, 0.15);
    background: rgba(255, 255, 255, 0.03);
    color: #FDD017;
    font-size: 1.4rem;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
}

.path-slider__btn-prev:hover,
.path-slider__btn-next:hover {
    background: #FDD017;
    color: #0A0A0A;
    border-color: #FDD017;
    transform: scale(1.05);
}

.path-slider__dots {
    display: flex;
    gap: 10px;
}

.path-slider__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__dot.active {
    background: #FDD017;
    transform: scale(1.3);
    box-shadow: 0 0 20px rgba(253, 208, 23, 0.30);
}

/* ===== CTA FINAL ===== */
.path-slider__cta {
    margin-top: 50px;
    margin-bottom: 80px;
    padding: 40px 45px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%);
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(253, 208, 23, 0.04);
    backdrop-filter: blur(4px);
}

.path-slider__cta-title {
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.path-slider__cta-divider {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 18px;
    border-radius: 50px;
}

.path-slider__cta-text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.70);
    max-width: 600px;
    margin: 0 auto;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--path-slider {
        padding: 60px 0 70px;
    }

    .path-slider__container {
        padding: 30px 25px;
    }

    .path-slider__item {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .path-slider__image {
        height: 250px;
    }

    .path-slider__btn {
        align-self: center;
    }

    .path-slider__cta {
        padding: 30px 25px;
        margin-top: 40px;
    }

    .path-slider__cta-title {
        font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.2rem);
    }
}

@media (max-width: 768px) {
    .section--path-slider {
        padding: 40px 0 50px;
    }

    .section--path-slider::before,
    .section--path-slider::after {
        width: 300px;
        height: 300px;
    }

    .path-slider__container {
        padding: 20px 16px;
        border-radius: 16px;
    }

    .path-slider__image {
        height: 200px;
    }

    .path-slider__title-item {
        font-size: 1.2rem;
    }

    .path-slider__text {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .path-slider__btn-prev,
    .path-slider__btn-next {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }

    .path-slider__dot {
        width: 8px;
        height: 8px;
    }

    .path-slider__cta {
        padding: 25px 20px;
        margin-top: 30px;
        border-radius: 16px;
    }

    .path-slider__cta-title {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
    }

    .path-slider__cta-text {
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .section--path-slider {
        padding: 30px 0 40px;
    }

    .section--path-slider::before,
    .section--path-slider::after {
        display: none;
    }

    .path-slider__container {
        padding: 16px 12px;
        border-radius: 14px;
    }

    .path-slider__image {
        height: 160px;
        border-radius: 12px;
    }

    .path-slider__title-item {
        font-size: 1.1rem;
    }

    .path-slider__text {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .path-slider__btn {
        font-size: 0.8rem;
    }

    .path-slider__controls {
        gap: 14px;
        margin-top: 20px;
    }

    .path-slider__btn-prev,
    .path-slider__btn-next {
        width: 32px;
        height: 32px;
        font-size: 0.8rem;
    }

    .path-slider__dot {
        width: 7px;
        height: 7px;
    }

    .path-slider__cta {
        padding: 20px 16px;
        border-radius: 14px;
    }

    .path-slider__cta-title {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
    }

    .path-slider__cta-divider {
        width: 40px;
        height: 2px;
        margin: 8px auto 12px;
    }

    .path-slider__cta-text {
        font-size: 0.85rem;
    }
}

@media (max-width: 380px) {
    .section--path-slider {
        padding: 20px 0 30px;
    }

    .path-slider__container {
        padding: 12px 10px;
        border-radius: 12px;
    }

    .path-slider__image {
        height: 130px;
        border-radius: 10px;
    }

    .path-slider__title-item {
        font-size: 1rem;
    }

    .path-slider__text {
        font-size: 0.75rem;
        line-height: 1.3;
    }

    .path-slider__btn {
        font-size: 0.75rem;
    }

    .path-slider__cta-title {
        font-size: 1rem;
    }

    .path-slider__cta-text {
        font-size: 0.8rem;
    }
}






/* ============================================
   HERO - FINANCIAL FREEDOM
   ============================================ */

.hero--financial {
    position: relative;
    padding: 100px 0 140px;
    margin-top: -190px;
    background-size: 100% 74%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--financial .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 10%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--financial .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--financial .hero__content--center {
    max-width: 800px;
    top: 60px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--financial .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--financial .hero__title--financial {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--financial .hero__divider--financial {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--financial .hero__subtitle--financial {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--financial {
        min-height: 500px;
        padding: 80px 0 120px;
        border-radius: 0 0 25px 25px;
    }

    .hero--financial::before {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--financial .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--financial .hero__content--center {
        top: 135px !important;
        padding: 40px 40px;
        left: -12%;
        border-radius: 16px;
    }

    .hero--financial .hero__title--financial {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--financial {
        min-height: 450px;
        padding: 60px 0 100px;
        border-radius: 0 0 20px 20px;
    }

    .hero--financial::before {
        height: 100% !important;
        border-radius: 0 0 20px 20px;
        background-size: 130% 100%;
        background-position: center top;
    }

    .hero--financial .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--financial .hero__content--center {
        top: 125px !important;
        padding: 35px 30px;
        left: -12%;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--financial .hero__title--financial {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--financial .hero__subtitle--financial {
        font-size: 1rem;
    }

    .hero--financial .hero__divider--financial {
        width: 55px;
        height: 2.5px;
    }

    .hero--financial .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--financial {
        margin-top: -27% !important;
        min-height: 480px !important;
        padding: 80px 0 120px !important;
        border-radius: 0 0 16px 16px;
        margin-bottom: 90px;
    }

    .hero--financial::before {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background-size: 160% 100%;
        background-position: center top;
    }

    .hero--financial .hero__overlay {
        height: 100% !important;
        
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--financial .hero__content--center {
        top: 120px !important;
        padding: 28px 22px;
        left: -12%;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--financial .hero__title--financial {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-bottom: 15px;
    }

    .hero--financial .hero__subtitle--financial {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--financial .hero__divider--financial {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--financial .hero__label {
        margin-bottom: 8px;
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-top: 10px;
        
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--financial {
        min-height: 320px;
        padding: 30px 0 60px;
        border-radius: 0 0 12px 12px;
    }

    .hero--financial::before {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background-size: 200% 100%;
        background-position: center top;
    }

    .hero--financial .hero__overlay {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--financial .hero__content--center {
        top: 105px !important;
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--financial .hero__title--financial {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--financial .hero__subtitle--financial {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--financial .hero__divider--financial {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--financial .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--financial {
        min-height: 280px;
        padding: 20px 0 50px;
        border-radius: 0 0 10px 10px;
    }

    .hero--financial::before {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background-size: 220% 100%;
        background-position: center top;
    }

    .hero--financial .hero__overlay {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--financial .hero__content--center {
        top: 95px !important;
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--financial .hero__title--financial {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--financial .hero__subtitle--financial {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--financial .hero__divider--financial {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--financial .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
    }
}




/* ============================================
   SECTION : TURNING STRUGGLE INTO ABUNDANCE
   ============================================ */



.section--abundance {
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(248, 246, 240, 0.95) 0%,
        rgba(248, 246, 240, 0.80) 15%,
        rgba(235, 225, 210, 0.60) 35%,
        rgba(200, 180, 160, 0.40) 55%,
        rgba(100, 80, 60, 0.25) 75%,
        rgba(30, 25, 20, 0.15) 90%,
        rgba(10, 10, 10, 0) 100% /* ✅ 0% noir en bas */
    );
    position: relative;
    overflow: hidden;
}

/* ✅ Décoration de fond - cercles lumineux dorés */
.section--abundance::before {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.05) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: abundanceGlow 8s ease-in-out infinite alternate;
}

.section--abundance::after {
    content: '';
    position: absolute;
    bottom: -200px;
    left: -200px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: abundanceGlow 8s ease-in-out infinite alternate-reverse;
}

@keyframes abundanceGlow {
    0% { transform: scale(1) rotate(0deg); }
    100% { transform: scale(1.1) rotate(10deg); }
}

.section--abundance .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.abundance__header {
    text-align: center;
    margin-bottom: 35px;
}

.abundance__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.abundance__title span {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.abundance__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 14px auto 0;
    border-radius: 50px;
}

/* ===== TEXTE ===== */
.abundance__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.abundance__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: #4A5568;
    margin-bottom: 18px;
}

.abundance__text--highlight {
    color: #2C2C2C;
    font-weight: 500;
    position: relative;
    padding-left: 30px;
    border-left: 4px solid #FDD017;
}

.abundance__text--highlight::before {
    content: '"';
    position: absolute;
    left: -20px;
    top: -10px;
    font-size: 4rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.abundance__cta {
    text-align: center;
}

.abundance__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.35);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.abundance__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--abundance {
        padding: 60px 0 70px;
    }

    .section--abundance::before,
    .section--abundance::after {
        width: 350px;
        height: 350px;
    }

    .abundance__header {
        margin-bottom: 28px;
    }

    .abundance__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .abundance__divider {
        width: 50px;
        height: 2.5px;
    }

    .abundance__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .abundance__text--highlight {
        padding-left: 20px;
    }

    .abundance__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--abundance {
        padding: 40px 0 50px;
    }

    .section--abundance::before,
    .section--abundance::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .abundance__header {
        margin-bottom: 22px;
    }

    .abundance__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .abundance__divider {
        width: 45px;
        height: 2px;
    }

    .abundance__content {
        margin-bottom: 28px;
    }

    .abundance__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .abundance__text--highlight {
        padding-left: 16px;
        border-left-width: 3px;
    }

    .abundance__text--highlight::before {
        font-size: 3rem;
        left: -15px;
        top: -5px;
    }

    .abundance__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--abundance {
        padding: 30px 0 40px;
    }

    .section--abundance::before,
    .section--abundance::after {
        display: none;
    }

    .abundance__header {
        margin-bottom: 18px;
    }

    .abundance__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .abundance__divider {
        width: 40px;
        height: 2px;
    }

    .abundance__content {
        margin-bottom: 22px;
    }

    .abundance__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .abundance__text--highlight {
        padding-left: 14px;
        border-left-width: 2px;
    }

    .abundance__text--highlight::before {
        font-size: 2.5rem;
        left: -12px;
    }

    .abundance__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--abundance {
        padding: 20px 0 30px;
    }

    .abundance__title {
        font-size: 1.1rem;
    }

    .abundance__divider {
        width: 35px;
        height: 1.5px;
    }

    .abundance__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .abundance__text--highlight {
        padding-left: 12px;
    }

    .abundance__text--highlight::before {
        font-size: 2rem;
        left: -10px;
    }

    .abundance__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}



/* ============================================
   SECTION : WHO I SERVE (FINANCIAL FREEDOM)
   ============================================ */

.section--serve-financial {
    padding: 70px 0 80px;
    margin-top: -40px; /* ⬅️ Chevauchement avec la section précédente */
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0) 0%,     /* ✅ 0% noir en haut */
        rgba(10, 10, 10, 0.05) 15%,
        rgba(10, 10, 10, 0.10) 35%,
        rgba(10, 10, 10, 0.20) 55%,
        rgba(10, 10, 10, 0.30) 75%,
        rgba(10, 10, 10, 0.40) 90%,
        rgba(10, 10, 10, 0.50) 100%  /* ✅ 50% noir en bas */
    );
    position: relative;
    overflow: hidden;
}

/* Décoration de fond - cercles lumineux */
.section--serve-financial::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-financial::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-financial .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve-financial__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve-financial__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve-financial__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #2E8B57;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.serve-financial__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
}

/* ===== LISTE AVEC ICÔNES ===== */
.serve-financial__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.serve-financial__list li {
    position: relative;
    padding: 12px 0 12px 45px;
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.6;
    color: #4A5568;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-financial__list li:last-child {
    border-bottom: none;
}

/* ✅ PUCE SPÉCIALE AVEC CERCLE DORÉ */
.serve-financial__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid #FDD017;
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-financial__list li::after {
    content: '✦';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: #FDD017;
    font-size: 10px;
    transition: all 0.3s ease;
}

/* ✅ SURVOL DE LA LISTE */
.serve-financial__list li:hover {
    color: #2E8B57;
    padding-left: 55px;
}

.serve-financial__list li:hover::before {
    background: #FDD017;
    border-color: #2E8B57;
    transform: translateY(-50%) scale(1.1);
}

.serve-financial__list li:hover::after {
    color: #0A0A0A;
    transform: translateY(-50%) scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve-financial__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve-financial__card {
    background: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-financial__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.10);
    transform: translateY(-5px);
}

.serve-financial__image-wrapper {
    overflow: hidden;
}

.serve-financial__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-financial__card:hover .serve-financial__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve-financial__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve-financial__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve-financial {
        padding: 60px 0 70px;
    }

    .section--serve-financial::before,
    .section--serve-financial::after {
        width: 350px;
        height: 350px;
    }

    .serve-financial__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve-financial__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve-financial__divider {
        margin: 12px auto 25px;
    }

    .serve-financial__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve-financial__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve-financial__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve-financial {
        padding: 40px 0 50px;
    }

    .section--serve-financial::before,
    .section--serve-financial::after {
        width: 250px;
        height: 250px;
    }

    .serve-financial__grid {
        gap: 30px;
    }

    .serve-financial__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve-financial__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve-financial__list li {
        padding: 10px 0 10px 40px;
        font-size: 0.9rem;
    }

    .serve-financial__list li::before {
        width: 24px;
        height: 24px;
    }

    .serve-financial__list li::after {
        left: 7px;
        font-size: 8px;
    }

    .serve-financial__list li:hover {
        padding-left: 45px;
    }

    .serve-financial__right {
        max-width: 100%;
    }

    .serve-financial__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve-financial {
        padding: 30px 0 40px;
    }

    .section--serve-financial::before,
    .section--serve-financial::after {
        display: none;
    }

    .serve-financial__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve-financial__divider {
        width: 40px;
        height: 2px;
    }

    .serve-financial__list {
        max-width: 100%;
    }

    .serve-financial__list li {
        padding: 8px 0 8px 35px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve-financial__list li::before {
        width: 20px;
        height: 20px;
    }

    .serve-financial__list li::after {
        left: 5px;
        font-size: 7px;
    }

    .serve-financial__list li:hover {
        padding-left: 38px;
    }

    .serve-financial__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve-financial__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve-financial {
        padding: 20px 0 30px;
    }

    .serve-financial__title {
        font-size: 1.2rem;
    }

    .serve-financial__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve-financial__list li {
        padding: 6px 0 6px 30px;
        font-size: 0.8rem;
    }

    .serve-financial__list li::before {
        width: 18px;
        height: 18px;
        border-width: 1.5px;
    }

    .serve-financial__list li::after {
        left: 4px;
        font-size: 6px;
    }

    .serve-financial__list li:hover {
        padding-left: 32px;
    }

    .serve-financial__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve-financial__card {
        border-radius: 14px;
    }
}





/* ============================================
   SECTION : FIND YOUR PATH BELOW (SLIDER)
   ============================================ */

.section--path-slider {
    padding: 60px 0 80px;
    margin-top: -50px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.10) 0%,
        rgba(10, 10, 10, 0.25) 15%,
        rgba(10, 10, 10, 0.45) 35%,
        rgba(10, 10, 10, 0.60) 55%,
        rgba(10, 10, 10, 0.75) 75%,
        rgba(10, 10, 10, 0.90) 90%,
        rgba(10, 10, 10, 1) 100%
    );
    position: relative;
    overflow: hidden;
}

/* ✅ Transition en haut */
.section--path-slider::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0) 0%,
        rgba(10, 10, 10, 0.20) 30%,
        rgba(10, 10, 10, 0.50) 60%,
        rgba(10, 10, 10, 0.80) 85%,
        rgba(10, 10, 10, 1) 100%
    );
    z-index: 0;
    pointer-events: none;
}

/* ✅ Cercles lumineux */
.section--path-slider::after {
    content: '';
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    animation: pathGlow 8s ease-in-out infinite alternate;
}

@keyframes pathGlow {
    0% { transform: scale(1) rotate(0deg); }
    100% { transform: scale(1.1) rotate(10deg); }
}

.section--path-slider .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.path-slider__header {
    text-align: center;
    margin-bottom: 40px;
}

.path-slider__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.path-slider__title span {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.path-slider__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 14px auto 0;
    border-radius: 50px;
}

/* ===== SLIDER ===== */
.path-slider__container {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.04);
    padding: 40px 35px;
}

.path-slider__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.path-slider__item {
    display: none;
    grid-template-columns: 1fr 1.5fr;
    gap: 40px;
    align-items: center;
    animation: sliderFade 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__item.active {
    display: grid;
}

@keyframes sliderFade {
    0% { opacity: 0; transform: translateX(20px); }
    100% { opacity: 1; transform: translateX(0); }
}

/* ===== IMAGE ===== */
.path-slider__media {
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.30);
}

.path-slider__image {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__item.active .path-slider__image {
    animation: imageZoom 8s ease-in-out infinite alternate;
}

@keyframes imageZoom {
    0% { transform: scale(1); }
    100% { transform: scale(1.06); }
}

/* ===== BODY ===== */
.path-slider__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.path-slider__title-item {
    font-size: clamp(1.4rem, 1.8vw + 0.5rem, 2rem);
    font-weight: 700;
    color: #FDD017;
    margin-bottom: 8px;
}

.path-slider__text {
    font-size: clamp(0.9rem, 0.9vw + 0.3rem, 1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.80);
    margin: 0;
}

.path-slider__text strong {
    color: #FDD017;
}

.path-slider__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    margin-top: 8px;
    align-self: flex-start;
}

.path-slider__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ===== CONTROLS ===== */
.path-slider__controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}

.path-slider__btn-prev,
.path-slider__btn-next {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px solid rgba(253, 208, 23, 0.15);
    background: rgba(255, 255, 255, 0.03);
    color: #FDD017;
    font-size: 1.4rem;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
}

.path-slider__btn-prev:hover,
.path-slider__btn-next:hover {
    background: #FDD017;
    color: #0A0A0A;
    border-color: #FDD017;
    transform: scale(1.05);
}

.path-slider__dots {
    display: flex;
    gap: 10px;
}

.path-slider__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.path-slider__dot.active {
    background: #FDD017;
    transform: scale(1.3);
    box-shadow: 0 0 20px rgba(253, 208, 23, 0.30);
}

/* ===== CTA FINAL ===== */
.path-slider__cta {
    margin-top: 50px;
    padding: 40px 45px;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(253, 208, 23, 0.03);
    backdrop-filter: blur(4px);
}

.path-slider__cta-title {
    font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.path-slider__cta-divider {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px auto 18px;
    border-radius: 50px;
}

.path-slider__cta-text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.70);
    max-width: 600px;
    margin: 0 auto;
}





/* ============================================
   HERO - SACRED HERBALISM HEALTHCARE PART 2
   ============================================ */

.hero--herbalism {
    position: relative;
    padding: 100px 0 60px;
    background-size: 100% 100%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 450px;
    display: flex;
    border-radius: 0 0 30px 30px;
}

/* ✅ IMAGE VIA PSEUDO-ÉLÉMENT (pour garder le border-radius) */
.hero--herbalism::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background-image: url('../mes-images/industries/who-i serve-sacred herbalism.png');
    background-size: 100% 74%;
    background-position:  center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--herbalism .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--herbalism .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--herbalism .hero__content--center {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--herbalism .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--herbalism .hero__title--herbalism {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--herbalism .hero__divider--herbalism {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--herbalism .hero__subtitle--herbalism {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--herbalism {
        min-height: 500px;
        padding: 60px 0 120px !important;
        border-radius: 0 0 25px 25px;
        margin-top: -83px;

    }

    .hero--herbalism::before {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--herbalism .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--herbalism .hero__content--center {
        padding: 40px 40px;
        
        border-radius: 16px;
    }

    .hero--herbalism .hero__title--herbalism {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--herbalism {
        min-height: 450px;
        padding: 50px 0 80px !important;
        border-radius: 0 0 20px 20px;
        margin-top: -73px;
    }

    .hero--herbalism::before {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background-size: 130% 100%;
    }

    .hero--herbalism .hero__overlay {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--herbalism .hero__content--center {
        padding: 35px 30px;
        top: 125px !important;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--herbalism .hero__title--herbalism {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--herbalism .hero__subtitle--herbalism {
        font-size: 1rem;
    }

    .hero--herbalism .hero__divider--herbalism {
        width: 55px;
        height: 2.5px;
    }

    .hero--herbalism .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
        margin-top: 50px !important;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--herbalism {
        min-height: 480px !important;
        padding: 30px 0 60px !important;
        border-radius: 0 0 16px 16px;
        margin-top: -113px;
    }

    .hero--herbalism::before {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background-size: 160% 100%;
    }

    .hero--herbalism .hero__overlay {
        height: 100% !important;
        margin-top: 100px;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--herbalism .hero__content--center {
        padding: 28px 22px;
        border-radius: 12px;
        top: 115px !important;
        left: -12%;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--herbalism .hero__title--herbalism {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        
    }

    .hero--herbalism .hero__subtitle--herbalism {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--herbalism .hero__divider--herbalism {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--herbalism .hero__label {
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-bottom: 8px;
        margin-top: 40px !important;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--herbalism {
        min-height: 320px;
        padding: 30px 0 60px;
        border-radius: 0 0 12px 12px;
    }

    .hero--herbalism::before {
        height: 80% !important;
        border-radius: 0 0 12px 12px;
        background-size: 200% 100%;
    }

    .hero--herbalism .hero__overlay {
        height: 80% !important;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--herbalism .hero__content--center {
        padding: 22px 18px;
        border-radius: 10px;
        top: 105px !important;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--herbalism .hero__title--herbalism {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--herbalism .hero__subtitle--herbalism {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--herbalism .hero__divider--herbalism {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--herbalism .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
        margin-top: 30px !important;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--herbalism {
        min-height: 280px;
        padding: 20px 0 50px;
        border-radius: 0 0 10px 10px;
    }

    .hero--herbalism::before {
        height: 70%;
        border-radius: 0 0 10px 10px;
        background-size: 220% 100%;
    }

    .hero--herbalism .hero__overlay {
        height: 70%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--herbalism .hero__content--center {
        padding: 18px 14px;
        border-radius: 8px;
        top: 95px !important;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--herbalism .hero__title--herbalism {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--herbalism .hero__subtitle--herbalism {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--herbalism .hero__divider--herbalism {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--herbalism .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
        margin-top: 10px;
    }
}








/* ============================================
   SECTION : THE PHARMACY OF OUR ANCESTORS
   ============================================ */

.section--pharmacy {
    padding: 70px 0 80px;
    margin-top: 10px;
    background: linear-gradient(180deg, 
        #F5F0EB 0%,
        #EDE8E1 25%,
        #F0EBE4 50%,
        #EAE5DE 75%,
        #F5F0EB 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* ✅ Dégradé de lumière doux en haut */
.section--pharmacy::before {
    content: '';
    position: absolute;
    top: -100px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

/* ✅ Effet de "ciel" avec des nuages lumineux */
.section--pharmacy::after {
    content: '';
    position: absolute;
    top: 50px;
    right: -150px;
    width: 500px;
    height: 300px;
    background: radial-gradient(ellipse at 70% 30%, rgba(255, 255, 255, 0.30) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

/* ✅ Deuxième nuage lumineux */
.section--pharmacy .cloud {
    position: absolute;
    bottom: 100px;
    left: -100px;
    width: 400px;
    height: 200px;
    background: radial-gradient(ellipse at 30% 70%, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--pharmacy .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.pharmacy__header {
    text-align: center;
    margin-bottom: 35px;
}

.pharmacy__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #2C2C2C;
    margin-bottom: 0;
    letter-spacing: 1px;
}

.pharmacy__title span {
    background: linear-gradient(135deg, #FDD017, #E8B800);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.pharmacy__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 14px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.pharmacy__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.pharmacy__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: #4A4A4A;
    margin-bottom: 18px;
}

.pharmacy__text--highlight {
    color: #2C2C2C;
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.pharmacy__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.06);
    font-family: Georgia, serif;
}

.pharmacy__separator {
    text-align: center;
    color: rgba(253, 208, 23, 0.08);
    font-size: 10px;
    letter-spacing: 4px;
    padding: 18px 0;
}

/* ===== BOUTON ===== */
.pharmacy__cta {
    text-align: center;
}

.pharmacy__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.pharmacy__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--pharmacy {
        padding: 60px 0 70px;
    }

    .section--pharmacy::before {
        width: 300px;
        height: 300px;
        top: -80px;
        left: -80px;
    }

    .section--pharmacy::after {
        width: 350px;
        height: 250px;
        right: -100px;
    }

    .section--pharmacy .cloud {
        width: 300px;
        height: 150px;
        left: -80px;
        bottom: 80px;
    }

    .pharmacy__header {
        margin-bottom: 28px;
    }

    .pharmacy__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .pharmacy__divider {
        width: 50px;
        height: 2.5px;
    }

    .pharmacy__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .pharmacy__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .pharmacy__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .section--pharmacy {
        padding: 40px 0 50px;
        border-radius: 16px 16px 16px 16px;
    }

    .section--pharmacy::before {
        width: 200px;
        height: 200px;
        top: -60px;
        left: -60px;
    }

    .section--pharmacy::after {
        display: none;
    }

    .section--pharmacy .cloud {
        display: none;
    }

    .pharmacy__header {
        margin-bottom: 22px;
    }

    .pharmacy__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .pharmacy__divider {
        width: 45px;
        height: 2px;
    }

    .pharmacy__content {
        margin-bottom: 28px;
    }

    .pharmacy__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .pharmacy__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .pharmacy__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .pharmacy__separator {
        font-size: 8px;
        padding: 12px 0;
    }

    .pharmacy__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

@media (max-width: 576px) {
    .section--pharmacy {
        padding: 30px 0 40px;
        border-radius: 12px 12px 12px 12px;
    }

    .section--pharmacy::before {
        display: none;
    }

    .pharmacy__header {
        margin-bottom: 18px;
    }

    .pharmacy__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .pharmacy__divider {
        width: 40px;
        height: 2px;
    }

    .pharmacy__content {
        margin-bottom: 22px;
    }

    .pharmacy__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .pharmacy__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .pharmacy__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .pharmacy__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

@media (max-width: 380px) {
    .section--pharmacy {
        padding: 20px 0 30px;
        border-radius: 10px 10px 10px 10px;
    }

    .pharmacy__title {
        font-size: 1.1rem;
    }

    .pharmacy__divider {
        width: 35px;
        height: 1.5px;
    }

    .pharmacy__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .pharmacy__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .pharmacy__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .pharmacy__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}





/* ============================================
   SECTION : WHO I SERVE (SACRED HERBALISM)
   ============================================ */

.section--serve-herbalism {
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(30, 28, 25, 0.95) 0%,
        rgba(40, 35, 30, 0.85) 20%,
        rgba(25, 22, 18, 0.80) 40%,
        rgba(20, 18, 15, 0.85) 60%,
        rgba(15, 12, 10, 0.90) 80%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* ✅ Dégradé de lumière subtil en haut */
.section--serve-herbalism::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 200px;
    background: linear-gradient(180deg, 
        rgba(253, 208, 23, 0.04) 0%,
        rgba(253, 208, 23, 0.02) 40%,
        transparent 100%
    );
    z-index: 0;
    pointer-events: none;
}

/* ✅ Cercles lumineux décoratifs */
.section--serve-herbalism::after {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-herbalism .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve-herbalism__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve-herbalism__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve-herbalism__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.serve-herbalism__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.10);
}

/* ===== LISTE AVEC ICÔNES ===== */
.serve-herbalism__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.serve-herbalism__list li {
    position: relative;
    padding: 12px 0 12px 45px;
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.80);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-herbalism__list li:last-child {
    border-bottom: none;
}

/* ✅ PUCE SPÉCIALE AVEC CERCLE DORÉ */
.serve-herbalism__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid rgba(253, 208, 23, 0.20);
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-herbalism__list li::after {
    content: '✦';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(253, 208, 23, 0.40);
    font-size: 10px;
    transition: all 0.3s ease;
}

/* ✅ SURVOL DE LA LISTE */
.serve-herbalism__list li:hover {
    color: #FFFFFF;
    padding-left: 55px;
}

.serve-herbalism__list li:hover::before {
    background: #FDD017;
    border-color: #FDD017;
    transform: translateY(-50%) scale(1.1);
}

.serve-herbalism__list li:hover::after {
    color: #0A0A0A;
    transform: translateY(-50%) scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve-herbalism__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve-herbalism__card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(4px);
}

.serve-herbalism__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.25);
    transform: translateY(-5px);
    border-color: rgba(253, 208, 23, 0.10);
}

.serve-herbalism__image-wrapper {
    overflow: hidden;
}

.serve-herbalism__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-herbalism__card:hover .serve-herbalism__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve-herbalism__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve-herbalism__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve-herbalism {
        padding: 60px 0 70px;
    }

    .serve-herbalism__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve-herbalism__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve-herbalism__divider {
        margin: 12px auto 25px;
    }

    .serve-herbalism__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve-herbalism__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve-herbalism__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve-herbalism {
        padding: 40px 0 50px;
    }

    .serve-herbalism__grid {
        gap: 30px;
    }

    .serve-herbalism__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve-herbalism__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve-herbalism__list li {
        padding: 10px 0 10px 40px;
        font-size: 0.9rem;
        color: rgba(255, 255, 255, 0.85);
    }

    .serve-herbalism__list li::before {
        width: 24px;
        height: 24px;
    }

    .serve-herbalism__list li::after {
        left: 7px;
        font-size: 8px;
    }

    .serve-herbalism__list li:hover {
        padding-left: 45px;
    }

    .serve-herbalism__right {
        max-width: 100%;
    }

    .serve-herbalism__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }

    .section--serve-herbalism::before {
        height: 120px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve-herbalism {
        padding: 30px 0 40px;
    }

    .section--serve-herbalism::before {
        height: 80px;
    }

    .section--serve-herbalism::after {
        display: none;
    }

    .serve-herbalism__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve-herbalism__divider {
        width: 40px;
        height: 2px;
    }

    .serve-herbalism__list {
        max-width: 100%;
    }

    .serve-herbalism__list li {
        padding: 8px 0 8px 35px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve-herbalism__list li::before {
        width: 20px;
        height: 20px;
    }

    .serve-herbalism__list li::after {
        left: 5px;
        font-size: 7px;
    }

    .serve-herbalism__list li:hover {
        padding-left: 38px;
    }

    .serve-herbalism__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve-herbalism__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve-herbalism {
        padding: 20px 0 30px;
    }

    .serve-herbalism__title {
        font-size: 1.2rem;
    }

    .serve-herbalism__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve-herbalism__list li {
        padding: 6px 0 6px 30px;
        font-size: 0.8rem;
    }

    .serve-herbalism__list li::before {
        width: 18px;
        height: 18px;
        border-width: 1.5px;
    }

    .serve-herbalism__list li::after {
        left: 4px;
        font-size: 6px;
    }

    .serve-herbalism__list li:hover {
        padding-left: 32px;
    }

    .serve-herbalism__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve-herbalism__card {
        border-radius: 14px;
    }
}






/* ============================================
   SECTION : HEALTH CARDS (FOND NOIR)
   ============================================ */

.section--health-cards {
    padding: 60px 0 80px;
    margin-top: 10px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* ✅ Décoration de fond - cercles lumineux */
.section--health-cards::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--health-cards::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--health-cards .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== HEALTH CARD ===== */
.health-card {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 40px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.health-card:last-child {
    border-bottom: none;
}

.health-card:hover {
    transform: translateY(-4px);
}

/* ===== IMAGE ===== */
.health-card__media {
    flex: 0 0 300px;
    max-width: 300px;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.health-card:hover .health-card__media {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.40);
}

.health-card__image {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.health-card:hover .health-card__image {
    transform: scale(1.04);
}

/* ===== BODY ===== */
.health-card__body {
    flex: 1;
}

.health-card__title {
    font-size: clamp(1.3rem, 1.5vw + 0.5rem, 1.8rem);
    font-weight: 700;
    color: #FDD017;
    margin-bottom: 15px;
    letter-spacing: 0.5px;
}

.health-card__text {
    font-size: clamp(0.9rem, 0.9vw + 0.3rem, 1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 12px;
}

.health-card__text strong {
    color: #FDD017;
}

/* ===== BOUTON ===== */
.health-card__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    margin-top: 4px;
}

.health-card__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ============================================
   ALTERNANCE IMAGE GAUCHE / DROITE
   ============================================ */

.health-card--left {
    flex-direction: row;
}

.health-card--right {
    flex-direction: row-reverse;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--health-cards {
        padding: 40px 0 60px;
    }

    .section--health-cards::before,
    .section--health-cards::after {
        width: 300px;
        height: 300px;
    }

    .health-card {
        gap: 30px;
        padding: 30px 0;
    }

    .health-card__media {
        flex: 0 0 240px;
        max-width: 240px;
    }

    .health-card__image {
        height: 200px;
    }

    .health-card__title {
        font-size: clamp(1.2rem, 1.5vw + 0.3rem, 1.5rem);
    }
}

@media (max-width: 768px) {
    .section--health-cards {
        padding: 30px 0 50px;
    }

    .health-card {
        flex-direction: column !important;
        gap: 20px;
        padding: 25px 0;
        text-align: center;
    }

    .health-card__media {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
    }

    .health-card__image {
        height: 200px;
        width: 100%;
    }

    .health-card__title {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
    }

    .health-card__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .health-card__btn {
        font-size: 0.85rem;
    }

    .health-card:hover {
        transform: translateY(-3px);
    }
}

@media (max-width: 576px) {
    .section--health-cards {
        padding: 20px 0 40px;
    }

    .health-card {
        gap: 15px;
        padding: 20px 0;
    }

    .health-card__image {
        height: 160px;
    }

    .health-card__title {
        font-size: 1rem;
    }

    .health-card__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 8px;
    }

    .health-card__btn {
        font-size: 0.8rem;
    }

    .health-card__media {
        border-radius: 12px;
    }
}

@media (max-width: 380px) {
    .section--health-cards {
        padding: 15px 0 30px;
    }

    .health-card {
        gap: 12px;
        padding: 15px 0;
    }

    .health-card__image {
        height: 130px;
    }

    .health-card__title {
        font-size: 0.9rem;
    }

    .health-card__text {
        font-size: 0.8rem;
        line-height: 1.3;
        margin-bottom: 6px;
    }

    .health-card__btn {
        font-size: 0.75rem;
    }
}






/* ============================================
   SECTION : JOIN OUR TEAM
   ============================================ */

.section--join-team {
    padding: 60px 0 70px;
    margin-top: 10px;
    margin-bottom: 11%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.04);
    border-bottom: 1px solid rgba(253, 208, 23, 0.04);
    border-radius: 25px 25px 0 0;
}

/* ✅ Décoration de fond - cercles lumineux */
.section--join-team::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.join-team__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE ===== */
.join-team__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.join-team__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.join-team__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== DROITE ===== */
.join-team__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.join-team__text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 25px;
}

.join-team__btn {
    display: inline-block;
    padding: 14px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.25);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.join-team__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.45);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--join-team {
        padding: 50px 0 60px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 300px;
        height: 300px;
    }

    .join-team__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .join-team__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__divider {
        margin: 14px auto 0;
    }

    .join-team__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .join-team__text {
        max-width: 550px;
        margin: 0 auto 25px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--join-team {
        padding: 40px 0 50px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 200px;
        height: 200px;
        top: -100px;
        bottom: -100px;
    }

    .join-team__grid {
        gap: 25px;
    }

    .join-team__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .join-team__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .join-team__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .join-team__btn {
        padding: 12px 32px;
        font-size: 14px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--join-team {
        padding: 30px 0 40px;
    }

    .section--join-team::before,
    .section--join-team::after {
        display: none;
    }

    .join-team__grid {
        gap: 20px;
    }

    .join-team__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .join-team__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .join-team__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 18px;
    }

    .join-team__btn {
        padding: 10px 24px;
        font-size: 13px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--join-team {
        padding: 20px 0 30px;
    }

    .join-team__title {
        font-size: 1.2rem;
    }

    .join-team__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .join-team__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 15px;
    }

    .join-team__btn {
        padding: 8px 18px;
        font-size: 12px;
    }
}







/* ============================================
   HERO - MALE VITALITY
   ============================================ */

.hero--vitality {
    margin-top: -185px;
    max-resolution: 100%;
    position: relative;
    padding: 160px 0 180px !important;
    background-size: 100% 74%;
    background-position: bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: relatiive;
    border-radius: 0 0 30px 30px;
}

/* ✅ IMAGE VIA PSEUDO-ÉLÉMENT (pour garder le border-radius) */
.hero--vitality::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background-image: url('../mes-images/industries/who-i serve-sacred herbalism-1-.png');
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--vitality .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--vitality .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--vitality .hero__content--center {
    top: 70px;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--vitality .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--vitality .hero__title--vitality {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--vitality .hero__divider--vitality {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--vitality .hero__subtitle--vitality {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--vitality {
        top: 55px;
        min-height: 500px;
        padding: 80px 0 120px;
        border-radius: 0 0 25px 25px;
    }

    .hero--vitality::before {
        height: 60%;
        border-radius: 0 0 25px 25px;
    }

    .hero--vitality .hero__overlay {
        height: 100%;
        border-radius: 0 0 25px 25px;
    }

    .hero--vitality .hero__content--center {
        padding: 40px 40px;
        border-radius: 16px;
    }

    .hero--vitality .hero__title--vitality {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--vitality {
        top: 45px;
        min-height: 450px;
        padding: 60px 0 100px;
        border-radius: 0 0 20px 20px;
    }

    .hero--vitality::before {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background-size: 130% 100%;
    }

    .hero--vitality .hero__overlay {
        height: 100%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--vitality .hero__content--center {
        padding: 35px 30px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--vitality .hero__title--vitality {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--vitality .hero__subtitle--vitality {
        font-size: 1rem;
    }

    .hero--vitality .hero__divider--vitality {
        width: 55px;
        height: 2.5px;
    }

    .hero--vitality .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--vitality {
        top: 35px;
        min-height: 480px;
        padding: 70px 0 140px !important;
        border-radius: 0 0 16px 16px;
        margin-bottom: 100px;
    }

    .hero--vitality::before {
        height: 50%;
        border-radius: 0 0 16px 16px;
        background-size: 160% 100%;
    }

    .hero--vitality .hero__overlay {
        height: 100%;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--vitality .hero__content--center {
        top: 120px !important;
        padding: 28px 22px;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--vitality .hero__title--vitality {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-bottom: 15px;
    }

    .hero--vitality .hero__subtitle--vitality {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--vitality .hero__divider--vitality {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--vitality .hero__label {
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-bottom: 8px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--vitality {
        top: 25px;
        min-height: 320px;
        padding: 30px 0 60px;
        border-radius: 0 0 12px 12px;
    }

    .hero--vitality::before {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background-size: 200% 100%;
    }

    .hero--vitality .hero__overlay {
        height: 100%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--vitality .hero__content--center {
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--vitality .hero__title--vitality {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--vitality .hero__subtitle--vitality {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--vitality .hero__divider--vitality {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--vitality .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--vitality {
        top: 15px;
        min-height: 280px;
        padding: 20px 0 50px;
        border-radius: 0 0 10px 10px;
    }

    .hero--vitality::before {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background-size: 220% 100%;
    }

    .hero--vitality .hero__overlay {
        height: 100%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--vitality .hero__content--center {
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--vitality .hero__title--vitality {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--vitality .hero__subtitle--vitality {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--vitality .hero__divider--vitality {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--vitality .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
    }
}




/* ============================================
   SECTION : RESTORING WHAT WAS LOST
   ============================================ */

.section--restoring {margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--restoring::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--restoring::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--restoring .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.restoring__header {
    text-align: center;
    margin-bottom: 35px;
}

.restoring__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.restoring__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.restoring__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.restoring__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.restoring__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}

.restoring__text--highlight {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.restoring__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.restoring__cta {
    text-align: center;
}

.restoring__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.restoring__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--restoring {
        padding: 60px 0 70px;
        margin-bottom: -65px;
        top: -65px !important;
    }

    .section--restoring::before,
    .section--restoring::after {
        width: 350px;
        height: 350px;
    }

    .restoring__header {
        margin-bottom: 28px;
    }

    .restoring__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .restoring__divider {
        width: 50px;
        height: 2.5px;
    }

    .restoring__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .restoring__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .restoring__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .section--restoring {
        padding: 40px 0 50px;
        margin-bottom: -55px;
        top: -65px !important;
    }

    .section--restoring::before,
    .section--restoring::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .restoring__header {
        margin-bottom: 22px;
    }

    .restoring__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .restoring__divider {
        width: 45px;
        height: 2px;
    }

    .restoring__content {
        margin-bottom: 28px;
    }

    .restoring__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .restoring__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .restoring__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .restoring__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

@media (max-width: 576px) {
    .section--restoring {
        padding: 30px 0 40px;
    }

    .section--restoring::before,
    .section--restoring::after {
        display: none;
    }

    .restoring__header {
        margin-bottom: 18px;
    }

    .restoring__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .restoring__divider {
        width: 40px;
        height: 2px;
    }

    .restoring__content {
        margin-bottom: 22px;
    }

    .restoring__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .restoring__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .restoring__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .restoring__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

@media (max-width: 380px) {
    .section--restoring {
        padding: 20px 0 30px;
    }

    .restoring__title {
        font-size: 1.1rem;
    }

    .restoring__divider {
        width: 35px;
        height: 1.5px;
    }

    .restoring__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .restoring__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .restoring__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .restoring__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}





/* ============================================
   SECTION : WHO I SERVE (MALE VITALITY)
   ============================================ */

.section--serve-vitality {
    margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--serve-vitality::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-vitality::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-vitality .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve-vitality__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve-vitality__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve-vitality__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.serve-vitality__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== LISTE AVEC ICÔNES ===== */
.serve-vitality__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.serve-vitality__list li {
    position: relative;
    padding: 12px 0 12px 45px;
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.80);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-vitality__list li:last-child {
    border-bottom: none;
}

/* ✅ PUCE SPÉCIALE AVEC CERCLE DORÉ */
.serve-vitality__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid rgba(253, 208, 23, 0.20);
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-vitality__list li::after {
    content: '✦';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(253, 208, 23, 0.40);
    font-size: 10px;
    transition: all 0.3s ease;
}

/* ✅ SURVOL DE LA LISTE */
.serve-vitality__list li:hover {
    color: #FFFFFF;
    padding-left: 55px;
}

.serve-vitality__list li:hover::before {
    background: #FDD017;
    border-color: #FDD017;
    transform: translateY(-50%) scale(1.1);
}

.serve-vitality__list li:hover::after {
    color: #0A0A0A;
    transform: translateY(-50%) scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve-vitality__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve-vitality__card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(4px);
}

.serve-vitality__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.25);
    transform: translateY(-5px);
    border-color: rgba(253, 208, 23, 0.10);
}

.serve-vitality__image-wrapper {
    overflow: hidden;
}

.serve-vitality__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-vitality__card:hover .serve-vitality__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve-vitality__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve-vitality__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve-vitality {
        padding: 60px 0 70px;
    }

    .section--serve-vitality::before,
    .section--serve-vitality::after {
        width: 350px;
        height: 350px;
    }

    .serve-vitality__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve-vitality__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve-vitality__divider {
        margin: 12px auto 25px;
    }

    .serve-vitality__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve-vitality__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve-vitality__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve-vitality {
        padding: 40px 0 50px;
    }

    .section--serve-vitality::before,
    .section--serve-vitality::after {
        width: 250px;
        height: 250px;
    }

    .serve-vitality__grid {
        gap: 30px;
    }

    .serve-vitality__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve-vitality__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve-vitality__list li {
        padding: 10px 0 10px 40px;
        font-size: 0.9rem;
        color: rgba(255, 255, 255, 0.85);
    }

    .serve-vitality__list li::before {
        width: 24px;
        height: 24px;
    }

    .serve-vitality__list li::after {
        left: 7px;
        font-size: 8px;
    }

    .serve-vitality__list li:hover {
        padding-left: 45px;
    }

    .serve-vitality__right {
        max-width: 100%;
    }

    .serve-vitality__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve-vitality {
        padding: 30px 0 40px;
    }

    .section--serve-vitality::before,
    .section--serve-vitality::after {
        display: none;
    }

    .serve-vitality__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve-vitality__divider {
        width: 40px;
        height: 2px;
    }

    .serve-vitality__list {
        max-width: 100%;
    }

    .serve-vitality__list li {
        padding: 8px 0 8px 35px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve-vitality__list li::before {
        width: 20px;
        height: 20px;
    }

    .serve-vitality__list li::after {
        left: 5px;
        font-size: 7px;
    }

    .serve-vitality__list li:hover {
        padding-left: 38px;
    }

    .serve-vitality__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve-vitality__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve-vitality {
        padding: 20px 0 30px;
    }

    .serve-vitality__title {
        font-size: 1.2rem;
    }

    .serve-vitality__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve-vitality__list li {
        padding: 6px 0 6px 30px;
        font-size: 0.8rem;
    }

    .serve-vitality__list li::before {
        width: 18px;
        height: 18px;
        border-width: 1.5px;
    }

    .serve-vitality__list li::after {
        left: 4px;
        font-size: 6px;
    }

    .serve-vitality__list li:hover {
        padding-left: 32px;
    }

    .serve-vitality__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve-vitality__card {
        border-radius: 14px;
    }
}




/* ============================================
   HERO - BREAKING CURSES
   ============================================ */

.hero--curses {
    max-resolution: 100%;
    margin-top: -60px;
    position: relative;
    padding: 100px 0 140px;
    background-size: 100% 90%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* ✅ IMAGE VIA PSEUDO-ÉLÉMENT (pour garder le border-radius) */
.hero--curses::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../mes-images/industries/Breaking-Curses-1.png');
    background-size: 100% 90%;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--curses .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--curses .hero__container {
    top: 70px;
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU CENTRÉ ===== */
.hero--curses .hero__content--center {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

/* ===== LABEL ===== */
.hero--curses .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

/* ===== TITRE ===== */
.hero--curses .hero__title--curses {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== LIGNE DÉCORATIVE ===== */
.hero--curses .hero__divider--curses {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

/* ===== SOUS-TITRE ===== */
.hero--curses .hero__subtitle--curses {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--curses {
        min-height: 500px;
        padding: 80px 0 120px;
        border-radius: 0 0 25px 25px;
    }

    .hero--curses::before {
        height: 60%;
        border-radius: 0 0 25px 25px;
    }

    .hero--curses .hero__overlay {
        height: 60%;
        border-radius: 0 0 25px 25px;
    }

    .hero--curses .hero__content--center {
        padding: 40px 40px;
        border-radius: 16px;
    }

    .hero--curses .hero__title--curses {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--curses {
        min-height: 450px;
        padding: 60px 0 100px;
        border-radius: 0 0 20px 20px;
    }

    .hero--curses::before {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background-size: 130% 100%;
    }

    .hero--curses .hero__overlay {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--curses .hero__content--center {
        padding: 35px 30px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--curses .hero__title--curses {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--curses .hero__subtitle--curses {
        font-size: 1rem;
    }

    .hero--curses .hero__divider--curses {
        width: 55px;
        height: 2.5px;
    }

    .hero--curses .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--curses {
        min-height: 380px;
        padding: 40px 0 80px;
        border-radius: 0 0 16px 16px;
    }

    .hero--curses::before {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background-size: 160% 100%;
    }

    .hero--curses .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--curses .hero__content--center {
        top: -25px !important;
        padding: 28px 22px;
        left: -12%;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--curses .hero__title--curses {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-bottom: 15px;
    }

    .hero--curses .hero__subtitle--curses {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--curses .hero__divider--curses {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--curses .hero__label {
        margin-top: 49px !important;
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-bottom: 8px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--curses {
        min-height: 320px;
        padding: 30px 0 60px;
        border-radius: 0 0 12px 12px;
    }

    .hero--curses::before {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background-size: 200% 100%;
    }

    .hero--curses .hero__overlay {
        height: 45%;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--curses .hero__content--center {
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--curses .hero__title--curses {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--curses .hero__subtitle--curses {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--curses .hero__divider--curses {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--curses .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--curses {
        min-height: 280px;
        padding: 20px 0 50px;
        border-radius: 0 0 10px 10px;
    }

    .hero--curses::before {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background-size: 220% 100%;
    }

    .hero--curses .hero__overlay {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--curses .hero__content--center {
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--curses .hero__title--curses {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--curses .hero__subtitle--curses {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--curses .hero__divider--curses {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--curses .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
    }
}




/* ============================================
   SECTION : BREAKING THE INVISIBLE CHAINS
   ============================================ */

.section--chains {
    margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 26px 26px 26px 26px;
}

/* Décoration de fond */
.section--chains::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--chains::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--chains .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.chains__header {
    text-align: center;
    margin-bottom: 35px;
}

.chains__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.chains__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.chains__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.chains__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.chains__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}

.chains__text--highlight {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.chains__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.chains__cta {
    text-align: center;
}

.chains__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.chains__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--chains {
        padding: 60px 0 70px;
    }

    .section--chains::before,
    .section--chains::after {
        width: 350px;
        height: 350px;
    }

    .chains__header {
        margin-bottom: 28px;
    }

    .chains__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .chains__divider {
        width: 50px;
        height: 2.5px;
    }

    .chains__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .chains__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .chains__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--chains {
        padding: 40px 0 50px;
    }

    .section--chains::before,
    .section--chains::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .chains__header {
        margin-bottom: 22px;
    }

    .chains__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .chains__divider {
        width: 45px;
        height: 2px;
    }

    .chains__content {
        margin-bottom: 28px;
    }

    .chains__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .chains__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .chains__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .chains__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--chains {
        padding: 30px 0 40px;
    }

    .section--chains::before,
    .section--chains::after {
        display: none;
    }

    .chains__header {
        margin-bottom: 18px;
    }

    .chains__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .chains__divider {
        width: 40px;
        height: 2px;
    }

    .chains__content {
        margin-bottom: 22px;
    }

    .chains__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .chains__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .chains__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .chains__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--chains {
        padding: 20px 0 30px;
    }

    .chains__title {
        font-size: 1.1rem;
    }

    .chains__divider {
        width: 35px;
        height: 1.5px;
    }

    .chains__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .chains__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .chains__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .chains__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}







/* ============================================
   SECTION : WHO I SERVE (BREAKING CURSES)
   ============================================ */

.section--serve-curses {
    margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--serve-curses::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-curses::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--serve-curses .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.serve-curses__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE : TITRE + LISTE ===== */
.serve-curses__left {
    flex: 1.2 1 400px;
    min-width: 280px;
}

.serve-curses__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.serve-curses__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 12px 0 25px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== LISTE AVEC ICÔNES ===== */
.serve-curses__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.serve-curses__list li {
    position: relative;
    padding: 12px 0 12px 45px;
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.80);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-curses__list li:last-child {
    border-bottom: none;
}

/* ✅ PUCE SPÉCIALE AVEC CERCLE DORÉ */
.serve-curses__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid rgba(253, 208, 23, 0.20);
    border-radius: 50%;
    background: rgba(253, 208, 23, 0.04);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-curses__list li::after {
    content: '✦';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(253, 208, 23, 0.40);
    font-size: 10px;
    transition: all 0.3s ease;
}

/* ✅ SURVOL DE LA LISTE */
.serve-curses__list li:hover {
    color: #FFFFFF;
    padding-left: 55px;
}

.serve-curses__list li:hover::before {
    background: #FDD017;
    border-color: #FDD017;
    transform: translateY(-50%) scale(1.1);
}

.serve-curses__list li:hover::after {
    color: #0A0A0A;
    transform: translateY(-50%) scale(1.2);
}

/* ===== DROITE : IMAGE + BOUTON ===== */
.serve-curses__right {
    flex: 0.8 1 280px;
    min-width: 220px;
}

.serve-curses__card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(4px);
}

.serve-curses__card:hover {
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.25);
    transform: translateY(-5px);
    border-color: rgba(253, 208, 23, 0.10);
}

.serve-curses__image-wrapper {
    overflow: hidden;
}

.serve-curses__image {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.serve-curses__card:hover .serve-curses__image {
    transform: scale(1.04);
}

/* ===== BOUTON ===== */
.serve-curses__btn {
    display: block;
    padding: 18px 25px;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: none;
    cursor: pointer;
}

.serve-curses__btn:hover {
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
    letter-spacing: 2px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--serve-curses {
        padding: 60px 0 70px;
    }

    .section--serve-curses::before,
    .section--serve-curses::after {
        width: 350px;
        height: 350px;
    }

    .serve-curses__grid {
        flex-direction: column;
        gap: 40px;
    }

    .serve-curses__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .serve-curses__divider {
        margin: 12px auto 25px;
    }

    .serve-curses__list {
        max-width: 500px;
        margin: 0 auto;
        text-align: left;
    }

    .serve-curses__right {
        flex: 1 1 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .serve-curses__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--serve-curses {
        padding: 40px 0 50px;
    }

    .section--serve-curses::before,
    .section--serve-curses::after {
        width: 250px;
        height: 250px;
    }

    .serve-curses__grid {
        gap: 30px;
    }

    .serve-curses__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .serve-curses__divider {
        width: 50px;
        height: 2.5px;
        margin: 10px auto 20px;
    }

    .serve-curses__list li {
        padding: 10px 0 10px 40px;
        font-size: 0.9rem;
        color: rgba(255, 255, 255, 0.85);
    }

    .serve-curses__list li::before {
        width: 24px;
        height: 24px;
    }

    .serve-curses__list li::after {
        left: 7px;
        font-size: 8px;
    }

    .serve-curses__list li:hover {
        padding-left: 45px;
    }

    .serve-curses__right {
        max-width: 100%;
    }

    .serve-curses__btn {
        padding: 14px 20px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--serve-curses {
        padding: 30px 0 40px;
    }

    .section--serve-curses::before,
    .section--serve-curses::after {
        display: none;
    }

    .serve-curses__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .serve-curses__divider {
        width: 40px;
        height: 2px;
    }

    .serve-curses__list {
        max-width: 100%;
    }

    .serve-curses__list li {
        padding: 8px 0 8px 35px;
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .serve-curses__list li::before {
        width: 20px;
        height: 20px;
    }

    .serve-curses__list li::after {
        left: 5px;
        font-size: 7px;
    }

    .serve-curses__list li:hover {
        padding-left: 38px;
    }

    .serve-curses__btn {
        padding: 12px 16px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .serve-curses__card {
        border-radius: 16px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--serve-curses {
        padding: 20px 0 30px;
    }

    .serve-curses__title {
        font-size: 1.2rem;
    }

    .serve-curses__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 15px;
    }

    .serve-curses__list li {
        padding: 6px 0 6px 30px;
        font-size: 0.8rem;
    }

    .serve-curses__list li::before {
        width: 18px;
        height: 18px;
        border-width: 1.5px;
    }

    .serve-curses__list li::after {
        left: 4px;
        font-size: 6px;
    }

    .serve-curses__list li:hover {
        padding-left: 32px;
    }

    .serve-curses__btn {
        padding: 10px 14px;
        font-size: 11px;
    }

    .serve-curses__card {
        border-radius: 14px;
    }
}






/* ============================================
   SECTION : BREAKING CURSES CARDS
   ============================================ */

.section--curses-cards {
    margin-top: 10px;
    padding: 40px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--curses-cards::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--curses-cards::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--curses-cards .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== CURSES CARD ===== */
.curses-card {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 35px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.curses-card:last-child {
    border-bottom: none;
}

.curses-card:hover {
    transform: translateY(-4px);
}

/* ===== IMAGE ===== */
.curses-card__media {
    flex: 0 0 280px;
    max-width: 280px;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.curses-card:hover .curses-card__media {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.40);
}

.curses-card__image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.curses-card:hover .curses-card__image {
    transform: scale(1.04);
}

/* ===== BODY ===== */
.curses-card__body {
    flex: 1;
}

.curses-card__title {
    font-size: clamp(1.2rem, 1.5vw + 0.5rem, 1.7rem);
    font-weight: 700;
    color: #FDD017;
    margin-bottom: 12px;
    letter-spacing: 0.5px;
}

.curses-card__text {
    font-size: clamp(0.9rem, 0.9vw + 0.3rem, 1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 10px;
}

.curses-card__text strong {
    color: #FDD017;
}

/* ===== BOUTON ===== */
.curses-card__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    margin-top: 6px;
}

.curses-card__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ============================================
   ALTERNANCE IMAGE GAUCHE / DROITE
   ============================================ */

.curses-card--left {
    flex-direction: row;
}

.curses-card--right {
    flex-direction: row-reverse;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--curses-cards {
        padding: 30px 0 60px;
    }

    .section--curses-cards::before,
    .section--curses-cards::after {
        width: 300px;
        height: 300px;
    }

    .curses-card {
        gap: 30px;
        padding: 25px 0;
    }

    .curses-card__media {
        flex: 0 0 220px;
        max-width: 220px;
    }

    .curses-card__image {
        height: 180px;
    }

    .curses-card__title {
        font-size: clamp(1.1rem, 1.5vw + 0.3rem, 1.4rem);
    }
}

@media (max-width: 768px) {
    .section--curses-cards {
        padding: 20px 0 40px;
    }

    .section--curses-cards::before,
    .section--curses-cards::after {
        width: 200px;
        height: 200px;
        top: -80px;
        bottom: -80px;
    }

    .curses-card {
        flex-direction: column !important;
        gap: 20px;
        padding: 20px 0;
        text-align: center;
    }

    .curses-card__media {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
    }

    .curses-card__image {
        height: 180px;
        width: 100%;
    }

    .curses-card__title {
        font-size: clamp(1rem, 2vw + 0.3rem, 1.3rem);
    }

    .curses-card__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .curses-card__btn {
        font-size: 0.85rem;
    }

    .curses-card:hover {
        transform: translateY(-3px);
    }
}

@media (max-width: 576px) {
    .section--curses-cards {
        padding: 15px 0 30px;
    }

    .section--curses-cards::before,
    .section--curses-cards::after {
        display: none;
    }

    .curses-card {
        gap: 15px;
        padding: 15px 0;
    }

    .curses-card__image {
        height: 150px;
    }

    .curses-card__title {
        font-size: 0.95rem;
    }

    .curses-card__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 8px;
    }

    .curses-card__btn {
        font-size: 0.8rem;
    }
}

@media (max-width: 380px) {
    .section--curses-cards {
        padding: 10px 0 25px;
    }

    .curses-card {
        gap: 12px;
        padding: 12px 0;
    }

    .curses-card__image {
        height: 120px;
    }

    .curses-card__title {
        font-size: 0.85rem;
    }

    .curses-card__text {
        font-size: 0.8rem;
        line-height: 1.3;
        margin-bottom: 6px;
    }

    .curses-card__btn {
        font-size: 0.75rem;
    }
}






/* ============================================
   SECTION : JOIN OUR TEAM
   ============================================ */

.section--join-team {
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.04);
    border-bottom: 1px solid rgba(253, 208, 23, 0.04);
}

/* ✅ Décoration de fond - cercles lumineux */
.section--join-team::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.join-team__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE ===== */
.join-team__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.join-team__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.join-team__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== DROITE ===== */
.join-team__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.join-team__text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 25px;
}

.join-team__btn {
    display: inline-block;
    padding: 14px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.25);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.join-team__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.45);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--join-team {
        padding: 50px 0 60px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 300px;
        height: 300px;
    }

    .join-team__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .join-team__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__divider {
        margin: 14px auto 0;
    }

    .join-team__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .join-team__text {
        max-width: 550px;
        margin: 0 auto 25px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--join-team {
        padding: 40px 0 50px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 200px;
        height: 200px;
        top: -100px;
        bottom: -100px;
    }

    .join-team__grid {
        gap: 25px;
    }

    .join-team__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .join-team__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .join-team__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .join-team__btn {
        padding: 12px 32px;
        font-size: 14px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--join-team {
        padding: 30px 0 40px;
    }

    .section--join-team::before,
    .section--join-team::after {
        display: none;
    }

    .join-team__grid {
        gap: 20px;
    }

    .join-team__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .join-team__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .join-team__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 18px;
    }

    .join-team__btn {
        padding: 10px 24px;
        font-size: 13px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--join-team {
        padding: 20px 0 30px;
    }

    .join-team__title {
        font-size: 1.2rem;
    }

    .join-team__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .join-team__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 15px;
    }

    .join-team__btn {
        padding: 8px 18px;
        font-size: 12px;
    }
}






/* ============================================
   HERO - SPIRITUAL CONSULTATION
   ============================================ */

.hero--consultation {
    margin-top: -450px;
    position: relative;
    padding: 320px 0 140px;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* ✅ IMAGE VIA PSEUDO-ÉLÉMENT (avec border-radius) */
.hero--consultation::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 74%;
    background-image: url('../mes-images/industries/spiritual-consultation-2.png');
    background-size: 100% 74%;
    background-position: center bottom;
    background-repeat: no-repeat;
    z-index: 0;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--consultation .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--consultation .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
    
}

/* ===== CONTENU ===== */
.hero--consultation .hero__content--center {
    top: 90px;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

.hero--consultation .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

.hero--consultation .hero__title--consultation {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero--consultation .hero__divider--consultation {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

.hero--consultation .hero__subtitle--consultation {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

 /* ============================================
   RESPONSIVE - TABLETTE (max-width: 1200px)
   ============================================ */
@media (max-width: 1200px) {
    .hero--consultation {
        margin-top: -300px;
        padding: 220px 0 120px;
        min-height: 500px;
        border-radius: 0 0 25px 25px;
    }

    .hero--consultation::before {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
        background-size: 100% 60%;
        background-position: center bottom;
    }

    .hero--consultation .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 25px 25px;
    }

    .hero--consultation .hero__content--center {
        top: 60px;
        padding: 40px 40px;
        border-radius: 16px;
    }

    .hero--consultation .hero__title--consultation {
        font-size: clamp(2.2rem, 3.5vw + 1rem, 3.8rem);
    }
}

/* ============================================
   RESPONSIVE - TABLETTE (max-width: 992px)
   ============================================ */
@media (max-width: 992px) {
    .hero--consultation {
        margin-top: -200px;
        padding: 160px 0 100px;
        min-height: 450px;
        border-radius: 0 0 20px 20px;
    }

    .hero--consultation::before {
        height: 100% !important;
        border-radius: 0 0 20px 20px;
        background-size: 130% 55%;
        background-position: center top;
    }

    .hero--consultation .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--consultation .hero__content--center {
        top: 40px;
        padding: 35px 30px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.25);
    }

    .hero--consultation .hero__title--consultation {
        font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem);
    }

    .hero--consultation .hero__subtitle--consultation {
        font-size: 1rem;
    }

    .hero--consultation .hero__divider--consultation {
        width: 55px;
        height: 2.5px;
    }

    .hero--consultation .hero__label {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* ============================================
   RESPONSIVE - MOBILE (max-width: 768px)
   ============================================ */
@media (max-width: 768px) {
    .hero--consultation {
        padding: 100px 0 30px !important;
        margin-top: -100px;        
        min-height: 380px;
        border-radius: 0 0 16px 16px;
    }

    .hero--consultation::before {
        height: 100% !important;
        border-radius: 0 0 16px 16px;    
        background-size: 160% 100% !important;
        background-position: center bottom !important;
        background-repeat: no-repeat !important;
    }

    .hero--consultation .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.35) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--consultation .hero__content--center {
        top: -10px !important;
        padding: 28px 22px;
        left: -12%;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.30);
        backdrop-filter: blur(3px);
    }

    .hero--consultation .hero__title--consultation {
        font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.2rem);
        margin-bottom: 15px;
    }

    .hero--consultation .hero__subtitle--consultation {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .hero--consultation .hero__divider--consultation {
        width: 45px;
        height: 2px;
        margin-bottom: 18px;
    }

    .hero--consultation .hero__label {
        font-size: 0.7rem;
        letter-spacing: 2px;
        margin-bottom: 8px;
        margin-top: 45px;
    }
}

/* ============================================
   RESPONSIVE - PETIT MOBILE (max-width: 576px)
   ============================================ */
@media (max-width: 576px) {
    .hero--consultation {
        margin-top: -60px;
        padding: 70px 0 60px;
        min-height: 320px;
        border-radius: 0 0 12px 12px;
    }

    .hero--consultation::before {
        height: 95% !important;
        border-radius: 0 0 12px 12px;
        background-size: 200% 45%;
        background-position: center top;
    }

    .hero--consultation .hero__overlay {
        height: 95% !important;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.40) 0%,
            rgba(0, 0, 0, 0.45) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--consultation .hero__content--center {
        top: 10px;
        padding: 22px 18px;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }

    .hero--consultation .hero__title--consultation {
        font-size: clamp(1.3rem, 2.5vw + 0.3rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--consultation .hero__subtitle--consultation {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .hero--consultation .hero__divider--consultation {
        width: 40px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--consultation .hero__label {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
    }
}

/* ============================================
   RESPONSIVE - TRÈS PETIT MOBILE (max-width: 380px)
   ============================================ */
@media (max-width: 380px) {
    .hero--consultation {
        margin-top: -40px;
        padding: 50px 0 50px;
        min-height: 280px;
        border-radius: 0 0 10px 10px;
    }

    .hero--consultation::before {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background-size: 220% 40%;
        background-position: center top;
    }

    .hero--consultation .hero__overlay {
        height: 40%;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.45) 0%,
            rgba(0, 0, 0, 0.50) 30%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--consultation .hero__content--center {
        top: 5px;
        padding: 18px 14px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.40);
    }

    .hero--consultation .hero__title--consultation {
        font-size: clamp(1.1rem, 2vw + 0.3rem, 1.4rem);
        margin-bottom: 10px;
    }

    .hero--consultation .hero__subtitle--consultation {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .hero--consultation .hero__divider--consultation {
        width: 35px;
        height: 1.5px;
        margin-bottom: 12px;
    }

    .hero--consultation .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1px;
    }
}




/* ============================================
   SECTION : THOSE WHO SEEK CLARITY
   ============================================ */

.section--clarity {
    margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius:  25px 25px 25px 25px;
}

/* Décoration de fond */
.section--clarity::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--clarity::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--clarity .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.clarity__header {
    text-align: center;
    margin-bottom: 35px;
}

.clarity__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.clarity__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.clarity__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.clarity__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.clarity__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}

.clarity__text--highlight {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.clarity__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.clarity__cta {
    text-align: center;
}

.clarity__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.clarity__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--clarity {
        padding: 60px 0 70px;
    }

    .section--clarity::before,
    .section--clarity::after {
        width: 350px;
        height: 350px;
    }

    .clarity__header {
        margin-bottom: 28px;
    }

    .clarity__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .clarity__divider {
        width: 50px;
        height: 2.5px;
    }

    .clarity__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .clarity__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .clarity__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--clarity {
        padding: 40px 0 50px;
    }

    .section--clarity::before,
    .section--clarity::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .clarity__header {
        margin-bottom: 22px;
    }

    .clarity__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .clarity__divider {
        width: 45px;
        height: 2px;
    }

    .clarity__content {
        margin-bottom: 28px;
    }

    .clarity__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .clarity__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .clarity__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .clarity__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--clarity {
        padding: 30px 0 40px;
    }

    .section--clarity::before,
    .section--clarity::after {
        display: none;
    }

    .clarity__header {
        margin-bottom: 18px;
    }

    .clarity__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .clarity__divider {
        width: 40px;
        height: 2px;
    }

    .clarity__content {
        margin-bottom: 22px;
    }

    .clarity__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .clarity__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .clarity__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .clarity__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--clarity {
        padding: 20px 0 30px;
    }

    .clarity__title {
        font-size: 1.1rem;
    }

    .clarity__divider {
        width: 35px;
        height: 1.5px;
    }

    .clarity__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .clarity__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .clarity__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .clarity__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}





/* ============================================
   SECTION : SPIRITUAL CONSULTATION SERVICES
   ============================================ */

/* ===== STRUCTURE COMMUNE ===== */
.section--consultation-block {
    margin-top: 10px;
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond - cercles lumineux */
.section--consultation-block::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--consultation-block::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--consultation-block .container-reg {
    position: relative;
    z-index: 1;
}

.consultation-block__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

.consultation-block__left {
    flex: 1 1 35%;
    min-width: 250px;
}

.consultation-block__title {
    font-size: clamp(2rem, 3vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin: 0;
    line-height: 1.2;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.consultation-block__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.consultation-block__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

.consultation-block__right {
    flex: 1 1 50%;
    min-width: 300px;
}

.consultation-block__card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 24px;
    padding: 40px 45px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.10);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.consultation-block__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 50px rgba(0, 0, 0, 0.20);
    border-color: rgba(253, 208, 23, 0.06);
}

.consultation-block__text {
    font-size: clamp(0.95rem, 0.9vw + 0.3rem, 1.05rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin: 0 0 14px 0;
}

.consultation-block__text:last-of-type {
    margin-bottom: 0;
}

.consultation-block__cta {
    text-align: center;
    margin-top: 28px;
}

.consultation-block__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 1rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.consultation-block__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--consultation-block {
        padding: 50px 0 60px;
    }

    .section--consultation-block::before,
    .section--consultation-block::after {
        width: 350px;
        height: 350px;
    }

    .consultation-block__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .consultation-block__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .consultation-block__divider {
        margin: 14px auto 0;
    }

    .consultation-block__right {
        flex: 1 1 100%;
    }

    .consultation-block__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .consultation-block__card {
        padding: 32px 30px;
        border-radius: 20px;
    }

    .consultation-block__text {
        font-size: 0.95rem;
        line-height: 1.7;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--consultation-block {
        padding: 40px 0 50px;
    }

    .section--consultation-block::before,
    .section--consultation-block::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .consultation-block__grid {
        gap: 25px;
    }

    .consultation-block__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .consultation-block__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .consultation-block__card {
        padding: 25px 22px;
        border-radius: 16px;
    }

    .consultation-block__text {
        font-size: 0.9rem;
        line-height: 1.6;
        margin-bottom: 10px;
    }

    .consultation-block__cta {
        margin-top: 20px;
    }

    .consultation-block__btn {
        font-size: 0.9rem;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--consultation-block {
        padding: 30px 0 40px;
    }

    .section--consultation-block::before,
    .section--consultation-block::after {
        display: none;
    }

    .consultation-block__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .consultation-block__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .consultation-block__card {
        padding: 20px 18px;
        border-radius: 14px;
        backdrop-filter: blur(2px);
    }

    .consultation-block__text {
        font-size: 0.85rem;
        line-height: 1.5;
        margin-bottom: 8px;
    }

    .consultation-block__btn {
        font-size: 0.85rem;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--consultation-block {
        padding: 20px 0 30px;
    }

    .consultation-block__title {
        font-size: 1.1rem;
    }

    .consultation-block__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .consultation-block__card {
        padding: 16px 14px;
        border-radius: 12px;
    }

    .consultation-block__text {
        font-size: 0.8rem;
        line-height: 1.4;
        margin-bottom: 6px;
    }

    .consultation-block__btn {
        font-size: 0.8rem;
    }
}





/* ============================================
   SECTION : YOU ARE NOT ALONE
   ============================================ */

.section--not-alone {
    margin-bottom: 11%;
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.04);
    border-bottom: 1px solid rgba(253, 208, 23, 0.04);
    border-radius: 25px 25px 0 0;
}

/* ✅ Décoration de fond - cercles lumineux */
.section--not-alone::before {
    content: '';
    position: absolute;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--not-alone::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--not-alone .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.not-alone__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE ===== */
.not-alone__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.not-alone__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.not-alone__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== DROITE ===== */
.not-alone__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.not-alone__text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin: 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--not-alone {
        padding: 50px 0 60px;
        margin-bottom: 41% !important;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        width: 300px;
        height: 300px;
    }

    .not-alone__grid {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }

    .not-alone__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .not-alone__divider {
        margin: 14px auto 0;
    }

    .not-alone__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .not-alone__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .not-alone__text {
        max-width: 550px;
        margin: 0 auto;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--not-alone {
        padding: 40px 0 50px;
        margin-bottom: 31% !important;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        width: 200px;
        height: 200px;
        top: -100px;
        bottom: -100px;
    }

    .not-alone__grid {
        gap: 20px;
    }

    .not-alone__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .not-alone__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .not-alone__text {
        font-size: 0.95rem;
        line-height: 1.6;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--not-alone {
        padding: 30px 0 40px;
        margin-bottom: 21% !important;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        display: none;
    }

    .not-alone__grid {
        gap: 16px;
    }

    .not-alone__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .not-alone__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .not-alone__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--not-alone {
        padding: 20px 0 30px;
    }

    .not-alone__title {
        font-size: 1.2rem;
    }

    .not-alone__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .not-alone__text {
        font-size: 0.85rem;
        line-height: 1.4;
    }
}






/* ============================================
   HERO - CHILDREN'S SPIRITUAL CLEANSING
   ============================================ */

.hero--children {
    max-resolution: 100%;
    top: -225px;
    position: relative;
    padding: 100px 0 140px;
    background-size: 100% 74%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    /* ✅ BORDER-RADIUS AVEC CLIP-PATH */
    border-radius: 0 0 30px 30px;
    clip-path: inset(0 0 0 0 round 0 0 30px 30px);
    -webkit-clip-path: inset(0 0 0 0 round 0 0 30px 30px);
}

/* Overlay */
.hero--children .hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--children .hero__container {
    top: 220px;
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU ===== */
.hero--children .hero__content--center {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

.hero--children .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

.hero--children .hero__title--children {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 1rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero--children .hero__divider--children {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

.hero--children .hero__subtitle--children {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}


/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 1200px) ----- */
@media (max-width: 1200px) {
    .hero--children {
        min-height: 500px;
        padding: 80px 0 120px;
        border-radius: 0 0 25px 25px;
        clip-path: inset(0 0 0 0 round 0 0 25px 25px);
        -webkit-clip-path: inset(0 0 0 0 round 0 0 25px 25px);
        background-size: 100% 60%;
        background-position: center bottom;
        align-items: center;
    }

    .hero--children .hero__overlay {
        height: 60%;
        border-radius: 0 0 25px 25px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--children .hero__content--center {
        top: 0;
        padding: 35px 40px;
        border-radius: 16px;
        background: rgba(0, 0, 0, 0.25);
        max-width: 85%;
        margin: 0 auto;
    }

    .hero--children .hero__title--children {
        font-size: clamp(2rem, 3vw + 1rem, 3.2rem);
        margin-bottom: 15px;
    }

    .hero--children .hero__subtitle--children {
        font-size: 1rem;
        line-height: 1.6;
    }

    .hero--children .hero__divider--children {
        width: 50px;
        height: 2.5px;
        margin-bottom: 18px;
    }

    .hero--children .hero__label {
        font-size: 0.75rem;
        letter-spacing: 2px;
        margin-bottom: 10px;
        margin-top: 0;
    }
}

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .hero--children {
        min-height: 450px;
        padding: 60px 0 100px;
        border-radius: 0 0 20px 20px;
        clip-path: inset(0 0 0 0 round 0 0 20px 20px);
        -webkit-clip-path: inset(0 0 0 0 round 0 0 20px 20px);
        background-size: 100% 55%;
        background-position: center bottom;
        align-items: center;
    }

    .hero--children .hero__overlay {
        height: 55%;
        border-radius: 0 0 20px 20px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.65) 100%
        );
    }

    .hero--children .hero__content--center {
        top: 0;
        padding: 30px 28px;
        border-radius: 14px;
        background: rgba(0, 0, 0, 0.28);
        max-width: 90%;
        margin: 0 auto;
    }

    .hero--children .hero__title--children {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.8rem);
        margin-bottom: 12px;
    }

    .hero--children .hero__subtitle--children {
        font-size: 0.95rem;
        line-height: 1.5;
    }

    .hero--children .hero__divider--children {
        width: 45px;
        height: 2px;
        margin-bottom: 15px;
    }

    .hero--children .hero__label {
        font-size: 0.7rem;
        letter-spacing: 1.5px;
        margin-bottom: 8px;
        margin-top: 0;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--children {
        top: -40px;
        min-height: 350px;
        padding: 60px 0 30px;
        border-radius: 0 0 16px 16px;
        clip-path: inset(0 0 0 0 round 0 0 16px 16px);
        -webkit-clip-path: inset(0 0 0 0 round 0 0 16px 16px);
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        align-items: flex-end;
    }

    .hero--children .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.20) 0%,
            rgba(0, 0, 0, 0.30) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--children .hero__content--center {
        top: -270px !important;
        padding: 20px 18px !important;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(3px);
        max-width: 95%;
        margin: 0 auto 10px auto;
        position: relative;
    }

    .hero--children .hero__title--children {
        font-size: clamp(1.4rem, 3vw + 0.5rem, 1.8rem);
        margin-bottom: 12px;
    }

    .hero--children .hero__subtitle--children {
        font-size: 0.85rem;
        line-height: 1.5;
        color: rgba(255, 255, 255, 0.92);
    }

    .hero--children .hero__divider--children {
        width: 40px;
        height: 2px;
        margin-bottom: 14px;
    }

    .hero--children .hero__label {
        font-size: 0.6rem;
        letter-spacing: 1.5px;
        margin-bottom: 6px;
        margin-top: 25px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--children {
        min-height: 400px;
        padding: 40px 0 20px;
        border-radius: 0 0 12px 12px;
        clip-path: inset(0 0 0 0 round 0 0 12px 12px);
        -webkit-clip-path: inset(0 0 0 0 round 0 0 12px 12px);
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        align-items: flex-end;
    }

    .hero--children .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.25) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--children .hero__content--center {
        top: -180px !important;
        padding: 18px 16px !important;
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.40);
        backdrop-filter: blur(2px);
        max-width: 98%;
        margin: 0 auto 5px auto;
    }

    .hero--children .hero__title--children {
        font-size: clamp(1.2rem, 2.5vw + 0.3rem, 1.5rem);
        margin-bottom: 10px;
    }

    .hero--children .hero__subtitle--children {
        font-size: 0.8rem;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.92);
    }

    .hero--children .hero__divider--children {
        width: 35px;
        height: 2px;
        margin-bottom: 12px;
    }

    .hero--children .hero__label {
        font-size: 0.55rem;
        letter-spacing: 1px;
        margin-bottom: 4px;
        margin-top: 15px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--children {
        min-height: 350px;
        padding: 30px 0 15px;
        border-radius: 0 0 10px 10px;
        clip-path: inset(0 0 0 0 round 0 0 10px 10px);
        -webkit-clip-path: inset(0 0 0 0 round 0 0 10px 10px);
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        align-items: flex-end;
    }

    .hero--children .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 10px 10px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.80) 100%
        );
    }

    .hero--children .hero__content--center {
        top: -140px !important;
        padding: 14px 12px !important;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.45);
        max-width: 100%;
        margin: 0 auto 5px auto;
    }

    .hero--children .hero__title--children {
        font-size: clamp(1rem, 2vw + 0.2rem, 1.2rem);
        margin-bottom: 8px;
    }

    .hero--children .hero__subtitle--children {
        font-size: 0.75rem;
        line-height: 1.3;
        color: rgba(255, 255, 255, 0.92);
    }

    .hero--children .hero__divider--children {
        width: 30px;
        height: 1.5px;
        margin-bottom: 10px;
    }

    .hero--children .hero__label {
        font-size: 0.5rem;
        letter-spacing: 0.5px;
        margin-bottom: 4px;
        margin-top: 10px;
    }
}








/* ============================================
   SECTION : PROTECTING YOUR CHILD
   ============================================ */

.section--protect-child {
    margin-top: -30px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--protect-child::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--protect-child::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--protect-child .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.protect-child__header {
    text-align: center;
    margin-bottom: 35px;
}

.protect-child__title {
    font-size: clamp(1.8rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.protect-child__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.protect-child__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.protect-child__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.protect-child__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}

.protect-child__text--highlight {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.protect-child__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.protect-child__cta {
    text-align: center;
}

.protect-child__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.protect-child__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--protect-child {
        padding: 60px 0 70px;
    }

    .section--protect-child::before,
    .section--protect-child::after {
        width: 350px;
        height: 350px;
    }

    .protect-child__header {
        margin-bottom: 28px;
    }

    .protect-child__title {
        font-size: clamp(1.6rem, 2.5vw + 1rem, 2.4rem);
    }

    .protect-child__divider {
        width: 50px;
        height: 2.5px;
    }

    .protect-child__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .protect-child__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .protect-child__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--protect-child {
        padding: 40px 0 50px;
    }

    .section--protect-child::before,
    .section--protect-child::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .protect-child__header {
        margin-bottom: 22px;
    }

    .protect-child__title {
        font-size: clamp(1.3rem, 3vw + 0.5rem, 1.8rem);
    }

    .protect-child__divider {
        width: 45px;
        height: 2px;
    }

    .protect-child__content {
        margin-bottom: 28px;
    }

    .protect-child__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .protect-child__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .protect-child__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .protect-child__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--protect-child {
        padding: 30px 0 40px;
    }

    .section--protect-child::before,
    .section--protect-child::after {
        display: none;
    }

    .protect-child__header {
        margin-bottom: 18px;
    }

    .protect-child__title {
        font-size: clamp(1.1rem, 3vw + 0.3rem, 1.5rem);
    }

    .protect-child__divider {
        width: 40px;
        height: 2px;
    }

    .protect-child__content {
        margin-bottom: 22px;
    }

    .protect-child__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .protect-child__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .protect-child__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .protect-child__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--protect-child {
        padding: 20px 0 30px;
    }

    .protect-child__title {
        font-size: 1rem;
    }

    .protect-child__divider {
        width: 35px;
        height: 1.5px;
    }

    .protect-child__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .protect-child__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .protect-child__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .protect-child__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}





/* ============================================
   SECTION : CHILDREN'S SPIRITUAL CLEANSING CARDS
   ============================================ */

.section--children-cards {
    margin-top: 10px;
    padding: 40px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond */
.section--children-cards::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--children-cards::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--children-cards .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== CHILDREN CARD ===== */
.children-card {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 35px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.children-card:last-child {
    border-bottom: none;
}

.children-card:hover {
    transform: translateY(-4px);
}

/* ===== IMAGE ===== */
.children-card__media {
    flex: 0 0 280px;
    max-width: 280px;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.children-card:hover .children-card__media {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.40);
}

.children-card__image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.children-card:hover .children-card__image {
    transform: scale(1.04);
}

/* ===== BODY ===== */
.children-card__body {
    flex: 1;
}

.children-card__title {
    font-size: clamp(1.2rem, 1.5vw + 0.5rem, 1.7rem);
    font-weight: 700;
    color: #FDD017;
    margin-bottom: 12px;
    letter-spacing: 0.5px;
}

.children-card__text {
    font-size: clamp(0.9rem, 0.9vw + 0.3rem, 1rem);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 10px;
}

.children-card__text strong {
    color: #FDD017;
}

/* ===== BOUTON ===== */
.children-card__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    margin-top: 6px;
}

.children-card__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ============================================
   ALTERNANCE IMAGE GAUCHE / DROITE
   ============================================ */

.children-card--left {
    flex-direction: row;
}

.children-card--right {
    flex-direction: row-reverse;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 992px) {
    .section--children-cards {
        padding: 30px 0 60px;
    }

    .section--children-cards::before,
    .section--children-cards::after {
        width: 300px;
        height: 300px;
    }

    .children-card {
        gap: 30px;
        padding: 25px 0;
    }

    .children-card__media {
        flex: 0 0 220px;
        max-width: 220px;
    }

    .children-card__image {
        height: 180px;
    }

    .children-card__title {
        font-size: clamp(1.1rem, 1.5vw + 0.3rem, 1.4rem);
    }
}

@media (max-width: 768px) {
    .section--children-cards {
        padding: 20px 0 40px;
    }

    .section--children-cards::before,
    .section--children-cards::after {
        width: 200px;
        height: 200px;
        top: -80px;
        bottom: -80px;
    }

    .children-card {
        flex-direction: column !important;
        gap: 20px;
        padding: 20px 0;
        text-align: center;
    }

    .children-card__media {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
    }

    .children-card__image {
        height: 180px;
        width: 100%;
    }

    .children-card__title {
        font-size: clamp(1rem, 2vw + 0.3rem, 1.3rem);
    }

    .children-card__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .children-card__btn {
        font-size: 0.85rem;
    }

    .children-card:hover {
        transform: translateY(-3px);
    }
}

@media (max-width: 576px) {
    .section--children-cards {
        padding: 15px 0 30px;
    }

    .section--children-cards::before,
    .section--children-cards::after {
        display: none;
    }

    .children-card {
        gap: 15px;
        padding: 15px 0;
    }

    .children-card__image {
        height: 150px;
    }

    .children-card__title {
        font-size: 0.95rem;
    }

    .children-card__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 8px;
    }

    .children-card__btn {
        font-size: 0.8rem;
    }
}

@media (max-width: 380px) {
    .section--children-cards {
        padding: 10px 0 25px;
    }

    .children-card {
        gap: 12px;
        padding: 12px 0;
    }

    .children-card__image {
        height: 120px;
    }

    .children-card__title {
        font-size: 0.85rem;
    }

    .children-card__text {
        font-size: 0.8rem;
        line-height: 1.3;
        margin-bottom: 6px;
    }

    .children-card__btn {
        font-size: 0.75rem;
    }
}




/* ============================================
   SECTION : JOIN OUR TEAM
   ============================================ */

.section--join-team {
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.04);
    border-bottom: 1px solid rgba(253, 208, 23, 0.04);
}

/* ✅ Décoration de fond - cercles lumineux */
.section--join-team::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--join-team .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.join-team__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE ===== */
.join-team__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.join-team__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.join-team__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== DROITE ===== */
.join-team__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.join-team__text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 25px;
}

.join-team__btn {
    display: inline-block;
    padding: 14px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.25);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.join-team__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.45);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--join-team {
        padding: 50px 0 60px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 300px;
        height: 300px;
    }

    .join-team__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .join-team__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__divider {
        margin: 14px auto 0;
    }

    .join-team__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .join-team__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .join-team__text {
        max-width: 550px;
        margin: 0 auto 25px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--join-team {
        padding: 40px 0 50px;
    }

    .section--join-team::before,
    .section--join-team::after {
        width: 200px;
        height: 200px;
        top: -100px;
        bottom: -100px;
    }

    .join-team__grid {
        gap: 25px;
    }

    .join-team__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .join-team__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .join-team__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .join-team__btn {
        padding: 12px 32px;
        font-size: 14px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--join-team {
        padding: 30px 0 40px;
    }

    .section--join-team::before,
    .section--join-team::after {
        display: none;
    }

    .join-team__grid {
        gap: 20px;
    }

    .join-team__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .join-team__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .join-team__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 18px;
    }

    .join-team__btn {
        padding: 10px 24px;
        font-size: 13px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--join-team {
        padding: 20px 0 30px;
    }

    .join-team__title {
        font-size: 1.2rem;
    }

    .join-team__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .join-team__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 15px;
    }

    .join-team__btn {
        padding: 8px 18px;
        font-size: 12px;
    }
}







/* ============================================
   HERO - FAMILY HARMONY
   ============================================ */

.hero--family {
    margin-top: -160px;
    position: relative;
    padding: 100px 0 140px;
    background-size: 100% 74%;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 550px;
    display: flex;
    align-items: center;
    border-radius: 0 0 30px 30px;
}

/* Overlay */
.hero--family .hero__overlay {
    position: absolute;
    top: 160px;
    left: 0;
    width: 100%;
    height: 74%;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.35) 0%,
        rgba(0, 0, 0, 0.25) 30%,
        rgba(0, 0, 0, 0.35) 60%,
        rgba(0, 0, 0, 0.55) 100%
    );
    z-index: 1;
    border-radius: 0 0 30px 30px;
    pointer-events: none;
}

.hero--family .hero__container {
    position: relative;
    z-index: 2;
    width: 100%;
}

/* ===== CONTENU ===== */
.hero--family .hero__content--center {
    top: 60px;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    background: rgba(0, 0, 0, 0.20);
    padding: 50px 55px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 20px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.20);
}

.hero--family .hero__label {
    color: #FDD017;
    font-size: clamp(0.8rem, 1vw + 0.3rem, 0.95rem);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 600;
}

.hero--family .hero__title--family {
    color: #FFFFFF;
    font-size: clamp(2.5rem, 4vw + 2rem, 4.5rem);
    font-weight: 700;
    text-shadow: 0 0 30px rgba(46, 139, 87, 0.3), 0 4px 20px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #FFFFFF, #F5F5F5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero--family .hero__divider--family {
    width: 70px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 0 auto 25px;
    border-radius: 50px;
    box-shadow: 0 2px 15px rgba(253, 208, 23, 0.20);
}

.hero--family .hero__subtitle--family {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.2rem);
    line-height: 1.8;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .hero--family {
        margin-top: 0 !important;
        min-height: 350px !important;
        padding: 10px 20px !important;
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        border-radius: 0 0 16px 16px;
        align-items: flex-end; /* ✅ CONTENU EN BAS */
    }

    .hero--family .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.20) 0%,
            rgba(0, 0, 0, 0.30) 30%,
            rgba(0, 0, 0, 0.50) 60%,
            rgba(0, 0, 0, 0.70) 100%
        );
    }

    .hero--family .hero__content--center {
        margin-top: 30px !important;
        padding: 10px 8px !important;
        left: -11% !important;
        border-radius: 12px !important;
        background: rgba(0, 0, 0, 0.35) !important;
        backdrop-filter: blur(3px) !important;
        max-width: 65% !important;
        margin: 0 auto 10px auto ;
        position: relative ;
    }

    .hero--family .hero__title--family {
        font-size: clamp(1.7rem, 3vw + 0.4rem, 1.8rem) !important;
        margin-bottom: 12px !important;
    }

    .hero--family .hero__subtitle--family {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
        color: rgba(255, 255, 255, 0.92);
    }

    .hero--family .hero__divider--family {
        width: 40px !important;
        height: 2px !important;
        margin-bottom: 24px !important;
    }

    .hero--family .hero__label {
        font-size: 0.6rem !important;
        letter-spacing: 1.5px !important;
        margin-bottom: 20px !important;
        margin-top: 20px !important;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .hero--family {
        min-height: 350px !important;
        padding: 0px 10px !important;
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        border-radius: 0 0 12px 12px;
        align-items: flex-end;
    }

    .hero--family .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 12px 12px;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.25) 0%,
            rgba(0, 0, 0, 0.35) 30%,
            rgba(0, 0, 0, 0.55) 60%,
            rgba(0, 0, 0, 0.75) 100%
        );
    }

    .hero--family .hero__content--center {
        margin-top: 30px !important;
        padding: 18px 16px !important;
        border-radius: 10px !important;
        background: rgba(0, 0, 0, 0.40) !important;
        backdrop-filter: blur(2px) !important;
        max-width: 78% !important;
        margin: 0 auto 5px auto !important;
    }

    .hero--family .hero__title--family {
        font-size: clamp(1.5rem, 2.5vw + 0.3rem, 1.5rem) !important;
        margin-bottom: 10px !important;
    }

    .hero--family .hero__subtitle--family {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }

    .hero--family .hero__divider--family {
        width: 35px !important;
        height: 2px !important;
        margin-bottom: 12px !important;
    }

    .hero--family .hero__label {
        font-size: 0.55rem !important;
        letter-spacing: 1px !important;
        margin-bottom: 20px !important;
        margin-top: 40px !important;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .hero--family {
        min-height: 350px;
        padding: 30px 0 120px !important;
        background-size: 100% 100% !important;
        background-position: center bottom !important;
        border-radius: 0 0 10px 10px !important;
        align-items: flex-end !important;
    }

    .hero--family .hero__overlay {
        height: 100% !important;
        border-radius: 0 0 10px 10px !important;
        background: linear-gradient(180deg, 
            rgba(0, 0, 0, 0.30) 0%,
            rgba(0, 0, 0, 0.40) 30%,
            rgba(0, 0, 0, 0.60) 60%,
            rgba(0, 0, 0, 0.80) 100%
        ) !important;
    }

    .hero--family .hero__content--center {
        top: 20px !important;
        padding: 14px 12px !important;
        border-radius: 8px !important;
        background: rgba(0, 0, 0, 0.45) !important;
        max-width: 100% !important;
        margin: 0 auto 5px auto !important;
    }

    .hero--family .hero__title--family {
        font-size: clamp(1rem, 2vw + 0.2rem, 1.2rem) !important;
        margin-bottom: 8px !important;
    }

    .hero--family .hero__subtitle--family {
        font-size: 0.75rem !important;
        line-height: 1.3 !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }

    .hero--family .hero__divider--family {
        width: 30px !important;
        height: 1.5px !important;
        margin-bottom: 10px !important;
    }

    .hero--family .hero__label {
        font-size: 0.5rem !important;
        letter-spacing: 0.5px !important;
        margin-bottom: 4px !important;
        margin-top: 20px !important;
    }
}





/* ============================================
   SECTION : RESTORING PEACE AT HOME
   ============================================ */

.section--peace-home {
    margin-top: 10px;
    padding: 70px 0 80px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 20px 20px 20px 20px;
}

/* Décoration de fond */
.section--peace-home::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--peace-home::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--peace-home .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== TITRE ===== */
.peace-home__header {
    text-align: center;
    margin-bottom: 35px;
}

.peace-home__title {
    font-size: clamp(1.8rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.peace-home__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.peace-home__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin: 16px auto 0;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== TEXTE ===== */
.peace-home__content {
    max-width: 820px;
    margin: 0 auto 35px;
}

.peace-home__text {
    font-size: clamp(1rem, 1.1vw + 0.3rem, 1.15rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 18px;
}

.peace-home__text--highlight {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    position: relative;
    padding: 20px 25px 20px 30px;
    background: rgba(253, 208, 23, 0.04);
    border-radius: 12px;
    border-left: 4px solid #FDD017;
}

.peace-home__text--highlight::before {
    content: '"';
    position: absolute;
    left: -15px;
    top: -5px;
    font-size: 3.5rem;
    color: rgba(253, 208, 23, 0.08);
    font-family: Georgia, serif;
}

/* ===== BOUTON ===== */
.peace-home__cta {
    text-align: center;
}

.peace-home__btn {
    display: inline-block;
    padding: 14px 45px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    color: #0A0A0A;
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 30px rgba(253, 208, 23, 0.30);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}

.peace-home__btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 8px 40px rgba(253, 208, 23, 0.50);
    background: linear-gradient(135deg, #FFE033, #FDD017);
    color: #0A0A0A;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--peace-home {
        padding: 60px 0 70px;
    }

    .section--peace-home::before,
    .section--peace-home::after {
        width: 350px;
        height: 350px;
    }

    .peace-home__header {
        margin-bottom: 28px;
    }

    .peace-home__title {
        font-size: clamp(1.6rem, 2.5vw + 1rem, 2.4rem);
    }

    .peace-home__divider {
        width: 50px;
        height: 2.5px;
    }

    .peace-home__text {
        font-size: 1rem;
        line-height: 1.7;
    }

    .peace-home__text--highlight {
        padding: 16px 20px 16px 24px;
    }

    .peace-home__btn {
        padding: 12px 35px;
        font-size: 14px;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--peace-home {
        padding: 40px 0 50px;
    }

    .section--peace-home::before,
    .section--peace-home::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .peace-home__header {
        margin-bottom: 22px;
    }

    .peace-home__title {
        font-size: clamp(1.3rem, 3vw + 0.5rem, 1.8rem);
    }

    .peace-home__divider {
        width: 45px;
        height: 2px;
    }

    .peace-home__content {
        margin-bottom: 28px;
    }

    .peace-home__text {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 14px;
    }

    .peace-home__text--highlight {
        padding: 14px 16px 14px 20px;
        border-left-width: 3px;
    }

    .peace-home__text--highlight::before {
        font-size: 2.5rem;
        left: -10px;
        top: -3px;
    }

    .peace-home__btn {
        padding: 12px 30px;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--peace-home {
        padding: 30px 0 40px;
    }

    .section--peace-home::before,
    .section--peace-home::after {
        display: none;
    }

    .peace-home__header {
        margin-bottom: 18px;
    }

    .peace-home__title {
        font-size: clamp(1.1rem, 3vw + 0.3rem, 1.5rem);
    }

    .peace-home__divider {
        width: 40px;
        height: 2px;
    }

    .peace-home__content {
        margin-bottom: 22px;
    }

    .peace-home__text {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }

    .peace-home__text--highlight {
        padding: 12px 14px 12px 18px;
        border-left-width: 2px;
    }

    .peace-home__text--highlight::before {
        font-size: 2rem;
        left: -8px;
        top: -2px;
    }

    .peace-home__btn {
        padding: 10px 24px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--peace-home {
        padding: 20px 0 30px;
    }

    .peace-home__title {
        font-size: 1rem;
    }

    .peace-home__divider {
        width: 35px;
        height: 1.5px;
    }

    .peace-home__text {
        font-size: 0.85rem;
        line-height: 1.4;
        margin-bottom: 10px;
    }

    .peace-home__text--highlight {
        padding: 10px 12px 10px 16px;
    }

    .peace-home__text--highlight::before {
        font-size: 1.8rem;
        left: -6px;
    }

    .peace-home__btn {
        padding: 8px 20px;
        font-size: 11px;
    }
}





/* ============================================
   SECTION : FAMILY HARMONY SERVICES
   ============================================ */

/* ===== STRUCTURE COMMUNE ===== */
.section--family-block {
    margin-top: 10px;
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 25px 25px;
}

/* Décoration de fond - cercles lumineux */
.section--family-block::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--family-block::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--family-block .container-reg {
    position: relative;
    z-index: 1;
}

.family-block__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

.family-block__left {
    flex: 1 1 35%;
    min-width: 250px;
}

.family-block__title {
    font-size: clamp(2rem, 3vw + 1rem, 3.2rem);
    font-weight: 700;
    color: #FFFFFF;
    margin: 0;
    line-height: 1.2;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.family-block__title span {
    background: linear-gradient(135deg, #FDD017, #FFE066);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.family-block__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

.family-block__right {
    flex: 1 1 50%;
    min-width: 300px;
}

.family-block__card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 24px;
    padding: 40px 45px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.10);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.family-block__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 50px rgba(0, 0, 0, 0.20);
    border-color: rgba(253, 208, 23, 0.06);
}

.family-block__text {
    font-size: clamp(0.95rem, 0.9vw + 0.3rem, 1.05rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin: 0 0 14px 0;
}

.family-block__text strong {
    color: #FDD017;
}

.family-block__text:last-of-type {
    margin-bottom: 0;
}

.family-block__cta {
    text-align: center;
    margin-top: 28px;
}

.family-block__btn {
    display: inline-block;
    font-weight: 600;
    font-size: 1rem;
    color: #FDD017;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.family-block__btn:hover {
    color: #FFFFFF;
    border-bottom-color: #FDD017;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--family-block {
        padding: 50px 0 60px;
    }

    .section--family-block::before,
    .section--family-block::after {
        width: 350px;
        height: 350px;
    }

    .family-block__grid {
        flex-direction: column;
        gap: 35px;
        text-align: center;
    }

    .family-block__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .family-block__divider {
        margin: 14px auto 0;
    }

    .family-block__right {
        flex: 1 1 100%;
    }

    .family-block__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.6rem);
    }

    .family-block__card {
        padding: 32px 30px;
        border-radius: 20px;
    }

    .family-block__text {
        font-size: 0.95rem;
        line-height: 1.7;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--family-block {
        padding: 40px 0 50px;
    }

    .section--family-block::before,
    .section--family-block::after {
        width: 250px;
        height: 250px;
        top: -100px;
        bottom: -100px;
    }

    .family-block__grid {
        gap: 25px;
    }

    .family-block__title {
        font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
    }

    .family-block__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .family-block__card {
        padding: 25px 22px;
        border-radius: 16px;
    }

    .family-block__text {
        font-size: 0.9rem;
        line-height: 1.6;
        margin-bottom: 10px;
    }

    .family-block__cta {
        margin-top: 20px;
    }

    .family-block__btn {
        font-size: 0.9rem;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--family-block {
        padding: 30px 0 40px;
    }

    .section--family-block::before,
    .section--family-block::after {
        display: none;
    }

    .family-block__title {
        font-size: clamp(1.3rem, 3vw + 0.3rem, 1.7rem);
    }

    .family-block__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .family-block__card {
        padding: 20px 18px;
        border-radius: 14px;
        backdrop-filter: blur(2px);
    }

    .family-block__text {
        font-size: 0.85rem;
        line-height: 1.5;
        margin-bottom: 8px;
    }

    .family-block__btn {
        font-size: 0.85rem;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--family-block {
        padding: 20px 0 30px;
    }

    .family-block__title {
        font-size: 1.1rem;
    }

    .family-block__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .family-block__card {
        padding: 16px 14px;
        border-radius: 12px;
    }

    .family-block__text {
        font-size: 0.8rem;
        line-height: 1.4;
        margin-bottom: 6px;
    }

    .family-block__btn {
        font-size: 0.8rem;
    }
}




/* ============================================
   SECTION : YOU ARE NOT ALONE
   ============================================ */

.section--not-alone {
    padding: 60px 0 70px;
    background: linear-gradient(180deg, 
        rgba(10, 10, 10, 0.95) 0%,
        rgba(15, 15, 15, 0.90) 30%,
        rgba(20, 20, 20, 0.85) 60%,
        rgba(15, 15, 15, 0.90) 85%,
        rgba(10, 10, 10, 0.95) 100%
    );
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(253, 208, 23, 0.04);
    border-bottom: 1px solid rgba(253, 208, 23, 0.04);
}

/* ✅ Décoration de fond - cercles lumineux */
.section--not-alone::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(253, 208, 23, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--not-alone::after {
    content: '';
    position: absolute;
    bottom: -150px;
    right: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(46, 139, 87, 0.04) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
}

.section--not-alone .container-reg {
    position: relative;
    z-index: 1;
}

/* ===== GRILLE ===== */
.not-alone__grid {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

/* ===== GAUCHE ===== */
.not-alone__left {
    flex: 1 1 40%;
    min-width: 250px;
}

.not-alone__title {
    font-size: clamp(2rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 30px rgba(0, 0, 0, 0.3);
}

.not-alone__divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    margin-top: 14px;
    border-radius: 50px;
    box-shadow: 0 0 30px rgba(253, 208, 23, 0.08);
}

/* ===== DROITE ===== */
.not-alone__right {
    flex: 1 1 45%;
    min-width: 280px;
}

.not-alone__text {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.1rem);
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.75);
    margin: 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */

/* ----- TABLETTE (max-width: 992px) ----- */
@media (max-width: 992px) {
    .section--not-alone {
        padding: 50px 0 60px;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        width: 300px;
        height: 300px;
    }

    .not-alone__grid {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }

    .not-alone__left {
        flex: 1 1 100%;
        text-align: center;
    }

    .not-alone__divider {
        margin: 14px auto 0;
    }

    .not-alone__right {
        flex: 1 1 100%;
        text-align: center;
    }

    .not-alone__title {
        font-size: clamp(1.8rem, 2.5vw + 1rem, 2.5rem);
    }

    .not-alone__text {
        max-width: 550px;
        margin: 0 auto;
    }
}

/* ----- MOBILE (max-width: 768px) ----- */
@media (max-width: 768px) {
    .section--not-alone {
        padding: 40px 0 50px;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        width: 200px;
        height: 200px;
        top: -100px;
        bottom: -100px;
    }

    .not-alone__grid {
        gap: 20px;
    }

    .not-alone__title {
        font-size: clamp(1.6rem, 3vw + 0.5rem, 2rem);
    }

    .not-alone__divider {
        width: 50px;
        height: 2.5px;
        margin: 12px auto 0;
    }

    .not-alone__text {
        font-size: 0.95rem;
        line-height: 1.6;
    }
}

/* ----- PETIT MOBILE (max-width: 576px) ----- */
@media (max-width: 576px) {
    .section--not-alone {
        padding: 30px 0 40px;
    }

    .section--not-alone::before,
    .section--not-alone::after {
        display: none;
    }

    .not-alone__grid {
        gap: 16px;
    }

    .not-alone__title {
        font-size: clamp(1.4rem, 3vw + 0.3rem, 1.8rem);
    }

    .not-alone__divider {
        width: 40px;
        height: 2px;
        margin: 10px auto 0;
    }

    .not-alone__text {
        font-size: 0.9rem;
        line-height: 1.5;
    }
}

/* ----- TRÈS PETIT MOBILE (max-width: 380px) ----- */
@media (max-width: 380px) {
    .section--not-alone {
        padding: 20px 0 30px;
    }

    .not-alone__title {
        font-size: 1.2rem;
    }

    .not-alone__divider {
        width: 35px;
        height: 1.5px;
        margin: 8px auto 0;
    }

    .not-alone__text {
        font-size: 0.85rem;
        line-height: 1.4;
    }
}



/* ============================================
   MENU MOBILE - Z-INDEX CORRIGÉ
   ============================================ */

.mobile-header {
    display: none;
    background: #0A0A0A;
    color: #FDD017;
    padding: 15px 20px;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 10000; /* ✅ AJOUTÉ */
    border-bottom: 1px solid rgba(253, 208, 23, 0.1);
}

.mobile-header .logo {
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #FDD017, #2E8B57);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.mobile-header .hamburger {
    display: block !important;
    cursor: pointer;
    padding: 10px 15px;
    border-radius: 50%;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: none;
    border: none;
    position: relative;
    width: 50px;
    height: 44px;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.hamburger-line {
    display: block;
    width: 28px;
    height: 4px;
    background: #FDD017;
    border-radius: 4px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.mobile-header .hamburger:hover {
    background: rgba(253, 208, 23, 0.10);
    transform: rotate(90deg);
}

.mobile-header .hamburger:hover .hamburger-line {
    background: #FFFFFF;
    width: 32px;
}

.mobile-nav {
    display: none;
    background: #0A0A0A;
    flex-direction: column;
    padding: 10px 0;
    border-bottom: 2px solid rgba(253, 208, 23, 0.15);
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    z-index: 9999; /* ✅ AJOUTÉ */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30);
}

.mobile-nav.active {
    display: flex;
}

.mobile-nav a {
    color: #FDD017;
    padding: 14px 25px;
    border-bottom: 1px solid rgba(253, 208, 23, 0.08);
    text-align: center;
    font-weight: 500;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: #0A0A0A;
}

.mobile-nav a:last-child {
    border-bottom: none;
}

.mobile-nav a:hover {
    background: rgba(253, 208, 23, 0.1);
    color: #FFFFFF;
    padding-left: 35px;
}

.mobile-nav a.active {
    color: #0A0A0A;
    background-color: #FDD017;
    border-radius: 5px;
}















































/* ============================================
   STICKY TOP BAR - VERSION ULTRA FINE
   ============================================ */

   .sticky-top-bar {
    position: fixed;
    top: 81px;
    left: 67%;
    right: 0;
    display: flex;
    justify-content: center;
    pointer-events: none;
    padding: 0 15px;
    z-index: 10000;
    will-change: transform, opacity; /* ✅ Améliore les performances */
}

.sticky-top-bar-inner {
    width: auto;
    max-width: 430px;
    background: linear-gradient(135deg, rgba(136, 136, 136, 0.85), rgba(255, 217, 0, 0.349));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 20px 20px 7px 7px;
    padding: 2px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0px;
    box-shadow: 
        0 8px 30px rgba(0, 0, 0, 0.10),
        inset 0 1px 0 rgba(255, 217, 0, 0.363);
    border: 1px solid rgba(255, 215, 0, 0.25);
    pointer-events: auto;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    flex-wrap: wrap;
    min-height: 22px;
    
    
    /* Effet flottant très doux */
    animation: floatBar 6s ease-in-out infinite;
}

@keyframes floatBar {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-2px); }
}

.sticky-top-bar-inner:hover {
    animation-play-state: paused;
    background: rgba(10, 10, 10, 0.40);
    border-color: rgba(253, 208, 23, 0.10);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.15);
}

/* ===== BRAND ===== */
.sticky-brand {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    
}

.sticky-icon {
    font-size: 12px;
    color: #FDD017;
}

.sticky-title {
    font-size: 9px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.80);
    letter-spacing: 0.8px;
    text-transform: uppercase;
    white-space: nowrap;
}

/* ===== SEPARATEUR ===== */
.sticky-divider {
    color: rgba(255, 255, 255, 0.06);
    font-size: 6px;
    flex-shrink: 0;
}

/* ===== LIENS SERVICES - PLUS VISIBLES ===== */
.sticky-links {
    display: flex;
    align-items: center;
    gap: 1px;
    flex-wrap: wrap;
}

.sticky-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 1px 5px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 8px;
    font-weight: 550px;
    color: rgba(255, 255, 255, 0.70); /* ✅ Plus visible */
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: rgba(255, 255, 255, 0.02);
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, 0.02);
}

.sticky-link:hover {
    background: rgba(253, 208, 23, 0.08);
    color: #FDD017;
    border-color: rgba(253, 208, 23, 0.08);
    transform: translateY(-1px);
}

.sticky-link span {
    font-size: 8px;
}

.sticky-link-text {
    font-size: 9px !important;
    font-weight: 900;
}

/* ===== CONTACTS - PLUS VISIBLES ===== */
.sticky-contacts {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.sticky-contact {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 1px 4px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 7px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.55); /* ✅ Plus visible */
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    background: rgba(255, 255, 255, 0.01);
    white-space: nowrap;
}

.sticky-contact:hover {
    color: rgba(255, 255, 255, 0.85);
    background: rgba(255, 255, 255, 0.03);
}

.sticky-contact span {
    font-size: 12px;
}

.sticky-contact-text {
    font-size: 6px;
}

/* ===== CTA BUTTON ===== */
.sticky-cta {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 1px 8px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 7px;
    font-weight: 700;
    color: #0A0A0A;
    background: linear-gradient(135deg, #FDD017, #E8B800);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    white-space: nowrap;
    box-shadow: 0 1px 8px rgba(253, 208, 23, 0.08);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.sticky-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 16px rgba(253, 208, 23, 0.15);
    background: linear-gradient(135deg, #FFE033, #FDD017);
}

.sticky-cta span {
    font-size: 10px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1200px) {
    .sticky-top-bar-inner {
        padding: 2px 10px;
        gap: 3px;
        max-width: 450px;
    }
}

@media (max-width: 992px) {
    .sticky-top-bar {
        top: 72px;
        left: 25%;
    }
    
    .sticky-top-bar-inner {
        padding: 2px 8px;
        gap: 2px;
        min-height: 24px;
        border-radius: 40px;
        max-width: 400px;
    }
    
    .sticky-title {
        font-size: 8px;
    }
    
    .sticky-link {
        padding: 2px 6px;
        font-size: 7px;
        color: rgba(255, 255, 255, 0.65);
    }
    
    .sticky-link span {
        font-size: 7px;
    }
    
    .sticky-link-text {
        font-size: 6px;
    }
    
    .sticky-contact {
        padding: 2px 5px;
        font-size: 7px;
        color: rgba(255, 255, 255, 0.50);
    }
    
    .sticky-contact span {
        font-size: 7px;
    }
    
    .sticky-contact-text {
        font-size: 6px;
    }
    
    .sticky-cta {
        padding: 2px 8px;
        font-size: 7px;
    }
    
    .sticky-cta span {
        font-size: 7px;
    }
    
    .sticky-divider {
        font-size: 6px;
    }
}

@media (max-width: 768px) {
    .sticky-top-bar {
        top: 75px;
        left: 55%;
        padding: 0 -12px;
    }
    
    .sticky-top-bar-inner {
        background: linear-gradient(135deg, rgba(136, 136, 136, 0.85), rgba(255, 217, 0, 0.253));
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        width: 600px !important;
        max-width: 550px !important;
        padding: 3px 6px;
        gap: 1;
        border-radius: 20px;
        min-height: 22px;
        
        backdrop-filter: blur(12px);
    }
    
    .sticky-brand {
        display: none;
    }
    
    .sticky-divider {
        display: none;
    }
    
    .sticky-links {
        width: 100%;
        gap: 1px;
        justify-content: center;
    }
    
    .sticky-link {
        padding: 2px 5px;
        font-size: 7px;
        color: rgba(255, 255, 255, 0.70);
    }
    
    .sticky-link span {
        font-size: 7px;
    }
    
    .sticky-link-text {
        font-size: 6px;
    }
    
    .sticky-contacts {
        width: 100%;
        gap: 1px;
        justify-content: center;
    }
    
    .sticky-contact {
        padding: 2px 5px;
        font-size: 7px;
        color: rgba(255, 255, 255, 0.55);
    }
    
    .sticky-contact span {
        font-size: 7px;
    }
    
    .sticky-contact-text {
        font-size: 6px;
    }
    
    .sticky-cta {
        padding: 2px 8px;
        font-size: 7px;
        border-radius: 30px;
    }
    
    .sticky-cta span {
        font-size: 7px;
    }
}

@media (max-width: 480px) {
    .sticky-top-bar {
        top: 58px;
        padding: 0 4px;
    }
    
    .sticky-top-bar-inner {
        padding: 2px 4px;
        min-height: 18px;
        border-radius: 20px;
        gap: 1px;
        background: rgba(10, 10, 10, 0.35);
    }
    
    .sticky-link {
        padding: 1px 4px;
        font-size: 6px;
        color: rgba(255, 255, 255, 0.65);
    }
    
    .sticky-link span {
        font-size: 6px;
    }
    
    .sticky-link-text {
        font-size: 5px;
    }
    
    .sticky-contact {
        padding: 1px 4px;
        font-size: 6px;
        color: rgba(255, 255, 255, 0.50);
    }
    
    .sticky-contact span {
        font-size: 6px;
    }
    
    .sticky-contact-text {
        font-size: 5px;
    }
    
    .sticky-cta {
        padding: 1px 6px;
        font-size: 6px;
        border-radius: 20px;
    }
    
    .sticky-cta span {
        font-size: 6px;
    }
}
























/* ============================================
   CHATBOT - TOUTES LANGUES (LTR UNIQUEMENT)
   ============================================ */

#chatbot-widget {
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;  /* Toujours à droite */
    z-index: 9999 !important;
}

#chatbot-container {
    position: absolute !important;
    bottom: 70px !important;
    right: 0 !important;  /* Toujours à droite */
    width: 350px !important;
    height: 450px !important;
    border-radius: 15px !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.2) !important;
    overflow: hidden !important;
}

#chatbot-toggle {
    background: #C9A84C !important;
    border: none !important;
    border-radius: 50% !important;
    width: 60px !important;
    height: 60px !important;
    font-size: 30px !important;
    cursor: pointer !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2) !important;
    transition: all 0.3s ease !important;
}

#chatbot-toggle:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 6px 30px rgba(0,0,0,0.25) !important;
}

/* Version arabe - UNIQUEMENT LA POLICE */
html[lang="ar"] .chatbot-container .rcw-widget-container {
    font-family: 'Noto Sans Arabic', sans-serif !important;
}