/**
 * Agenzio - One-Page Custom Styles & Smoke Animation
 * Garante o efeito exato da demo https://demo.casethemes.net/agenzio/home-one-page-01/
 */

:root {
  --primary-color: #E44F39;
  --primary-color-rgb: 228, 79, 57;
  --secondary-color: #161616;
  --dark-color: #111111;
  --heading-color: #161616;
  --body-bg-color: #ffffff;
  --link-color: #232323;
  --link-color-hover: #E44F39;
  --font-heading: 'Outfit', sans-serif;
  --font-body: 'Inter', sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  color: #555555;
  background-color: #ffffff;
  overflow-x: hidden;
}

/* =========================================================
   EFEITO DE FUMAÇA ANIMADA (SMOKE EFFECT) - FIEL À DEMO
   ========================================================= */
.pxl-banner.pxl-banner1 {
  position: relative;
  overflow: hidden;
}

.pxl-banner.pxl-banner1 .pxl-box-inner.style1 {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Camadas de fumaça */
.pxl-banner.pxl-banner1 .pxl-box-inner.style1 .pxl-item--imgprimary {
  width: 130%;
  height: 100%;
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: -15%;
  -webkit-animation: an-smoke-1 8s ease-in-out infinite;
  animation: an-smoke-1 8s ease-in-out infinite;
  opacity: 0;
  pointer-events: none;
}

.pxl-banner.pxl-banner1 .pxl-box-inner.style1 .pxl-item--imgprimary img {
  width: 100%;
  height: auto;
  min-height: 250px;
  object-fit: cover;
  filter: blur(4px);
  opacity: 0.85;
}

/* Delays para criar sensação orgânica de movimento contínuo */
.ag-smoke__delay-1 {
  -webkit-animation-delay: 2.5s !important;
  animation-delay: 2.5s !important;
}

.ag-smoke__delay-2 {
  -webkit-animation-delay: 5s !important;
  animation-delay: 5s !important;
}

/* Fumaça no Rodapé (Footer Smoke) */
.pxl-footer-elementor,
footer {
  position: relative;
  overflow: hidden;
}

.footer-smoke-container {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 380px;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}

.footer-smoke-container .pxl-item--imgprimary {
  position: absolute;
  bottom: 0;
  left: -10%;
  width: 120%;
  height: 100%;
  animation: an-smoke-1 7s ease-in-out infinite;
  opacity: 0;
  pointer-events: none;
}

.footer-smoke-container .pxl-item--imgprimary img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(3px);
  opacity: 0.75;
}

/* Animações Keyframes Fiel ao Agenzio */
@keyframes an-smoke-1 {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0.98) rotate(0.01deg);
  }
  30% {
    opacity: 0.75;
  }
  60% {
    opacity: 0.6;
  }
  80% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
    transform: translateY(-70px) scale(1.08) rotate(0.01deg);
  }
}

@keyframes an-smoke-2 {
  0% {
    opacity: 0;
    transform: translateY(15px) scale(1) rotate(0.01deg);
  }
  40% {
    opacity: 0.8;
  }
  70% {
    opacity: 0.45;
  }
  100% {
    opacity: 0;
    transform: translateY(-55px) scale(1.05) rotate(0.01deg);
  }
}

/* Header Fixo & Menu One-Page */
.pxl-header-elementor.is-sticky,
header.is-sticky {
  position: sticky;
  top: 0;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
}

/* Ajuste de scroll com offset para não esconder títulos debaixo do menu fixo */
section[id] {
  scroll-margin-top: 100px;
}

/* Loader inicial do Agenzio */
#pxl-loadding {
  transition: opacity 0.5s ease, visibility 0.5s ease;
}
#pxl-loadding.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Botões do Tema Agenzio */
.btn-primary,
.btn-primary-agenzio {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: #ffffff !important;
  transition: all 0.35s ease;
}

.btn-primary:hover,
.btn-primary-agenzio:hover {
  background-color: #161616 !important;
  border-color: #161616 !important;
  color: #ffffff !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(228, 79, 57, 0.3);
}

/* Correções de Responsividade */
@media (max-width: 991px) {
  .elementor-column {
    width: 100% !important;
  }
  .pxl-nav-menu {
    display: none;
  }
}