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

/* ================= SCROLL PROGRESS ================= */
.scroll-progress{
    position:fixed;
    top:0;
    left:0;
    height:4px;
    width:0%;
    background:linear-gradient(90deg,#f6a623,#ffb84d);
    z-index:2000;
    transition:width .2s ease;
}

/* ================= NAVBAR ================= */
.main-navbar{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
    padding:18px 0;
    transition:all .35s ease;
}

/* HOME PAGE (Glass Transparent) */
.main-navbar.home{
    background:rgba(12,47,74,0.25);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

/* OTHER PAGES (Dark Blue Glass) */
.main-navbar:not(.home){
    background:#0c2f4a;
}

/* Optional shrink */
.main-navbar.shrink{
    padding:14px 0;
}

/* Gradient Bottom Border */
.main-navbar::after{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:3px;
    background:linear-gradient(90deg,#f6a623,#ffb84d,#f6a623);
    background-size:200% 100%;
    animation:borderMove 6s linear infinite;
}

@keyframes borderMove{
    0%{background-position:0% 0;}
    100%{background-position:200% 0;}
}

/* ================= CONTAINER ================= */
.nav-container{
    width:92%;
    max-width:1300px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

/* ================= LOGO ================= */
.logo img{
    height:64px;
    transition:.3s ease;
}

.main-navbar.shrink .logo img{
    height:50px;
}

.logo img:hover{
    filter:drop-shadow(0 0 6px rgba(246,166,35,0.6));
}

/* ================= NAV LINKS ================= */
.nav-links{
    display:flex;
    align-items:center;
}

.nav-links a{
    color:#ffffff;
    margin-left:32px;
    text-decoration:none;
    font-weight:500;
    font-size:16px;
    position:relative;
    transition:.3s ease;
}

.nav-links a:hover{
    color:#f6a623;
    transform:translateY(-2px);
}

.nav-links a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-7px;
    width:0%;
    height:2px;
    background:#f6a623;
    transition:.35s ease;
}

.nav-links a:hover::after,
.nav-links a.active::after{
    width:100%;
}

/* ================= USER BUTTONS ================= */
.nav-user{
    display:flex;
    align-items:center;
    gap:14px;
}

.user-btn{
    width:42px;
    height:42px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:16px;
    transition:.3s ease;
    background:rgba(255,255,255,.08);
    color:#fff;
}

.user-btn:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 25px rgba(0,0,0,.35);
}

.login-btn:hover{
    background:#ffffff;
    color:#0b2f3f;
}

.register-btn{
    background:linear-gradient(135deg,#f6a623,#ffb84d);
    color:#0b2f3f !important;
}

.register-btn:hover{
    background:linear-gradient(135deg,#ffb84d,#f6a623);
    box-shadow:0 15px 35px rgba(246,166,35,.5);
}

/* ================= HAMBURGER ================= */
.menu-btn{
    width:28px;
    height:22px;
    display:none;
    flex-direction:column;
    justify-content:space-between;
    cursor:pointer;
}

.menu-btn span{
    height:3px;
    width:100%;
    background:#fff;
    transition:.3s;
}

.menu-btn.open span:nth-child(1){
    transform:rotate(45deg) translate(6px,6px);
}
.menu-btn.open span:nth-child(2){
    opacity:0;
}
.menu-btn.open span:nth-child(3){
    transform:rotate(-45deg) translate(6px,-6px);
}

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

    .nav-links{
        position:fixed;
        top:0;
        right:-100%;
        width:260px;
        height:100vh;
        background:#0c2f4a;
        display:flex;
        flex-direction:column;
        padding:120px 30px;
        transition:.4s ease;
        box-shadow:-5px 0 25px rgba(0,0,0,0.25);
    }

    .nav-links a{
        margin:16px 0;
        font-size:18px;
    }

    .nav-links.show{
        right:0;
    }

    .menu-btn{
        display:flex;
    }

    .nav-user{
        display:none;
    }
}