<!-- NAVBAR dengan warna elegan: navy + emas -->
<nav class="glass-nav sticky top-0 z-50 shadow-sm">
    <div class="flex justify-between items-center px-6 md:px-12 py-5">
        <!-- Logo dengan warna navy dan emas -->
        <div class="flex items-center gap-3 group">
            <div class="flex items-center justify-center rotate-3 group-hover:rotate-0 transition-transform duration-300">
                <img src="/egj/assets/image/logo.png" alt="Logo" class="w-11 h-11 object-contain">
            </div>
            <span class="font-bold text-2xl tracking-tight text-[#1e2b3a]">Efata <span class="text-[#C5A028]">Gemilang Jaya</span></span>
        </div>

        <!-- Desktop Menu -->
        <div class="hidden md:flex gap-10 font-medium text-slate-600">
            <a href="../home/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Beranda</a>
            <a href="../about/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Tentang</a>
            <a href="../services/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Layanan</a>
            <a href="../contact/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Kontak</a>
            <a href="../testimony/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Testimoni</a>
            <a href="../recruitment/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Rekrutmen</a>
            <a href="../gallery/" class="relative after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-0 hover:after:w-full after:bg-[#C5A028] after:transition-all after:duration-300 pb-1">Galeri</a>
        </div>

        <!-- Desktop CTA & Mobile Hamburger -->
        <a href="https://wa.me/6285283399086?text=Halo%20Efata%20Gemilang%20Jaya,%20saya%20ingin%20bertanya."
            target="_blank"
            class="hidden md:block bg-[#1e2b3a] text-white px-6 py-3 rounded-full text-sm font-semibold hover:bg-[#2c3e50] transition shadow-lg btn-shine">
            Hubungi Kami
        </a>

        <!-- Mobile Hamburger Button -->
        <button id="menuToggle" class="md:hidden w-10 h-10 flex flex-col items-center justify-center gap-1.5 focus:outline-none group">
            <span class="hamburger-line block w-6 h-0.5 bg-[#1e2b3a] transition-all group-hover:w-8"></span>
            <span class="hamburger-line block w-6 h-0.5 bg-[#1e2b3a] transition-all group-hover:w-8"></span>
            <span class="hamburger-line block w-6 h-0.5 bg-[#1e2b3a] transition-all group-hover:w-8"></span>
        </button>
    </div>
    </div>

    <!-- Mobile Menu Dropdown -->
    <div id="mobileMenu" class="mobile-menu closed absolute left-0 right-0 top-full bg-white/95 backdrop-blur-md border-b border-[#C5A028]/20 shadow-lg md:hidden">
        <div class="flex flex-col px-6 py-8 space-y-5 text-center">
            <a href="../home/" class="text-lg font-bold text-[#1e2b3a] py-2 transition-colors">Beranda</a>
            <a href="../about/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Tentang</a>
            <a href="../services/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Layanan</a>
            <a href="../contact/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Kontak</a>
            <a href="../testimony/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Testimoni</a>
            <a href="../recruitment/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Rekrutmen</a>
            <a href="../gallery/" class="text-lg font-medium text-slate-600 hover:text-[#C5A028] py-2 transition-colors">Galeri</a>
            <a href="https://wa.me/6285283399086?text=Halo%20Efata%20Gemilang%20Jaya,%20saya%20ingin%20bertanya."
                target="_blank"
                class="mt-4 bg-[#1e2b3a] text-white px-8 py-4 rounded-full text-base font-semibold hover:bg-[#2c3e50] transition shadow-lg w-full inline-block text-center">
                Hubungi Kami
            </a>
        </div>
    </div>
</nav>