/* Ensure hidden vs visible panels behave as expected */
nav .relative > div.absolute.invisible { visibility: hidden; opacity: 0; }
nav .relative > div.absolute.visible   { visibility: visible;  opacity: 1; }
/* Optional: prevents accidental clicks when hidden */
nav .relative > div.absolute.invisible { pointer-events: none; }
/* Smoothen transitions (your panels already have transition classes) */

/* Add a small hover bridge above dropdowns so the pointer doesn't leave the container while traveling to the panel */
nav .relative > div.absolute::before {
  content: "";
  position: absolute;
  top: -10px;         /* bridge height (must be >= your mt-2 offset ~8px) */
  right: 0;
  left: 0;
  height: 10px;
  pointer-events: none;   /* don't block clicks */
}