/* ══════════════════════════════════════════════════════════════════════════
   Energia Verde Amarela: navegação do site inteiro (ver menu.js)
   Topo com menus abertos no computador, barra fixa em baixo no telemóvel.
   ══════════════════════════════════════════════════════════════════════════ */
:root{--nv-lima:#D0F53D; --nv-preto:#0B0B0A; --nv-osso:#F2F2EE}

/* ── o logótipo, maior em todos os topos ──────────────────────────────── */
.hx-marca svg,.zt-marca svg,.topo .marca svg{width:44px !important; height:44px !important}
.hx-marca b,.zt-marca b{font-size:17px !important; letter-spacing:-.02em}
.hx-marca b span,.zt-marca b span{font-size:10.5px !important}
.topo .marca b{font-size:17px !important}
@media(max-width:599px){
  .hx-marca svg,.zt-marca svg,.topo .marca svg{width:38px !important; height:38px !important}
  .hx-marca b,.zt-marca b,.topo .marca b{font-size:15.5px !important}
}

/* ── topos mais altos e iguais ────────────────────────────────────────── */
.hx-top-in,.zt-in{min-height:80px}
.topo .tel,.zt-tel,.hx-tel{font-size:14px}
@media(max-width:1239px){ .topo .tel{display:none} }
.topo .btn{white-space:nowrap}

/* ── menus abertos (computador) ───────────────────────────────────────── */
.hx-nav,.zt-nav,.pg-nav{align-items:center}
.nv-dd{position:relative}
.nv-b,.nv-solto{display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 14px; border:0; border-radius:999px; cursor:pointer;
  background:transparent; color:rgba(242,242,238,.88); font-weight:500; font-size:14.5px; line-height:1; font-family:inherit; text-decoration:none; letter-spacing:-.005em;
  transition:background-color .2s, color .2s}
.nv-b svg{width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.6; transition:transform .25s ease}
.nv-b:hover,.nv-solto:hover,.nv-dd.aberto .nv-b{background:rgba(242,242,238,.1); color:#fff}
.nv-dd.aberto .nv-b svg{transform:rotate(180deg)}
.nv-solto.on{color:var(--nv-lima)}
.nv-p{position:absolute; top:calc(100% + 12px); left:50%; z-index:80; width:min(640px,90vw); padding:12px; border-radius:24px;
  background:rgba(20,20,18,.97); border:1px solid rgba(242,242,238,.12); box-shadow:0 30px 80px -20px rgba(0,0,0,.75);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  opacity:0; visibility:hidden; transform:translate(-50%,-6px); transition:opacity .2s ease, transform .2s ease, visibility 0s .2s}
.nv-p::before{content:""; position:absolute; left:0; right:0; top:-14px; height:14px}
.nv-dd.aberto .nv-p{opacity:1; visibility:visible; transform:translate(-50%,0); transition:opacity .2s ease, transform .2s ease}
.nv-g2{display:grid; grid-template-columns:1fr 1fr; gap:4px}
.nv-c{display:flex; gap:14px; align-items:flex-start; padding:14px; border-radius:16px; color:var(--nv-osso); text-decoration:none;
  transition:background-color .2s}
.nv-c:hover,.nv-c.on{background:rgba(242,242,238,.07)}
.nv-c b{display:block; font-size:15px; font-weight:600; letter-spacing:-.01em; color:#fff}
.nv-c small{display:block; margin-top:3px; font-size:13px; line-height:1.4; color:rgba(242,242,238,.6)}
.nv-ic{flex:none; width:36px; height:36px; padding:7px; border-radius:11px; background:rgba(208,245,61,.1);
  fill:none; stroke:var(--nv-lima); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; box-sizing:border-box}
.nv-c:hover .nv-ic{background:var(--nv-lima); stroke:var(--nv-preto)}
.nv-rodape{display:flex; justify-content:space-between; align-items:center; margin-top:8px; padding:14px 16px; border-radius:16px;
  background:var(--nv-lima); color:var(--nv-preto); font-weight:600; font-size:14.5px; text-decoration:none}
.nv-seta{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; transition:transform .2s}
.nv-rodape:hover .nv-seta{transform:translateX(3px)}
.nv-zonas{display:grid; grid-template-columns:200px 1fr; gap:16px; padding:6px}
.nv-k{margin:0 0 8px; font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--nv-lima)}
.nv-zonas-s{margin:0 0 12px; font-size:13px; line-height:1.45; color:rgba(242,242,238,.65)}
.nv-mini{display:block; padding:8px 0; color:#fff; font-size:13.5px; font-weight:600; text-decoration:none; border-top:1px solid rgba(242,242,238,.1)}
.nv-mini:hover{color:var(--nv-lima)}
.nv-zl{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:2px}
.nv-zl a{display:block; padding:7px 10px; border-radius:10px; color:rgba(242,242,238,.85); font-size:13.5px; text-decoration:none}
.nv-zl a:hover{background:rgba(208,245,61,.12); color:#fff}
/* a página inicial abre o menu "Por distrito" mais à esquerda, para caber */
.nv-dd:last-of-type .nv-p{left:auto; right:-80px; transform:translate(0,-6px)}
.nv-dd:last-of-type.aberto .nv-p{transform:translate(0,0)}

/* o botão do menu antigo (versão anterior) não aparece mais */
.mn-btn,.mn-painel{display:none !important}

/* ── barra fixa em baixo (telemóvel) ──────────────────────────────────── */
.nv-barra{display:none}
@media(max-width:999px){
  .nv-barra{position:fixed; z-index:75; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom));
    display:grid; grid-template-columns:repeat(5,1fr); align-items:end; gap:2px; padding:6px;
    border-radius:24px; background:rgba(20,20,18,.92); border:1px solid rgba(242,242,238,.12);
    backdrop-filter:saturate(1.4) blur(18px); -webkit-backdrop-filter:saturate(1.4) blur(18px);
    box-shadow:0 18px 40px -12px rgba(0,0,0,.7)}
  html.nv-com-barra body{padding-bottom:92px}
  .nv-t{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:56px; padding:4px 2px;
    border:0; border-radius:18px; background:transparent; color:rgba(242,242,238,.7); text-decoration:none; cursor:pointer;
    font-weight:600; font-size:11px; line-height:1; font-family:inherit; letter-spacing:.01em; transition:color .2s, background-color .2s}
  .nv-ti{width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
  .nv-t.on{color:var(--nv-lima)}
  .nv-t.on::after{content:""; width:4px; height:4px; border-radius:50%; background:var(--nv-lima); margin-top:-1px}
  .nv-t:active{background:rgba(242,242,238,.08)}
  .nv-t-cta{background:var(--nv-lima); color:var(--nv-preto); min-height:62px; margin-top:-14px;
    box-shadow:0 10px 24px -8px rgba(208,245,61,.55)}
  .nv-t-cta.on{color:var(--nv-preto)}
  .nv-t-cta:active{background:#DCF76E}
  /* no telemóvel o topo fica só com logótipo e telefone escondido: a ação vive na barra */
  .hx-cta,.zt-cta{display:none !important}
  .topo .btn{display:none !important}
  /* o aviso de cookies sobe para cima da barra */
  .cookies{bottom:calc(96px + env(safe-area-inset-bottom)) !important}
}

/* ── a folha do menu (telemóvel) ──────────────────────────────────────── */
.nv-folha{position:fixed; z-index:74; inset:0; overflow-y:auto; overscroll-behavior:contain; background:rgba(11,11,10,.98);
  padding:calc(24px + env(safe-area-inset-top)) 0 calc(120px + env(safe-area-inset-bottom)); animation:nv-sobe .25s ease}
.nv-folha[hidden]{display:none}
@keyframes nv-sobe{from{opacity:0; transform:translateY(16px)}}
@media(prefers-reduced-motion:reduce){ .nv-folha{animation:none} }
.nv-folha-in{max-width:640px; margin:0 auto; padding:0 16px}
.nv-folha .nv-k{margin:22px 4px 8px}
.nv-lista{display:grid; gap:4px}
.nv-lista .nv-c{background:rgba(242,242,238,.04)}
.nv-chips{display:flex; flex-wrap:wrap; gap:6px}
.nv-chips a{display:inline-flex; align-items:center; min-height:40px; padding:0 14px; border-radius:999px; border:1px solid rgba(242,242,238,.18);
  color:#F2F2EE; font-size:14px; text-decoration:none}
.nv-contactos{display:grid; gap:6px; margin-top:26px}
.nv-contactos a{display:flex; align-items:center; min-height:48px; color:rgba(242,242,238,.85); font-size:15px; text-decoration:none}
.nv-contactos .nv-ctab{justify-content:center; min-height:56px; border-radius:999px; background:var(--nv-lima); color:var(--nv-preto); font-weight:600; font-size:16px}
html.mn-aberto{overflow:hidden}

/* os estilos antigos dos topos ("nav a") não entram nos painéis */
nav.nv-on .nv-p a{min-height:0; border-radius:16px; background:none; font-size:inherit; letter-spacing:normal}
nav.nv-on .nv-p a.nv-c{display:flex; padding:14px; color:#F2F2EE}
nav.nv-on .nv-p a.nv-c:hover,nav.nv-on .nv-p a.nv-c.on{background:rgba(242,242,238,.07)}
nav.nv-on .nv-p a.nv-rodape{display:flex; padding:14px 16px; background:var(--nv-lima); color:var(--nv-preto)}
nav.nv-on .nv-p a.nv-rodape:hover{background:#DCF76E; color:var(--nv-preto)}
nav.nv-on .nv-p a.nv-mini{display:block; padding:8px 0; border-radius:0; color:#fff}
nav.nv-on .nv-p .nv-zl a{display:block; padding:7px 10px; border-radius:10px; color:rgba(242,242,238,.85); font-size:13.5px}
nav.nv-on .nv-p .nv-zl a:hover{background:rgba(208,245,61,.12); color:#fff}
.nv-p{background:#141412}

/* ícones só a traço, sem fundo */
.nv-ic{width:28px !important; height:28px !important; padding:0 !important; border-radius:0 !important; background:none !important; margin-top:2px}
.nv-c:hover .nv-ic,.nv-c.on .nv-ic{background:none !important; stroke:var(--nv-lima) !important}

/* ── no telemóvel o logótipo fica ao centro (a navegação vive na barra de baixo) ── */
@media(max-width:999px){
  .hx-top-in,.zt-in,.topo{justify-content:center !important}
  .hx-marca,.zt-marca,.topo .marca{margin-left:auto !important; margin-right:auto !important}
  .hx-tel,.zt-tel,.topo .tel{display:none !important}
}
