.elementor-453 .elementor-element.elementor-element-65a507a{--display:flex;--background-transition:0.3s;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-10fb311 *//* ========================================================= */
/* FULL WIDTH & FULL HEIGHT HERO - SEM ESPAÇOS NAS LATERAIS */
/* ========================================================= */

/* Remove margens e paddings padrão */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-x: hidden !important; /* impede rolagem lateral */
}

/* Força o container principal a ocupar 100% da tela */
.hero {
  position: relative !important;
  width: 100vw !important; /* ocupa toda a largura da viewport */
  height: 100vh !important; /* ocupa toda a altura da tela */
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Centraliza e garante que a imagem cubra tudo */
.hero::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(to bottom right, rgba(0,43,91,0.8), rgba(0,119,200,0.8)),
              url('https://deluxecleanbrasil.com.br/wp-content/uploads/2024/02/BG-Sec-1-Mobile.png') center/cover no-repeat;
  z-index: -1; /* mantém o fundo atrás do conteúdo */
}

/* Remove qualquer espaçamento colateral de seções e elementos internos */
section, header, footer, div, p, h1, h2 {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Garante que o conteúdo central não tenha espaçamento lateral */
.hero > * {
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* Ajusta o comportamento do body em mobile */
@media (max-width: 768px) {
  body, html {
    overflow-x: hidden !important;
  }
  .hero {
    height: 100dvh !important; /* usa altura real em celulares modernos */
  }
}
/* ===========================================
   AJUSTE FINAL – FULLSCREEN SEM BORDAS
   =========================================== */

/* Remove qualquer margem lateral e superior */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden !important; /* sem rolagem lateral */
  background: #002B5B !important; /* fallback azul do fundo */
}

/* Faz o Hero ocupar 100% exato da tela, sem sobras */
.hero {
  position: relative !important;
  width: 100vw !important;
  height: 100dvh !important; /* ocupa altura total visível, inclusive em iPhone */
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

/* Remove espaços residuais entre logo, textos e botão */
.hero * {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 95% !important;
  box-sizing: border-box !important;
}

/* Ajuste fino da logo (evita cortar ou deslocar) */
.hero .logo {
  position: absolute !important;
  top: 4% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* Corrige leve rolagem vertical e força o preenchimento */
body, html {
  overflow-y: hidden !important;
}

/* Garante centralização no mobile */
@media (max-width: 768px) {
  .hero {
    height: 100dvh !important;
    padding: 0 16px !important;
  }
  .hero h1 {
    font-size: 28px !important;
    line-height: 1.25 !important;
  }
  .hero p {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }
}/* End custom CSS */