/* ==========================================================================
                       STYLE2.CSS - Extension pour les pages secondaires (À Propos, etc.)
                       ========================================================================== */
                    
                    /* Page À Propos - Image de mise en avant */
                    .about-hero-image {
                        width: 100%;
                        max-height: 400px;
                        overflow: hidden;
                        border-radius: 12px;
                        margin-bottom: 40px;
                    }
                    
                    .about-hero-image img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                    
                    /* Page À Propos - Structure du contenu */
                    .about-content {
                        display: grid;
                        grid-template-columns: 2fr 1fr;
                        gap: 40px;
                        align-items: start;
                    }
                    
                    .about-text h2, 
                    .about-text h3 {
                        margin-bottom: 15px;
                        color: #333;
                    }
                    
                    .about-text p {
                        line-height: 1.7;
                        margin-bottom: 20px;
                        color: #555;
                    }
                    
                    .about-products-list {
                        list-style: none;
                        padding: 0;
                        margin-bottom: 30px;
                    }
                    
                    .about-products-list li {
                        margin-bottom: 12px;
                        line-height: 1.5;
                    }
                    
                    .about-products-list i {
                        color: #d4a373;
                        margin-right: 8px;
                    }
                    
                    /* Carte PDG (Elvidiane François) */
                    .about-ceo-card {
                        background: #f7fcf0;
                        border: 1px solid #eee;
                        border-radius: 12px;
                        padding: 25px;
                        text-align: center;
                        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
                    }
                    
                    .ceo-photo-container {
                        width: 150px;
                        height: 150px;
                        margin: 0 auto 20px;
                        border-radius: 50%;
                        overflow: hidden;
                        border: 4px solid #fff;
                        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
                    }
                    
                    .ceo-photo {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                    
                    .about-ceo-card h4 {
                        margin: 0 0 5px;
                        font-size: 1.2rem;
                    }
                    
                    .ceo-title {
                        display: block;
                        color: #888;
                        font-size: 0.9rem;
                        margin-bottom: 15px;
                    }
                    
                    .ceo-quote {
                        font-style: italic;
                        color: #555;
                        font-size: 0.95rem;
                        margin: 0;
                        padding-top: 10px;
                        border-top: 1px solid #eee;
                    }
                    
                    /* Responsive Tablette / Mobile */
                    @media (max-width: 768px) {
                        .about-content {
                            grid-template-columns: 1fr;
                        }
                    }
                    
                    
                    /* ==========================================================================
                       STYLE2.CSS - Extension (À Propos & Menu Hamburger Animé)
                       ========================================================================== */
                    
                    /* --- 1. PAGE À PROPOS --- */
                    .about-hero-image {
                        width: 100%;
                        max-height: 400px;
                        overflow: hidden;
                        border-radius: 12px;
                        margin-bottom: 40px;
                    }
                    
                    .about-hero-image img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                    
                    .about-content {
                        display: grid;
                        grid-template-columns: 2fr 1fr;
                        gap: 40px;
                        align-items: start;
                    }
                    
                    .about-text h2, 
                    .about-text h3 {
                        margin-bottom: 15px;
                        color: #333;
                    }
                    
                    .about-text p {
                        line-height: 1.7;
                        margin-bottom: 20px;
                        color: #555;
                    }
                    
                    .about-products-list {
                        list-style: none;
                        padding: 0;
                        margin-bottom: 30px;
                    }
                    
                    .about-products-list li {
                        margin-bottom: 12px;
                        line-height: 1.5;
                    }
                    
                    .about-products-list i {
                        color: #d4a373;
                        margin-right: 8px;
                    }
                    
                    /* Carte PDG (Elvidiane François) */
                    .about-ceo-card {
                        background: #fdfbf7;
                        border: 1px solid #eee;
                        border-radius: 12px;
                        padding: 25px;
                        text-align: center;
                        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
                    }
                    
                    .ceo-photo-container {
                        width: 150px;
                        height: 150px;
                        margin: 0 auto 20px;
                        border-radius: 50%;
                        overflow: hidden;
                        border: 4px solid #fff;
                        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
                    }
                    
                    .ceo-photo {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                    
                    .about-ceo-card h4 {
                        margin: 0 0 5px;
                        font-size: 1.2rem;
                    }
                    
                    .ceo-title {
                        display: block;
                        color: #888;
                        font-size: 0.9rem;
                        margin-bottom: 15px;
                    }
                    
                    .ceo-quote {
                        font-style: italic;
                        color: #555;
                        font-size: 0.95rem;
                        margin: 0;
                        padding-top: 10px;
                        border-top: 1px solid #eee;
                    }
                    
                    
                    /* Responsive pour les tablettes et mobiles */
                        @media (max-width: 768px) {
                            .about-content {
                                grid-template-columns: 1fr !important;
                                gap: 30px;
                            }
                        }
                        
                        
                    
                    /* --- 2. MENU HAMBURGER & ANIMATION MOBILE --- */
                    /* .burger-btn {
                        display: none;
                        background: none;
                        border: none;
                        font-size: 1.5rem;
                        cursor: pointer;
                        color: #333;
                        padding: 5px;
                        z-index: 1001;
                        transition: transform 0.3s ease;
                    }
                    
                    .burger-btn i {
                        transition: transform 0.3s ease, opacity 0.3s ease;
                    }
                    
                    .burger-btn:hover {
                        transform: scale(1.1);
                    }
                    
                    /* Styles pour les mobiles et tablettes (écrans <= 768px) */
                   /*  @media (max-width: 768px) {
                        .burger-btn {
                            display: block;
                        }
                    
                        .nav-menu {
                            display: flex;
                            flex-direction: column;
                            position: absolute;
                            top: 100%;
                            left: 0;
                            width: 100%;
                            background-color: #ffffff;
                            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
                            padding: 0;
                            max-height: 0;
                            overflow: hidden;
                            opacity: 0;
                            visibility: hidden;
                            transition: max-height 0.4s ease-in-out, opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
                            z-index: 1000;
                        }
                    
                    
                        .nav-menu.active {
                                display: flex !important;
                                max-height: 500px !important;
                                opacity: 1 !important;
                                visibility: visible !important;
                                padding: 20px 0 !important;
                            }
                    
                    
                        .nav-menu ul {
                            flex-direction: column;
                            align-items: center;
                            gap: 15px;
                            list-style: none;
                            padding: 0;
                            margin: 0;
                            width: 100%;
                        }
                    
                        .nav-menu ul li {
                            width: 100%;
                            text-align: center;
                        }
                    
                        .nav-menu ul li a {
                            font-size: 1.1rem;
                            color: #333;
                            text-decoration: none;
                            display: block;
                            padding: 8px 15px;
                            transition: color 0.2s ease, background-color 0.2s ease;
                        }
                    
                        .nav-menu ul li a:hover {
                            color: #d4a373;
                            background-color: #fdfbf7;
                        }
                    
                        .about-content {
                            grid-template-columns: 1fr;
                        }
                    }
                    */
                    
                    
                    
                    /* ==========================================================================
                       STYLE PAGE CONTACT
                       ========================================================================== */
                    .contact-hero-image {
                        width: 100%;
                        max-height: 350px;
                        overflow: hidden;
                        border-radius: 12px;
                        margin-bottom: 40px;
                    }
                    
                    .contact-hero-image img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                    
                    .contact-grid {
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        gap: 50px;
                        align-items: start;
                        margin-bottom: 50px;
                    }
                    
                    .contact-info h2 {
                        color: #333;
                        margin-bottom: 20px;
                    }
                    
                    .contact-info p {
                        color: #555;
                        line-height: 1.7;
                        margin-bottom: 15px;
                    }
                    
                    .contact-details {
                        margin-top: 30px;
                        padding: 20px;
                        background: #fdfbf7;
                        border-radius: 8px;
                        border: 1px solid #eee;
                       
                    }
                    
                    .contact-details p {
                        margin-bottom: 10px;
                        color: #333;
                         margin-right : 10px;
                        margin-left : 10px;
                    }
                    
                    .contact-details i {
                        color: #d4a373;
                        margin-right: 10px;
                    }
                    
                    /* Formulaire */
                    .contact-form-container {
                        background: #ffffff;
                        padding: 30px;
                        border-radius: 12px;
                        box-shadow: 0 4px 20px rgba(0,0,0,0.05);
                        border: 1px solid #eee;
                    }
                    
                    .contact-form .form-group {
                        margin-bottom: 20px;
                    }
                    
                    .contact-form label {
                        display: block;
                        margin-bottom: 8px;
                        font-weight: 500;
                        color: #333;
                        font-size: 0.95rem;
                    }
                    
                    .contact-form .required {
                        color: #d90429;
                    }
                    
                    .contact-form input[type="text"],
                    .contact-form input[type="email"],
                    .contact-form input[type="tel"],
                    .contact-form textarea {
                        width: 100%;
                        padding: 12px;
                        border: 1px solid #ddd;
                        border-radius: 6px;
                        font-size: 1rem;
                        font-family: inherit;
                        transition: border-color 0.3s ease;
                    }
                    
                    .contact-form input:focus,
                    .contact-form textarea:focus {
                        outline: none;
                        border-color: #d4a373;
                    }
                    
                    .contact-form textarea {
                        resize: vertical;
                    }
                    
                    .btn-submit {
                        width: 100%;
                        padding: 12px;
                        background-color: #333;
                        color: #fff;
                        border: none;
                        border-radius: 6px;
                        font-size: 1rem;
                        font-weight: 600;
                        cursor: pointer;
                        transition: background-color 0.3s ease;
                    }
                    
                    .btn-submit:hover {
                        background-color: #d4a373;
                    }
                    
                    /* Alertes de succès / erreur */
                    .alert {
                        padding: 12px 15px;
                        border-radius: 6px;
                        margin-bottom: 20px;
                        font-size: 0.95rem;
                    }
                    
                    .alert-success {
                        background-color: #d8f3dc;
                        color: #2d6a4f;
                        border: 1px solid #b7e4c7;
                    }
                    
                    .alert-error {
                        background-color: #ffe5ec;
                        color: #d90429;
                        border: 1px solid #ffb3c6;
                    }
                    
                    /* Responsive */
                    @media (max-width: 768px) {
                        .contact-grid {
                            grid-template-columns: 1fr;
                            gap: 30px;
                        }
                        
                    
                    }
                    
                    
                    /* Ajout de marges à gauche et à droite sur mobile pour la page contact */
                    @media (max-width: 768px) {
                        /* Ajoute un espacement autour de toute la section de contact */
                        .contact-section .container {
                            padding-left: 20px;
                            padding-right: 20px;
                            margin-top : 40px;
                        }
                    
                        /* Optionnel : si tu veux un espacement interne spécifique sur le bloc de texte */
                        .contact-info {
                            padding: 0 10px;
                        }
                    }
                        
                        
                         /* ==========================================================================
                       SECTION EFFICACITÉ (ISOLÉE - SANS CONFLIT)
                       ========================================================================== */
                    .efficacy-section {
                        padding: 60px 0;
                        background-color: #fdfbf7;
                    }
                    
                    .efficacy-container {
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        gap: 40px;
                        align-items: center;
                    }
                    
                    .efficacy-image-wrapper {
                        width: 100%;
                        max-height: 450px;
                        overflow: hidden;
                        border-radius: 12px;
                        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
                    }
                    
                    .efficacy-img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        display: block;
                    }
                    
                    .efficacy-content {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                    }
                    
                    .efficacy-title {
                        font-size: 2rem;
                        color: #333333;
                        margin-bottom: 10px;
                    }
                    
                    .efficacy-subtitle {
                        font-size: 1.1rem;
                        color: #d4a373;
                        font-weight: 500;
                        margin-bottom: 20px;
                    }
                    
                    .efficacy-description {
                        line-height: 1.7;
                        color: #555555;
                        margin-bottom: 25px;
                    }
                    
                    .efficacy-benefit-list {
                        list-style: none;
                        padding: 0;
                        margin: 0 0 30px 0;
                    }
                    
                    .efficacy-benefit-list li {
                        font-size: 1rem;
                        color: #444444;
                        margin-bottom: 12px;
                        display: flex;
                        align-items: center;
                    }
                    
                    .efficacy-benefit-list i {
                        color: #d4a373;
                        margin-right: 10px;
                        font-size: 1.1rem;
                    }
                    
                    .efficacy-btn {
                        display: inline-block;
                        padding: 12px 28px;
                        background-color: #688a5f;
                        color: #ffffff;
                        text-decoration: none;
                        border-radius: 6px;
                        font-weight: 600;
                        transition: background-color 0.3s ease, transform 0.2s ease;
                    }
                    
                    .efficacy-btn:hover {
                        background-color: #d4a373;
                        transform: translateY(-2px);
                    }
                    
                    /* Responsive Tablette / Mobile */
                    @media (max-width: 768px) {
                        .efficacy-section {
                            padding: 40px 15px;
                        }
                    
                        .efficacy-container {
                            grid-template-columns: 1fr;
                            gap: 30px;
                        }
                    
                        .efficacy-title {
                            font-size: 1.6rem;
                        }
                    
                        .efficacy-image-wrapper {
                            max-height: 300px;
                        }
                    }