/* Barô: identidade aplicada sobre a base EvoServer.
 * A base tem baixa especificidade; os utilitários são opcionais.
 */
:root {
	/* Cores. Accent (dourado claro) é decorativo: não usar como texto pequeno sobre fundo claro. */
	--evs-primary: #163842;
	--evs-primary-dark: #052B36;
	--evs-secondary: #9A8560;
	--evs-accent: #C6AE88;
	--evs-white: #FFFFFF;
	--evs-background: #F6F4EF;
	--evs-background-alt: #EBE8E2;
	--evs-text: #5B6669;
	--evs-heading: #163842;
	--evs-muted: #6B7578;
	--evs-border: #D5D2CB;
	--baro-footer: #051F26;
	--baro-container: 1180px;

	/* Gabriel Sans: auto-hospedada (inc/baro.php). Lexend/Inter via enqueue.php como reserva. */
	--evs-font-heading: 'Gabriel Sans', 'Lexend', Arial, sans-serif;
	--evs-font-body: 'Inter', Arial, sans-serif;
	--evs-text-xs: clamp(0.75rem, 0.73rem + 0.1vw, 0.8125rem);
	--evs-text-sm: clamp(0.875rem, 0.85rem + 0.125vw, 0.9375rem);
	--evs-text-base: clamp(1rem, 0.975rem + 0.125vw, 1.0625rem);
	--evs-text-lg: clamp(1.125rem, 1.075rem + 0.25vw, 1.25rem);
	--evs-text-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
	--evs-heading-sm: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
	--evs-heading-md: clamp(1.5rem, 1.3rem + 1vw, 2rem);
	--evs-heading-lg: clamp(1.875rem, 1.575rem + 1.5vw, 2.625rem);
	--evs-heading-xl: clamp(2.25rem, 1.85rem + 2vw, 3.25rem);
	--evs-heading-hero: clamp(2.5rem, 1.8rem + 3.5vw, 4.25rem);
	--evs-line-height-body: 1.6;
	--evs-line-height-heading: 1.2;
	--evs-weight-regular: 400;
	--evs-weight-medium: 500;
	--evs-weight-semibold: 600;
	--evs-weight-bold: 700;

	/* Larguras incluem o padding lateral. Desktop: acima de 1024px. */
	--evs-container: 1200px;
	--evs-container-wide: 1360px;
	--evs-container-padding: 32px;
	--evs-space-xs: 4px;
	--evs-space-sm: 8px;
	--evs-space-md: 16px;
	--evs-space-lg: 24px;
	--evs-space-xl: 32px;
	--evs-space-2xl: 48px;
	--evs-space-3xl: 64px;
	--evs-section-spacing: 100px;

	--evs-radius-sm: 8px;
	--evs-radius-md: 12px;
	--evs-radius-lg: 18px;
	--evs-radius-xl: 24px;
	--evs-radius-pill: 999px;
	--evs-shadow-sm: 0 2px 6px rgb(16 24 40 / 4%);
	--evs-shadow-md: 0 6px 18px rgb(16 24 40 / 6%);
	--evs-shadow-lg: 0 12px 32px rgb(16 24 40 / 8%);

	--evs-transition-fast: 150ms ease;
	--evs-transition: 250ms ease;
	--evs-transition-slow: 400ms ease;
}

/* Base do documento: não define tamanhos por heading nem margens de widgets. */
html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--evs-font-body);
	font-size: var(--evs-text-base);
	font-weight: var(--evs-weight-regular);
	line-height: var(--evs-line-height-body);
	color: var(--evs-text);
	background-color: var(--evs-background);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--evs-font-heading);
	font-weight: var(--evs-weight-semibold);
	line-height: var(--evs-line-height-heading);
	color: var(--evs-heading);
}

img {
	max-width: 100%;
	height: auto;
}

::selection {
	background-color: var(--evs-primary);
	color: var(--evs-white);
}

/* Inclui links, controles nativos e elementos com tabindex sem afetar cliques. */
:focus-visible,
.evs-button:focus-visible,
.evs-button.elementor-widget-button .elementor-button:focus-visible {
	outline: 3px solid var(--evs-primary-dark);
	outline-offset: 3px;
	box-shadow: 0 0 0 3px var(--evs-white);
}

.evs-container {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--evs-container);
	margin-inline: auto;
	padding-inline: var(--evs-container-padding);
}

.evs-section {
	padding-block: var(--evs-section-spacing);
}

.evs-section--alt {
	background-color: var(--evs-background-alt);
	color: var(--evs-text);
}

.evs-section--dark {
	/* Tokens locais preservam o contraste dos utilitários neste contexto. */
	--evs-text: #FFFFFF;
	--evs-heading: #FFFFFF;
	--evs-muted: #E4E7EC;
	background-color: var(--evs-primary);
	color: var(--evs-text);
}

.evs-text-center {
	text-align: center;
}

.evs-text-muted {
	color: var(--evs-muted);
}

.evs-eyebrow {
	font-family: var(--evs-font-heading);
	font-size: var(--evs-text-xs);
	font-weight: var(--evs-weight-bold);
	line-height: 1.5;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--evs-muted);
}

/* Aceita a classe no link/button ou em Avançado > Classes CSS do widget Botão. */
.evs-button {
	--evs-button-background: var(--evs-primary);
	--evs-button-color: var(--evs-white);
	--evs-button-border: var(--evs-primary);
	--evs-button-hover-background: var(--evs-primary-dark);
	--evs-button-hover-color: var(--evs-white);
	--evs-button-hover-border: var(--evs-primary-dark);
}

.evs-button:not(.elementor-widget),
.evs-button.elementor-widget-button .elementor-button {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--evs-space-sm);
	min-height: 48px;
	padding: 12px 24px;
	border: 1px solid var(--evs-button-border);
	border-radius: var(--evs-radius-sm);
	background-color: var(--evs-button-background);
	color: var(--evs-button-color);
	font-family: var(--evs-font-body);
	font-size: var(--evs-text-base);
	font-weight: var(--evs-weight-semibold);
	line-height: 1.5;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--evs-transition), color var(--evs-transition), border-color var(--evs-transition);
}

.evs-button--primary {
	--evs-button-background: var(--evs-primary);
	--evs-button-color: var(--evs-white);
	--evs-button-border: var(--evs-primary);
}

.evs-button--outline {
	--evs-button-background: transparent;
	--evs-button-color: var(--evs-heading);
	--evs-button-border: currentColor;
}

.evs-button--light {
	--evs-button-background: var(--evs-white);
	--evs-button-color: var(--evs-primary);
	--evs-button-border: var(--evs-border);
	--evs-button-hover-background: var(--evs-background-alt);
	--evs-button-hover-color: var(--evs-primary-dark);
	--evs-button-hover-border: var(--evs-secondary);
}

.evs-button:not(.elementor-widget):visited,
.evs-button.elementor-widget-button .elementor-button:visited {
	color: var(--evs-button-color);
}

.evs-button:not(.elementor-widget):hover,
.evs-button:not(.elementor-widget):active,
.evs-button.elementor-widget-button .elementor-button:hover,
.evs-button.elementor-widget-button .elementor-button:active {
	background-color: var(--evs-button-hover-background);
	border-color: var(--evs-button-hover-border);
	color: var(--evs-button-hover-color);
	text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	:root {
		--evs-transition-fast: 0s;
		--evs-transition: 0s;
		--evs-transition-slow: 0s;
	}
}