/* ============================================================
   Shared v2 header — brand/CTAs on top, navigation below
   Add class="v2" to the body on pages using this header.
   ============================================================ */

body.v2 {
    overflow-x: hidden;
}

body.v2 .announce { display: none; }

body.v2 .nav {
    background: #fff !important;
    border-bottom: 1px solid #a9d8cf !important;
    box-shadow: 0 10px 28px -20px rgba(11, 44, 77, .55) !important;
}

/* Tint the menu row so it reads as a distinct bar above page content. */
@media (min-width: 901px) {
    body.v2 .nav {
        position: sticky;
    }

    body.v2 .nav::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 61px;
        background: #eef9f6;
        border-top: 1px solid #d8ece7;
        pointer-events: none;
    }

    body.v2 .nav .nav-inner {
        position: relative;
        z-index: 1;
    }

    body.v2 .nav .nav-links {
        background: transparent;
    }
}

body.v2 .nav .nav-inner {
    flex-wrap: wrap !important;
    min-height: 0 !important;
    padding: 12px 24px 0 !important;
    gap: 8px 16px !important;
}

body.v2 .nav .brand {
    order: 0;
    flex: none;
    font-size: 24px !important;
    gap: 10px;
}

body.v2 .nav .brand .logo {
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    background: transparent;
}

body.v2 .nav .nav-cta {
    order: 1;
    margin-left: auto;
    gap: 8px;
}

body.v2 .nav .nav-cta .btn {
    padding: 9px 14px !important;
    font-size: 13px !important;
    border-radius: 9px;
}

body.v2 .nav .nav-cta .btn-orange { display: none; }

body.v2 .nav .nav-cta .btn-primary {
    background: #0f766e;
}

body.v2 .nav .nav-cta .btn-primary:hover {
    background: #115e59;
}

body.v2 .nav .nav-links {
    order: 2 !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    justify-content: flex-start !important;
    gap: 24px !important;
    margin-left: 0 !important;
    padding: 8px 0 !important;
    border-top: 1px solid #e4ebf1 !important;
}

body.v2 .nav .nav-links > a,
body.v2 .nav .nav-links > .nav-dropdown > .nav-dropdown-toggle {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #33475c !important;
    padding: 9px 10px !important;
}

body.v2 .nav .nav-links .nav-dropdown-menu a {
    font-size: 15px !important;
    padding: 9px 14px !important;
}


/* The "All …" destination in each dropdown reads as a distinct action row. */
body.v2 .nav .nav-dropdown-menu a.nav-dropdown-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 7px;
    padding: 9px 12px !important;
    border: 1px solid #cfe4de !important;
    border-radius: 8px;
    background: #e9fbf7;
    color: #0b5f58 !important;
    font-weight: 800 !important;
}

body.v2 .nav .nav-dropdown-menu a.nav-dropdown-all::after {
    content: "\2192";
    font-size: 14px;
    line-height: 1;
}

body.v2 .nav .nav-dropdown-menu a.nav-dropdown-all:hover {
    background: #dff6f1;
    border-color: #9edbd1 !important;
    color: #0b5f58 !important;
}

body.v2 .mobile-dropdown-menu a.nav-dropdown-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 6px 0;
    padding: 10px 12px !important;
    border: 1px solid #cfe4de;
    border-radius: 8px;
    background: #e9fbf7;
    color: #0b5f58 !important;
    font-weight: 800 !important;
}

body.v2 .mobile-dropdown-menu a.nav-dropdown-all::after {
    content: "\2192";
    font-size: 14px;
    line-height: 1;
}

@media (min-width: 1024px) and (max-width: 1150px) {
    body.v2 .nav .nav-links { gap: 12px !important; }

    body.v2 .nav .nav-links > a,
    body.v2 .nav .nav-links > .nav-dropdown > .nav-dropdown-toggle {
        padding: 8px 7px !important;
    }

    body.v2 .nav .nav-cta .btn {
        padding: 8px 12px !important;
        font-size: 12.5px !important;
    }
}

@media (max-width: 900px) {
    body.v2 .nav .nav-inner { padding: 10px 24px !important; }
}
