/* Reset mínimo + tipografia + grade. */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

body {
	margin: 0;
	font-family: var(--fonte);
	font-size: var(--tamanho-corpo);
	line-height: 1.65;
	color: var(--cinza-texto);
	background: var(--branco);
	-webkit-font-smoothing: antialiased;
}

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

a { color: var(--azul-medio); }

h1, h2, h3, h4 {
	color: var(--azul);
	margin: 0 0 var(--espaco-2);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.1;
}

h3 { font-size: var(--tamanho-h3); font-weight: 700; letter-spacing: -0.01em; }

p { margin: 0 0 var(--espaco-2); }

ul { margin: 0; padding: 0; list-style: none; }

button { font-family: inherit; }

:focus-visible {
	outline: 3px solid var(--azul-medio);
	outline-offset: 2px;
}

.container {
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--respiro-mobile);
}

.secao {
	padding-block: var(--espaco-6);
}

.secao--rosa-palido { background: var(--rosa-palido); }
.secao--azul { background: var(--azul); color: var(--branco); }
.secao--azul h2, .secao--azul h3 { color: var(--branco); }
.secao--rosa { background: var(--rosa); color: var(--branco); }
.secao--rosa h2, .secao--rosa h3 { color: var(--branco); }
.secao--rosa-escura { background: var(--rosa-escuro); color: var(--branco); }
.secao--rosa-escura h2, .secao--rosa-escura h3 { color: var(--branco); }

.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--tamanho-eyebrow);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 6px 14px;
	border-radius: var(--raio-pilula);
	background: var(--ciano);
	color: var(--azul);
}

.grade-2 {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--espaco-4);
}

@media (min-width: 768px) {
	.grade-2 { grid-template-columns: 1fr 1fr; gap: var(--espaco-5); }
}

.grade-3 {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--espaco-3);
}

@media (min-width: 640px) {
	.grade-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
	.grade-3 { grid-template-columns: repeat(3, 1fr); }
}

.grade-4 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--espaco-3);
}

@media (min-width: 1024px) {
	.grade-4 { grid-template-columns: repeat(4, 1fr); }
}

.grade-6 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--espaco-3);
}

@media (min-width: 768px) {
	.grade-6 { grid-template-columns: repeat(3, 1fr); }
}

/* Revelação suave na rolagem — SPEC seção 8: nada em loop. */
.revelar {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 0.5s ease, transform 0.5s ease;
}

.revelar.revelar--visivel {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.revelar { opacity: 1; transform: none; transition: none; }
}
