/* ════════════════════════════════════════════════════════
   HECT — Ajustes de responsividade do conteúdo montado no Enfold
   (páginas do construtor, rodapé). Os plugins hect-* têm os
   próprios ajustes nos seus CSS.
════════════════════════════════════════════════════════ */

/* ── Rodapé (página "Rodapé" do Enfold, seção #rodape) ── */
/* E-mails nunca quebram no meio; a coluna Contato tem a largura do próprio conteúdo
   (a coluna Serviços, flexível, cede o espaço). */
.footer-nav a[href^="mailto:"] {
    white-space: nowrap;
}
.footer-nav > div > div:last-child {
    flex: 0 0 auto !important;
}

/* Tablet: o logo (1/4) e os links (3/4) lado a lado espremiam a coluna de contato */
@media (max-width: 989px) {
    #rodape .flex_column {
        width: 100% !important;
        margin-left: 0 !important;
        float: none !important;
    }
    #rodape .flex_column.av_one_fourth .avia-image-container {
        text-align: left;
    }
    #rodape .flex_column.av_one_fourth .avia_image {
        max-width: 150px !important;
        height: auto !important;
    }
    #rodape .flex_column.av_one_fourth {
        margin-bottom: 24px !important;
    }
}

/* Celular: as três colunas de links (flex inline no HTML) viram uma lista vertical */
@media (max-width: 767px) {
    .footer-nav > div {
        flex-direction: column;
        gap: 28px !important;
    }
    .footer-nav > div > div {
        flex: none !important;
        width: 100%;
    }
    .footer-nav h4 {
        margin-bottom: 8px;
    }
}

/* ── Números animados em círculo (Home, Sobre) ──────── */
@media (max-width: 767px) {
    /* No modo círculo o Enfold reserva margin 50% em cima e embaixo de cada número e desenha um
       círculo do tamanho da coluna — no celular virava uma faixa enorme. Mesmo efeito da opção
       "esconder círculo em telas pequenas" do elemento. */
    .avia-animated-number-circle {
        display: none !important;
    }
    #top .avia-animated-number.av-display-circle {
        margin: 18px 0 !important;
    }
}

/* ── Logos de certificações/rankings (Home, seção #certificados) ── */
#certificados .avia-image-container img {
    max-width: 100% !important;
    height: auto !important;
}
@media (max-width: 989px) {
    /* O CSS customizado do tema fixa "#certificados #lexology img { max-width: 170px !important }",
       maior que a coluna de 1/5 no tablet */
    #top #certificados #lexology img {
        max-width: 100% !important;
    }
}

/* ── Títulos dos blocos de texto ─────────────────────── */
@media (max-width: 767px) {
    .avia_textblock h2 {
        font-size: 22px !important;
        line-height: 1.3 !important;
        overflow-wrap: break-word;
    }
}

/* ── Página Contato: URLs do LinkedIn/Instagram na lista de ícones ── */
.iconlist_content a {
    overflow-wrap: anywhere;
}

/* Rodapé: um e-mail por linha */
.footer-nav a[href^="mailto:"] {
    display: block;
}

/* ── Seção de CTA antes do rodapé (fundo rodape4-1.jpg, "center right") ──
   No celular a imagem fica presa à esquerda, mostrando o fundo azul em vez das mãos.
   É a última seção do conteúdo de cada página (as seções do rodapé ficam em #footer-page). */
@media (max-width: 767px) {
    #main > .avia-section.avia-builder-el-last {
        background-position: left center !important;
    }
}

/* ── Faixa de título das páginas internas (.hect-page-hero) ──
   O CSS customizado do tema aplica padding-top: 80px; no celular o espaço sobra. */
@media (max-width: 767px) {
    .avia-section.hect-page-hero {
        padding-top: 0 !important;
    }
}

/* ── Rodapé: link "Compliance e Integridade" ─────────────
   Desktop: fica no rodapé inferior, depois do copyright (.hect-footer-compliance-desktop).
   Celular: aparece abaixo dos ícones do Instagram/LinkedIn (.hect-footer-compliance-mobile,
   inserido no bloco .footer-nav pelo script ajustes/rodape-compliance-mobile.php). */
.hect-footer-compliance-mobile {
    display: none;
    margin: 20px 0 0 !important;
}
@media (max-width: 767px) {
    .hect-footer-compliance-mobile {
        display: block;
    }
    .hect-footer-compliance-desktop {
        display: none !important;
    }
}

/* ── Blog (página Blog, grade de postagens do construtor) ── */
#top .avia-content-slider .slide-entry-title {
    font-size: 18px;
    line-height: 1.35;
}

/* "Voltar para o blog" no topo das postagens (hect-scripts.php) — mesmo estilo do
   "Voltar para a equipe" da página de uma pessoa (hect-pessoas/assets/pessoas.css) */
.hect-voltar-blog {
    padding-bottom: 14px; /* + margem do 1º parágrafo = mesmo respiro da página da pessoa */
}
#top .hect-voltar-blog a {
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #7A8099;
    text-decoration: none;
    transition: color 0.2s;
}
#top .hect-voltar-blog a:hover {
    color: #2E6EA6;
}