/*====================================================
                APPLE GLASS NAVBAR
====================================================*/

/* NAVBAR */

.navbar{

    position:fixed;

    top:20px;

    left:50%;

    transform:translateX(-50%);

    width:95%;

    height:90px;

    padding:0 35px;

    /*background:rgba(24,28,45,.45);

    backdrop-filter:blur(25px);*/

    -webkit-backdrop-filter:blur(25px);

    border:1px solid rgba(255,255,255,.10);

    border-radius:28px;

    z-index:1000;

    transition:
        transform .4s ease,
        background .35s ease,
        box-shadow .35s ease;

}

/* Scroll Effect */

.navbar.scrolled{

    background:rgba(12,15,30,.90);

    box-shadow:0 15px 45px rgba(0,0,0,.35);

}
/*==============================
    Auto Hide Navbar
==============================*/

.navbar.nav-hidden{

    transform:translate(-50%, -150%);

}

.navbar.nav-visible{

    transform:translate(-50%,0);

}
/* Bootstrap Container */

.navbar .container{

    max-width:100%;

    height:100%;

    display:flex;

    align-items:center;

    justify-content:space-between;

}

/* Logo */

.navbar-brand{

    padding:0;

    margin:0;

    display:flex;

    align-items:center;

}

/* IMPORTANT */

.navbar-brand img{

    height:100px;

    width:auto;

    object-fit:contain;

    display:block;

}

/* Hide text */

.navbar-brand span{

    display:none;

}

/* Navigation */

.navbar-nav{

    display:flex;

    align-items:center;

    gap:12px;

}

/* Links */

.nav-link{

    position:relative;

    color:#fff !important;

    font-size:17px;

    font-weight:600;

    padding:10px 14px !important;

    transition:.35s;

}

/* Hover */

.nav-link:hover{

    color:#d4af37 !important;

}

/* Animated underline */

.nav-link::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:2px;

    transform:translateX(-50%);

    width:0;

    height:2px;

    background:#d4af37;

    transition:.35s;

}

.nav-link:hover::after{

    width:70%;

}

/* Toggle Button */

.navbar-toggler{

    border:none;

    outline:none;

    box-shadow:none !important;

    color:#fff;

    font-size:28px;

    padding:0;

}

.navbar-toggler:focus{

    box-shadow:none;

}

/* Mobile Menu */

@media(max-width:991px){

.navbar{

height:80px;

padding:0 22px;

width:94%;

}

.navbar-brand img{

height:60px;

}

/* Dropdown */

.navbar-collapse{

position:absolute;

top:95px;

left:0;

right:0;

margin:0 15px;

padding:20px;

border-radius:22px;

background:rgba(18,22,38,.96);

backdrop-filter:blur(30px);

-webkit-backdrop-filter:blur(30px);

border:1px solid rgba(255,255,255,.08);

box-shadow:0 25px 60px rgba(0,0,0,.35);

}

/* Menu */

.navbar-nav{

display:flex;

flex-direction:column;

gap:8px;

align-items:center;

}

/* Links */

.nav-link{

margin:0;

font-size:18px;

padding:12px;

}

}

/* Small Phones */

@media(max-width:576px){

.navbar{

height:75px;

padding:0 18px;

}

.navbar-brand img{

height:55px;

}

.navbar-collapse{

top:88px;

}

.nav-link{

font-size:17px;

}

}