/* Menu do site, igual na landing e nas páginas de produto (incentivadores).
   Grupos com submenu no computador; painel único no celular. */

.menu-site { align-items:center; gap:2px; }
.menu-site__grupo { position:relative; }

.menu-site__gatilho,
.menu-site__link {
  display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 12px;
  border:0; border-radius:var(--alt-radius, 4px); background:none; cursor:pointer;
  font:inherit; font-size:14px; font-weight:500; line-height:1; white-space:nowrap;
  color:rgba(13,13,13,.55); text-decoration:none;
  transition:color .16s ease, background-color .16s ease;
}
.menu-site__gatilho:hover,
.menu-site__link:hover,
.menu-site__gatilho[aria-expanded="true"] { color:var(--alt-ink, #282525); background:rgba(13,13,13,.04); }
.menu-site__seta { font-size:12px; transition:transform .16s ease; }
.menu-site__gatilho[aria-expanded="true"] .menu-site__seta { transform:rotate(180deg); }

.menu-site__painel {
  position:absolute; top:calc(100% + 8px); right:0; z-index:60; padding:6px;
  background:#fff; border:1px solid rgba(13,13,13,.08); border-radius:var(--alt-radius, 4px);
  box-shadow:0 18px 40px -16px rgba(40,37,37,.22), 0 2px 6px rgba(40,37,37,.05);
  opacity:0; visibility:hidden; transform:translateY(-4px);
  transition:opacity .16s ease, transform .16s ease, visibility 0s linear .16s;
}
/* Uma coluna por módulo (Captação de recursos, Prestação de contas...). */
.menu-site__painel { display:grid; grid-template-columns:repeat(var(--colunas, 1), 21rem); width:auto; }
.menu-site__coluna + .menu-site__coluna { padding-left:6px; border-left:1px solid rgba(13,13,13,.06); }

/* Ponte invisível sobre o vão de 8px: o mouse passa do botão ao painel sem fechá-lo. */
.menu-site__painel::before { content:""; position:absolute; left:0; right:0; top:-9px; height:9px; }
.menu-site__grupo.is-aberto .menu-site__painel {
  opacity:1; visibility:visible; transform:none;
  transition:opacity .16s ease, transform .16s ease;
}

.menu-site__secao {
  margin:0; padding:8px 12px 4px; font-size:11px; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(13,13,13,.55);
}
.menu-site__item {
  display:block; padding:10px 12px; border-radius:var(--alt-radius, 4px);
  color:var(--alt-ink, #282525); text-decoration:none;
  transition:background-color .16s ease;
}
.menu-site__item:hover { background:var(--alt-surface, #F7F7F5); }
.menu-site__titulo { display:block; font-size:14px; font-weight:500; line-height:1.3; }
.menu-site__desc { display:block; margin-top:3px; font-size:12.5px; line-height:1.45; color:rgba(13,13,13,.55); }
.menu-site__item[aria-current="page"] { background:var(--alt-surface, #F7F7F5); }

.menu-site__gatilho:focus-visible,
.menu-site__link:focus-visible,
.menu-site__item:focus-visible,
.menu-site__botao-celular:focus-visible {
  outline:2px solid var(--alt-purple-focus, #7259B5); outline-offset:2px;
}

/* Celular */
.menu-site__botao-celular {
  display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
  border:0; border-radius:var(--alt-radius, 4px); background:none; cursor:pointer;
  color:var(--alt-ink, #282525); font-size:22px;
}
.menu-site__botao-celular:hover { background:rgba(13,13,13,.04); }

.menu-celular {
  position:fixed; top:72px; left:8px; right:8px; z-index:60;
  max-height:calc(100dvh - 88px); overflow-y:auto; padding:8px;
  background:#fff; border:1px solid rgba(13,13,13,.08); border-radius:var(--alt-radius, 4px);
  box-shadow:0 18px 40px -16px rgba(40,37,37,.25);
}
.menu-celular[hidden] { display:none; }
.menu-celular__secao + .menu-celular__secao { margin-top:6px; padding-top:6px; border-top:1px solid rgba(13,13,13,.06); }
.menu-celular__rotulo {
  display:block; padding:8px 12px 4px; font-size:11px; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(13,13,13,.55);
}
.menu-celular__link {
  display:flex; align-items:center; min-height:44px; padding:0 12px; border-radius:var(--alt-radius, 4px);
  font-size:15px; font-weight:500; color:var(--alt-ink, #282525); text-decoration:none;
}
.menu-celular__link:hover { background:var(--alt-surface, #F7F7F5); }
.menu-celular__link:focus-visible { outline:2px solid var(--alt-purple-focus, #7259B5); outline-offset:-2px; }

@media (min-width:768px) { .menu-site__botao-celular, .menu-celular { display:none !important; } }
@media (prefers-reduced-motion:reduce) {
  .menu-site__painel, .menu-site__seta, .menu-site__gatilho, .menu-site__item { transition:none; }
}

/* Exibição por largura: no celular, o menu vira o painel e o "Fazer login" entra nele. */
.menu-site { display:none; }
/* No computador o menu encosta à direita, antes do login, separado por um traço. */
@media (min-width:768px) {
  .menu-site { display:flex; margin-left:auto; }
  .menu-site::after {
    content:""; flex:none; width:1px; height:20px; margin:0 6px 0 10px;
    background:rgba(13,13,13,.14);
  }
}
@media (max-width:767px) { .menu-site__login { display:none !important; } }