/* ====== NAVBAR (lado do logo, sobre header com gradiente) ====== */
.navbar{
  flex: 1;
  background: transparent;      /* usa o gradiente do header */
  box-shadow: none;
  border: 0;
  position: relative;
  z-index: 10;                   /* fica acima do conteúdo */
}

.navbar-container{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-height: 70px;
}

/* ====== LISTA DE LINKS ====== */
.navbar-nav{
  display: flex;
  align-items: center;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-item{ position: relative; }

.nav-link{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 16px;
  color: #ffffff;                /* contraste no gradiente */
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
  border-radius: 6px;
  transition: background .2s ease, color .2s ease, padding-left .2s ease;
  white-space: nowrap;
}

.nav-link:hover,
.nav-link:focus{
  color: #ffdd57;
  background: rgba(255,255,255,.12);
}

.nav-icon{ font-size: 16px; }

/* ====== DROPDOWN (DESKTOP) ====== */
.dropdown{ position: relative; }

.dropdown-menu{
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 240px;
  background: #ffffff;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  z-index: 9999;
}

.dropdown:hover > .dropdown-menu{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.dropdown-item{
  display: block;
  padding: 10px 14px;
  color: #333;
  text-decoration: none;
  font-weight: 500;
  border-bottom: 1px solid #f3f3f3;
  transition: background .15s ease, color .15s ease, padding-left .15s ease;
}

.dropdown-item:last-child{ border-bottom: 0; }

.dropdown-item:hover{
  background: #f7f9ff;
  color: #155799;
  padding-left: 18px;
}

/* ====== BUSCA ====== */
.navbar-search{
  display: flex;
  align-items: center;
  gap: 8px;
}

.search-input{
  padding: 8px 14px;
  border: none;
  border-radius: 22px;
  outline: none;
  width: 200px;
  background: #ffffff;
}

.search-input:focus{
  box-shadow: 0 0 0 3px rgba(255,255,255,.25);
}

.search-btn{
  background: #ffffff;
  color: #155799;
  border: none;
  padding: 8px 12px;
  border-radius: 22px;
  cursor: pointer;
}

/* ====== BOTÃO MOBILE (HAMBURGUER) ====== */
.mobile-menu-btn{
  display: none;
  flex-direction: column;
  gap: 4px;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 8px;
}
.mobile-menu-btn span{
  width: 26px;
  height: 3px;
  background: #ffffff;
  border-radius: 2px;
}

/* ====== RESPONSIVO ====== */
@media (max-width: 992px){
  .navbar-search{ display: none; }         /* esconde busca */
}

@media (max-width: 768px){
  /* empilha logo + menu */
  .navbar-container{
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .mobile-menu-btn{ display: flex; }

  /* menu fechado por padrão */
  .navbar-nav{
    display: none;
    flex-direction: column;
    width: 100%;
    background: rgba(0,0,0,0.06);          /* leve contraste sobre o gradiente */
    backdrop-filter: blur(2px);
    border-radius: 10px;
    overflow: hidden;
  }
  /* classe ativada pelo JS: toggleMobileMenu() adiciona/remova .active */
  .navbar-nav.active{ display: flex; }

  .nav-link{
    width: 100%;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    border-radius: 0;
  }
  .nav-item:last-child .nav-link{ border-bottom: 0; }

  /* dropdown vira lista expandida dentro do fluxo */
  .dropdown-menu{
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    box-shadow: none;
    border: 0;
    background: rgba(255,255,255,.95);
    border-radius: 0;
    padding: 0;
  }
  .dropdown-item{
    padding: 12px 18px;
    border-bottom: 1px solid #eee;
  }
  .dropdown-item:last-child{ border-bottom: 0; }
}

/* Header base */
.site-header {
  position: sticky; top: 0; z-index: 1000;
}

.container-nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px;
}

/* Marca */
.brand { display: inline-flex; align-items: center; gap: 10px; }

/* Menu desktop */
.nav { display: block; }
.menu {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 18px; align-items: center;
}
.menu a { color: #fff; text-decoration: none; font-weight: 600; }

/* Botão hambúrguer (esconde no desktop) */
.menu-toggle {
  display: none;
  background: none; border: 0; cursor: pointer;
  width: 40px; height: 40px; position: relative;
}
.menu-toggle .bar {
  position: absolute; left: 8px; right: 8px; height: 2px; background: #fff;
  transform-origin: center; transition: transform .2s ease, opacity .2s ease;
}
.menu-toggle .bar:nth-child(1) { top: 12px; }
.menu-toggle .bar:nth-child(2) { top: 19px; }
.menu-toggle .bar:nth-child(3) { top: 26px; }

/* Mobile */
@media (max-width: 900px) {
  .menu-toggle { display: inline-block; }

  /* Nav vira “gaveta” abaixo do header */
  .nav {
    position: fixed; left: 0; right: 0; top: 60px; /* ajuste se seu header for maior */
    background: rgba(15, 67, 87, 0.98);
    transform: translateY(-110%); transition: transform .25s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,.2);
  }
  .nav.open { transform: translateY(0); }

  .menu {
    flex-direction: column; align-items: stretch;
    padding: 12px 14px; gap: 8px;
  }
  .menu a {
    display: block; padding: 12px 10px; border-radius: 8px;
  }
  .menu a:hover { background: rgba(255,255,255,0.08); }

  /* Evita scroll do fundo com menu aberto */
  body.menu-open { overflow: hidden; }
}

/* (Opcional) animação do ícone quando aberto */
@media (max-width: 900px) {
  .menu-toggle[aria-expanded="true"] .bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .bar:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

/* Se existir overlay, garanta que não capture cliques quando escondido */
.loading-overlay[hidden], .loading-overlay.is-hidden {
  display: none !important; pointer-events: none !important;
}

/* Header alinhado e sobreposto ao conteúdo */
#novo_background {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  position: sticky;
  top: 0;
  z-index: 1500; /* acima do conteúdo */
}

/* Linha com logo + botão */
.container-logo-mp {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Nav desktop */
.navbar { margin-left: auto; }
.navbar-container { display: block; }
.navbar-nav {
  display: flex;
  gap: 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.navbar-nav .nav-link {
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}

/* Botão hambúrguer (esconde no desktop) */
.menu-toggle {
  display: none;
  background: none;
  border: 0;
  cursor: pointer;
  width: 40px;
  height: 40px;
  position: relative;
}
.menu-toggle .bar {
  position: absolute;
  left: 8px; right: 8px;
  height: 2px; background: #fff;
  transition: transform .2s ease, opacity .2s ease;
}
.menu-toggle .bar:nth-child(1) { top: 12px; }
.menu-toggle .bar:nth-child(2) { top: 19px; }
.menu-toggle .bar:nth-child(3) { top: 26px; }

/* ===== MOBILE ===== */
@media (max-width: 900px) {
  .menu-toggle { display: inline-block; }

  /* Navbar vira gaveta sob o header */
  .navbar {
    position: fixed;
    left: 0; right: 0; top: 60px; /* ajuste se seu header for maior */
    background: rgba(15,67,87,0.98);
    transform: translateY(-120%);
    transition: transform .25s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,.2);
  }
  .navbar.open { transform: translateY(0); }

  .navbar-container { padding: 12px 14px; }
  .navbar-nav { flex-direction: column; gap: 8px; }
  .navbar-nav .nav-link {
    display: block;
    padding: 12px 10px;
    border-radius: 8px;
  }
  .navbar-nav .nav-link:hover {
    background: rgba(255,255,255,0.08);
  }

  /* Evitar scroll do fundo com menu aberto */
  body.menu-open { overflow: hidden; }
}

/* Animação do ícone quando aberto */
@media (max-width: 900px) {
  .menu-toggle[aria-expanded="true"] .bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .bar:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

/* Se existir overlay de carregamento, certifique-se que não bloqueie cliques quando escondido */
.loading-overlay[hidden],
.loading-overlay.is-hidden {
  display: none !important;
  pointer-events: none !important;
}