:root {
  --color-bg: #842e1b;
  --color-main: #034713;
  --color-hover: #40557c;
  --color-active: #0af;
  --color-white: #fff;
  --transition-speed: 0.3s;
}

/* RESET */
#cssmenu, #cssmenu ul, #cssmenu li, #cssmenu a {
margin:0; 
padding:0; 
list-style:none; 
box-sizing:border-box;
}

#cssmenu a {
text-decoration:none; 
color: var(--color-white); 
font-weight:200; 
text-transform: uppercase;
transition: color var(--transition-speed);
}

#cssmenu li {
position:relative;
}

/* MENU PRINCIPAL */
#cssmenu {
position:fixed; 
top:0; 
width:100%; 
background: var(--color-bg); 
z-index:1000; 
font-family:'Open Sans', sans-serif; 
border-bottom:1px solid var(--color-hover);
}

#cssmenu .menu-container {
max-width:1200px; 
margin:0 auto; 
display:flex; 
justify-content:flex-start; 
align-items:center; position:relative;
}

#menu-button {
display:block; 
padding:15px 20px; 
cursor:pointer; 
color:var(--color-white); 
font-weight:400; 
font-size:18px;
text-transform: uppercase;
}

/* MENU MOBILE */
#cssmenu ul {display:none; flex-direction:column; width:100%;}
#cssmenu.active ul {display:flex; flex-direction:column;}
#cssmenu ul li {width:100%;}
#cssmenu ul li a {padding:15px 20px; display:block;}


/* SOUS-MENU MOBILE */
#cssmenu ul li ul {display:none; flex-direction:column; padding-left:15px;}
#cssmenu ul li.open > ul {display:flex;}

/* ACTIVE / HOVER */
#cssmenu li.active > a, #cssmenu li:hover > a {color: var(--color-hover);}
#cssmenu ul li:hover > a {color: var(--color-active);}

/* Flèche sous-menu mobile */
.submenu-toggle {
    float: right;
    margin-left: 10px;
    font-size: 12px;
    cursor: pointer;
}

/* DESKTOP */
@media(min-width:640px){
    #menu-button { display:none; }
    #cssmenu ul {
        display:flex !important;         /* ✅ visible desktop */
        flex-direction: row !important;  /* ✅ horizontal */
        justify-content:center;
    }
    #cssmenu ul li {width:auto;}
    #cssmenu ul li ul {
        position:absolute;
        top:100%;
        left:0;
        display:none;
        background: var(--color-main);
        border-radius:5px;
        min-width:200px;
        opacity:0;
        transition: opacity 0.3s ease;
    }
    #cssmenu ul l