/* =======================================================================================================NEW====================== */
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins', sans-serif;
}

body{
    background:#f4f4f4;
}

/* Lock background when menu open */
body.menu-open{
    overflow:hidden;
}

/* ================= HEADER ================= */
.header{
    background:#364A0F;
    padding:0px 20px;
    position:sticky;
    top:0;
    z-index:1000;
}

/* NAV */
.nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

/* LOGO */
.logo img{
    height:70px;
}

/* ================= MENU DESKTOP ================= */
.menu{
    list-style:none;
    display:flex;
    gap:20px;
}

.menu li{
    position:relative;
}

.menu a{
    color:white;
    text-decoration:none;
    font-size:15px;
    padding:10px 5px;
    display:block;
}

/* ================= MEGA MENU DESKTOP ================= */
.mega-menu{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    top:100%;

    width:min(90vw, 850px); /* ⭐ Responsive Fix */

    background:#364A0F;
    padding:25px 35px;

    display:none;
    grid-template-columns:repeat(4,1fr);
    gap:20px;

    border-radius:4px;
    z-index:999;
}

/* Desktop Hover Only Desktop */
@media(min-width:901px){
    #servicesMenu:hover .mega-menu{
        display:grid;
    }
}

/* JS Click Support */
#servicesMenu.mega-active .mega-menu{
    display:grid;
}

/* ================= TOGGLE ================= */
.menu-toggle{
    display:none;
    font-size:28px;
    color:white;
    cursor:pointer;
    position:relative;
}

/* ⭐ HAMBURGER ICON */
#menuToggle::before{
    content:"☰";
}

/* ⭐ CLOSE ICON */
#menuToggle.open::before{
    content:"✖";
}
.logo img{
    height:45px;
}

/* ================= MOBILE ================= */
@media(max-width:900px){

.menu-toggle{
    display:block;
    Color:white;
}

/* MOBILE MENU PANEL */
.menu{
    position:fixed;
    top:var(--header-height, 80px);
    margin-top:6vh;
    left:0;
    width:100%;
    height:calc(65vh - var(--header-height, 80px));
    background:#364A0F;
    flex-direction:column;
    display:none;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}
.menu.active{
    display:flex;
}

.menu li{
    border-top:1px solid rgba(255,255,255,0.1);
}

/* MOBILE MEGA MENU */
.mega-menu{
    position:static;
    transform:none;
    width:100%;

    display:none;

    grid-template-columns: 1fr;
    gap:0;
    row-gap:0;

    max-height:70vh;
    overflow-y:auto;
}

.mega-menu li{
    margin:0;
    padding:8px 0;
}

/* Mobile JS Toggle */
#servicesMenu.mega-active .mega-menu{
    display:grid;
}

/* Mobile Logo */
.logo img{
    height:35px;
}

}