/* ===================================
   DROPDOWN MENU - ÁREAS DE ATUAÇÃO
   Solução limpa e funcional
   =================================== */

/* FORÇAR header para frente de tudo */
.header {
  position: relative;
  z-index: 999999 !important;
}

/* Forçar hero/banner para trás */
.hero,
main {
  position: relative;
  z-index: 1 !important;
}

/* Garantir que o nav-menu permita overflow */
.nav-menu {
  overflow: visible !important;
}

/* Container do dropdown */
.menu-dropdown {
  position: relative;
}

/* Link do dropdown */
.dropdown-toggle {
  cursor: pointer;
}

/* Seta indicadora */
.dropdown-toggle::after {
  content: ' ▾';
  margin-left: 0.25rem;
  font-size: 0.75rem;
}

/* Conteúdo do dropdown - ESCONDIDO por padrão */
.dropdown-content {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 250px;
  background: white;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 0.5rem 0;
  margin-top: 0.5rem;
  list-style: none;
  z-index: 999999;
}

/* MOSTRAR dropdown quando tem classe 'open' */
.menu-dropdown.open .dropdown-content {
  display: block;
}

/* Items do dropdown */
.dropdown-content li {
  margin: 0;
  padding: 0;
}

.dropdown-content a {
  display: block;
  padding: 0.75rem 1.5rem;
  color: #333;
  text-decoration: none;
  font-size: 0.9375rem;
  transition: background 0.2s;
  border-left: 3px solid transparent;
}

.dropdown-content a:hover {
  background: #f0f8ff;
  color: #0066CC;
  border-left-color: #0066CC;
}

.dropdown-content a.active {
  background: #e6f2ff;
  color: #0066CC;
  font-weight: 600;
}

/* Mobile */
@media (max-width: 1023px) {
  .dropdown-content {
    position: static;
    box-shadow: none;
    border: none;
    margin-top: 0;
    padding-left: 1rem;
    background: rgba(0, 102, 204, 0.05);
  }
}