/* ============================================
   DROPDOWN NAV FIX — v4 Final
   Projects <li> uses class="has-dropdown" (or "has-dropdown active")
   The submenu <ul> uses class="submenu"
   ============================================ */

/* 1. Strip border/outline/shadow from all top-level nav items */
.nav-links > li {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 2. Same for top-level links */
.nav-links > li > a {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 3. Hide the submenu UL by default */
.nav-links > li.has-dropdown > ul.submenu,
.nav-links > li > ul.submenu {
  display: none !important;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: var(--white, #fff);
  border: 1px solid rgba(0,0,0,0.08) !important;
  border-top: 3px solid var(--red, #9B1C1C) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;
  border-radius: 0 0 6px 6px;
  z-index: 2000;
  list-style: none;
  padding: 0.25rem 0;
  margin: 0;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}

/* 4. Show submenu on hover */
.nav-links > li.has-dropdown:hover > ul.submenu,
.nav-links > li:hover > ul.submenu {
  display: block !important;
}

/* 5. Submenu item rows */
.nav-links > li > ul.submenu > li {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
  margin: 0;
  padding: 0;
}

/* 6. Submenu links */
.nav-links > li > ul.submenu > li > a {
  display: block;
  padding: 0.65rem 1.2rem;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--charcoal, #2d2d2d) !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
  border-top: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
  white-space: nowrap;
  text-transform: none;
  transition: background 0.15s, color 0.15s;
}

.nav-links > li > ul.submenu > li:last-child > a {
  border-bottom: none !important;
}

.nav-links > li > ul.submenu > li > a:hover {
  background: var(--red, #9B1C1C) !important;
  color: #fff !important;
}