/*
 * Blog da Margem Azul.
 *
 * Tokens iguais aos do site principal (resources/css/site.css no repositório
 * do produto). Diferença deliberada: aqui o padrão é o CLARO, porque texto
 * longo se lê melhor em fundo claro; o escuro vem da preferência do sistema
 * ou do botão no topo. Regra da marca: #2D9CFF só sobre fundo escuro,
 * #1D6FD8 sobre claro.
 */

:root {
	color-scheme: light;

	--bg-0: #f5f8fb;
	--bg-1: #ffffff;
	--bg-2: #eef3f9;
	--line: rgba(13, 27, 44, 0.09);
	--line-strong: rgba(13, 27, 44, 0.16);

	--tx-0: #10151c;
	--tx-texto: #1f2731;
	--tx-1: rgba(16, 21, 28, 0.72);
	--tx-2: rgba(16, 21, 28, 0.56);

	--acc: #1d6fd8;
	--acc-hover: #175bb3;
	--acc-tx: #ffffff;
	--acc-soft: rgba(29, 111, 216, 0.08);
	--acc-line: rgba(29, 111, 216, 0.28);

	--ok: #0f9b72;
	--ok-soft: rgba(15, 155, 114, 0.08);
	--warn: #b7791f;
	--warn-soft: rgba(245, 165, 36, 0.12);

	--topo-bg: rgba(245, 248, 251, 0.85);
	--sombra: 0 18px 40px rgba(15, 35, 60, 0.10);
	--sombra-leve: 0 1px 2px rgba(15, 35, 60, 0.06);

	--logo-tile: #ffffff;
	--logo-tile-line: rgba(13, 27, 44, 0.18);
	--logo-acc: #1d6fd8;

	--r-sm: 8px;
	--r-md: 12px;
	--r-lg: 18px;
	--r-pill: 999px;

	--f-titulo: 'Schibsted Grotesk', 'Segoe UI', system-ui, sans-serif;
	--f-texto: Onest, 'Segoe UI', system-ui, sans-serif;
	--f-mono: 'JetBrains Mono', Consolas, Menlo, monospace;

	--t-h1: clamp(2rem, 1.45rem + 2.2vw, 3rem);
	--t-h1-artigo: clamp(1.9rem, 1.4rem + 2vw, 2.75rem);
	--t-h2: clamp(1.45rem, 1.25rem + 0.8vw, 1.8rem);
	--t-h3: clamp(1.2rem, 1.1rem + 0.4vw, 1.35rem);

	--topo-altura: 68px;
	--gutter: 20px;
}

/* Escuro: pelo sistema (sem escolha salva) ou pelo botão. Blocos iguais,
   duplicados porque CSS não deixa uma regra valer para os dois seletores. */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme='light']) {
		color-scheme: dark;
		--bg-0: #0a0b0d;
		--bg-1: #111317;
		--bg-2: #181b20;
		--line: rgba(255, 255, 255, 0.07);
		--line-strong: rgba(255, 255, 255, 0.13);
		--tx-0: rgba(255, 255, 255, 0.96);
		--tx-texto: rgba(255, 255, 255, 0.84);
		--tx-1: rgba(255, 255, 255, 0.66);
		--tx-2: rgba(255, 255, 255, 0.48);
		--acc: #2d9cff;
		--acc-hover: #5cb3ff;
		--acc-tx: #041322;
		--acc-soft: rgba(45, 156, 255, 0.10);
		--acc-line: rgba(45, 156, 255, 0.32);
		--ok: #2dd4a7;
		--ok-soft: rgba(45, 212, 167, 0.08);
		--warn: #f5a524;
		--warn-soft: rgba(245, 165, 36, 0.10);
		--topo-bg: rgba(10, 11, 13, 0.78);
		--sombra: 0 24px 50px rgba(0, 0, 0, 0.45);
		--sombra-leve: none;
		--logo-tile: #111317;
		--logo-tile-line: rgba(255, 255, 255, 0.10);
		--logo-acc: #2d9cff;
	}
}

:root[data-theme='dark'] {
	color-scheme: dark;
	--bg-0: #0a0b0d;
	--bg-1: #111317;
	--bg-2: #181b20;
	--line: rgba(255, 255, 255, 0.07);
	--line-strong: rgba(255, 255, 255, 0.13);
	--tx-0: rgba(255, 255, 255, 0.96);
	--tx-texto: rgba(255, 255, 255, 0.84);
	--tx-1: rgba(255, 255, 255, 0.66);
	--tx-2: rgba(255, 255, 255, 0.48);
	--acc: #2d9cff;
	--acc-hover: #5cb3ff;
	--acc-tx: #041322;
	--acc-soft: rgba(45, 156, 255, 0.10);
	--acc-line: rgba(45, 156, 255, 0.32);
	--ok: #2dd4a7;
	--ok-soft: rgba(45, 212, 167, 0.08);
	--warn: #f5a524;
	--warn-soft: rgba(245, 165, 36, 0.10);
	--topo-bg: rgba(10, 11, 13, 0.78);
	--sombra: 0 24px 50px rgba(0, 0, 0, 0.45);
	--sombra-leve: none;
	--logo-tile: #111317;
	--logo-tile-line: rgba(255, 255, 255, 0.10);
	--logo-acc: #2d9cff;
}

/* ------------------------------------------------------------------ base */

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: calc(var(--topo-altura) + 16px);
}

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

body {
	margin: 0;
	background: var(--bg-0);
	color: var(--tx-0);
	font-family: var(--f-texto);
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

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

a { color: var(--acc); text-decoration: none; }
a:hover { color: var(--acc-hover); }

:focus-visible {
	outline: 2px solid var(--acc);
	outline-offset: 3px;
	border-radius: 4px;
}

h1, h2, h3, h4 {
	font-family: var(--f-titulo);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.18;
	color: var(--tx-0);
	text-wrap: balance;
}

.icone { flex: none; vertical-align: middle; }

.leitor {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.pular {
	position: absolute;
	left: 16px; top: -60px;
	z-index: 100;
	padding: 10px 16px;
	background: var(--acc);
	color: var(--acc-tx);
	border-radius: var(--r-sm);
	font-weight: 600;
}
.pular:focus { top: 12px; color: var(--acc-tx); }

.envoltorio { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 var(--gutter); }
.envoltorio-largo { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 var(--gutter); }
.envoltorio-texto { width: 100%; max-width: calc(760px + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }

.principal { min-height: 60vh; padding-bottom: 72px; }

.eyebrow {
	margin: 0 0 12px;
	font-family: var(--f-mono);
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--acc);
}

.meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0;
	font-size: 0.875rem;
	color: var(--tx-2);
}
.meta .icone { width: 15px; height: 15px; }
.meta-leitura { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }

.rotulo {
	position: relative;
	z-index: 1;
	display: inline-block;
	font-family: var(--f-mono);
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--acc);
}

/* ---------------------------------------------------------------- botões */

.botao {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 0 18px;
	border: 1px solid transparent;
	border-radius: var(--r-pill);
	font: 600 0.9375rem/1 var(--f-texto);
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .15s, transform .15s, border-color .15s;
}
.botao .icone { width: 18px; height: 18px; }
.botao-primario { background: var(--acc); color: var(--acc-tx); }
.botao-primario:hover { background: var(--acc-hover); color: var(--acc-tx); transform: translateY(-1px); }
.botao-grande { min-height: 50px; padding: 0 24px; font-size: 1rem; }

.botao-icone {
	display: inline-grid;
	place-items: center;
	width: 40px; height: 40px;
	border: 1px solid var(--line);
	border-radius: var(--r-pill);
	background: transparent;
	color: var(--tx-1);
	cursor: pointer;
	list-style: none;
}
.botao-icone::-webkit-details-marker { display: none; }
.botao-icone:hover { color: var(--tx-0); border-color: var(--line-strong); }

/* --------------------------------------------------------------- topo */

.topo {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--topo-bg);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid var(--line);
}
.admin-bar .topo { top: 32px; }
@media (max-width: 782px) { .admin-bar .topo { top: 46px; } }
@media (max-width: 600px) { .admin-bar .topo { top: 0; } }

.topo-in {
	display: flex;
	align-items: center;
	gap: 24px;
	height: var(--topo-altura);
}

.topo-marca { color: inherit; flex: none; }
.marca { display: inline-flex; align-items: center; gap: 10px; }
.marca-simbolo { width: 34px; height: 34px; }
.marca-nome {
	display: inline-flex;
	flex-direction: column;
	line-height: 1;
	font-family: var(--f-titulo);
	font-weight: 700;
	font-size: 1.22rem;
	letter-spacing: -0.03em;
	color: var(--tx-0);
}
.marca-azul {
	font-weight: 400;
	font-size: 0.45em;
	letter-spacing: 0.34em;
	color: var(--logo-acc);
	text-align: right;
	margin-top: 2px;
	margin-right: -0.34em;
}
.marca-selo {
	margin-left: 4px;
	padding: 3px 8px;
	border: 1px solid var(--acc-line);
	border-radius: var(--r-pill);
	font-family: var(--f-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--acc);
}

.topo-nav { flex: 1; min-width: 0; }
.topo-nav .menu {
	display: flex;
	gap: 4px;
	margin: 0; padding: 0;
	list-style: none;
	overflow: hidden;
}
.topo-nav a {
	display: block;
	padding: 8px 12px;
	border-radius: var(--r-pill);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--tx-1);
	white-space: nowrap;
}
.topo-nav a:hover,
.topo-nav .current-menu-item > a,
.topo-nav .current-post-ancestor > a { color: var(--tx-0); background: var(--bg-2); }

.topo-acoes { display: flex; align-items: center; gap: 8px; margin-left: auto; }

.alternar-tema .so-escuro { display: none; }
:root[data-theme='dark'] .alternar-tema .so-claro { display: none; }
:root[data-theme='dark'] .alternar-tema .so-escuro { display: inline; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme='light']) .alternar-tema .so-claro { display: none; }
	:root:not([data-theme='light']) .alternar-tema .so-escuro { display: inline; }
}

.busca, .menu-movel { position: relative; }
.busca-painel {
	position: absolute;
	right: 0;
	top: calc(100% + 14px);
	width: min(420px, calc(100vw - 32px));
	padding: 12px;
	background: var(--bg-1);
	border: 1px solid var(--line-strong);
	border-radius: var(--r-md);
	box-shadow: var(--sombra);
}

.form-busca { display: flex; gap: 8px; }
.form-busca input {
	flex: 1;
	min-width: 0;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-pill);
	background: var(--bg-0);
	color: var(--tx-0);
	font: 400 1rem var(--f-texto);
}
.form-busca input:focus { outline: none; border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
.busca-grande { max-width: 560px; margin-top: 24px; }

.menu-movel { display: none; }
.menu-movel .icone-fechar { display: none; }
.menu-movel[open] .icone-abrir { display: none; }
.menu-movel[open] .icone-fechar { display: inline; }
.menu-movel-painel {
	position: fixed;
	left: 0; right: 0;
	top: var(--topo-altura);
	padding: 16px var(--gutter) 24px;
	background: var(--bg-1);
	border-bottom: 1px solid var(--line-strong);
	box-shadow: var(--sombra);
}
.admin-bar .menu-movel-painel { top: calc(var(--topo-altura) + 46px); }
.menu-movel-painel .menu { margin: 0 0 16px; padding: 0; list-style: none; }
.menu-movel-painel .menu a {
	display: block;
	padding: 12px 0;
	border-bottom: 1px solid var(--line);
	color: var(--tx-0);
	font-weight: 500;
}
.menu-movel-painel .botao { width: 100%; }

@media (max-width: 1100px) {
	.topo-nav { display: none; }
	.menu-movel { display: block; }
}
@media (max-width: 720px) {
	.topo-cta { display: none; }
	.marca-selo { display: none; }
}

/* ------------------------------------------------------ capa e arquivos */

.capa-topo { padding: 56px 0 36px; }
.capa-titulo {
	max-width: 22ch;
	margin: 0 0 16px;
	font-size: var(--t-h1);
}
.capa-titulo-menor { font-size: clamp(1.8rem, 1.4rem + 1.6vw, 2.5rem); max-width: 28ch; }
.capa-pagina { color: var(--tx-2); font-weight: 400; }
.capa-sub { max-width: 60ch; margin: 0; font-size: 1.125rem; color: var(--tx-1); }
.descricao-termo p { margin: 0 0 12px; }

.categorias {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 28px;
}
.chip {
	padding: 7px 14px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-pill);
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--tx-1);
	background: var(--bg-1);
}
.chip:hover { color: var(--tx-0); border-color: var(--acc-line); }
.chip.ativo { background: var(--acc); border-color: var(--acc); color: var(--acc-tx); }

.vazio {
	padding: 48px 24px;
	border: 1px dashed var(--line-strong);
	border-radius: var(--r-lg);
	text-align: center;
	color: var(--tx-1);
}

.secao-titulo { margin: 0 0 24px; font-size: var(--t-h2); }

/* -------------------------------------------------------------- cards */

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

.card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--bg-1);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	overflow: hidden;
	box-shadow: var(--sombra-leve);
	transition: border-color .2s, transform .2s, box-shadow .2s;
}
.card:hover { border-color: var(--acc-line); transform: translateY(-2px); box-shadow: var(--sombra); }
.card:focus-within { border-color: var(--acc); }

.card-imagem { aspect-ratio: 16 / 9; background: var(--bg-2); overflow: hidden; }
.card-imagem img { width: 100%; height: 100%; object-fit: cover; }
.card-imagem-vazia {
	width: 100%; height: 100%;
	background:
		radial-gradient(circle at 80% 20%, var(--acc-soft), transparent 55%),
		linear-gradient(135deg, var(--bg-2), var(--bg-1));
}

.card-corpo { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 20px 22px 22px; }
.card-titulo { margin: 0; font-size: 1.2rem; line-height: 1.28; }
.card-link { color: var(--tx-0); }
.card-link::after { content: ''; position: absolute; inset: 0; }
.card-link:hover { color: var(--acc); }
.card-link:focus-visible { outline: none; }
.card-resumo {
	margin: 0;
	color: var(--tx-1);
	font-size: 0.975rem;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.card .meta { margin-top: auto; padding-top: 6px; }

@media (min-width: 640px) {
	.card-destaque { grid-column: 1 / -1; }
}
@media (min-width: 900px) {
	.card-destaque { flex-direction: row; }
	.card-destaque .card-imagem { flex: 0 0 56%; aspect-ratio: 16 / 9; }
	.card-destaque .card-corpo { justify-content: center; padding: 36px 40px; gap: 14px; }
	.card-destaque .card-titulo { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); }
	.card-destaque .card-resumo { font-size: 1.0625rem; -webkit-line-clamp: 4; }
	.card-destaque .meta { margin-top: 8px; }
}

.paginacao { margin-top: 48px; }
.paginacao ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 0; padding: 0;
	list-style: none;
}
.paginacao .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 42px; height: 42px;
	padding: 0 14px;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-pill);
	color: var(--tx-1);
	font-weight: 500;
}
.paginacao a.page-numbers:hover { color: var(--tx-0); border-color: var(--acc-line); }
.paginacao .current { background: var(--acc); border-color: var(--acc); color: var(--acc-tx); }
.paginacao .dots { border: 0; }

/* ------------------------------------------------------------- artigo */

.trilha { margin-bottom: 20px; font-size: 0.875rem; color: var(--tx-2); }
.trilha p { margin: 0; }
.trilha a { color: var(--tx-1); }
.trilha a:hover { color: var(--acc); }
.trilha .separator { margin: 0 6px; opacity: .6; }

.artigo-topo { padding-top: 40px; padding-bottom: 32px; }
.artigo-titulo { margin: 10px 0 16px; font-size: var(--t-h1-artigo); }
.artigo-linha-fina { margin: 0 0 24px; font-size: 1.2rem; line-height: 1.55; color: var(--tx-1); }

.artigo-meta { display: flex; align-items: center; gap: 12px; }
.artigo-meta .avatar { width: 40px; height: 40px; border-radius: 50%; }
.artigo-autor { margin: 0 0 2px; font-size: 0.9375rem; color: var(--tx-1); }
.artigo-autor a { color: var(--tx-0); font-weight: 600; }
.meta-atualizado { color: var(--tx-1); }

.artigo-imagem { margin-top: 0; margin-bottom: 40px; }
.artigo-imagem img { width: 100%; border-radius: var(--r-lg); border: 1px solid var(--line); }
.artigo-imagem figcaption { margin-top: 10px; font-size: 0.875rem; color: var(--tx-2); text-align: center; }

.artigo-corpo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 64px; }
.artigo-coluna { min-width: 0; max-width: 720px; }
.artigo-lateral { display: none; }

@media (min-width: 1080px) {
	.artigo-corpo { grid-template-columns: minmax(0, 720px) 280px; justify-content: space-between; }
	.artigo-lateral { display: block; }
	.lateral-fixa {
		position: sticky;
		top: calc(var(--topo-altura) + 28px);
		display: flex;
		flex-direction: column;
		gap: 20px;
		max-height: calc(100vh - var(--topo-altura) - 56px);
		overflow-y: auto;
		scrollbar-width: thin;
	}
	.sumario-topo { display: none; }
	/* Com a lateral, o texto fica na coluna da esquerda em vez de centrado. */
	.artigo .artigo-topo { max-width: 1120px; }
	.artigo .artigo-topo > * { max-width: 760px; }
}

/* sumário */
.sumario { font-size: 0.9rem; }
.sumario-titulo {
	margin: 0 0 10px;
	font-family: var(--f-mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--tx-2);
}
.sumario ol { margin: 0; padding: 0; list-style: none; }
.sumario li { margin: 0; }
.sumario a {
	display: block;
	padding: 6px 0 6px 14px;
	border-left: 2px solid var(--line);
	color: var(--tx-1);
	line-height: 1.4;
}
.sumario .nivel-3 a { padding-left: 28px; font-size: 0.85rem; }
.sumario a:hover { color: var(--tx-0); }
.sumario a.ativo { color: var(--acc); border-left-color: var(--acc); }

.sumario-topo {
	margin-bottom: 32px;
	padding: 18px 20px;
	background: var(--bg-1);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

/* ----------------------------------------------------------- conteúdo */

.conteudo {
	font-size: 1.125rem;
	line-height: 1.78;
	color: var(--tx-texto);
	overflow-wrap: break-word;
}
.conteudo > * { margin-top: 0; margin-bottom: 1.35em; }
.conteudo > *:last-child { margin-bottom: 0; }

.conteudo h2 { margin: 2.2em 0 0.7em; font-size: var(--t-h2); }
.conteudo h3 { margin: 1.8em 0 0.6em; font-size: var(--t-h3); }
.conteudo h4 { margin: 1.6em 0 0.5em; font-size: 1.1rem; }
.conteudo > h2:first-child, .conteudo > h3:first-child { margin-top: 0; }

.conteudo a {
	color: var(--acc);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	text-decoration-color: var(--acc-line);
}
.conteudo a:hover { text-decoration-color: currentColor; }

.conteudo strong { color: var(--tx-0); font-weight: 600; }

.conteudo ul, .conteudo ol { padding-left: 1.4em; }
.conteudo li { margin-bottom: 0.45em; }
.conteudo li::marker { color: var(--acc); }

.conteudo blockquote {
	margin-left: 0; margin-right: 0;
	padding: 4px 0 4px 22px;
	border-left: 3px solid var(--acc);
	color: var(--tx-0);
	font-size: 1.15em;
}
.conteudo blockquote p { margin: 0 0 .6em; }
.conteudo blockquote cite { display: block; font-size: .8em; font-style: normal; color: var(--tx-2); }

.conteudo hr {
	border: 0;
	height: 1px;
	background: var(--line-strong);
	margin: 2.5em 0;
}

.conteudo code {
	font-family: var(--f-mono);
	font-size: .86em;
	padding: .15em .4em;
	background: var(--bg-2);
	border-radius: 6px;
}
.conteudo pre {
	padding: 18px 20px;
	background: var(--bg-2);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	overflow-x: auto;
	font-size: .9rem;
	line-height: 1.6;
}
.conteudo pre code { padding: 0; background: none; }

.conteudo figure { margin-left: 0; margin-right: 0; }
.conteudo img { border-radius: var(--r-md); }
.conteudo figcaption,
.conteudo .wp-element-caption {
	margin-top: 10px;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--tx-2);
	text-align: center;
}

/* Tabelas rolam na horizontal no celular em vez de estourar a página. */
.conteudo .wp-block-table { overflow-x: auto; }
.conteudo table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
	line-height: 1.5;
}
.conteudo th, .conteudo td {
	padding: 10px 14px;
	border-bottom: 1px solid var(--line-strong);
	text-align: left;
	vertical-align: top;
}
.conteudo th {
	font-family: var(--f-titulo);
	font-weight: 700;
	color: var(--tx-0);
	background: var(--bg-2);
}
.conteudo .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: var(--bg-1); }
.conteudo .wp-block-table.is-style-stripes { border: 0; }

.conteudo .wp-block-embed iframe { width: 100%; border-radius: var(--r-md); }
.conteudo .alignwide { margin-left: 0; margin-right: 0; }

.conteudo .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 24px;
	border-radius: var(--r-pill);
	background: var(--acc);
	color: var(--acc-tx);
	font-weight: 600;
	text-decoration: none;
}
.conteudo .wp-block-button__link:hover { background: var(--acc-hover); color: var(--acc-tx); }
.conteudo .is-style-outline .wp-block-button__link { background: transparent; color: var(--acc); border: 1px solid var(--acc-line); }

/* estilos de bloco da casa */
.conteudo .is-style-resumo,
.conteudo .is-style-dica,
.conteudo .is-style-atencao {
	padding: 22px 24px;
	border-radius: var(--r-md);
	border: 1px solid var(--acc-line);
	background: var(--acc-soft);
	font-size: 1.05rem;
}
.conteudo .is-style-dica { border-color: color-mix(in srgb, var(--ok) 35%, transparent); background: var(--ok-soft); }
.conteudo .is-style-atencao { border-color: color-mix(in srgb, var(--warn) 40%, transparent); background: var(--warn-soft); }
.conteudo .is-style-resumo > *:last-child,
.conteudo .is-style-dica > *:last-child,
.conteudo .is-style-atencao > *:last-child { margin-bottom: 0; }
.conteudo .is-style-resumo > *:first-child,
.conteudo .is-style-dica > *:first-child,
.conteudo .is-style-atencao > *:first-child { margin-top: 0; }
.conteudo .is-style-resumo h2,
.conteudo .is-style-resumo h3,
.conteudo .is-style-dica h3,
.conteudo .is-style-atencao h3 { font-size: 1.1rem; margin-bottom: .5em; }

.conteudo ul.is-style-checklist { list-style: none; padding-left: 0; }
.conteudo ul.is-style-checklist li { position: relative; padding-left: 32px; }
.conteudo ul.is-style-checklist li::before {
	content: '';
	position: absolute;
	left: 0; top: .35em;
	width: 20px; height: 20px;
	border-radius: 50%;
	background: var(--acc-soft);
}
/* O visto é máscara pintada com o token, para seguir o azul de cada tema. */
.conteudo ul.is-style-checklist li::after {
	content: '';
	position: absolute;
	left: 4px; top: calc(.35em + 4px);
	width: 12px; height: 12px;
	background: var(--acc);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.conteudo blockquote.is-style-destaque {
	padding: 28px 30px;
	border: 0;
	border-radius: var(--r-lg);
	background: var(--bg-1);
	box-shadow: inset 0 0 0 1px var(--line);
	font-family: var(--f-titulo);
	font-size: 1.4rem;
	line-height: 1.4;
	letter-spacing: -0.01em;
}

/* FAQ do Rank Math (gera o schema FAQPage). */
.conteudo .rank-math-block .rank-math-list-item {
	padding: 18px 0;
	border-bottom: 1px solid var(--line);
}
.conteudo .rank-math-block .rank-math-question { margin: 0 0 8px; font-size: 1.15rem; }
.conteudo .rank-math-block .rank-math-answer > *:last-child { margin-bottom: 0; }

/* --------------------------------------------------------- fim do artigo */

.artigo-rodape {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 48px;
	padding-top: 24px;
	border-top: 1px solid var(--line);
}

.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.tags a {
	display: inline-block;
	padding: 5px 12px;
	border-radius: var(--r-pill);
	background: var(--bg-2);
	font-size: 0.85rem;
	color: var(--tx-1);
}
.tags a:hover { color: var(--acc); }

.compartilhar { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.compartilhar-rotulo { font-size: 0.875rem; color: var(--tx-2); margin-right: 4px; }
.compartilhar-botao {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 38px; height: 38px;
	border: 1px solid var(--line-strong);
	border-radius: 50%;
	background: transparent;
	color: var(--tx-1);
	cursor: pointer;
}
.compartilhar-botao:hover { color: var(--acc); border-color: var(--acc-line); }
.compartilhar-botao .icone { width: 18px; height: 18px; }
.copiado {
	position: absolute;
	bottom: calc(100% + 8px);
	right: 0;
	padding: 5px 10px;
	border-radius: var(--r-sm);
	background: var(--tx-0);
	color: var(--bg-0);
	font-size: 0.78rem;
	white-space: nowrap;
}

.autor {
	display: flex;
	gap: 18px;
	margin-top: 40px;
	padding: 24px;
	background: var(--bg-1);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
}
.autor .avatar { width: 72px; height: 72px; border-radius: 50%; flex: none; }
.autor-rotulo { margin: 0; font-size: 0.8rem; color: var(--tx-2); }
.autor-nome { margin: 2px 0 8px; font-family: var(--f-titulo); font-weight: 700; font-size: 1.15rem; }
.autor-nome a { color: var(--tx-0); }
.autor-bio { margin: 0; color: var(--tx-1); font-size: 0.975rem; }
.autor-arquivo { margin-top: 0; padding: 0; background: none; border: 0; align-items: center; }
.autor-arquivo .avatar { width: 96px; height: 96px; }
.autor-arquivo .capa-titulo { margin-bottom: 8px; }

/* ------------------------------------------------------------------ CTA */

.cta { border-radius: var(--r-lg); }
.cta .cta-titulo {
	margin: 0 0 8px;
	font-family: var(--f-titulo);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--tx-0);
}
.cta p { margin: 0 0 12px; }

.cta-artigo {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-top: 40px;
	padding: 32px;
	background:
		radial-gradient(120% 140% at 100% 0%, var(--acc-soft), transparent 60%),
		var(--bg-1);
	border: 1px solid var(--acc-line);
}
.cta-artigo .cta-titulo { font-size: 1.5rem; line-height: 1.25; }
.cta-artigo p { color: var(--tx-1); }
.cta-artigo .botao { align-self: flex-start; }

.cta-lateral {
	padding: 20px;
	background: var(--bg-1);
	border: 1px solid var(--line);
	font-size: 0.9rem;
	color: var(--tx-1);
}
.cta-lateral .cta-titulo { font-size: 1.05rem; line-height: 1.3; }
.cta-lateral .botao { width: 100%; min-height: 38px; }

.cta-faixa {
	margin-top: 0;
	border-radius: 0;
	background:
		radial-gradient(60% 120% at 90% 0%, var(--acc-soft), transparent 70%),
		var(--bg-1);
	border-top: 1px solid var(--line);
}
.cta-faixa-in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding-top: 56px;
	padding-bottom: 56px;
}
.cta-faixa h2 { margin: 0 0 10px; font-size: var(--t-h2); }
.cta-faixa p:not(.eyebrow) { margin: 0; max-width: 56ch; color: var(--tx-1); }

/* -------------------------------------------------------- relacionados */

.relacionados { margin-top: 80px; }

/* -------------------------------------------------------------- página */

.pagina .conteudo { padding-bottom: 24px; }

/* -------------------------------------------------------------- rodapé */

.rodape {
	padding: 56px 0 32px;
	background: var(--bg-0);
	border-top: 1px solid var(--line);
	font-size: 0.9375rem;
	color: var(--tx-1);
}
.rodape-in { display: grid; gap: 40px; }
@media (min-width: 900px) { .rodape-in { grid-template-columns: 1.1fr 2fr; } }
.rodape-marca p { max-width: 38ch; margin: 16px 0 0; }
.rodape-marca a { color: inherit; }
.rodape-nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
@media (min-width: 700px) { .rodape-nav { grid-template-columns: repeat(4, 1fr); } }
.rodape-titulo {
	margin: 0 0 12px;
	font-family: var(--f-mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--tx-2);
}
.rodape ul { margin: 0; padding: 0; list-style: none; }
.rodape li { margin-bottom: 8px; }
.rodape-nav a { color: var(--tx-1); }
.rodape-nav a:hover { color: var(--acc); }
.rodape-base {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px;
	margin-top: 48px;
	padding-top: 24px;
	border-top: 1px solid var(--line);
	font-size: 0.85rem;
	color: var(--tx-2);
}

@media (max-width: 640px) {
	.capa-topo { padding: 36px 0 28px; }
	.artigo-topo { padding-top: 28px; }
	.cta-artigo { padding: 24px; }
	.cta-artigo .botao { align-self: stretch; }
	.artigo-rodape { flex-direction: column; align-items: flex-start; }
	.compartilhar { margin-left: 0; }
	.autor { flex-direction: column; }
}

@media print {
	.topo, .rodape, .cta, .artigo-lateral, .sumario, .compartilhar, .relacionados { display: none !important; }
	body { background: #fff; color: #000; }
}
