
/* Dropdown behavior (pure CSS) */
.site-header #primary-menu > li{ position:relative }
.site-header #primary-menu > li > a{ color:#fff; text-decoration:none; font-weight:600; padding:.65rem .6rem; border-radius:.5rem; display:inline-block }
.site-header #primary-menu > li.menu-item-has-children > a::after,
.site-footer #footer-menu > li > a.footer-parent::after{ content:"▾"; margin-left:.35rem; font-size:.8em; opacity:.85 }
.site-header #primary-menu > li > .sub-menu{
  position:absolute; left:50%; transform:translateX(-50%);
  top:calc(100% + 14px);
  min-width: 220px;
  background:#ffffff; color:#111827;
  border:1px solid #e5e7eb; border-radius:14px; padding:.5rem 0;
  box-shadow:0 20px 50px rgba(0,0,0,.20), 0 2px 6px rgba(0,0,0,.05);
  display:none; z-index:1000;
}
.site-header #primary-menu > li:hover > .sub-menu,
.site-header #primary-menu > li:focus-within > .sub-menu{ display:block }

/* Footer nested children beneath parent */
/* .site-footer #footer-menu > li > a{ color:#eef5f3; font-weight:700 } */
.site-footer #footer-menu .sub-menu{ margin:.5rem 0 0 0; padding:0; }
.site-footer #footer-menu > li > a.footer-parent{ border-top: 1px solid; border-bottom: 1px solid; }
/* .site-footer #footer-menu .sub-menu a{ color:#cfe6e0; font-weight:500; line-height:1.9; text-decoration:none } */

/* Mobile */
@media (max-width:991.98px){
  .nav-toggle{ display:block }
  .nav-primary{ display:none; position:absolute; right:1rem; top:60px; flex-direction:column; gap:0; background:var(--brand-900); width:min(90vw, 320px); padding:.5rem; border-radius:var(--radius-xl); box-shadow:0 10px 30px rgba(0,0,0,.25) }
  .nav-primary[data-open="true"]{ display:flex }
  .site-header #primary-menu{ flex-direction:column; gap:.25rem }
  .site-header #primary-menu > li > .sub-menu{ position:static; transform:none; box-shadow:none; border-radius:10px; padding:.25rem; display:block }
}

/* Assure header/footer color when no Tailwind */
.site-footer{ background-color: var(--brand-900); }


/* --- Keep dropdown open while moving cursor to it --- */
/* Create an invisible buffer between parent and submenu */
.site-header #primary-menu > li > .sub-menu{
  top:100%;           /* attach to bottom of parent */
  transform:none;     /* no gap created by translate */
}
.site-header #primary-menu > li > .sub-menu::before{
  content:"";         /* hover buffer */
  position:absolute;
  top:-12px;
  left:0; right:0;
  height:12px;
  background:transparent;
  display:block;
}
/* Move the caret to ::after so ::before is the buffer */
.site-header #primary-menu > li > .sub-menu::after{
  content:"";
  position:absolute;
  top:-8px;
  left:50%;
  transform:translateX(-50%);
  width:0; height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:8px solid #fff;
  filter: drop-shadow(0 -1px 0 rgba(0,0,0,.08));
}


/* --- Submenu visual fix (scoped) --- */
.site-header #primary-menu > li{ position:relative }
.site-header #primary-menu > li > .sub-menu{
  left:50%;
  top:100%;
  transform:translateX(-50%);
  min-width:240px;
  background:#fff;
  color:#111827;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:.5rem 0;
  box-shadow:0 20px 50px rgba(0,0,0,.20), 0 2px 6px rgba(0,0,0,.05);
  z-index: 1000;
}
/* Keep hover bridge so it does not close when moving cursor */
.site-header #primary-menu > li > .sub-menu::before{
  content:"";
  position:absolute;
  top:-12px; left:0; right:0;
  height:12px; background:transparent;
  display:block;
}
/* Caret */
.site-header #primary-menu > li > .sub-menu::after{
  content:"";
  position:absolute;
  top:-8px; left:50%; transform:translateX(-50%);
  width:0; height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:8px solid #fff;
  filter: drop-shadow(0 -1px 0 rgba(0,0,0,.08));
}
/* Links inside submenu */
.site-header #primary-menu > li > .sub-menu > li > a{
  color:#111827; text-decoration:none; display:block;
  padding:.6rem 1rem; border-radius:.5rem; font-weight:600;
}
.site-header #primary-menu > li > .sub-menu > li > a:hover,
.site-header #primary-menu > li > .sub-menu > li > a:focus{
  background:#f2f5f7;
}


/* --- Remove bullets from submenus (scoped to header & footer) --- */
.site-header #primary-menu .sub-menu,
.site-footer #footer-menu .sub-menu{
  list-style: none !important;
  margin: 0;
}

.site-header #primary-menu .sub-menu{
  padding: .5rem 0;
}
.site-header #primary-menu .sub-menu > li,
.site-footer #footer-menu .sub-menu > li{
  list-style: none !important;
  margin: 0;
  padding: 0;
}
