/* WCAG 1.4.3 – transparent navbar over photo background: white text on unpredictable
   image colours can fail 4.5:1. A dark semi-opaque backing ensures contrast. */
.navbar-default:not(.navbar-scroll) {
    background: rgba(0, 0, 0, 0.72);
}
/* On hover/focus in the transparent state, keep legible */
.navbar-default:not(.navbar-scroll) .navbar-nav > li > button.dropdown-toggle:hover,
.navbar-default:not(.navbar-scroll) .navbar-nav > li > button.dropdown-toggle:focus,
.navbar-default:not(.navbar-scroll) .navbar-nav > li > a:hover,
.navbar-default:not(.navbar-scroll) .navbar-nav > li > a:focus {
    color: #fff;
    background: rgba(255, 255, 255, 0.15);
}

/* ── Navbar: flexbox keeps all items on one line, no wrapping ──
   Desktop only - on mobile the collapsed menu must stack vertically
   (Bootstrap default), otherwise items and open dropdowns overflow
   the viewport horizontally. */
@media (min-width: 768px) {
    .navbar-default .navbar-nav.navbar-right {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-items: stretch;
        align-items: stretch;
    }

        .navbar-default .navbar-nav.navbar-right > li {
            float: none !important;
            position: relative;
            display: -webkit-flex;
            display: flex;
            -webkit-align-items: center;
            align-items: center;
        }

            .navbar-default .navbar-nav.navbar-right > li > a,
            .navbar-default .navbar-nav.navbar-right > li > button.dropdown-toggle {
                display: -webkit-flex;
                display: flex;
                -webkit-align-items: center;
                align-items: center;
                height: 100%;
                padding: 15px 9px;
                white-space: nowrap;
            }
}

/* ── Dropdown toggle button styling ── */
.navbar-default .navbar-nav > li > button.dropdown-toggle {
    color: #fff;
    font-family: 'Open Sans', helvetica, arial, sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 14px;
    text-decoration: none;
    border: none;
    background: transparent;
    cursor: pointer;
}

.navbar-scroll.navbar-default .navbar-nav > li > button.dropdown-toggle {
    color: #676a6c;
}

.navbar-default .navbar-nav > li > button.dropdown-toggle:hover,
.navbar-default .navbar-nav > li > button.dropdown-toggle:focus {
    color: #1253ca;
    background: transparent;
    text-decoration: none;
    outline: none;
}

.navbar-scroll.navbar-default .navbar-nav > li > button.dropdown-toggle:hover {
    color: #1253ca;
}

/* Dropdown panel items: always dark text on white, regardless of navbar state */
.navbar-default .navbar-nav .dropdown-menu > li > a,
.navbar-default .navbar-nav .dropdown-menu > li > button {
    color: #676a6c !important;
    background-color: #fff !important;
}

    .navbar-default .navbar-nav .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .dropdown-menu > li > button:hover {
        color: #1253ca !important;
        background-color: #f5f5f5 !important;
    }
/* Ensure dropdown sits above page hero content */
.navbar-default .dropdown-menu {
    z-index: 1050;
}