﻿/* Descriptive desktop panels and mobile navigation. */
#header { position: relative; z-index: 1000; }
#header.sticky { position: fixed; }
#header .main-menu-location .manage-has-mega { position: static; display: flex; align-items: center; gap: 2px; }
#header .manage-submenu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 40px; padding: 0; border: 0; border-radius: 6px; color: #526475; background: transparent; cursor: pointer; }
#header .manage-submenu-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; transition: transform .2s; }
#header .manage-submenu-toggle[aria-expanded="true"] { color: #086ca8; background: #eaf4fa; }
#header .manage-submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
#header nav .sub-menu.manage-mega-menu { display: none; position: absolute; top: calc(100% - 1px); left: 50%; transform: translateX(-50%); width: min(1120px, calc(100vw - 48px)); max-height: calc(100dvh - 130px); overflow-y: auto; margin: 0; padding: 24px; border: 1px solid #dce5ed; border-top: 3px solid #086ca8; border-radius: 0 0 18px 18px; background: #fff; box-shadow: 0 24px 48px #102b4624; list-style: none; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); z-index: 1002; }
#header nav .sub-menu.manage-mega-services { width: min(1040px, calc(100vw - 48px)); grid-template-columns: repeat(3, minmax(0, 1fr)); }
#header .manage-has-mega.is-open > .manage-mega-menu,
#header:not(.manage-nav-ready) .manage-has-mega:hover > .manage-mega-menu,
#header:not(.manage-nav-ready) .manage-has-mega:focus-within > .manage-mega-menu { display: grid; }
#header .manage-mega-menu > li { min-width: 0; margin: 0; padding: 0; }
#header .manage-mega-menu .manage-mega-heading { grid-column: 1 / -1; padding: 0 14px 20px; margin-bottom: 4px; border-bottom: 1px solid #e7edf2; }
#header .manage-mega-heading > span { display: block; margin-bottom: 5px; color: #086ca8; font-size: 10px; font-weight: 700; letter-spacing: .14em; }
#header .manage-mega-heading > strong { color: #102b46; font-size: 24px; line-height: 1.3; letter-spacing: -.025em; }
#header .manage-mega-heading p { margin: 6px 0 0; color: #526475; font-size: 13px; line-height: 1.6; }
#header .manage-mega-menu .manage-mega-item > a { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-content: start; align-items: start; position: relative; gap: 14px; height: 100%; min-height: 154px; padding: 18px 14px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: #102b46; font-weight: 400; text-decoration: none; transition: background .18s, border-color .18s; }
#header .manage-mega-menu .manage-mega-item > a:hover,
#header .manage-mega-menu .manage-mega-item > a:focus-visible { background: #f0f7fb; color: #102b46; border-color: #cbe3f1; }
#header .manage-mega-menu .current-menu-item > a { background: #f0f7fb; border-color: #cbe3f1; }
#header .manage-menu-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 1px solid #dce9f1; border-radius: 12px; color: #086ca8; background: #f5f8fb; overflow: hidden; }
#header .manage-menu-icon img { width: 48px; height: 48px; object-fit: contain; }
#header .manage-menu-icon svg { width: 26px; height: 26px; }
#header .manage-menu-copy { min-width: 0; }
#header .manage-menu-title { display: block; color: #102b46; font-size: 18px; line-height: 1.35; letter-spacing: -.025em; overflow-wrap: anywhere; }
#header .manage-menu-title strong { font-weight: 700; }
#header .manage-menu-description { display: block; margin-top: 8px; color: #526475; font-size: 12px; line-height: 1.65; font-weight: 400; }
#header .manage-menu-badge { display: inline-block; margin-top: 6px; padding: 1px 7px; border-radius: 4px; color: #08604c; background: #e6f5ee; font-size: 10px; line-height: 1.6; font-weight: 700; }
#header .manage-menu-arrow { position: absolute; bottom: 10px; right: 14px; color: #086ca8; font-size: 18px; opacity: 0; transition: opacity .18s; }
#header .manage-mega-item > a:hover .manage-menu-arrow,
#header .manage-mega-item > a:focus-visible .manage-menu-arrow { opacity: 1; }
#header .manage-mega-services .manage-menu-title { font-size: 19px; }
#header .manage-mega-services .manage-menu-description { font-size: 13px; }
#header a:focus-visible, #header button:focus-visible { outline: 3px solid #086ca8; outline-offset: 3px; }
@media (min-width: 913px) and (max-width: 1100px) {
  #header nav .sub-menu.manage-mega-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #header .manage-mega-menu .manage-mega-item > a { min-height: 114px; }
  #header .top-header { gap: 16px; }
  #header .middle-header ul { gap: 8px 12px; }
}
@media (max-width: 912px) {
  #header #mobile-menu { position: absolute; top: 100%; left: 0; right: 0; margin: 0; width: 100%; max-height: calc(100dvh - 100px); overflow-y: auto; overscroll-behavior: contain; padding: 12px 20px 24px; border: 0; border-bottom: 1px solid #dce5ed; border-radius: 0 0 16px 16px; background: #fff; opacity: 1; box-shadow: 0 20px 30px #102b461a; }
  #header.manage-nav-ready #mobile-menu:not([hidden]), #header:not(.manage-nav-ready) #mobile-menu { display: block; }
  #header #mobile-menu[hidden] { display: none; }
  #header .menu-bg { padding: 0; width: 100%; }
  #header .mobile-menu ul { padding: 0; margin: 0; }
  #header .mobile-menu-nav > div > ul > li { border-bottom: 1px solid #e7edf2; }
  #header .mobile-menu .menu > li > a { display: inline-flex; align-items: center; min-height: 48px; color: #102b46; font-size: 15px; font-weight: 600; }
  #header .mobile-menu .manage-has-mega { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; }
  #header .mobile-menu .manage-submenu-toggle { width: 44px; height: 44px; }
  #header .mobile-menu nav .sub-menu.manage-mega-menu { grid-column: 1 / -1; position: static; transform: none; width: 100%; max-height: none; overflow: visible; padding: 8px 0 16px; border: 0; box-shadow: none; border-radius: 0; grid-template-columns: minmax(0, 1fr); gap: 4px; }
  #header .mobile-menu .manage-mega-menu .manage-mega-heading { padding: 12px 12px 16px; }
  #header .mobile-menu .manage-mega-heading > strong { font-size: 21px; }
  #header .mobile-menu .manage-mega-menu .manage-mega-item > a { min-height: 0; padding: 14px 10px; gap: 12px; }
  #header .mobile-menu .manage-menu-description { font-size: 13px; }
  #header .mobile-menu .manage-menu-title { font-size: 18px; }
  #header .menu-toggle[aria-expanded="true"] .hamburger { transform: rotate(90deg); }
}
@media (prefers-reduced-motion: reduce) {
  #header .manage-submenu-toggle svg, #header .manage-mega-item > a, #header .manage-menu-arrow { transition: none; }
}
#header .menu-toggle[aria-expanded="true"] .hamburger { transform: none; }
#header .menu-toggle[aria-expanded="true"] .bar-1 { d: path("M2,2 L10,8"); }
#header .menu-toggle[aria-expanded="true"] .bar-2 { opacity: 0; }
#header .menu-toggle[aria-expanded="true"] .bar-3 { d: path("M2,8 L10,2"); }
/* Keep every top-level label and disclosure control on one center line. */
#header #primary-desktop { align-items: center; flex-wrap: nowrap; margin-block: 0; }
#header #primary-desktop > li { display: flex; align-items: center; }
#header #primary-desktop > li > a { display: inline-flex; align-items: center; min-height: 44px; line-height: 1.25; white-space: nowrap; }
#header #primary-desktop > li > a img { flex-shrink: 0; }
#header .header-contact-cta { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; gap: 14px; min-height: 44px; padding: 10px 18px; border: 1px solid transparent; border-radius: 8px; color: #fff; background: #086ca8; font-size: 14px; font-weight: 700; line-height: 1.25; text-decoration: none; }
#header .header-contact-cta:hover { background: #102b46; }
/* Empty WordPress title banners must not separate a page from its own hero. */
.page-header:not(:has(.page-image img)):has(+ .page-content .mit-hero) { display: none; }
.page-content:has(.mit-hero) { margin-top: 0; }
@media (min-width: 913px) and (max-width: 1100px) {
  #header .left-header { flex-basis: 190px; min-width: 160px; }
  #header .top-header { gap: 12px; }
  #header #primary-desktop { column-gap: 10px; }
  #header #primary-desktop > li > a { font-size: 13px; }
  #header .header-contact-cta { padding-inline: 12px; gap: 8px; }
}
@media (max-width: 912px) {
  #header .top-header { gap: 12px; }
  #header .middle-header { display: none; }
  #header .left-header { flex: 1 1 180px; min-width: 0; max-width: 220px; }
  #header .right-header { flex-shrink: 0; }
  #header .header-contact-cta { padding-inline: 12px; font-size: 13px; }
  #header .header-contact-cta span { display: none; }
  #header .menu-toggle { padding: 4px; }
  #header .menu-toggle .hamburger { width: 36px; height: 40px; }
}
/* Contact is the final item at the far right of the header. */
#header .header-contact-cta { margin-left: auto; }
#header .right-header { margin-left: 0; }
@media (max-width: 912px) {
  #header .right-header { margin-left: auto; }
  #header .header-contact-cta { margin-left: 0; }
}
