/*
 * center-layout.css
 * -----------------------------------------------------------------
 * Este projeto foi exportado de uma página feita com Elementor, mas o
 * CSS estrutural "core" do Elementor (frontend.min.css) não veio no
 * pacote — apenas os estilos específicos de cada widget/seção. Sem
 * essas regras base, os containers (.elementor-container, .e-con,
 * colunas, etc.) perdem o "margin: auto" e o "display: flex" que os
 * mantêm centralizados na tela.
 *
 * Este arquivo recria apenas as regras estruturais necessárias para
 * que todas as seções e blocos fiquem devidamente centralizados,
 * sem alterar nenhuma cor, fonte, espaçamento ou estilo visual já
 * definido nos outros arquivos CSS do projeto.
 * -----------------------------------------------------------------
 */

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  width: 100%;
}

/* Seções (elementor-section) sempre ocupam 100% da tela;
   quem centraliza é o .elementor-container interno */
.elementor-section {
  position: relative;
  width: 100%;
}

.elementor-section .elementor-container {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  position: relative;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Colunas dentro das seções */
.elementor-column {
  position: relative;
  min-height: 1px;
  display: flex;
  flex-direction: column;
}

.elementor-col-100 {
  width: 100%;
}

.elementor-column > .elementor-widget-wrap,
.elementor-column > .elementor-element-populated {
  width: 100%;
}

.elementor-widget-wrap {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: flex-start;
}

.elementor-widget {
  position: relative;
  width: 100%;
}

/* Containers modernos do Elementor (.e-con) */
.e-con {
  display: var(--display, flex);
  flex-direction: var(--flex-direction, column);
  flex-wrap: var(--flex-wrap-mobile, nowrap);
  align-items: var(--align-items, initial);
  justify-content: var(--justify-content, initial);
  gap: var(--gap, var(--row-gap, 0px) var(--column-gap, 0px));
  width: 100%;
  position: relative;
}

.e-con > .e-con,
.e-con-inner > .e-con,
.e-con > .elementor-widget,
.e-con-inner > .elementor-widget {
  width: var(--width, var(--container-widget-width, 100%));
  flex-grow: var(--container-widget-flex-grow, 0);
  flex-shrink: var(--flex-shrink, 1);
}

/* Container "boxed": o conteúdo interno é limitado e centralizado,
   enquanto o fundo/seção continua ocupando a largura total */
.e-con.e-con-boxed > .e-con-inner {
  width: 100%;
  max-width: var(--container-max-width, 1140px);
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: inherit;
  flex-wrap: inherit;
  align-items: inherit;
  justify-content: inherit;
  gap: inherit;
}

/* Alinhamento central para textos/blocos que usam a classe utilitária
   do Elementor */
.elementor-align-center {
  text-align: center;
}

.elementor-align-center .elementor-button-wrapper {
  display: flex;
  justify-content: center;
}

/* Imagens sempre responsivas e centralizadas quando o container permitir */
img {
  max-width: 100%;
  height: auto;
}
