.school-navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 90px;
    padding: 0 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background:
        linear-gradient(135deg,
            #07193d,
            #0c2b66,
            #09142c);
    border-bottom: 3px solid #dca84d;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, .2);
    z-index: 2000;
    transition: background 0.3s;
}



.brand {

    display: flex;
    align-items: center;
    gap: 18px;
}

.logo-container {

    width: 85px;
    height: 85px;

    margin-top: 20px;

    border-radius: 50%;

    padding: 4px;

    background: #112758;

    border: 3px solid #dca84d;

    display: flex;
    justify-content: center;
    align-items: center;

    box-shadow:
        0 0 20px rgba(255, 215, 90, .25);
}

.logo-container img {

    width: 75px;
}



.school-info h2 {

    color: white;
    font-size: 22px;
}

.school-info span {

    color: #dca84d;

    font-size: 12px;

    letter-spacing: 2px;

    text-transform: uppercase;
}




.nav-links {

    display: flex;
    align-items: center;

    gap: 8px;

    list-style: none;
}


.nav-links>li {

    position: relative;
}


.nav-links a {

    display: flex;
    align-items: center;
    gap: 5px;

    padding: 34px 14px;

    text-decoration: none;

    font-size: .95rem;

    font-weight: 500;

    color: white;

    transition: .35s;
}


.nav-links a:hover {

    color: #ffd76d;
}



.nav-links>li>a::after {

    content: "";

    position: absolute;

    left: 50%;
    bottom: 20px;

    transform: translateX(-50%);

    width: 0;
    height: 2px;

    background: #dca84d;

    transition: .3s;
}

.nav-links>li:hover>a::after {

    width: 75%;
}




.dropdown-menu {

    position: absolute;

    top: 100%;
    left: 0;

    min-width: 260px;

    background: white;

    border-radius: 0 0 15px 15px;

    overflow: hidden;

    max-height: 0;
    visibility: hidden;

    transition:
        max-height .45s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0s .45s;

    box-shadow:
        0 10px 35px rgba(0, 0, 0, .15);

    border-top: 4px solid #dca84d;
}


.dropdown-menu.open {

    max-height: 500px;
    visibility: visible;

    transition:
        max-height .45s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0s 0s;
}



.dropdown>a>span {

    display: inline-block;

    transition: transform .35s;
}

.dropdown>a>span svg {

    display: block;

    width: 16px;
    height: 16px;

    stroke: currentColor;
}

.dropdown.open>a>span {

    transform: rotate(180deg);
}


.dropdown-menu a {

    padding: 14px 20px;

    color: #2b3654;

    font-size: .9rem;

    border-left: 4px solid transparent;
}

.dropdown-menu a:hover {

    background: #edf4ff;

    color: #0c2b66;

    border-left-color: #dca84d;
}




.admission-btn {

    padding: 12px 22px !important;

    border-radius: 30px;

    background:
        linear-gradient(135deg,
            #dca84d,
            #ffd76d);

    color: #0a1f45 !important;

    font-weight: 700;
}

.admission-btn:hover {

    transform: translateY(-2px);

    box-shadow:
        0 0 20px rgba(255, 215, 90, .35);
}



.nav-links>li>a.admission-btn::after {

    display: none;
}




/* ── Hamburger button ── */

.hamburger {

    display: none;

    flex-direction: column;
    justify-content: center;
    gap: 5px;

    background: none;
    border: none;

    cursor: pointer;

    padding: 8px;

    z-index: 1000;
}

.hamburger span {

    display: block;

    width: 26px;
    height: 2px;

    background: white;

    border-radius: 2px;

    transition:
        transform .35s,
        opacity .35s;
}

.hamburger.open span:nth-child(1) {

    transform: translateY(7px) rotate(45deg);
}

.hamburger.open span:nth-child(2) {

    opacity: 0;
}

.hamburger.open span:nth-child(3) {

    transform: translateY(-7px) rotate(-45deg);
}




/* ── Responsive ── */


@media (max-width: 900px) {
    .school-navbar {
        flex-wrap: wrap;
        height: auto;
        min-height: 70px;
        padding: 0 24px;
        row-gap: 0;
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        background:
            linear-gradient(135deg,
                #07193d,
                #0c2b66,
                #09142c);
        z-index: 2000;
    }

    .logo-container {

        width: 60px;
        height: 60px;

        margin-top: 10px;
    }

    .logo-container img {

        width: 52px;
    }

    .school-info h2 {

        font-size: 18px;
    }

    .hamburger {

        display: flex;
    }



    .nav-links {
        display: none;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        padding: 8px 0 16px;
        gap: 0;
        background:
            linear-gradient(135deg,
                #07193d,
                #0c2b66,
                #09142c);
        position: absolute;
        left: 0;
        top: 100%;
        z-index: 1100;
        box-shadow: 0 8px 30px rgba(0,0,0,0.18);
        border-bottom-left-radius: 16px;
        border-bottom-right-radius: 16px;
    }
    .nav-links.open {
        display: flex;
    }


    .nav-links>li {

        width: 100%;
    }

    .nav-links a {

        padding: 13px 18px;
    }

    .nav-links>li>a::after {

        display: none;
    }



    .dropdown-menu {
        position: absolute;
        left: 0;
        top: 100%;
        max-height: 0;
        visibility: hidden;
        box-shadow: 0 10px 35px rgba(0, 0, 0, .15);
        border-radius: 0 0 15px 15px;
        border-top: 4px solid #dca84d;
        margin-left: 0;
        background: white;
        transition:
            max-height .45s cubic-bezier(0.4, 0, 0.2, 1),
            visibility 0s .45s;
        z-index: 2100;
    }

    .dropdown-menu.open {

        max-height: 500px;
        visibility: visible;

        transition:
            max-height .45s cubic-bezier(0.4, 0, 0.2, 1),
            visibility 0s 0s;
    }


    .dropdown-menu a:hover {

        background: rgba(255, 255, 255, .08);

        color: #ffd76d;

        border-left-color: #dca84d;
    }


    .nav-links>li:last-child {

        padding: 8px 18px;
    }

    .admission-btn {

        display: inline-flex;

        padding: 10px 20px !important;
    }
}