/* Memória dos atingidos | estilos de bloco
 * Carregado no site e no editor. Cada estilo aparece no editor, em "Estilos", ao selecionar o bloco.
 * As classes antigas do kit (ma-cartao, ma-grafismo, ma-legenda...) continuam valendo.
 */

:root {
	--ma-petroleo: #243e42;
	--ma-terracota: #a44732;
	--ma-papel: #f5f0e6;
	--ma-ocre: #d8ad58;
	--ma-cinza: #52605c;
	--ma-linha: #d6d5ca;
	--ma-nevoa: #e5e9e3;
	--ma-branco: #fff;
	--ma-fonte-texto: 'Source Sans 3', Arial, sans-serif;
	--ma-fonte-titulo: 'Source Serif 4', Georgia, serif;
	--ma-raio: 3px;
}

/* Rótulo: linha curta acima de títulos ("MEMÓRIA, TERRITÓRIO E DIREITOS") */
.is-style-ma-rotulo {
	color: var(--ma-terracota);
	font-family: var(--ma-fonte-texto);
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	line-height: 1.4;
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

/* Introdução: parágrafo de abertura de página */
.is-style-ma-introducao {
	color: var(--ma-petroleo);
	font-size: clamp(1.125rem, 2vw, 1.375rem);
	line-height: 1.5;
	max-width: 46ch;
}

/* Legenda e créditos: autoria · data · local · coleção · direitos de uso */
.is-style-ma-legenda,
.ma-legenda {
	color: var(--ma-cinza);
	font-size: 1rem;
	line-height: 1.5;
}

/* Botão "Link simples": ação secundária, ao lado do botão principal */
.wp-block-button.is-style-ma-link .wp-block-button__link {
	background: transparent;
	border-color: transparent;
	color: var(--ma-petroleo);
	font-weight: 400;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	text-decoration: underline;
	text-decoration-color: var(--ma-linha);
	text-underline-offset: 0.25em;
}
.wp-block-button.is-style-ma-link .wp-block-button__link:hover,
.wp-block-button.is-style-ma-link .wp-block-button__link:focus {
	background: transparent;
	color: var(--ma-terracota);
	text-decoration-color: currentColor;
}

/* Cartão */
.wp-block-group.is-style-ma-cartao,
.wp-block-group[class*="is-style-ma-cartao-linhas"],
.ma-cartao {
	background-color: var(--ma-branco);
	border: 1px solid var(--ma-linha);
	border-radius: var(--ma-raio);
	color: var(--ma-petroleo);
	padding: 1.5rem;
	position: relative;
}
.wp-block-group.is-style-ma-cartao > :first-child,
.wp-block-group[class*="is-style-ma-cartao-linhas"] > :first-child { margin-top: 0; }
.wp-block-group.is-style-ma-cartao > :last-child,
.wp-block-group[class*="is-style-ma-cartao-linhas"] > :last-child { margin-bottom: 0; }

/* Cartão com linhas: faixa de grafismo no topo (capa abstrata, manual p. 6) */
.wp-block-group[class*="is-style-ma-cartao-linhas"] {
	padding-top: calc(5.5rem + 1.25rem);
}
.wp-block-group[class*="is-style-ma-cartao-linhas"]::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5.5rem;
	border-bottom: 1px solid var(--ma-linha);
	background: var(--ma-nevoa) url('../marca/padrao-linhas-nevoa.svg') center / cover no-repeat;
}
.wp-block-group.is-style-ma-cartao-linhas-ocre::before {
	background-color: var(--ma-ocre);
	background-image: url('../marca/padrao-linhas-ocre.svg');
}
.wp-block-group.is-style-ma-cartao-linhas-papel::before {
	background-color: var(--ma-papel);
	background-image: url('../marca/padrao-linhas-papel.svg');
}
.wp-block-group[class*="is-style-ma-cartao"] :is(h2, h3, h4) {
	margin: 0.25rem 0 0.5rem;
	padding: 0;
}
/* Um link no título torna o cartão inteiro clicável */
.wp-block-group[class*="is-style-ma-cartao"] :is(h2, h3, h4) a {
	color: var(--ma-petroleo);
	text-decoration: none;
}
.wp-block-group[class*="is-style-ma-cartao"] :is(h2, h3, h4) a::after {
	content: "";
	position: absolute;
	inset: 0;
}
.wp-block-group[class*="is-style-ma-cartao"]:hover :is(h2, h3, h4) a {
	color: var(--ma-terracota);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}
.wp-block-group[class*="is-style-ma-cartao"]:focus-within {
	outline: 3px solid var(--ma-petroleo);
	outline-offset: 3px;
}

/* Painel petróleo com o símbolo em papel claro (abertura, manual p. 6) */
.wp-block-group.is-style-ma-painel-marca {
	background: var(--ma-petroleo) url('../marca/logo-papel-claro-simbolo.png') center / clamp(7rem, 32%, 10rem) auto no-repeat;
	color: var(--ma-papel);
	min-height: 16rem;
	height: 100%;
}

/* Grafismo de linhas: capas, divisórias e chamadas. Nunca sobre textos, rostos ou documentos. */
.wp-block-group.is-style-ma-grafismo,
.ma-grafismo {
	background: var(--ma-petroleo) url('../marca/padrao-linhas.svg') center / cover;
	color: var(--ma-papel);
	min-height: 15rem;
}

/* Faixa papel: seção de fundo papel dentro de páginas brancas */
.wp-block-group.is-style-ma-faixa-papel {
	background-color: var(--ma-papel);
	padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem);
}

/* Abertura: colunas lado a lado, com borda, sem espaço entre elas */
.wp-block-columns.is-style-ma-abertura {
	background-color: var(--ma-papel);
	border: 1px solid var(--ma-linha);
	gap: 0;
	align-items: stretch !important;
}
.wp-block-columns.is-style-ma-abertura > .wp-block-column:first-child {
	padding: clamp(1.5rem, 4vw, 3.5rem) clamp(1.25rem, 3vw, 2.25rem);
	align-self: center;
}
.wp-block-columns.is-style-ma-abertura > .wp-block-column:first-child > :first-child { margin-top: 0; }
.wp-block-columns.is-style-ma-abertura .wp-block-buttons { margin-top: 1.75rem; gap: 1rem 1.5rem; }

/* Imagem do acervo: área neutra e legenda com créditos (manual p. 5) */
.wp-block-image.is-style-ma-registro img {
	background-color: var(--ma-nevoa);
	border: 1px solid var(--ma-linha);
	border-radius: var(--ma-raio);
}
.wp-block-image.is-style-ma-registro figcaption {
	color: var(--ma-cinza);
	font-size: 1rem;
	line-height: 1.5;
	text-align: left;
}

/* Busca no acervo */
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__label {
	font-family: var(--ma-fonte-titulo);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ma-petroleo);
	margin-bottom: 0.5rem;
}
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__inside-wrapper {
	gap: 0.75rem;
}
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__input {
	background-color: var(--ma-papel);
	border: 1px solid var(--ma-linha);
	border-radius: var(--ma-raio);
	color: var(--ma-petroleo);
	font-size: 1.125rem;
	min-height: 48px;
	padding: 0.5rem 1rem;
}
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__button {
	background-color: var(--ma-terracota);
	border: 0;
	border-radius: var(--ma-raio);
	color: var(--ma-branco);
	font-weight: 600;
	margin-left: 0;
	min-height: 48px;
	min-width: 8rem;
	padding: 0.5rem 1.5rem;
}
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__button:hover,
.wp-block-search.is-style-ma-busca-acervo .wp-block-search__button:focus {
	background-color: var(--ma-petroleo);
}

@media (max-width: 781px) {
	.wp-block-columns.is-style-ma-abertura .wp-block-group.is-style-ma-painel-marca { min-height: 11rem; }
}
@media (max-width: 600px) {
	.wp-block-group.is-style-ma-cartao,
	.wp-block-group[class*="is-style-ma-cartao-linhas"],
	.ma-cartao { padding-left: 1rem; padding-right: 1rem; padding-bottom: 1rem; }
	.wp-block-group[class*="is-style-ma-cartao-linhas"] { padding-top: calc(4.5rem + 1rem); }
	.wp-block-group[class*="is-style-ma-cartao-linhas"]::before { height: 4.5rem; }
	.wp-block-group.is-style-ma-grafismo,
	.ma-grafismo { min-height: 10rem; }
	.wp-block-search.is-style-ma-busca-acervo .wp-block-search__inside-wrapper { flex-wrap: wrap; }
	.wp-block-search.is-style-ma-busca-acervo .wp-block-search__button { width: 100%; }
}

/* Cartões lado a lado (blocos Colunas) ficam com a mesma altura */
.wp-block-column > .wp-block-group[class*="is-style-ma-cartao"]:only-child {
	height: 100%;
}

/* Espaço entre colunas, inclusive quando empilham no celular */
.wp-block-columns:not(.is-style-ma-abertura) {
	column-gap: 2rem;
	row-gap: 1.5rem;
}
