/*
 * GrantFullen.com mobile menu layer and touch repair
 * Version: grantfullen-mobile-menu-v21-20260715
 *
 * Mobile only. Keeps the desktop navigation unchanged.
 */

@media (max-width: 920px) {
  :root {
    --grant-mobile-menu-layer-v21: 2147483000;
    --grant-mobile-menu-gap-v21: 6px;
  }

  html {
    overflow-x: clip !important;
  }

  /*
   * Prevent the generated sticky navigation from creating a low stacking
   * context or clipping an open submenu.
   */
  .grant-mobile-menu-root-v21,
  .grant-mobile-menu-root-v21 nav,
  .grant-mobile-menu-root-v21 [class*="topbar"],
  .grant-mobile-menu-root-v21 [class*="navbar"],
  .grant-mobile-menu-root-v21 [class*="nav-inner"],
  .grant-mobile-menu-root-v21 [class*="menu-wrap"] {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
    clip-path: none !important;
    contain: none !important;
    isolation: auto !important;
  }

  .grant-mobile-menu-root-v21 {
    z-index: var(--grant-mobile-menu-layer-v21) !important;
    pointer-events: auto !important;
  }

  /*
   * These selectors cover the generated topbar dropdown names as well as
   * conventional dropdown/submenu markup.
   */
  .grant-mobile-menu-panel-v21,
  .grant-mobile-menu-root-v21 :where(
    [role="menu"].open,
    [role="menu"].show,
    [role="menu"].is-open,
    [role="menu"][data-open="true"],
    .dropdown-menu.open,
    .dropdown-menu.show,
    .dropdown-menu.is-open,
    .submenu.open,
    .submenu.show,
    .submenu.is-open,
    .sub-menu.open,
    .sub-menu.show,
    .sub-menu.is-open,
    [class*="dropdown"][class*="open"],
    [class*="submenu"][class*="open"],
    [class*="menu-panel"][class*="open"],
    [aria-hidden="false"][role="menu"]
  ) {
    z-index: calc(var(--grant-mobile-menu-layer-v21) + 20) !important;

    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;

    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 74px) !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;

    transform: none !important;
    translate: none !important;
    clip-path: none !important;
    contain: none !important;
    isolation: isolate !important;

    touch-action: pan-y manipulation !important;
  }

  .grant-mobile-menu-panel-v21,
  .grant-mobile-menu-panel-v21 * {
    pointer-events: auto !important;
  }

  .grant-mobile-menu-panel-v21 a,
  .grant-mobile-menu-panel-v21 button,
  .grant-mobile-menu-panel-v21 [role="menuitem"] {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    align-items: center !important;

    min-height: 44px !important;
    width: 100% !important;
    max-width: 100% !important;

    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(255,255,255,.12) !important;
  }

  .grant-mobile-menu-trigger-v21 {
    position: relative !important;
    z-index: calc(var(--grant-mobile-menu-layer-v21) + 30) !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  /*
   * The backdrop sits above page content but below the navigation and submenu.
   * It prevents the hero/cards from intercepting taps beside the open menu.
   */
  #grant-mobile-menu-backdrop-v21 {
    position: fixed !important;
    inset: 0 !important;
    z-index: calc(var(--grant-mobile-menu-layer-v21) - 1) !important;

    display: none;
    background: rgba(0,0,0,.18);
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  body.grant-mobile-menu-open-v21 #grant-mobile-menu-backdrop-v21 {
    display: block !important;
  }

  body.grant-mobile-menu-open-v21 {
    overflow-x: clip !important;
  }
}