/* ============================================================================
   original-nav.css — 1:1 port of the coredocuments.com top navigation.
   Values captured from the live theme (style.css / home-style.css), the
   WP Mega Menu Pro plugin CSS and the WP Customizer inline CSS on the
   2026-06-14 snapshot. New cd-* class names so none of the retired mitech
   nav rules in style.css can match. Loaded after responsive.css so it wins.
   Desktop/mobile breakpoint is 1023px (the plugin's data-responsive-breakpoint),
   NOT Bootstrap's 992px.
   ========================================================================== */

/* ---- container (original .home-container) -------------------------------- */
.cd-container {
    width: 100%;
    margin: auto;
    padding: 0 12px;
    position: relative;
}

@media (min-width: 768px) {
    .cd-container { max-width: 750px; }
}

@media (min-width: 992px) {
    .cd-container { max-width: 970px; }
}

@media (min-width: 1200px) {
    .cd-container { max-width: 1170px; }
}

/* ---- align the page content grid with the original design ----------------
   The original site used the 750/970/1170 container grid at every level, so
   headings, heroes and sections all share one left edge with the logo and
   menu. The mitech theme's Bootstrap 5 containers run 540/720/960/1140/1320
   instead — at >=1400px content started ~75px LEFT of the menu. Pin every
   Bootstrap container on the public site to the original widths (fluid below
   768px, exactly like the original). Loaded after bootstrap/style/responsive,
   so these win; the admin panel does not load this file and is unaffected. */
@media (min-width: 576px) and (max-width: 767.98px) {
    .container, .container-sm, .container-md,
    .container-lg, .container-xl, .container-xxl { max-width: 100%; }
}

@media (min-width: 768px) {
    .container, .container-sm, .container-md,
    .container-lg, .container-xl, .container-xxl { max-width: 750px; }
}

@media (min-width: 992px) {
    .container, .container-sm, .container-md,
    .container-lg, .container-xl, .container-xxl { max-width: 970px; }
}

@media (min-width: 1200px) {
    .container, .container-sm, .container-md,
    .container-lg, .container-xl, .container-xxl { max-width: 1170px; }
}

/* ---- white utility bar (original .top-nav) ------------------------------- */
.cd-top-nav {
    background-color: #fff;
    padding: 8px 0;
}

/* Live original: logo pinned left, phone pinned to the bar's far right
   (wraps under the logo on phones). */
.cd-top-nav .cd-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0 16px;
}

.cd-top-nav__brand {
    display: block;
    max-width: 338px;
    width: 100%;
}

.cd-top-nav__brand img {
    max-width: 338px;
    width: 100%;
    height: auto;
    display: block;
}

.cd-top-nav__phone {
    padding: 5px 0;
    white-space: nowrap;
}

.cd-top-nav__phone a,
.cd-top-nav__phone a:hover {
    font-size: 20px;
    line-height: 41px;
    font-weight: 400;
    color: #000000;
    text-decoration: none;
}

/* ---- sticky navy menu bar (original .bottom-nav) ------------------------- */
.cd-bottom-nav {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #222281;
    border-top: 3px solid #B30909;
    border-bottom: 1px solid #ddd;
}

.cd-menu {
    list-style: outside none none;
    margin: 0;
    padding: 0;
    text-align: left;
    background: #222281;
}

.cd-menu__item {
    display: inline-block;
    vertical-align: top;
    position: static;
    margin: 0;
    padding: 0;
}

.cd-menu__item > a {
    position: relative;
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #ffffff;
    text-transform: capitalize;
    text-decoration: none;
    padding: 13px 15px;
    white-space: nowrap; /* an item label must never break mid-word */
}

/* Original hover on a top-level item changes nothing visually. */
.cd-menu__item > a:hover,
.cd-menu__item > a:focus {
    color: #ffffff;
    background-color: #222281;
    text-decoration: none;
}

/* Current page: white background, red text (plugin theme #dd3333 wins). */
.cd-menu__item--current > a,
.cd-menu__item--current > a:hover {
    background: #fff !important;
    color: #dd3333 !important;
}

/* FontAwesome chevron on items with children */
.cd-menu__item--has-children > a::after {
    content: '\f107';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 14px;
    position: absolute;
    right: 11px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

@media (min-width: 1024px) {
    .cd-menu__item--has-children > a {
        padding-right: 30px;
    }

    .cd-menu__item--has-children > a::after {
        right: 5px;
    }
}

/* Narrow desktops and zoomed-in screens (browser zoom shrinks the CSS
   viewport): scale the items down smoothly so the menu ALWAYS stays on one
   line between the 1024px accordion breakpoint and the full original size.
   At >=1400px the clamp maxes out at the original 16px / 15px values, so the
   1:1 look is untouched on normal screens. */
@media (min-width: 1024px) and (max-width: 1399.98px) {
    .cd-menu__item > a {
        font-size: clamp(12.5px, 1.15vw, 16px);
        padding-left: clamp(8px, 1vw, 15px);
        padding-right: clamp(8px, 1vw, 15px);
    }

    .cd-menu__item--has-children > a {
        padding-right: clamp(20px, 2vw, 30px);
    }

    #searchform input[type=text] {
        width: clamp(140px, 14vw, 200px);
    }
}

@media (min-width: 1600px) {
    .cd-menu__item > a {
        font-size: 18px;
        padding: 10px 30px;
    }

    .cd-menu__item--has-children > a {
        padding-right: 30px;
    }

    .cd-menu__item--has-children > a::after {
        right: 15px;
    }
}

/* ---- dropdown panels: hidden, fade in on hover (>=1024px only) ----------- */
.cd-mega-panel,
.cd-flyout-panel {
    position: absolute;
    top: 100%;
    left: 0;
    background: #ffffff;
    opacity: 0;
    visibility: hidden;
    text-align: left;
    z-index: 10;
}

@media (min-width: 1024px) {
    .cd-menu__item:hover > .cd-mega-panel,
    .cd-menu__item:hover > .cd-flyout-panel {
        opacity: 1;
        visibility: visible;
        z-index: 9;
        -webkit-transition: .6s;
        transition: .6s;
    }
}

/* ---- Products mega panel -------------------------------------------------- */
/* Top-level li is position:static, so the panel spans .cd-container in full —
   on the live original its right edge is flush with the search pill. */
.cd-mega-panel {
    width: 100%;
    border: 2px solid #C90606;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    padding: 20px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 22px;
}

.cd-mega-columns {
    list-style: outside none none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

.cd-mega-columns .cd-mega-col {
    width: 24%;
    padding: 0 10px;
}

/* Column count mirrors the plugin's wpmega-1columns-Ntotal widths. */
.cd-mega-columns--3 .cd-mega-col { width: 33.33%; }
.cd-mega-columns--4 .cd-mega-col { width: 24%; }
.cd-mega-columns--5 .cd-mega-col { width: 20%; }

@media (min-width: 1024px) {
    .cd-mega-col:not(:last-child) {
        border-right: 1px dotted #0A2E7C;
        min-height: 404px;
    }
}

.cd-mega-col__header {
    display: block;
    text-decoration: none;
    margin-bottom: 10px;
}

.cd-mega-col__header i {
    color: #0A2E7C;
    font-size: 20px;
    line-height: 25px;
    font-weight: 900; /* keep the FA5 solid glyph even if a theme rule interferes */
    margin-right: 5px;
}

.cd-mega-col__header span {
    font-family: 'Montserrat', sans-serif;
    color: #0A2E7C;
    font-size: 20px;
    line-height: 25px;
    font-weight: 700;
    letter-spacing: 0;
}

.cd-mega-col__header:hover {
    background-color: #fff;
    text-decoration: none;
}

.cd-mega-col__header:hover span,
.cd-mega-col__header:hover i {
    color: #dd3333;
}

.cd-mega-col__list {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}

.cd-mega-col__list li {
    border-bottom: 1px dotted #00000040;
    margin-bottom: 10px;
}

.cd-mega-col__list li a {
    display: block;
    text-decoration: none;
    background: #fff;
}

.cd-mega-col__list li a i {
    font-size: 16px;
    line-height: 25px;
    /* FA5 free solid needs 900 — at 400 arrow-right has no glyph and vanishes */
    font-weight: 900;
    color: #000;
    margin-right: 5px;
}

.cd-mega-col__list li a span {
    font-size: 16px;
    line-height: 25px;
    font-weight: 500;
    color: #000;
    text-decoration: none;
    padding-bottom: 5px;
}

.cd-mega-col__list li:hover a span,
.cd-mega-col__list li:hover a i {
    color: #C90606;
}

/* ---- Administration flyout ------------------------------------------------ */
.cd-menu__item--flyout {
    position: relative;
}

.cd-flyout-panel {
    width: 210px;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}

.cd-flyout-panel ul {
    list-style: outside none none;
    background: #fff;
    width: 210px;
    margin: 0;
    padding: 0;
}

.cd-flyout-panel ul li {
    margin: 0 5px;
    background: #fff;
}

.cd-flyout-panel ul li a {
    display: block;
    padding: 10px;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    text-transform: none;
    text-decoration: none;
}

.cd-flyout-panel ul li:hover {
    background: #fff;
}

.cd-flyout-panel ul li:hover a,
.cd-flyout-panel ul li a:hover {
    color: #dd3333;
    background: #fff;
    text-decoration: none;
}

/* ---- search pill (original #searchform, WP Customizer positioning) ------- */
#searchform {
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 24%;
}

@media (min-width: 1024px) {
    #searchform {
        top: 15%;
        right: 0;
    }
}

#searchform input[type=text] {
    background-color: #fff;
    border: 1px solid #4A89BF;
    border-radius: 20px;
    width: 200px;
    height: 30px;
    padding: 0 16px 0 20px;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    color: #505056;
}

#searchform input[type=text]:focus-visible {
    outline: -webkit-focus-ring-color auto 0px;
}

#searchform input[type=submit] {
    border: none;
    width: 18px;
    height: 18px;
    background: url(../images/icons/search-icon.png) no-repeat;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 7px;
    text-indent: -9999px;
}

/* ---- mobile toggle + CLOSE row (hidden on desktop) ----------------------- */
.cd-menu-toggle,
.cd-menu-closebtn {
    display: none;
}

/* ---- mobile: in-bar accordion (<=1023px, the plugin's breakpoint) -------- */
@media (max-width: 1023px) {
    /* Pin the search pill to the 60px toggle bar: the container grows several
       hundred px when the accordion opens, so a percentage top would drop the
       pill onto the menu links and swallow their taps. */
    #searchform {
        top: 15px;
    }

    .cd-menu-toggle {
        display: block;
        height: 60px;
        text-align: left;
        cursor: pointer;
    }

    /* wp-custom-css overrides the theme's #0A2E7C to #222281 at <=1023px.
       10px padding all round keeps the 40px icon block exactly 60px tall. */
    .cd-menu-toggle__open,
    .cd-menu-toggle__close {
        display: inline-block;
        padding: 10px;
        background-color: #222281;
        color: #fff;
    }

    .cd-menu-toggle__open i,
    .cd-menu-toggle__close i {
        font-size: 40px;
        line-height: 1;
    }

    .cd-menu-toggle__close {
        display: none;
    }

    .cd-show-menu .cd-menu-toggle__open {
        display: none;
    }

    .cd-show-menu .cd-menu-toggle__close {
        display: inline-block;
    }

    .cd-menu {
        display: none;
        overflow: hidden;
        z-index: 999;
        height: 100%;
        padding-bottom: 50px;
        background: #222281;
    }

    .cd-show-menu .cd-menu {
        display: block;
    }

    .cd-menu__item {
        display: block;
        width: 100%;
        text-align: center;
        position: relative;
        border-bottom: 1px solid #ccc;
    }

    .cd-menu__item:last-child {
        border-bottom: none;
    }

    .cd-menu__item--current {
        background-color: #fff;
    }

    /* panels become max-height accordions in the flow */
    .cd-mega-panel,
    .cd-flyout-panel {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        opacity: 1;
        visibility: visible;
        max-height: 0;
        overflow: hidden;
        transition: all ease 0.1s;
        -webkit-transition: all ease 0.1s;
        padding: 0 8px 0;
    }

    .cd-menu__item.active-show > .cd-mega-panel,
    .cd-menu__item.active-show > .cd-flyout-panel {
        max-height: 10000px;
        transition: all ease 0.3s;
        -webkit-transition: all ease 0.3s;
        padding: 15px 8px 5px;
    }

    .cd-flyout-panel,
    .cd-flyout-panel ul {
        width: 100%;
    }

    .cd-menu-closebtn {
        display: block;
        color: #fff;
        border-top: 1px solid #fff;
        padding: 15px 10px 15px 30px;
        font-weight: 600;
        position: relative;
        cursor: pointer;
        overflow: hidden;
        clear: both;
        z-index: 999999;
    }

    .cd-menu-closebtn::before {
        content: '\f00d';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 16px;
        position: absolute;
        left: 10px;
        line-height: 1.4;
    }

    .cd-menu-closebtn {
        display: none;
    }

    .cd-show-menu .cd-menu-closebtn {
        display: block;
    }
}

/* columns stack only below 768px (matching the plugin responsive CSS) */
@media (max-width: 768px) {
    .cd-mega-columns .cd-mega-col,
    .cd-mega-columns--3 .cd-mega-col,
    .cd-mega-columns--4 .cd-mega-col,
    .cd-mega-columns--5 .cd-mega-col {
        width: 100%;
    }
}