﻿header {
    padding-top: 25px;
    padding-bottom: 25px;
}

.scroll-header a.logo {
    display: inline-block;
}

.scroll-header .cta .btn {
    justify-self: flex-end;
    display: flex;
}

.scroll-link {
    text-align: center;
}

.link-list {
    justify-content: space-evenly;
}

.scroll-header button {
    background-color: transparent;
    border: none;
    padding: 0;
    width: 24px;
    display: block;
}

.mobile-menu-toggle {
    margin-left: auto;
}

.menu-line {
    border-top: 2px solid black;
    width: 24px;
    padding: 3px;
}

.site-header__logo {
    max-width: 140px;
}

.scroll-header .scroll-link a,
.mobile-scroll-link li a {
    color: var(--ng-color-blue08);
    font-family: 'BrittiSans-Medium';
}

.dark-logo {
    display: inline;
}

.white-logo {
    display: none;
}

body:has(.nav-sticky):has(.hero-container [class*="bg-dark"]) .scroll-header a:not(.btn) {
    color: white !important;
}

body:has(.nav-sticky):has(.hero-container [class*="bg-dark"]) .dark-logo {
    display: none;
}

body:has(.nav-sticky):has(.hero-container [class*="bg-dark"]) .white-logo {
    display: inline;
}

@media (min-width:992px) {
    .scroll-header .row {
        align-items: center;
    }

    .site-header__logo {
        max-width: 179px;
    }
}

@media(max-width:991px) {
    .mobile-scroll-link {
        position: absolute;
        background-color: white;
        transition: max-height 0.5s;
        max-height: 0px;
        overflow: hidden;
        text-align: center;
    }

        .mobile-scroll-link ul {
            margin-top: 8px;
            padding: 0;
            list-style: none;
            width: 100%;
        }

        .mobile-scroll-link li {
            text-align: left;
            border-bottom: 1px solid rgba(0,0,0,0.1);
        }

            .mobile-scroll-link li a {
                padding: 16px 0;
                display: block;
            }

            .mobile-scroll-link li:last-child {
                margin-bottom: 16px;
                border: none;
            }

        .mobile-scroll-link.open {
            border-top: 1px solid rgba(0,0,0,0.1);
            max-height: 500px;
        }

        .mobile-scroll-link .btn {
            margin-bottom: 16px;
        }

    .mobile-menu {
        position: relative;
    }
}
