/* css/map-section.css */

/* 3) Faz o mapa “subir” sobre o banner */
.map-block {
  position: relative;
  margin-top: -120px;        /* puxa o bloco do mapa para cima */
  padding-bottom: 10px;     /* cria o respiro embaixo do verde */
  background: radial-gradient(ellipse at center, #1AA53F 0%, #028036 100%);
  overflow: visible;
  z-index: 2;
}

/* 4) Altura de referência para o mapa */
.map-overlay-wrapper {
  position: relative;
  height: 600px;
  z-index: 2;
}

/* 5) A imagem do mapa posicionada */
.map-image-wrapper {
  position: absolute;
  /* se quiser diminuir o quanto a imagem “sai” da área verde, ajuste aqui */
  top: -120px;   /* antes: -120px, mas você pode testar -80px, -100px etc */
  left: 50%;
  transform: translateX(-50%);
  width: 1280px;
  max-width: 100%;
  z-index: 3;
}