/* Ajustes de layout e responsivos. O layout original usa estilos inline;
   estas regras usam !important para sobrepo-los. */

/* Desktop: conteudo das secoes centralizado em ~80% da largura da tela */
@media (min-width: 901px) {
  #servicos,
  #sobre,
  #configurador,
  #depoimentos {
    max-width: 80% !important;
  }
  #processo > div {
    max-width: 80% !important;
  }
  [data-hero-content] {
    width: 80%;
    margin: 0 auto;
  }
  /* Barra do rodape dentro do CTA acompanha a mesma largura */
  #contato > div:last-child {
    max-width: 80% !important;
  }
}

@media (max-width: 900px) {
  /* Nav compacta: esconde os links internos, mantem logo + CTA de orcamento */
  [data-nav] a.hoverfx-1,
  [data-nav] a.hoverfx-2,
  [data-nav] a.hoverfx-3,
  [data-nav] a.hoverfx-4 {
    display: none !important;
  }
  [data-nav] {
    padding: 8px 8px 8px 18px !important;
  }

  /* Respiro lateral menor nas secoes de conteudo */
  #servicos,
  #sobre,
  #configurador,
  #depoimentos,
  #contato {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  [data-hero] {
    padding: 120px 24px 0 !important;
  }
  #processo > div {
    padding: 80px 24px !important;
  }

  /* Grades de duas colunas empilham em uma */
  #processo > div,
  #sobre > div,
  #configurador > div:last-of-type {
    grid-template-columns: 1fr !important;
  }

  /* Linhas de servicos empilham (numero / titulo / descricao / seta) */
  #servicos [data-reveal][data-hoverable] {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

}

@media (max-width: 640px) {
  /* Cards de estatisticas em coluna unica */
  #sobre div:has(> [data-stat-card]) {
    grid-template-columns: 1fr !important;
  }

  /* Botoes do CTA final ocupam a largura toda */
  #contato [data-cta-inner] a {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }
}