/* Mapa de Hotspots — estilos do front (sem dependências). */
.mh-box{max-width:1060px;margin:0 auto;}
.mh-box .mh-titulo{margin:0 0 14px;font-size:1.4rem;line-height:1.3;}
.mh-fig{position:relative;margin:0;line-height:0;}
.mh-img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 10px 30px rgba(20,25,60,.12);}

/* ---- pino ---- */
.mh-wrap{position:absolute;width:0;height:0;z-index:3;line-height:0;}
.mh-dot{position:absolute;left:-17px;top:-17px;width:34px;height:34px;border-radius:50%;border:3px solid #fff;background:#2d3265;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px rgba(20,25,60,.35);padding:0;margin:0;transition:transform .15s ease;}
.mh-dot:hover{transform:scale(1.12);}
.mh-dot:focus-visible{outline:3px solid #8ac0de;outline-offset:2px;}
.mh-dot .mh-plus{position:relative;width:14px;height:14px;display:block;transition:transform .2s ease;pointer-events:none;}
.mh-dot .mh-plus:before,.mh-dot .mh-plus:after{content:"";position:absolute;background:#fff;border-radius:2px;}
.mh-dot .mh-plus:before{left:0;right:0;top:6px;height:2px;}
.mh-dot .mh-plus:after{top:0;bottom:0;left:6px;width:2px;}
.mh-dot[aria-expanded="true"] .mh-plus{transform:rotate(45deg);}
.mh-dot::before{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;z-index:-1;opacity:.9;animation:mh-pulse 3s cubic-bezier(.2,1,.2,1) infinite;pointer-events:none;}
@keyframes mh-pulse{0%{opacity:.8;transform:scale(1);}65%{opacity:0;transform:scale(1.65);}100%{opacity:0;transform:scale(1.65);}}

/* ---- tooltip ---- */
.mh-tip{position:absolute;bottom:calc(100% + 18px);left:0;transform:translateX(-50%);opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s;pointer-events:none;z-index:5;width:min(20rem,78vw);max-width:340px;line-height:1.2;text-align:left;}
/* Perto da borda esquerda/direita do mapa o tooltip não centraliza: encosta no
   pino e cresce para dentro. Sem isto, texto longo (as plataformas estaduais)
   saía como coluna de duas palavras por linha. */
.mh-wrap.mh-na-esquerda .mh-tip{left:-14px;transform:none;}
.mh-wrap.mh-na-direita .mh-tip{left:auto;right:-14px;transform:none;}
.mh-tip.mh-aberto{opacity:1;visibility:visible;pointer-events:auto;}
.mh-inner{background:#fff;border-radius:10px;padding:12px;box-shadow:0 18px 40px rgba(20,25,60,.22);width:100%;max-width:340px;line-height:1.45;}
.mh-ptit{display:block;font-size:.95rem;color:#1d2148;margin:0 0 6px;line-height:1.35;}
.mh-desc{white-space:pre-line;font-size:.83rem;line-height:1.55;color:#444;margin:4px 0 10px;word-break:break-word;}
.mh-btn{display:inline-flex;align-items:center;gap:8px;background:#2d3265;color:#fff;text-decoration:none;font-size:.85rem;font-weight:700;letter-spacing:.2px;padding:9px 15px;border-radius:4px;white-space:nowrap;box-shadow:0 3px 10px rgba(45,50,101,.35);}
.mh-btn:hover{background:#1d2148;color:#fff;}
.mh-btn svg{flex:none;}
.mh-semnome{display:inline-block;padding:4px 2px;font-size:.85rem;font-weight:600;}
.mh-close{display:none;}

/* ---- mobile (<690px): tooltip em overlay de tela cheia ---- */
@media (max-width:689px){
  .mh-tip{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;transform:none;border-radius:0;display:grid;place-items:center;background:rgba(22,26,58,.55);padding:0;box-shadow:none;line-height:1.5;}
  .mh-inner{position:relative;background:#fff;border-radius:14px;padding:0;text-align:left;max-width:340px;width:calc(100vw - 40px);box-shadow:0 20px 60px rgba(0,0,0,.35);}
  .mh-scroll{max-height:74vh;overflow:auto;padding:20px 22px 18px;}
  .mh-close{display:flex;align-items:center;justify-content:center;position:absolute;top:-14px;right:-14px;width:32px;height:32px;border-radius:50%;border:none;background:#2d3265;color:#fff;font-size:15px;cursor:pointer;line-height:1;z-index:2;}
  .mh-close:hover{background:#1d2148;}
}

/* ---- modo vetorial (Brasil/UF) ---- */
.mh-vetorial .mh-fig{background:#fff;border-radius:12px;}
.mh-svg{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 10px 30px rgba(20,25,60,.12);}
.mh-uf{fill:#cfe0f2;stroke:#ffffff;stroke-width:1.2;transition:fill .15s ease,stroke .15s ease;}
/* Hover direto no estado (path) com conteúdo: contorno reforçado, cor levemente destacada. */
.mh-uf:not(.mh-uf-vazia):hover{fill:#a9c6e6;stroke:#2d3265;stroke-width:2.4;}
/* Pino em foco (teclado/hover): reforço de contorno sem ser a cor de "aberto". */
.mh-uf.mh-uf-foco{fill:#bcd6ef;stroke:#2d3265;stroke-width:2.8;}
.mh-uf.mh-uf-foco:hover{fill:#a9c6e6;stroke:#2d3265;stroke-width:2.8;}
/* UF selecionada pelo clique (tooltip aberto): cor de destaque bem distinta. */
.mh-uf.mh-uf-aberta{fill:#ffd166;stroke:#2d3265;stroke-width:3.4;}
.mh-uf.mh-uf-aberta:hover{fill:#ffd166;stroke:#2d3265;stroke-width:3.4;}
.mh-uf-vazia{fill:#eef1f6;stroke:#e2e8f0;stroke-width:1.2;}
.mh-vetorial .mh-wrap{z-index:6;}
/* Pino com tooltip aberto: sobe acima de todos os outros pinos/paths do mapa. */
.mh-wrap.mh-top{z-index:100000;}
.mh-aviso-admin{max-width:1060px;margin:10px auto 0;font-size:.85rem;color:#7a3e00;background:#fcf0dd;border:1px solid #f2d9a8;border-radius:6px;padding:8px 12px;}