/*
 * Ajustes globais de responsividade, carregados depois do CSS do Elementor
 * (ver app/[[...slug]]/layout.tsx).
 */

/* Animações de entrada (fadeInRight etc.) empurravam elementos para fora da tela e
   geravam rolagem lateral / "zoom out" no celular. */
html,
body {
  overflow-x: clip;
}
@supports not (overflow: clip) {
  body {
    overflow-x: hidden;
  }
}

img {
  max-width: 100%;
}

/* ---------- Home: foto do casal no banner ----------
   A foto terminava solta ~40px acima da faixa de números, com o corte das pernas
   aparecendo. Encostamos a foto na base do banner para o corte ficar escondido. */
@media (min-width: 768px) {
  .elementor-2 .elementor-element.elementor-element-45859c85 {
    --padding-bottom: 0px !important;
  }
  .elementor-2 .elementor-element.elementor-element-60ba6f4b {
    padding-bottom: 3em;
  }
  .elementor-2 .elementor-element.elementor-element-533273b8 {
    align-self: flex-end !important;
    --padding-bottom: 0px !important;
    --justify-content: flex-end !important;
  }
  .elementor-2 .elementor-element.elementor-element-7e201a7e {
    margin-bottom: 0 !important;
  }
  .elementor-2 .elementor-element.elementor-element-7e201a7e img {
    display: block;
    margin: 0 auto;
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  /* O cabeçalho tinha margem negativa e cobria o topo da primeira seção
     (selo do banner e o título das páginas internas). */
  .elementor-12120 .elementor-element.elementor-element-c0941ed {
    --margin-bottom: 0px !important;
  }

  /* Rodapé: logo + texto no topo, Serviços e Navegação lado a lado, contato embaixo. */
  .elementor-13056 .elementor-element.elementor-element-62764a55 {
    order: -1;
    --width: 100% !important;
    width: 100%;
  }
  .elementor-13056 .elementor-element.elementor-element-62764a55 .elementor-widget-image,
  .elementor-13056 .elementor-element.elementor-element-62764a55 .elementor-heading-title {
    text-align: left;
  }
  .elementor-13056 .elementor-element.elementor-element-62764a55 img {
    max-width: 220px;
  }
  .elementor-13056 .elementor-element.elementor-element-47e6a3d0,
  .elementor-13056 .elementor-element.elementor-element-2a15add3 {
    --width: 50% !important;
    --padding-left: 0em !important;
    --padding-right: 0.5em !important;
    order: 1;
  }
  .elementor-13056 .elementor-element.elementor-element-1f3deee6 {
    --width: 100% !important;
    width: 100%;
    order: 2;
    padding-top: 1em;
  }
  .elementor-13056 .elementor-element.elementor-element-1f3deee6 .elementor-icon-list-text {
    overflow-wrap: anywhere;
  }
  /* Cards CTA azuis: o gráfico decorativo (chart_bg2) ocupava o card inteiro e
     passava por cima do texto. No celular ele fica só na faixa de baixo. */
  .elementor-2 .elementor-element.elementor-element-71207bc9::before,
  .elementor-12077 .elementor-element.elementor-element-4f52808::before,
  .elementor-12078 .elementor-element.elementor-element-6e1051d::before,
  .elementor-12394 .elementor-element.elementor-element-4a10586::before {
    background-size: 100% auto !important;
    background-position: bottom center !important;
  }
  .elementor-2 .elementor-element.elementor-element-71207bc9,
  .elementor-12077 .elementor-element.elementor-element-4f52808,
  .elementor-12078 .elementor-element.elementor-element-6e1051d,
  .elementor-12394 .elementor-element.elementor-element-4a10586 {
    --padding-bottom: 150px !important;
  }
  /* Linha de copyright: centraliza e deixa quebrar sem desalinhar. */
  .elementor-13056 .elementor-element.elementor-element-10bf9e3 .elementor-icon-list-items {
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
  }
}

/* Tablet: a foto do banner é recortada (object-fit: cover) a partir do canto
   esquerdo, cortando o braço do homem. Centraliza o recorte. */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-2 .elementor-element.elementor-element-7e201a7e img {
    object-position: center top !important;
  }
}