/**
 * Tabelas e callouts de premiação, usados nas páginas de Criação, Tração e Sobre.
 */

/* Módulos Criação e Tração abaixo de 1240px: "Para quem" e Premiações empilham as duas colunas;
   a largura da primeira (36% e 46,25%) e as margens das tabelas medidas em 1440 só valem a partir de
   1240px (regras mais abaixo e nas folhas criacao.css e tracao.css). */
@media (max-width: 1239px) {
	body :is(.garagem-modulo__para-quem, .garagem-modulo__secao-premiacoes) .wp-block-columns {
		flex-direction: column;
	}

	body :is(.garagem-modulo__para-quem, .garagem-modulo__secao-premiacoes) .wp-block-columns > .wp-block-column {
		box-sizing: border-box;
		flex-basis: auto;
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	body .garagem-modulo__secao-premiacoes .wp-block-garagem-tabela-ranking {
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
	}
}

/* Parágrafos de abertura das Premiações: tamanho do protótipo desde 768px; o recuo à esquerda vem da folha da página. */
.garagem-modulo__premios-intro {
	font-size: 1.0625rem;
	line-height: 1.5;
}

@media (min-width: 768px) {
	.garagem-modulo__premios-intro {
		font-size: 21.05px;
		line-height: 1.297;
	}
}

@media (min-width: 1240px) {
	body .garagem-modulo__secao-premiacoes .wp-block-columns > .garagem-modulo__premios-coluna-esq {
		flex-grow: 0;
		flex-basis: 46.25%;
	}

	.garagem-modulo__secao-premiacoes .wp-block-column:first-child .wp-block-garagem-tabela-ranking {
		margin-inline: 130px 62px;
	}

	.garagem-modulo__secao-premiacoes .wp-block-column:last-child .wp-block-garagem-tabela-ranking {
		margin-inline: 53px 99px;
	}
}

.garagem-modulo__secao-premiacoes .wp-block-column:first-child .wp-block-garagem-tabela-ranking {
	margin-top: 28px;
}

.garagem-modulo__secao-premiacoes .wp-block-column:last-child .wp-block-garagem-tabela-ranking {
	margin-top: 19px;
}

/* Destaques de premiações: a tabela cabe na largura da coluna no celular. */
@media (max-width: 767px) {
	:is(.wp-block-post-content, .editor-styles-wrapper) .wp-block-garagem-destaques.garagem-destaques--premiacoes {
		box-sizing: border-box;
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .wp-block-garagem-destaques.garagem-destaques--premiacoes > .garagem-destaques__tabela-wrap {
		box-sizing: border-box;
		width: 100%;
		min-width: 0;
		max-width: 100%;
		overflow-x: auto;
	}
}

/* Premiações abaixo de 1240px: o grid de 1142px medido em 1440 (inline na seed)
   passa da janela em tablet e notebook; a seção empilha como no celular.
   porque as medidas vêm em estilo inline. */
@media (max-width: 1239px) {
	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		box-sizing: border-box;
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > * {
		grid-column: auto;
		grid-row: auto;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		height: auto;
		margin: 0;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > .garagem-premiacoes__nota {
		border-radius: var(--garagem-container-borda-raio, 24px);
		padding: 1.25rem;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > h2,
	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > h3 {
		font-size: clamp(1.25rem, 5vw, 1.75rem);
		line-height: 1.2;
		text-align: center;
	}

	/* Respiro da faixa verde acima e abaixo, como o recuo de 74px do desktop. */
	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes {
		padding-block: 3rem 2rem;
	}

	/* As tabelas guardam a largura medida em 1440 e ficam centradas; sem isso a
	   terceira coluna absorve a sobra e os valores se afastam do cabeçalho. */
	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > div {
		max-width: 574px;
		margin-inline: auto;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > div:has(.garagem-sobre__tabela-mais-brasil) {
		max-width: 521px;
	}

	:is(.wp-block-post-content, .editor-styles-wrapper) .garagem-premiacoes > p {
		font-size: 1rem;
		line-height: 1.5;
	}
}

/* Premiações de Criação e Tração: passo de linha do protótipo (2 linhas de 34,4px) */
.garagem-modulo__secao-premiacoes .garagem-tabela-ranking__tabela td,
.garagem-modulo__secao-premiacoes .garagem-tabela-ranking__tabela tbody th {
	line-height: 1.48;
}

/* Premiações de Criação, Tração e Sobre: texto centralizado, primeira coluna de largura fixa e tabela sem
   contorno nem grade (feedback do cliente de 26/10/2026: não deve dar para ver o contorno das tabelas). */
:is(.garagem-modulo__secao-premiacoes, .garagem-sobre__premiacoes) .garagem-tabela-ranking__tabela {
	table-layout: fixed;
}

body :is(.garagem-modulo__secao-premiacoes, .garagem-sobre__premiacoes) .wp-block-garagem-tabela-ranking .garagem-tabela-ranking__rolagem {
	border: 0;
	border-radius: 0;
}

body :is(.garagem-modulo__secao-premiacoes, .garagem-sobre__premiacoes) .wp-block-garagem-tabela-ranking .garagem-tabela-ranking__tabela :is(th, td),
body :is(.garagem-modulo__secao-premiacoes, .garagem-sobre__premiacoes) .wp-block-garagem-tabela-ranking.garagem-tabela-ranking--divisoria .garagem-tabela-ranking__tabela :is(th, td):nth-child(n + 2) {
	border: 0;
	color: #1d1d1d;
	overflow-wrap: anywhere;
	text-align: center;
	vertical-align: middle;
}

/* Larguras medidas em desktop; no celular as colunas dividem a tabela e o valor monetário nunca quebra. */
@media (min-width: 768px) {
	.garagem-modulo__secao-premiacoes .wp-block-column:first-child .garagem-tabela-ranking__tabela th:first-child {
		width: 158px;
	}

	.garagem-modulo__secao-premiacoes .wp-block-column:last-child .garagem-tabela-ranking__tabela th:first-child {
		width: 197px;
	}
}

/* Mais Brasil: "Economia de Periferia" quebra em duas linhas dentro da coluna em vez de invadir a vizinha. */
@media (min-width: 768px) {
	:is(.garagem-sobre__tabela-mais-brasil, .garagem-modulo__secao-premiacoes .wp-block-column:last-child) .garagem-tabela-ranking__tabela tbody th {
		font-size: 17px;
		line-height: 1.1;
		white-space: normal;
	}
}

.garagem-premiacoes__callout {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	border: var(--garagem-container-borda-largura, 4px) solid #c9c9c9;
	border-radius: var(--garagem-container-borda-raio, 24px);
	box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
	color: #565656;
	font-size: 18px;
	line-height: 1.3;
}

.garagem-modulo__secao-premiacoes .garagem-premiacoes__callout {
	min-height: 166px;
	margin: -6px 0 0;
	padding: 24px 28px;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}

@media (min-width: 1240px) {
	.garagem-modulo__secao-premiacoes .wp-block-column:first-child > h3 {
		max-width: 363px;
		margin-left: 130px;
	}

	.garagem-modulo__secao-premiacoes .garagem-premiacoes__callout {
		width: 632px;
		max-width: none;
		margin-left: -31px;
	}

	.garagem-modulo__secao-premiacoes .wp-block-column:last-child > h3 {
		margin-top: 37px;
	}
}