/* ==========================================================================
   AAOPM header + navigation, premium 2026 look (Nov 12 2026)
   Sitewide: loaded by includes/head.php so every page's header matches the
   homepage. Scoped to the header, sale banner and mobile menu only, so page
   bodies keep their own styles. Mirrors the header rules in premium-2026.css.
   ========================================================================== */
header, #saleBanner, #countdownBar, #mobileMenu, .nv2-results {
  --primary-color: #B3001B;
  --primary-color-darker: #8C0015;
  --secondary-color: #141618;
  --secondary-color-darker: #0C0E10;
  --nav-ink: #181A1C;
  --nav-sans: 'Geist', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
header, header a, header span, header p, header button, header input, header li, header div,
#saleBanner, #saleBanner *, #countdownBar, #countdownBar *, #mobileMenu, #mobileMenu *, .nv2-results, .nv2-results * {
  font-family: var(--nav-sans);
}
header .bi, #mobileMenu .bi, #saleBanner .bi { font-family: bootstrap-icons !important; }
header, #saleBanner, #mobileMenu { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* top bar */
header .top-nav { background: #0C0E10 !important; }
header .top-nav a, header .top-nav span, header .top-nav p { letter-spacing: .02em; }

/* search: rectangle, not pill */
header .nv2-search { border-radius: 3px !important; }

/* header CTAs: Request Info + Book a Call, identical size */
header .nv2-reqinfo,
header .btn.btn-primary {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 42px !important; min-width: 148px; padding: 0 1.25rem !important;
  border-radius: 3px !important; border-width: 1px !important; border-style: solid !important;
  font-family: var(--nav-sans) !important; font-size: 12px !important; font-weight: 600 !important;
  letter-spacing: .09em !important; text-transform: uppercase !important; line-height: 1 !important;
  box-sizing: border-box !important; box-shadow: none !important;
}
header .btn.btn-primary { background: #B3001B !important; border-color: #B3001B !important; color: #fff !important; }
header .btn.btn-primary:hover { background: #8C0015 !important; border-color: #8C0015 !important; }
header .nv2-reqinfo { border-color: var(--nav-ink) !important; color: var(--nav-ink) !important; background: #fff !important; }
header .nv2-reqinfo:hover { background: var(--nav-ink) !important; color: #fff !important; }

/* mega-menu badges */
header .mega-featured-badge { border-radius: 3px !important; }

/* sale banner button */
#saleBanner .btn, #countdownBar .btn, #saleBanner a.btn {
  border-radius: 3px !important; box-shadow: none !important;
}

/* mobile menu buttons */
#mobileMenu .btn { border-radius: 3px !important; }

/* ---------- Mega menu: no "ghost" reopen (Nov 12 2026) ----------
   1) While fading out (0.3s) the full-width panel still caught the mouse, so moving down onto the
      page re-triggered :hover and the menu popped back open. It now ignores the pointer unless open.
   2) :focus-within kept it open after a mouse click inside it. Open-on-focus is now keyboard only
      (:focus-visible), which keeps the WCAG 2.1.1 keyboard access from 2026-09-08. */
header .mega-menu { pointer-events: none; }
header .mega-menu-parent:hover .mega-menu { pointer-events: auto; }
@supports selector(:has(*)) {
  header .mega-menu-parent:focus-within:not(:hover):not(:has(:focus-visible)) .mega-menu {
    opacity: 0 !important; visibility: hidden !important; transform: translateY(-10px) !important; pointer-events: none !important;
  }
  header .mega-menu-parent:has(:focus-visible) .mega-menu { pointer-events: auto; }
}
/* Hover bridge (Nov 12 2026): there is a ~9px gap between the nav item and the panel; without this the menu
   closed while the mouse crossed it. The bridge is part of the open panel, so it only exists while open. */
header .mega-menu::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 22px; }

/* ---------- Mega menu: 2026 brand (Nov 12 2026) ----------
   Visual only, no markup or text changes. Flat white panel, hairlines instead of shadows and tinted
   boxes, text-first links (the filled clip-art icons are hidden), one featured-card style for all
   three categories (no pink/green/blue gradients), square 3px buttons. */
header .mega-menu {
  box-shadow: none !important; background: #fff !important;
  border-top: 1px solid #E4E2DE; border-bottom: 1px solid #E4E2DE;
}
header .mega-menu .bi { display: none !important; }
header .mega-menu .mega-featured-btn .bi { display: inline-block !important; }

/* category tabs: underline style */
header .mega-menu-tabs { background: #fff !important; border-bottom: 1px solid #E4E2DE !important; margin: 0 2rem; padding: 0; gap: 2.5rem; }
header .mega-tab {
  flex: 0 0 auto !important; padding: 1.15rem 0 !important; background: transparent !important;
  color: #6B6F73 !important; font-size: 13px !important; font-weight: 600 !important;
  letter-spacing: .09em; text-transform: uppercase;
}
header .mega-tab:hover, header .mega-tab.active { color: var(--nav-ink) !important; background: transparent !important; }
header .mega-tab.active::after { height: 2px !important; background: #B3001B !important; }

/* panel */
header .mega-menu-content { min-height: 0 !important; }
header .mega-panel { padding: 2.25rem 2rem 2.5rem !important; }
header .mega-panel-grid { gap: 3.5rem !important; }
header .mega-category-title {
  display: block !important; border-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: .5rem !important;
  color: #6B6F73 !important; font-size: 12px !important; font-weight: 600 !important;
  letter-spacing: .12em; text-transform: uppercase;
}

/* course links: hairline list, no boxes */
header .mega-courses-grid { column-gap: 2.5rem !important; row-gap: 0 !important; }
header .mega-course-item {
  background: transparent !important; border: 0 !important; border-bottom: 1px solid #E4E2DE !important;
  border-radius: 0 !important; padding: .85rem 0 !important; box-shadow: none !important; transform: none !important;
  color: var(--nav-ink) !important; font-size: 15px !important; font-weight: 500 !important; letter-spacing: -.005em;
  transition: color .15s ease !important;
}
header .mega-course-item:hover { color: #B3001B !important; }

/* link cards in Dates & Locations / Admissions (inline-styled in the markup) */
header .mega-menu a.d-block[style] {
  background: #fff !important; border: 1px solid #E4E2DE !important; border-radius: 3px !important;
  transition: border-color .15s ease !important;
}
header .mega-menu a.d-block[style]:hover { border-color: var(--nav-ink) !important; }
header .mega-menu a.d-block[style] p { color: #5A5E62 !important; }
header .mega-menu a.d-block[style] .d-flex p { color: var(--nav-ink) !important; font-weight: 600 !important; }

/* featured card: one flat style for every category */
header .mega-featured-card,
header .mega-featured-card.mega-featured-functional,
header .mega-featured-card.mega-featured-pain {
  background: #F4F3F1 !important; border: 0 !important; border-radius: 3px !important; padding: 2rem !important;
}
header .mega-featured-badge,
header .mega-featured-functional .mega-featured-badge,
header .mega-featured-pain .mega-featured-badge {
  background: transparent !important; color: #B3001B !important; padding: 0 !important; border-radius: 0 !important;
  font-size: 11px !important; font-weight: 600 !important; letter-spacing: .14em !important; margin-bottom: .85rem !important;
}
header .mega-featured-card .mega-featured-title {
  color: var(--nav-ink) !important; font-size: 1.375rem !important; font-weight: 500 !important;
  letter-spacing: -.02em; line-height: 1.2;
}
header .mega-featured-card p:not(.mega-featured-title) { color: #5A5E62 !important; }
header .mega-featured-stats { gap: 0 !important; }
header .mega-featured-stats span { color: var(--nav-ink) !important; font-size: 12px !important; font-weight: 500; }
header .mega-featured-stats span + span { margin-left: .85rem; padding-left: .85rem; border-left: 1px solid #CFCCC6; }
header .mega-featured-btn {
  background: #141618 !important; border-radius: 3px !important; min-height: 42px; padding: .7rem 1.25rem !important; line-height: 1.35;
  font-size: 12px !important; font-weight: 600 !important; letter-spacing: .09em; text-transform: uppercase;
  transform: none !important;
}
header .mega-featured-btn:hover { background: #B3001B !important; }

/* footer quick links */
header .mega-menu-footer { background: #fff !important; border-top: 1px solid #E4E2DE !important; justify-content: flex-start !important; gap: 2.5rem !important; margin: 0 2rem; padding: 1.1rem 0 !important; }
header .mega-footer-link {
  padding: 0 !important; border-radius: 0 !important; background: transparent !important;
  color: var(--nav-ink) !important; font-size: 12px !important; font-weight: 600 !important;
  letter-spacing: .09em; text-transform: uppercase;
}
header .mega-footer-link:hover { color: #B3001B !important; background: transparent !important; }
header .mega-courses-list > .d-flex[style] { gap: 1.25rem !important; } /* 4 link cards fit on one row */