/* ============================================================================
   HG Tracker — Custom overrides + fade-in fallback
   O CSS principal vem de react-build.css (Tailwind compilado).
   Este arquivo só corrige coisas específicas do WP/Elementor.
   ============================================================================ */

/* Reset Hello Elementor: o tema padrão limita largura do main */
.site-main, main.site-main, .ehf-template-hello-elementor .site, .ehf-template-hello-elementor .site-content {
	max-width: 100% !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}
/* SCROLL: body precisa scrollar (o React tinha overflow-hidden no #root, não no body) */
html, body {
	margin: 0 !important;
	padding: 0 !important;
	overflow-x: hidden !important;  /* horizontal escondido (evita scroll lateral do hero) */
	overflow-y: auto !important;    /* vertical SIM (precisa scrollar) */
	height: auto !important;
	min-height: 100vh;
}

/* Elementor section padrão tem padding que atrapalha — zerar pra HTML widgets */
.elementor-section.elementor-section-boxed > .elementor-container {
	max-width: 100% !important;
	padding: 0 !important;
}
.elementor-html-widget, .elementor-widget-html { padding: 0 !important; margin: 0 !important; }

/* IntersectionObserver fallback: sem JS, fade-in sempre visível */
.fade-in {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.6s ease, transform 0.6s ease;
}
body.hg-js-loaded .fade-in:not(.visible) {
	opacity: 0;
	transform: translateY(20px);
}
body.hg-js-loaded .fade-in.visible {
	opacity: 1;
	transform: translateY(0);
}

/* Variáveis CSS — replica o @theme do Tailwind v4 do projeto React */
:root {
	--primary-color: #ff1414;
	--secondary-color: #1f242e;
	--opacity-primary-color: #ff14144d;
	--hg-gray-color: #f0f0f0;
}