/* ============================================================
   BRAVUS — Corrige os fundos de secao que o WP Rocket carregava
   de forma "lazy" via JS (--wpr-bg-...). No espelho estatico esse
   JS nao roda, entao os fundos ficavam cinza. Aqui forcamos as
   imagens diretamente (mesmas do site original).
   ============================================================ */

/* HERO (home) */
.elementor-element-ae8f015,
.elementor-element-ae8f015 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-image: url('/wp-content/uploads/capa.jpg?4') !important;
  background-size: cover !important;
  /* posição vertical em 80% = mostra mais os PRÉDIOS (parte de baixo) e
     menos o CÉU. Ajustável: 65% mostra mais céu, 90% quase só prédios. */
  background-position: center 80% !important;
  background-repeat: no-repeat !important;
}
/* Hero desktop = banner (recorte 1920x760 da capa, proporção ~2.53:1 = 39.6vw).
   Mais baixo que antes, mostrando o recorte enquadrado (logo + prédios). */
.elementor-element-ae8f015 { min-height: 39.6vw !important; }
/* Overlay escuro do hero em 0.6 (era 0.7 no original): capa um pouco mais
   clara que o original, mas escura o bastante pro texto não se misturar
   com a imagem (0.5 deixava o texto poluído). */
.elementor-element-ae8f015 > .elementor-background-overlay { opacity: 0.6 !important; }
@media (max-width: 767px) {
  /* mobile: recorte VERTICAL específico (810x1080), enquadrado para tela estreita */
  .elementor-element-ae8f015,
  .elementor-element-ae8f015 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-image: url('/wp-content/uploads/capa-mobile.jpg?3') !important;
    background-position: center center !important;
  }
  .elementor-element-ae8f015 { min-height: 0 !important; }  /* altura guiada pelo conteúdo */
  /* no mobile a imagem (recorte dos prédios) é mais clara/movimentada nas áreas
     do texto → overlay mais escuro (0.72) que o desktop (0.6) pro texto destacar */
  .elementor-element-ae8f015 > .elementor-background-overlay { opacity: 0.72 !important; }
  /* "FERRAMENTA EXCLUSIVA DE DIAGNÓSTICO DE SEGURANÇA" em UMA linha (cabe em 11px) */
  .elementor-element-486dd41 .elementor-icon-list-text { font-size: 11px !important; }
  /* reduz o espaço grande entre FERRAMENTA e ENTRE EM CONTATO */
  .elementor-element-9e4cb49 { display: none !important; }      /* remove o spacer */
  .elementor-element-762bd2e { margin-top: 14px !important; }   /* aproxima o "Entre em contato" */
  /* Só UMA linha divisória acima do ENTRE EM CONTATO (no mobile as colunas
     empilhavam e mostravam 2 bordas). Remove a de cima + o spacer-linha,
     mantém só a borda do bloco de contato (f288c86). */
  .elementor-element-89b7f40 > .elementor-element-populated { border-top: 0 !important; }
  .elementor-element-9dd8c27 { display: none !important; }
}

/* ===== Bandeiras de idioma: VISÍVEIS (traduzem a página via Google Translate,
   religadas pelo bravus-translate.js). Escondemos só a BARRA/gadget do Google
   (o banner que empurra a página pra baixo), não as bandeiras. ===== */
#google_language_translator, #flags, #glt-footer, #glt_translate_element,
#google_translate_element,
.goog-te-gadget, .goog-te-banner-frame, .skiptranslate, iframe.goog-te-banner-frame,
a.flag, a.nturl { display: none !important; }
body { top: 0 !important; }
/* bandeiras: mantêm o tamanho/disposição NATIVOS do widget (igual ao
   original, 22x22). Só cursor de clique (a tradução é via JS). */
.elementor-element-06f1993 a { cursor: pointer; }

/* Remove a paginação do blog no /noticias/ (mostramos tudo numa página) */
.navigation.pagination, nav.pagination, .ast-pagination { display: none !important; }

/* Menu MOBILE (hambúrguer do Elementor Nav Menu). Dois problemas no espelho:
   (1) faltava a regra que REVELA o dropdown ao tocar (JS já marca .elementor-active);
   (2) o modo "stretch" do Elementor posicionava o dropdown via JS com
   left/width negativos, jogando o menu pra fora da tela ("não funcionava").
   Aqui: revela o dropdown ativo e o coloca em FLUXO, largura total do header,
   fundo escuro legível — um painel limpo abaixo do botão. */
@media (max-width: 1024px) {
  /* Esconde o dropdown do Elementor no mobile — usamos NOSSO menu próprio
     (#bravus-mm, criado por bravus-menu.js com estilo inline charcoal+dourado,
     idêntico ao original). Assim não dependemos do JS/CSS do Elementor. */
  .elementor-nav-menu--dropdown.elementor-nav-menu__container {
    display: none !important;
  }
  /* Ícone do botão controlado pela NOSSA classe (o Elementor invertia o
     elementor-active via delegação): fechado = ☰, aberto = X. */
  html:not(.bravus-menu-open) .elementor-menu-toggle .elementor-menu-toggle__icon--open  { display: inline-block !important; }
  html:not(.bravus-menu-open) .elementor-menu-toggle .elementor-menu-toggle__icon--close { display: none !important; }
  html.bravus-menu-open .elementor-menu-toggle .elementor-menu-toggle__icon--open  { display: none !important; }
  html.bravus-menu-open .elementor-menu-toggle .elementor-menu-toggle__icon--close { display: inline-block !important; }
}

/* Conteúdo da notícia: quebra URLs/palavras longas e não deixa nada
   estourar a coluna (texto invadindo a sidebar). */
.elementor-widget-theme-post-content, .entry-content,
.elementor-widget-theme-post-content *, .entry-content * {
  max-width: 100% !important;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.elementor-widget-theme-post-content a, .entry-content a { overflow-wrap: anywhere; word-break: break-word; }
.elementor-widget-theme-post-content img, .entry-content img { height: auto !important; }
.elementor-widget-theme-post-content, .entry-content { overflow-x: hidden; }

/* Artigo: em telas mais estreitas, a coluna do conteúdo e a da sidebar
   EMPILHAM (conteúdo em cima, ocupando a largura toda; sidebar embaixo).
   Evita a sidebar cinza cobrir/cortar o texto do artigo. */
@media (max-width: 1200px) {
  .elementor-element-332d2b9,   /* coluna do conteúdo (template article) */
  .elementor-element-a5b0afb {  /* coluna da sidebar (template article)  */
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }
}

/* Cards de notícia (home): a miniatura usava uma caixa de proporção fixa
   (padding-bottom) e a imagem não a preenchia → sobrava faixa CINZA embaixo.
   Aqui a imagem flui NATURAL (sem a caixa), preenchendo o card — sem cinza.
   Vale desktop E mobile (imagens com texto/logo aparecem inteiras, sem corte). */
.elementor-widget-posts .elementor-post__thumbnail {
  padding-bottom: 0 !important;
  height: auto !important;
}
.elementor-widget-posts .elementor-post__thumbnail img {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* HERO das páginas de NOTÍCIAS / ARTIGO / POST (banner azul "NOTÍCIAS") */
.elementor-element-e9f6ccd,
.elementor-element-e9f6ccd > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-image: url('/wp-content/uploads/2020/10/bap_bnn6.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* SECAO DE SERVICOS / EXPERTISE */
.elementor-element-83f2f6c,
.elementor-element-83f2f6c > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-image: url('/wp-content/uploads/2020/07/expertise-bg.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* SECAO SOBRE: antes a imagem (aperto de mãos) usava `auto 100%` à direita e
   sobrava um VÃO CINZA (#f5f5f5) entre o texto e a imagem. Agora a imagem
   COBRE toda a seção (cover, à direita) e um GRADIENTE claro por cima cobre
   a esquerda (onde fica o texto) e some suavemente na direita — sem cinza. */
.elementor-element-c0c8c0e,
.elementor-element-c0c8c0e > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-image:
    linear-gradient(to right, #f5f5f5 38%, rgba(245,245,245,.5) 55%, rgba(245,245,245,0) 72%),
    url('/wp-content/uploads/2020/10/BCci_Qs.jpg?2') !important;
  background-size: cover, cover !important;
  background-position: center, right center !important;
  background-repeat: no-repeat, no-repeat !important;
}
.elementor-element-c0c8c0e > .elementor-background-overlay {
  background-image: none !important;
}
@media (max-width: 767px) {
  /* No mobile a imagem (aperto de mãos) cobria a seção e o texto escuro
     ficava ilegível ("sumia"). Removemos a imagem no celular — o texto
     fica sobre o fundo claro base (#f5f5f5), legível. */
  .elementor-element-c0c8c0e,
  .elementor-element-c0c8c0e > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-image: none !important;
  }
}
