/* ============================================================================
   MDC — Zoom, arrastar e etiquetas progressivas nos mapas
   Módulo aditivo: funciona em qualquer .pr-mapwrap, tanto no mapa inline da
   Home quanto nos mapas das páginas de projeto (mdc-mapa.css/js).
   Carregar DEPOIS do mdc-mapa.css (ou, na Home, depois do <style> do mapa).
   --k  = aproximação atual (1 = mapa inteiro)
   --px = unidades do viewBox por pixel de tela (para texto de tamanho fixo)
   ========================================================================== */

.pr-mapwrap{--k:1;--px:1.2522}

/* -- gestos ---------------------------------------------------------------- */
.pr-mapwrap.pr-zoomable .pr-svg{touch-action:pan-y}
.pr-mapwrap.pr-zoomable.pr-in .pr-svg{cursor:grab;touch-action:none}
.pr-mapwrap.pr-zoomable.pr-drag .pr-svg{cursor:grabbing}

/* -- espessura de traço e raios constantes na tela em qualquer aproximação -- */
.pr-mapwrap.pr-zoomable .pr-gl{stroke-width:calc(.7px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-nb{stroke-width:calc(.7px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-br{stroke-width:calc(1.35px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-sl{stroke-width:calc(.85px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-rt{stroke-width:calc(1.9px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-rt-g{stroke-width:calc(7px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-fl-t{r:calc(7px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-fl-d{r:calc(2.6px / var(--k))}
.pr-mapwrap.pr-zoomable .pr-eqt{font-size:calc(11px / var(--k));letter-spacing:calc(2.4px / var(--k))}

/* -- etiquetas: 12px de tela em qualquer largura de container -------------- */
.pr-mapwrap.pr-zoomable .pr-lb{font-size:calc(12px * var(--px));stroke-width:calc(2.7px * var(--px))}
/* etiqueta que não caberia agora: fica no DOM e volta suavemente ao aproximar.
   O !important é para vencer o .pr-lb{opacity:1!important} do prefers-reduced-motion. */
.pr-mapwrap .pr-lb.pr-lb-off{opacity:0!important}

/* -- controles ------------------------------------------------------------- */
.pr-zc{position:absolute;top:16px;right:16px;z-index:6;display:flex;flex-direction:column;gap:6px;opacity:0;transition:opacity .8s ease 2.4s}
.in-map .pr-zc{opacity:1}
.pr-zb{width:36px;height:36px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:11px;background:rgba(4,10,19,.74);border:1px solid rgba(255,255,255,.11);color:rgba(226,232,240,.8);cursor:pointer;-webkit-backdrop-filter:blur(11px);backdrop-filter:blur(11px);transition:background .22s ease,border-color .22s ease,color .22s ease,opacity .22s ease}
.pr-zb:hover{background:rgba(37,99,235,.3);border-color:rgba(59,130,246,.52);color:#fff}
.pr-zb:focus-visible{outline:2px solid rgba(96,165,250,.85);outline-offset:2px}
.pr-zb svg{width:17px;height:17px;display:block;pointer-events:none}
.pr-zb[disabled]{opacity:.3;cursor:default;background:rgba(4,10,19,.74);border-color:rgba(255,255,255,.11);color:rgba(226,232,240,.8)}
.pr-zb.pr-zr{margin-top:3px}
.pr-zb.pr-zr svg{width:15px;height:15px}

.pr-zhint{position:absolute;top:16px;right:62px;z-index:6;max-width:min(260px,52vw);padding:8px 12px;border-radius:10px;background:rgba(4,10,19,.9);border:1px solid rgba(255,255,255,.1);color:rgba(226,232,240,.66);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.63rem;line-height:1.5;letter-spacing:.4px;pointer-events:none;opacity:0;transform:translateX(8px);transition:opacity .22s ease,transform .22s ease}
.pr-zc:hover ~ .pr-zhint,.pr-zc:focus-within ~ .pr-zhint{opacity:1;transform:none}

/* nível de aproximação, ao lado da escala */
.pr-zlvl{position:absolute;left:18px;bottom:38px;z-index:5;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.62rem;letter-spacing:1.4px;color:rgba(147,197,253,.6);opacity:0;transition:opacity .3s ease;pointer-events:none}
.pr-mapwrap.pr-in .pr-zlvl{opacity:1}

@media (max-width:768px){
  .pr-mapwrap.pr-zoomable .pr-rt{stroke-width:calc(2.6px / var(--k))}
  /* no celular a etiqueta só entra quando o visitante aproxima */
  .pr-mapwrap.pr-zoomable .pr-lb{display:none}
  .pr-mapwrap.pr-zoomable.pr-in .pr-lb{display:block}
  .pr-zc{top:12px;right:12px}
  .pr-zb{width:34px;height:34px}
  .pr-zhint{display:none}
  .pr-zlvl{left:14px;bottom:34px}
}

@media (prefers-reduced-motion:reduce){
  .pr-zc,.pr-zhint,.pr-zlvl{transition:none!important}
  .pr-zc{opacity:1!important}
}