/* =====================================================
                       JCARMEL STORE - MENU HAMBURGER RESPONSIVE
                    ===================================================== */
                    
                    /* BOUTON BURGER */
                    
                    .burger-btn {
                        display: none;
                        background: transparent;
                        border: none;
                        font-size: 1.5rem;
                        cursor: pointer;
                        color: var(--text-color, #333);
                        padding: 8px;
                        z-index: 1002;
                        transition: transform 0.3s ease;
                    }
                    
                    .burger-btn i {
                        transition: transform 0.3s ease;
                    }
                    
                    .burger-btn:hover {
                        transform: scale(1.1);
                    }
                    
                    
                    /* CONTENEUR HEADER */
                    
                    .main-header {
                        position: relative;
                        z-index: 1000;
                    }
                    
                    
                    /* =====================================================
                       VERSION MOBILE ET TABLETTE
                    ===================================================== */
                    
                    @media screen and (max-width: 768px) {
                    
                        /* Afficher le bouton burger */
                    
                        .burger-btn {
                            display: block !important;
                        }
                    
                        /* Positionnement du header */
                    
                        .main-header .header-container {
                            position: relative;
                        }
                    
                        /* MENU FERMÉ */
                    
                        .main-header .nav-menu {
                            display: block !important;
                    
                            position: absolute !important;
                    
                            top: 100%;
                            left: 0;
                            right: 0;
                    
                            width: 100%;
                    
                            background-color: #ffffff;
                    
                            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
                    
                            padding: 0 !important;
                    
                            max-height: 0;
                    
                            overflow: hidden;
                    
                            opacity: 0;
                    
                            visibility: hidden;
                    
                            pointer-events: none;
                    
                            transition:
                                max-height 0.4s ease,
                                opacity 0.3s ease,
                                padding 0.3s ease,
                                visibility 0.3s ease;
                    
                            z-index: 1001;
                        }
                    
                    
                        /* MENU OUVERT */
                    
                        .main-header .nav-menu.active {
                    
                            max-height: 450px !important;
                    
                            opacity: 1 !important;
                    
                            visibility: visible !important;
                    
                            pointer-events: auto;
                    
                            padding: 15px 0 !important;
                        }
                    
                    
                        /* LISTE DES LIENS */
                    
                        .main-header .nav-menu ul {
                    
                            display: flex !important;
                    
                            flex-direction: column !important;
                    
                            align-items: center !important;
                    
                            gap: 0 !important;
                    
                            width: 100% !important;
                    
                            margin: 0 !important;
                    
                            padding: 0 !important;
                    
                            list-style: none;
                        }
                    
                    
                        /* ÉLÉMENTS */
                    
                        .main-header .nav-menu ul li {
                    
                            width: 100%;
                    
                            text-align: center;
                        }
                    
                    
                        /* LIENS */
                    
                        .main-header .nav-menu ul li a {
                    
                            display: block;
                    
                            width: 100%;
                    
                            padding: 14px 15px;
                    
                            font-size: 1.05rem;
                    
                            color: #4a2e19;
                    
                            text-decoration: none;
                    
                            transition:
                                color 0.3s ease,
                                background-color 0.3s ease;
                        }
                    
                    
                        /* SURVOL */
                    
                        .main-header .nav-menu ul li a:hover {
                    
                            color: #d4a373;
                    
                            background-color: #fdf5ec;
                        }
                    
                    }
                    
                    
                    /* =====================================================
                       GRAND ÉCRAN
                    ===================================================== */
                    
                    @media screen and (min-width: 769px) {
                    
                        .burger-btn {
                            display: none !important;
                        }
                    
                        .main-header .nav-menu {
                            display: block !important;
                    
                            position: static;
                    
                            max-height: none;
                    
                            opacity: 1;
                    
                            visibility: visible;
                    
                            overflow: visible;
                    
                            pointer-events: auto;
                        }
                    
                    }