/* V2 service dropdowns only. Original menu and other dropdowns retain their layout. */
header .main_nav>ul>li.cm-v2-service-menu .parent-sub-menu .row>.sub-menu {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    row-gap: 32px;
}
header .main_nav>ul>li.cm-v2-service-menu .parent-sub-menu .row>.sub-menu>li:not(.color-box) {
    grid-column: 1;
    min-width: 0;
}
header .main_nav>ul>li.cm-v2-service-menu .parent-sub-menu .row>.sub-menu>li.color-box {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: stretch;
    min-width: 0;
}

/* Service page titles use the design's navy; descriptions retain their softer colour. */
header .main_nav>ul>li.cm-v2-service-menu .parent-sub-menu .row>.sub-menu>li:not(.color-box)>a {
    color: #1d264a;
    font-size: 24px;
    line-height: 1.25;
    font-weight: 500;
    margin-bottom: 8px;
}

/* Mobile V2 is an accordion; legacy menus do not receive this class. */
@media (max-width: 1024px) {
    .mobile_menu_container.cm-v2-mobile {
        top: var(--cm-menu-top, 74px);
        bottom: 0;
        height: auto;
        max-height: calc(100dvh - var(--cm-menu-top, 74px));
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .mobile_menu_container.cm-v2-mobile nav { padding: 12px 24px; }
    .mobile_menu_container.cm-v2-mobile .level_a > li {
        margin: 0;
        border-bottom: 1px solid #e5e8ee;
    }
    .mobile_menu_container.cm-v2-mobile .level_a > li > a,
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle-label {
        display: block;
        width: 100%;
        padding: 18px 48px 18px 0;
        margin: 0;
        color: #1d264a;
        font-size: 21px;
        line-height: 1.3;
        font-weight: 500;
        text-align: left;
    }
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle {
        position: absolute;
        top: 4px;
        right: 0;
        width: 48px;
        height: 56px;
        background: transparent;
        color: #1d264a;
        cursor: pointer;
        font-family: inherit;
    }
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle-label {
        position: relative;
        top: auto;
        width: 100%;
        height: auto;
    }
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle::after {
        content: '';
        position: absolute;
        right: 16px;
        top: 24px;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
    }
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle[aria-expanded="true"]::after { transform: rotate(225deg); top: 28px; }
    .mobile_menu_container.cm-v2-mobile .cm-v2-toggle:focus-visible,
    .mobile_menu_container.cm-v2-mobile a:focus-visible { outline: 2px solid #1d264a; outline-offset: 2px; }
    .mobile_menu_container.cm-v2-mobile .sub-menu[hidden] { display: none !important; }
    .mobile_menu_container.cm-v2-mobile .level_a > li > .sub-menu { padding: 0 0 16px 16px; }
    .mobile_menu_container.cm-v2-mobile .level_a > li > .sub-menu a {
        display: block;
        font-size: 18px;
        line-height: 1.4;
        color: #1d264a;
        padding: 10px 0;
        margin: 0;
        overflow-wrap: anywhere;
    }
    .mobile_menu_container.cm-v2-mobile .level_a > li > .sub-menu > li.menu-item-has-children > a {
        font-size: 15px;
        color: #69728b;
        padding-bottom: 2px;
    }
    .mobile_menu_container.cm-v2-mobile .level_a > li > .sub-menu > li > .sub-menu { margin: 0 0 12px; }
    .mobile_menu_container.cm-v2-mobile .level_a .global_menu { margin: 0; }
    .mobile_menu_container.cm-v2-mobile .contact-buttons { padding: 24px 24px calc(24px + env(safe-area-inset-bottom)); }
}
@media (max-width: 1024px) {
    /* The separate accordion button supplies the mobile arrow. */
    .mobile_menu_container.cm-v2-mobile .level_a > li.main-menu-arrow > a::after { display: none; }
}

/* V2 About uses two columns, without legacy group headings or a promo card. */
header .main_nav > ul > li.cm-v2-about-menu .parent-sub-menu .row > .sub-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, auto);
    grid-auto-flow: column;
    gap: 32px 60px;
}
header .main_nav > ul > li.cm-v2-about-menu .parent-sub-menu .row > .sub-menu > li {
    margin: 0;
    min-width: 0;
}
header .main_nav > ul > li.cm-v2-about-menu .parent-sub-menu .row > .sub-menu > li > a {
    color: #1d264a;
    font-size: 24px;
    line-height: 1.25;
    font-weight: 500;
    margin-bottom: 8px;
}
header .main_nav > ul > li.cm-v2-about-menu .parent-sub-menu {
    z-index: 100;
    max-height: calc(100dvh - 100px);
    overflow-y: auto;
}

/* Keep the longer V2 navigation on one line at laptop widths. */
@media (min-width: 1025px) {
    header:has(.cm-v2-service-menu) .top-header {
        flex-wrap: nowrap;
        gap: 20px;
    }
    header:has(.cm-v2-service-menu) .top-header > figure { flex-shrink: 0; }
    header:has(.cm-v2-service-menu) .top-header > .flex {
        flex-wrap: nowrap;
        gap: 12px;
        min-width: 0;
    }
    header:has(.cm-v2-service-menu) .main_nav { margin: 0; }
    header:has(.cm-v2-service-menu) .main_nav > ul { flex-wrap: nowrap; gap: 8px; }
    header:has(.cm-v2-service-menu) .main_nav > ul > li { margin-left: 0; }
    header:has(.cm-v2-service-menu) .main_nav > ul > li > a {
        position: relative;
        white-space: nowrap;
        font-size: 20px;
        line-height: 1.3;
        font-weight: 400;
        padding: 9px 26px 12px 10px;
    }
    header:has(.cm-v2-service-menu) .main_nav > ul > li > a::after {
        left: auto;
        right: 10px;
        top: calc(50% - 1px);
        margin-left: 0;
    }
    header:has(.cm-v2-service-menu) .contact-btn-wrap .button {
        font-size: 20px;
        font-weight: 400;
        white-space: nowrap;
        padding: 7px 20px;
    }
}
@media (min-width: 1025px) and (max-width: 1199px) {
    header:has(.cm-v2-service-menu) .top-header { gap: 12px; padding-left: 20px; padding-right: 20px; }
    header:has(.cm-v2-service-menu) .top-header > .flex { gap: 6px; }
    header:has(.cm-v2-service-menu) .main_nav > ul { gap: 0; }
    header:has(.cm-v2-service-menu) .main_nav > ul > li > a { font-size: 18px; padding-left: 6px; padding-right: 22px; }
    header:has(.cm-v2-service-menu) .contact-btn-wrap .button { font-size: 18px; padding: 7px 16px; }
}
@media (min-width: 1025px) {
    header:has(.cm-v2-service-menu) .main_nav,
    header:has(.cm-v2-service-menu) .main_nav > ul > li,
    header:has(.cm-v2-service-menu) .contact-btn-wrap { flex-shrink: 0; }
    header:has(.cm-v2-service-menu) .contact-btn-wrap .button { margin: 0; width: auto; }
}
@media (min-width: 1025px) and (max-width: 1199px) {
    header:has(.cm-v2-service-menu) .top-header > figure { width: 130px; }
    header:has(.cm-v2-service-menu) .top-header > figure img { width: 130px; height: auto; }
    header:has(.cm-v2-service-menu) .main_nav > ul > li > a { font-size: 16px; padding-left: 4px; padding-right: 20px; }
    header:has(.cm-v2-service-menu) .contact-btn-wrap .button { font-size: 16px; padding: 12px; }
}

/* Featured reports use the navigation design's light blue. */
header .main_nav > ul > li.cm-v2-service-menu .parent-sub-menu .row > .sub-menu > li.color-box {
    background-color: #d8efff;
}

/* Give V2 dropdown content breathing room above the page below. */
@media (min-width: 1025px) {
    header:has(.cm-v2-service-menu) .main_nav .parent-sub-menu {
        padding-bottom: 44px;
    }
}