ok cargare el headr
<script>
.header-custom{
    position: sticky;
    top: 0;
    z-index: 9999;
    background: #1E1E1E;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.logo{
    color:#FFF !important;
    font-size:1.5rem;
    font-weight:700;
}

.nav-link{
    color:#DDD !important;
    padding:12px 16px !important;
    transition:.3s;
}

.nav-link:hover,
.nav-link.active{
    color:#FFF !important;
}

.menu-btn{
    border:none;
    background:none;
    width:40px;
    height:40px;
    padding:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
}

.menu-btn span{
    display:block;
    width:100%;
    height:3px;
    background:#FFF;
    border-radius:5px;
    transition:.3s;
}

/* Menú móvil */
@media (max-width:991px){

    #navbarMenu{
        display:none;
        width:100%;
        margin-top:15px;
    }

    #navbarMenu.show{
        display:block;
    }

    .navbar-nav{
        background:#252525;
        border-radius:12px;
        overflow:hidden;
    }

    .nav-link{
        border-bottom:1px solid rgba(255,255,255,.05);
    }

    .nav-item:last-child .nav-link{
        border-bottom:none;
    }

}

</script>

<script>
	document.addEventListener('DOMContentLoaded', function(){

    const btn = document.getElementById('menuToggle');
    const menu = document.getElementById('navbarMenu');

    btn.addEventListener('click', function(){

        menu.classList.toggle('show');

        this.classList.toggle('active');

    });

});
</script>
<header class="header-custom">
    <nav class="navbar navbar-expand-lg">

        <div class="container">

            <!-- Logo -->
            <a class="navbar-brand logo" href="#">
                LOGO
            </a>

            <!-- Botón móvil -->
            <button class="navbar-toggler menu-btn" type="button" id="menuToggle">
                <span></span>
                <span></span>
                <span></span>
            </button>

            <!-- Menú -->
            <div class="collapse navbar-collapse" id="navbarMenu">

                <ul class="navbar-nav ms-auto">

                    <!-- Aquí generarás los enlaces desde MySQL -->
                    <li class="nav-item">
                        <a class="nav-link active" href="#">Inicio</a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="#">Cursos</a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="#">Blog</a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="#">Contacto</a>
                    </li>

                </ul>

            </div>

        </div>

    </nav>
</header>