/* Top Bar and Socials
-------------------------------------------------------------------*/
.top-bar a:link,
.top-bar a:visited,
.top-bar a:active,
.top-bar a:focus {
    color: var(--white);
    text-decoration: none;
    background: none;
}

.socials a {
    text-decoration: none;
    margin-left: .5em;
}

@media screen and (max-width: 991px) {
    .socials-mobile {
        text-align: center;
        font-size: 2rem;
    }

    .socials-mobile a {
        color: var(--white);
        text-decoration: none;
    }
}


/* Navbar Base
-------------------------------------------------------------------*/
.navbar {
    font-size: 1.8rem;
    line-height: 1;
    font-weight: 600;
    padding: 1em 0;
    font-family: var(--ff-default);
}

.navbar-toggler {
    background-color: var(--light-grey);
}

.navbar-toggler-icon {
    width: 2em;
    height: 2em;
}

.navbar .nav-item a.nav-link {
    padding-left: 1em;
    padding-right: 1em;
    color: var(--black);
    text-decoration: none;
}

.navbar .nav-item a.nav-link:hover {
    color: var(--brand-dark);
}

.navbar-brand img {
    height: 100%;
    max-height: 150px;
    transition: .3s ease-in-out;
}

@media screen and (max-width: 1199px) {
    .navbar-brand img {
        max-height: 65px;
    }

    .navbar .nav-item a.nav-link {
        padding-left: .5em;
        padding-right: .5em;
    }
}

@media screen and (max-width: 991px) {
    .navbar-brand img {
        max-height: 92px;
    }

    .navbar-nav {
        padding: 1em 0;
    }

    .navbar .nav-item a.nav-link {
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 575px) {
    .navbar-brand img,
    .navbar.shrink-it .navbar-brand img {
        max-height: 50px;
    }
}


/* Dropdowns
-------------------------------------------------------------------*/
.navbar .dropdown-menu {
    font-size: 1.4rem;
    text-transform: none;
    font-weight: 600;
    line-height: 1.25;
}

.navbar .dropdown-menu .dropdown-item {
    padding: .75em;
    text-decoration: none;
}

.dropdown-item.active,
.dropdown-item:active {
    color: var(--black);
    text-decoration: none;
    background-color: var(--white);
}

.dropdown-item.active:hover,
.dropdown-item:active:hover,
.dropdown-item:hover {
    color: var(--brand-dark);
    text-decoration: none;
    background-color: var(--white);
}


/* Navbar: Transparent, Inner, Scrolled
-------------------------------------------------------------------*/
.transparent-navbar {
    background-color: transparent !important;
    transition: background-color 0.1s ease-in-out;
}

.inner.transparent-navbar {
    background-color: #FFF !important;
}

.navbar.navbar-scrolled {
    background: rgba(0, 0, 0, .8) !important;
}

.navbar.inner.navbar-scrolled {
    background: #FFF !important;
}

.navbar .top-bar {
    font-size: 1.3rem;
    color: var(--white);
    padding: .75em 0;
    font-family: var(--ff-default);
    transition: .3s ease-in-out;
}

.navbar.navbar-scrolled .top-bar {
    padding: .25em 0;
}

.navbar .navigation-overrides {
    padding: 3em 0;
    transition: .3s ease-in-out;
    font-size: 2rem !important;
    text-transform: uppercase !important;
}

.navbar.navbar-scrolled .navigation-overrides {
    padding: .5em 0;
}

.navbar.inner .navigation-overrides {
    padding: 2em 0;
    text-transform: uppercase !important;
}

.navbar.inner.navbar-scrolled .navigation-overrides {
    padding: .5em 0;
}


/* Navbar Logos
-------------------------------------------------------------------*/
.navbar .navigation-overrides .nav-logo {
    width: 100%;
    max-width: 225px;
    transition: .3s ease-in-out;
}

.navbar.navbar-scrolled .navigation-overrides .nav-logo,
.navbar.inner.navbar-scrolled .navigation-overrides .nav-logo {
    max-width: 80px;
}

.navbar.inner .navigation-overrides .nav-logo {
    max-width: 175px;
}

.navbar.inner.navbar-scrolled .navigation-overrides .nav-logo {
    max-width: 80px;
}


/* Navbar: Mobile
-------------------------------------------------------------------*/
.navbar.mobile {
    background: transparent;
    transition: .3s ease-in-out;
}

.navbar.mobile.inner,
.navbar.mobile.navbar-scrolled-mobile {
    background: #FFF;
}

.navbar.mobile .mobile-logo {
    width: 100px;
    transition: .3s ease-in-out;
}

.navbar.mobile.navbar-scrolled-mobile .mobile-logo {
    width: 60px;
}


.navbar.mobile.mobile-bar {
    background: #FFF;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}

@media (max-width: 991.98px) {
    body.fixed-top-padding {
        padding-top: 76px;
    }
}


/* Mega Menu Plugin Overrides
-------------------------------------------------------------------*/
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
    transition: .3s ease-in-out;
}

.navbar.navbar-scrolled .navigation-overrides #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
    color: #FFF !important;
}

.navbar.inner .navigation-overrides #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link,
.navbar.inner.navbar-scrolled .navigation-overrides #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
    color: #000 !important;
}


/* Mobile Menu (Offcanvas)
   Bootstrap 5.3 drives offcanvas from variables, so the theme
   sets colors through them instead of redeclaring the component.
-------------------------------------------------------------------*/
.offcanvas {
    --bs-offcanvas-color: var(--black);
    --bs-offcanvas-bg: var(--white);
}

.mobile-menu {
    list-style: none;
    padding: 0 1em;
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.mobile-menu li {
    padding: .5em 0;
}

.mobile-menu li ul {
    padding: .5em 1em 0 1em;
    list-style: none;
}

.mobile-menu li a,
.navbar-content a {
    color: var(--black);
    text-decoration: none;
}

.navbar-content {
    padding: 0 1em;
    font-size: 1.5rem;
}