/* =========================
   DESKTOP NAVIGATION
========================= */

.main-nav {
    display: block;
}

.main-nav ul {
    list-style: none;
    display: flex;
    gap: 35px;
    margin: 0;
    padding: 0;
}

.main-nav li {
    list-style: none;
}

.main-nav a {
    text-decoration: none;
    font-size: 14px;
    color: white;
    font-weight: 500;
    transition: 0.2s ease;
}

.main-nav a:hover {
    color: #9e8f3d;
}

/* =========================
   BURGER ICON (☰)
========================= */

.menu-toggle {
    display: none;
    font-size: 30px;
    cursor: pointer;
    color: white;
    z-index: 300;
    position: relative;
}

/*Sticky header */
.site-header.scrolled .menu-toggle {
    color: #111;
}


.site-header.scrolled .main-nav a {
    color: #111;
}

.site-header.scrolled .main-nav a:hover {
    color: #9e8f3d;
}


.nav-close {
    display: none;
}

/* =========================
   MOBILE SIDEBAR
========================= */

@media (max-width: 992px) {

    /* Affiche le burger */
    .menu-toggle {
        display: block;
    }

    /* Sidebar cachée par défaut */
    .main-nav {
        position: fixed;
        top: 0;
        right: -320px;
        width: 300px;
        height: 100vh;
        background: white;
        padding: 120px 40px 40px;
        transition: 0.35s ease;
        z-index: 250;
        box-shadow: -10px 0 30px rgba(0, 0, 0, 0.08);
    }

    /* Menu vertical */
    .main-nav ul {
        display: block;
    }

    .main-nav li {
        margin-bottom: 30px;
    }

    .main-nav a {
        color: #111;
        font-size: 18px;
    }

    .main-nav a:hover {
        color: #9e8f3d;
    }

    /* Croix fermeture */
    .nav-close {
        display: block;
        position: absolute;
        top: 30px;
        right: 30px;
        font-size: 22px;
        cursor: pointer;
        color: #111;
    }

    /* Overlay */
    .menu-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        opacity: 0;
        visibility: hidden;
        transition: 0.3s ease;
        z-index: 200;
    }

    /* Etat ouvert */
    body.menu-open .main-nav {
        right: 0;
    }

    body.menu-open .menu-overlay {
        opacity: 1;
        visibility: visible;
    }

    body.menu-open {
        overflow: hidden;
    }

    body.menu-open .menu-toggle {
        display: none;
    }

}