/*
Theme Name: Agency Hello Child (BASE)
Theme URI: https://suaagencia.com.br
Description: Boilerplate de child theme da agência sobre o Hello Elementor. Clone por projeto (renomeie Theme Name + text domain). MANTENHA FINO — design mora no Elementor Kit, não aqui.
Author: Sua Agência
Template: hello-elementor
Version: 0.1.0
Text Domain: agency-hello-child
*/

/* ==========================================================================
   GUARDRAILS DE RESPONSIVIDADE (estrutural — NÃO é design)
   --------------------------------------------------------------------------
   WP + Elementor entregam responsividade "automática" que falha na prática
   em tablet/mobile (overflow horizontal, mídia estourando, tipografia grande
   demais, alvos de toque pequenos). Este bloco são guardrails estruturais que
   valem para todo site da agência. DESIGN (cores/escala) continua no Kit.
   ========================================================================== */

/* 1. Mídia nunca estoura o container */
img, video, iframe, svg, canvas {
	max-width: 100%;
	height: auto;
}

/* 2. Mata o scroll horizontal acidental (causa nº1 de "quebrou no celular") */
html, body {
	max-width: 100%;
	overflow-x: hidden;
}

/* 3. Permite que filhos de flex encolham (sem isto, texto/mídia força overflow) */
.e-con, .e-con-inner, .elementor-widget-container {
	min-width: 0;
}

/* 4. Tipografia fluida para títulos do conteúdo (clamp: mobile → desktop) */
.elementor-widget-heading h1 { font-size: clamp(1.9rem, 5.5vw, 3rem);   line-height: 1.15; }
.elementor-widget-heading h2 { font-size: clamp(1.5rem, 4.2vw, 2.25rem); line-height: 1.2; }
.elementor-widget-heading h3 { font-size: clamp(1.2rem, 3vw, 1.5rem);   line-height: 1.3; }

/* 5. Ajustes específicos de mobile (≤ 767px, breakpoint padrão do Elementor) */
@media (max-width: 767px) {

	/* Alvos de toque confortáveis (acessibilidade / WCAG) */
	.elementor-button,
	.elementor-field-group .elementor-field,
	.elementor-field-group button {
		min-height: 44px;
	}

	/* Campos de formulário ocupam a largura toda no celular */
	.elementor-form .elementor-field-group {
		width: 100% !important;
		flex-basis: 100% !important;
	}

	/* Quebra palavras longas (e-mails, URLs) em vez de estourar a largura */
	p, a, li, h1, h2, h3, h4 {
		overflow-wrap: break-word;
		word-wrap: break-word;
	}
}