/* ==================================================
   MOBILE.CSS – CORREÇÃO DEFINITIVA
================================================== */

/* -------- RESET -------- */
html, body {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* -------- IMAGENS -------- */
img {
  display: block;
  width: 100%;
  height: auto;
}

/* -------- BLOCO BASE (ZERA DESKTOP) -------- */
.bloco {
  width: 100%;
  margin: 0;
  padding: 0;

  height: auto !important;
  min-height: 0 !important;

  position: relative;
}

/* -------- MENU MOBILE -------- */
.menu {
  align-items: center;
}

.menu-toggle {
  display: block;
  font-size: 28px;
  color: #fff;
  cursor: pointer;
  z-index: 1001;
}

.menu-links {
  display: none;
  position: absolute;
  top: 70px;
  right: 20px;
  background: rgba(0,0,0,0.9);
  padding: 20px;
  border-radius: 8px;
  flex-direction: column;
  gap: 20px;
  z-index: 1000;
}

.menu-links.ativo {
  display: flex;
}

.menu-links a {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-decoration: none;
}

/* -------- BLOCO 0 (MENU) -------- */
.bloco-0 {
  background-size: cover;
  background-position: center;
  min-height: 120px !important;
}

/* -------- BLOCO 1+ MOBILE IMG -------- */
.bloco-1,
.bloco-2,
.bloco-3,
.bloco-4,
.bloco-5,
.bloco-6,
.bloco-7,
.bloco-8,
.bloco-9,
.bloco-10,
.bloco-11,
.bloco-12,
.bloco-13,
.bloco-14,
.bloco-15,
.bloco-16,
.bloco-17 {
  background: none !important;
}

/* esconde textos */
.bloco-1 .caixa-texto,
.bloco-2 .caixa-texto,
.bloco-3 .caixa-texto,
.bloco-4 .caixa-texto,
.bloco-5 .caixa-texto {
  display: none !important;
}

/* imagens mobile */
.img-mobile {
  display: block;
  width: 100%;
  height: auto;
}

/* =========================
   BLOCO 6 – MOBILE (IMAGEM PURA)
========================= */

/* esconde qualquer texto do bloco 6 */
.bloco-6 .caixa-texto {
  display: none !important;
}

/* imagem mobile do bloco 6 */
.bloco-6 {
  background: none !important;
}

/* =========================
   BLOCO 7 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 7 */
.bloco-7 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-7 {
  background: none !important;
}

/* =========================
   BLOCO 8 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 8 */
.bloco-8 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-8 {
  background: none !important;
}

/* =========================
   BLOCO 9 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 9 */
.bloco-9 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-9 {
  background: none !important;
}

/* =========================
   BLOCO 10 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 10 */
.bloco-10 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-10 {
  background: none !important;
}

/* =========================
   BLOCO 11 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 11 */
.bloco-11 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-11 {
  background: none !important;
}

/* =========================
   BLOCO 12 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 12 */
.bloco-12 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-12 {
  background: none !important;
}

/* =========================
   BLOCO 13 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 13 */
.bloco-13 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-13 {
  background: none !important;
}

/* =========================
   BLOCO 14 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 14 */
.bloco-14 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-14 {
  background: none !important;
}

/* =========================
   BLOCO 15 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 15 */
.bloco-15 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-15 {
  background: none !important;
}
/* esconde título do desktop */
.bloco-15 .titulo-centro {
  display: none !important;
}

/* remove fundo desktop */
.bloco-15 {
  background: none !important;
}
/* =========================
   BLOCO 16 – MOBILE (IMAGEM PURA)
========================= */

/* esconde textos do bloco 16 */
.bloco-16 .caixa-texto {
  display: none !important;
}

/* remove qualquer fundo desktop */
.bloco-16 {
  background: none !important;
}

/* ==================================================
   BLOCO 17 – MOBILE (EXCEÇÃO COM TEXTO)
================================================== */

/* mantém o fundo do desktop */
.bloco-17 {
  background-image: url("images/bloco17.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  min-height: 420px;
  padding: 40px 20px 60px;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* garante que o texto apareça */
.bloco-17 .bloco17-texto,
.bloco-17 .bloco17-info,
.bloco-17 .bloco17-conteudo {
  display: block !important;
}

/* estilo do texto no mobile */
.bloco-17 .titulo {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 10px;
}

.bloco-17 p {
  font-size: 18px;
  line-height: 1.5;
}
/* ==================================================
   BLOCO 17 – MOBILE (FUNDO + TEXTO)
================================================== */

.bloco-17 {
  background-image: url("images/bloco17.jpg") !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  min-height: 420px;
  padding: 40px 20px 60px;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
/* ==================================================
   BLOCO 17 – TEXTO + MAPA CENTRALIZADOS (MOBILE)
================================================== */

@media (max-width: 768px) {

  /* container principal */
  .bloco-17 {
    align-items: center;
    text-align: center;
  }

  /* bloco de texto */
  .bloco-17 .bloco17-texto,
  .bloco-17 .bloco17-info {
    width: 100%;
    max-width: 360px;
    margin: 0 auto 24px;
    text-align: center;
  }

  /* títulos */
  .bloco-17 .titulo {
    text-align: center;
  }

  /* parágrafos */
  .bloco-17 p {
    text-align: center;
  }

  /* mapa */
  .bloco-17-mapa {
    width: 50%;
    max-width: 160px;
    margin: 0 auto;
  }

  .bloco-17-mapa iframe {
    width: 100%;
    height: 220px;
    border-radius: 8px;
  }

}

/* ==================================================
   BLOCO 61 – MOBILE (VERSÃO FINAL ESTÁVEL)
================================================== */

@media (max-width: 768px) {

  /* garante comportamento fluido */
  .bloco-61 {
    width: 100%;
    padding: 16px;
    margin: 0;
    display: block; /* 🔥 flex removido */
  }

  /* container simples */
  .bloco61-conteudo {
    width: 100%;
    margin: 0 auto;
  }

  /* iframe corrigido para celular real */
  .bloco-61 iframe {
    width: 100%;
    height: 420px;       /* altura segura em celular físico */
    border: none;
    display: block;
  }

}

html, body {
  overflow-x: hidden;
}

/* =========================
   PROTEÇÃO DE IMAGENS – MOBILE
========================= */

@media (max-width: 768px) {

  img {
    pointer-events: none;
    -webkit-user-drag: none;
  }

}

@media (max-width: 768px) {

  body {
    -webkit-user-select: none;
    user-select: none;
  }

  /* exceção: bloco 17 (contato copiável) */
  .bloco-17 {
    -webkit-user-select: text;
    user-select: text;
  }

}

/* =========================
   CORREÇÃO DEFINITIVA DE ESPAÇOS – MOBILE REAL
========================= */

@media (max-width: 768px) {

  .bloco {
    height: auto !important;
    min-height: unset !important;
  }

}

@media (max-width: 768px) {
  .bloco {
    height: auto !important;
    min-height: unset !important;
  }
}

/* ==================================================
   BLOCO 0 – MOBILE (CORREÇÃO REAL)
================================================== */

@media (max-width: 768px) {

  /* o bloco PRECISA ter altura */
  .bloco-0 {
    width: 100%;
    height: auto;
    min-height: 140px;        /* altura mínima real */
    padding-top: 140px;       /* 🔥 cria área física pro menu */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
  }

  /* menu fica posicionado, mas agora SEM colapsar o bloco */
  .bloco-0 .menu {
    .bloco-0 .menu {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;              /* 🔥 LIMITA A ALTURA DO MENU */
  display: flex;
  align-items: center;

}

/* =========================
   BLOCO 61 – MOBILE
========================= */

@media (max-width: 768px) {

  .bloco-61 {
    background-image: url("images/bloco61-mobile.png"); /* opcional */
    background-size: cover;
    background-position: center;

    padding: 80px 20px;
  }

  .bloco-61 h2 {
    font-size: 20px;
  }

  .btn-avaliacao-formativa {
    width: 100%;
    padding: 16px;
    font-size: 18px;
  }

}

/* =========================
   BLOCO 61 – AJUSTE REAL DE ESPAÇAMENTO (MOBILE)
========================= */

@media (max-width: 468px) {

  /* força o container a controlar o espaço */
  .bloco-61 .caixa-texto {
    gap: 6px !important;   /* 🔥 ISSO É O QUE FUNCIONA */
  }

  /* zera margens herdadas */
  .bloco-61 h2 {
    margin: 0 !important;
  }

  .bloco-61 .btn-avaliacao-formativa {
    margin: 0 !important;
  }

}