/**
 * Página Inscreva-se: botões, subtítulos e indicadores da diversidade.
 */

body.garagem-pagina-inscreva-se details.garagem-inscreva-faq-documentos > .garagem-faq-item__pergunta {
	gap: 8px;
	font-size: 18.5px;
}

body.garagem-pagina-inscreva-se details.garagem-inscreva-faq-documentos > .garagem-faq-item__pergunta::after {
	width: 22px;
	height: 12px;
	margin-top: 2.2px;
	border: 0;
	background: currentcolor;
	clip-path: polygon(0 0, 50% calc(100% - 4px), 100% 0, 100% 4px, 50% 100%, 0 4px);
	transform: none;
}

/* Botão do hero medido no protótipo (1440): altura 55, rótulo de 16 px semibold. A largura e o raio vêm da regra única de botões. */
body.garagem-pagina-inscreva-se .wp-block-garagem-banner .garagem-blocks-banner__botao {
	box-sizing: border-box;
	min-height: 55px;
	font-size: 16px;
	font-weight: 600;
}

/* Rótulo em uma linha só a partir de 782px; no celular ele quebra em vez de estourar o botão. */
@media (min-width: 782px) {
	body.garagem-pagina-inscreva-se .wp-block-garagem-banner .garagem-blocks-banner__botao {
		white-space: nowrap;
	}
}

/* Até 1024px o botão do hero parte da mesma borda do título (o recuo de -11px do protótipo vale em 1440). */
@media (max-width: 1024px) {
	body.garagem-pagina-inscreva-se .wp-block-garagem-banner .garagem-blocks-banner__botoes,
	body.garagem-pagina-inscreva-se .wp-block-garagem-banner .garagem-blocks-banner__botao {
		margin-inline-start: 0;
	}
}

/* Foto da diversidade: 10px de folga entre as colunas lado a lado, que somam a largura útil; empilhadas (até 781px) não há folga. */
@media (min-width: 782px) {
	body.garagem-pagina-inscreva-se .garagem-inscreva-diversidade__imagem {
		margin-left: 10px;
	}
}

/* Posições finas medidas no protótipo em 1440 (deslocamentos e recuos): valem só a partir de 1240px,
   abaixo disso as seções ficam simétricas. */
@media (min-width: 1240px) {
	body.garagem-pagina-inscreva-se .garagem-inscreva-faq-documentos {
		position: relative;
		left: 4px;
		margin-left: -24px;
	}

	.garagem-inscreva-botao-inscricao {
		position: relative;
		top: -4.3px;
		left: 8.5px;
	}

	.garagem-inscreva-diversidade__botao {
		margin-left: 38px;
	}

	.garagem-inscreva-destaque-1,
	.garagem-inscreva-destaque-2,
	.garagem-inscreva-destaque-3 {
		position: relative;
	}

	.garagem-inscreva-destaque-1 {
		left: -3px;
	}

	.garagem-inscreva-destaque-2 {
		left: -6px;
	}

	.garagem-inscreva-destaque-3 {
		left: -8px;
	}
}

/* Inscreva-se, correções da rodada de QA visual de 24/10/2026. */
/* Subtítulo "Para quem é" dentro do corpo do texto e imagem, na mesma medida dos demais subtítulos (25,3 px). */
body.garagem-pagina-inscreva-se .garagem-blocks-texto-imagem__corpo h2 {
	margin: 30px 0 9px;
	font-size: 25.3px;
}

body.garagem-pagina-inscreva-se .garagem-blocks-texto-imagem__corpo > p:first-child,
body.garagem-pagina-inscreva-se .garagem-blocks-texto-imagem__corpo h2 + p {
	margin-top: 0;
}

/* Botão verde do bloco "o que preciso": mais próximo do verde vivo do token que o escurecimento global.
   #008935 é o verde do protótipo no menor escurecimento que dá 4,54:1 com texto branco de 18px (AA).
   !important porque a classe de preset do WordPress (has-verde-cta-background-color) já o usa. */
body.garagem-pagina-inscreva-se .wp-block-button__link.has-verde-cta-background-color {
	background-color: #008935 !important;
}

/* Larguras das caixas dos indicadores da diversidade (protótipo em 1440). */
body.garagem-pagina-inscreva-se .wp-block-garagem-destaques.garagem-destaques--estilo-contorno .garagem-inscreva-destaque-1 {
	max-width: 168px;
}

body.garagem-pagina-inscreva-se .wp-block-garagem-destaques.garagem-destaques--estilo-contorno .garagem-inscreva-destaque-2 {
	max-width: 154px;
}

body.garagem-pagina-inscreva-se .wp-block-garagem-destaques.garagem-destaques--estilo-contorno .garagem-inscreva-destaque-3 {
	max-width: 159px;
}

/* Indicadores da diversidade abaixo de 900px (antes das três colunas do plugin): caixas de largura igual, uma por linha. */
@media (max-width: 899px) {
	body.garagem-pagina-inscreva-se .wp-block-garagem-destaques.garagem-destaques--estilo-contorno .garagem-destaques-item {
		flex: 0 0 166px;
		width: 166px;
		max-width: 166px;
	}
}

/* Indicadores da diversidade: numeral e legenda centralizados, numeral a 23px de tinta do topo da caixa e legenda de 3 linhas com passo de 13px, como no protótipo. */
body.garagem-pagina-inscreva-se .wp-block-garagem-destaques.garagem-destaques--estilo-contorno .garagem-destaques-item {
	align-items: center;
	justify-content: flex-start;
	padding-top: 8px;
}

body.garagem-pagina-inscreva-se .garagem-destaques--estilo-contorno .garagem-destaques-item__rotulo {
	margin-top: 8px;
	line-height: 13px;
}

/* Botão do formulário na faixa de Diversidade: espaçamento entre letras do protótipo (rótulo de 312 px em 1440). */
@media (min-width: 768px) {
	body.garagem-pagina-inscreva-se .garagem-inscreva-diversidade__botao .wp-block-button__link {
		letter-spacing: 0.09em;
	}
}