/* Reset básico */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Scroll suave e transições só pra quem não pediu movimento reduzido no SO
   (prefers-reduced-motion) — requisito de acessibilidade (WCAG 2.3.3). */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Compensa o header sticky ao rolar pra uma âncora do sumário do post */
.entry-content h2,
.entry-content h3 {
	scroll-margin-top: 96px;
}

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

/* Header sticky — o position:sticky precisa ficar no wrapper <header
   class="wp-block-template-part"> gerado pelo próprio wp:template-part, não
   no .site-header interno. O sticky só "flutua" dentro da altura do seu pai
   direto; como esse wrapper tem exatamente a mesma altura do header (é um
   wrapper 1:1, sem folga), aplicar sticky no filho não tem espaço pra
   funcionar e o header simplesmente rola com a página. */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

.site-header {
	background: var(--wp--preset--color--primary);
}

.site-header__logo img {
	width: 180px;
	height: auto;
}

/* <main> e <footer> são o 2º e o 3º filho direto de .wp-site-blocks (depois
   do header) e herdam o blockGap padrão do WordPress (margin-block-start)
   como uma faixa vazia revelando a cor de fundo do body entre as seções —
   zerar nos dois. */
.wp-site-blocks > main,
.wp-site-blocks > footer {
	margin-top: 0;
	margin-bottom: 0;
}

.site-header__inner {
	position: relative;
	flex-wrap: nowrap;
}

.site-header__logo {
	flex-shrink: 0;
}

/* Hambúrguer (esquerda) e busca (direita) — sempre visíveis, nos dois lados
   da logo, tanto no desktop quanto no mobile (não é mais condicional a
   overflow/breakpoint como antes). */
.site-header__toggle,
.site-header__search-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	background: none;
	border: 0;
	color: var(--wp--preset--color--white);
	cursor: pointer;
	flex-shrink: 0;
}

.site-header__toggle {
	flex-direction: column;
	gap: 5px;
}

.site-header__toggle span {
	display: block;
	width: 22px;
	height: 2px;
	background: currentColor;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Vira um "X" quando o menu está aberto. */
.site-header.is-nav-open .site-header__toggle span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.site-header.is-nav-open .site-header__toggle span:nth-child(2) {
	opacity: 0;
}

.site-header.is-nav-open .site-header__toggle span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

.site-header__search-toggle svg {
	width: 22px;
	height: 22px;
}

/* Painel do menu — gaveta (drawer) fixa na lateral esquerda, altura cheia da
   tela, escondida fora da viewport até o hambúrguer ser clicado. z-index
   menor que o header.wp-block-template-part (sticky, z-index:100) de
   propósito: o header continua visível por cima do topo da gaveta, então o
   botão (agora em "X") continua clicável pra fechar. */
.site-header__nav {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	margin-top: 0 !important;
	width: min(320px, 85vw);
	z-index: 90;
	background: var(--wp--preset--color--background);
	padding: 40px var(--wp--preset--spacing--3) var(--wp--preset--spacing--3);
	overflow-y: auto;
	box-shadow: 0 0 32px rgba(0, 0, 0, 0.25);
	transform: translateX(-100%);
	transition: transform 0.3s ease;
}

.site-header.is-nav-open .site-header__nav {
	transform: translateX(0);
}

/* Cabeçalho da gaveta (título + botão fechar) — mesma linguagem visual do
   drawer "Categorias" do dock mobile (nv-dock__drawer-head), só que essa
   gaveta abre pela esquerda em vez da direita. */
.site-header__nav-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.site-header__nav-titulo {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-muted);
}

.site-header__nav-fechar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: none;
	border-radius: 50%;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	cursor: pointer;
}

.site-header__nav-fechar svg {
	width: 18px;
	height: 18px;
}

.site-header__nav .wp-block-navigation__container {
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.site-header__nav .wp-block-navigation-item {
	width: 100%;
}

/* Divisor entre os links — mesmo tratamento do nv-dock__categorias. */
.site-header__nav a {
	display: block;
	padding: 14px 0;
	color: var(--wp--preset--color--ink);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--surface);
}

.site-header__nav .wp-block-navigation__container > *:last-child a {
	border-bottom: none;
}

.site-header__nav a:hover {
	color: var(--wp--preset--color--primary);
}

/* Painel de busca — altura fixa de 50vh, largura cheia da janela (não só do
   contentSize do header), começa exatamente onde o header termina (top:100%
   sem gap) e abre com uma animação de cima pra baixo (translateY, não
   display:none/block, que não anima). */
.site-header__search-panel {
	display: flex;
	align-items: center;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	/* Zera o margin-top que o layout "flow" do WordPress aplica entre os
	   filhos de .site-header (mesmo bug recorrente já visto em outras
	   seções) — sem isso, o painel abre com uma folga acima dele. */
	margin-top: 0 !important;
	/* .site-header usa layout "constrained" (contentSize 1440px), que gera
	   um max-width:1440px + margin:auto !important nos filhos diretos — em
	   telas mais largas que 1440px isso sobra como margem lateral visível
	   no painel. Precisa escapar disso pra ser realmente 100% da janela. */
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	height: 50vh;
	background: #0066cc;
	padding: var(--wp--preset--spacing--4);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
	transform: translateY(-100%);
	opacity: 0;
	visibility: hidden;
	transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s linear 0.3s;
}

.site-header.is-search-open .site-header__search-panel {
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
	transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s linear 0s;
}

.site-header__search-form.wp-block-search {
	width: 100%;
	max-width: 680px;
	margin: 0 auto;
}

.site-header__search-form .wp-block-search__inside-wrapper {
	border: 2px solid var(--wp--preset--color--white);
	border-radius: 999px;
	background: var(--wp--preset--color--white);
	overflow: hidden;
}

.site-header__search-form .wp-block-search__input {
	padding: 16px 24px;
	font-size: var(--wp--preset--font-size--lg);
}

.site-header__search-form .wp-block-search__button {
	margin: 4px;
	border-radius: 999px;
}

/* CTA global — usar sempre estas duas classes, nunca criar botão por seção.
   Contexto padrão: fundo escuro. Envolver seções de fundo claro com .on-light
   pra inverter as cores automaticamente.
   Estiliza só o elemento que é a superfície real do botão: o <button>/<a> cru
   (filtro de busca) ou o .wp-block-button__link dentro de um wp:button — o
   <div class="wp-block-button"> é apenas wrapper de layout, sem padding nem
   borda própria (evita o efeito "caixa dentro de caixa"). */
button.btn-primary,
button.btn-secondary,
.wp-block-button.btn-primary .wp-block-button__link,
.wp-block-button.btn-secondary .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.75em 1.5em;
	border-radius: 999px;
	border: 1px solid transparent;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, filter 0.2s ease;
}

button.btn-primary,
.wp-block-button.btn-primary .wp-block-button__link {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--primary);
}

button.btn-primary:hover,
.wp-block-button.btn-primary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

button.btn-secondary,
.wp-block-button.btn-secondary .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--white);
}

button.btn-secondary:hover,
.wp-block-button.btn-secondary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

button.btn-secondary.is-ativo {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

.on-light button.btn-primary,
.on-light .wp-block-button.btn-primary .wp-block-button__link {
	color: var(--wp--preset--color--white);
}

.on-light button.btn-secondary,
.on-light .wp-block-button.btn-secondary .wp-block-button__link {
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
}

.on-light button.btn-secondary:hover,
.on-light .wp-block-button.btn-secondary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}

/* Toolbar: filtro por tipo (à esquerda, só quando há mais de 1 tipo com
   resultado) + busca (à direita), na mesma linha. Sem borda própria — o
   .archive-hero logo acima já fecha com um traço, não precisa de dois. */
.nv-busca-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--2) var(--wp--preset--spacing--5);
	margin-bottom: var(--wp--preset--spacing--5);
}

.nv-busca-toolbar--sem-filtro {
	justify-content: flex-end;
}

.nv-busca-filtro {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--2);
}

.nv-busca-filtro__item {
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	padding: 0.3em 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.nv-busca-filtro__item:hover {
	color: var(--wp--preset--color--ink);
}

.nv-busca-filtro__item.is-ativo {
	color: var(--wp--preset--color--primary);
	border-bottom-color: var(--wp--preset--color--primary);
}

/* Campo de busca — mesmo visual (pill, ícone, campo+botão colados) da busca
   da página 404, só que via formulário clássico (form/input/button próprios),
   já que aqui é gerado direto no pattern PHP, não por um bloco wp:search. */
.nv-busca-campo {
	display: flex;
	flex: 0 1 360px;
	max-width: 360px;
}

.nv-busca-campo__input {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 46px;
	padding: 0 1.2em 0 2.6em;
	border: 1px solid #e7eaed;
	border-right: none;
	border-radius: 999px 0 0 999px;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink);
	background-color: var(--wp--preset--color--white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B6B6B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: 1.05em center;
	background-size: 15px;
	box-shadow: 0 1px 2px rgba(26, 26, 26, 0.05);
}

.nv-busca-campo__input::placeholder {
	color: var(--wp--preset--color--text-muted);
}

.nv-busca-campo__input:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
}

.nv-busca-campo__botao {
	flex-shrink: 0;
	min-height: 46px;
	padding: 0 1.5em;
	border: none;
	border-radius: 0 999px 999px 0;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.nv-busca-campo__botao:hover {
	background: var(--wp--preset--color--secondary);
}

/* Resultado sem correspondência */
.nv-busca-vazio {
	max-width: 640px;
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.55;
}

.nv-busca-vazio a {
	color: var(--wp--preset--color--primary);
}

.nv-busca-lista .is-oculto {
	display: none !important;
}

@media (max-width: 600px) {
	.nv-busca-toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.nv-busca-campo {
		max-width: none;
		flex-basis: auto;
	}
}

/* Banner escuro com o H1 (página interna e archive do blog) */
.page-header {
	text-align: center;
}

/* Grid de posts do blog (archive) */
.blog-grid {
	gap: var(--wp--preset--spacing--3) !important;
}

.post-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--wp--preset--color--surface);
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--white);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.post-card .wp-block-post-featured-image img {
	width: 100%;
	object-fit: cover;
}

.post-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--1);
	padding: var(--wp--preset--spacing--2);
}

/* O blockGap padrão do WordPress (margin-block-start) soma com o gap do flex
   acima, dobrando o espaço entre título/resumo/data — zerar e deixar só o
   gap controlando a distância. */
.post-card__body > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.post-card .wp-block-post-excerpt {
	color: var(--wp--preset--color--text-muted);
}

.post-card .wp-block-post-date {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--text-muted);
}

/* Paginação — números em pill, atual destacado, anterior/próxima discretos */
.wp-block-query-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25em;
	height: 2.25em;
	padding: 0 0.5em;
	border-radius: 6px;
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: none;
}

.wp-block-query-pagination a.page-numbers:hover {
	background-color: var(--wp--preset--color--surface);
	text-decoration: none;
}

.wp-block-query-pagination .page-numbers.current {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-weight: 600;
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
	padding: 0 0.75em;
	height: 2.25em;
	display: inline-flex;
	align-items: center;
	border-radius: 6px;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover {
	background-color: var(--wp--preset--color--surface);
	text-decoration: none;
}

/* Breadcrumb (fallback sem Rank Math — com o plugin ativo, o estilo dele prevalece) */
.nv-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4em;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 12px;
	color: var(--wp--preset--color--text-muted);
}

.nv-breadcrumb li:not(:last-child)::after {
	content: "/";
	margin-left: 0.4em;
	color: var(--wp--preset--color--primary);
}

.nv-breadcrumb a {
	color: var(--wp--preset--color--text-muted);
}

/* Faixa azul do herói (breadcrumb + título + meta) — texto branco por
   herança (backgroundColor/textColor do bloco), mas breadcrumb/meta/links
   têm cor própria fixa em outro lugar (cinza, azul) que precisa de
   sobrescrita pra não sumir num fundo da mesma cor da marca. */
.hero-band {
	padding-bottom: 0;
}

.hero-band .nv-breadcrumb ol,
.hero-band .nv-breadcrumb a {
	color: #fff;
}

.hero-band .nv-breadcrumb li:not(:last-child)::after {
	color: rgba(255, 255, 255, 0.3);
}

.hero-band .nv-breadcrumb a:hover {
	color: var(--wp--preset--color--white);
}

.hero-band h1.wp-block-post-title {
	color: var(--wp--preset--color--white);
}

/* Resumo (excerpt) logo abaixo do H1 */
.hero-band .single-dek {
	margin-top: var(--wp--preset--spacing--2);
	margin-bottom: 20px;
	max-width: 75ch;
}

.hero-band .single-dek .wp-block-post-excerpt__excerpt {
	margin: 0;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.85);
}

/* Legenda/crédito da foto destacada — discreta, sobre a área de papel do
   gradiente (os 20% finais da faixa). */
.single-featured-caption {
	margin: var(--wp--preset--spacing--1) 0 0;
	font-size: 12px;
	color: var(--wp--preset--color--text-muted);
}

.single-meta {
	align-items: center;
	gap: var(--wp--preset--spacing--1) !important;
	margin-top: var(--wp--preset--spacing--2);
	color: rgba(255, 255, 255, 0.75);
	font-size: var(--wp--preset--font-size--sm);
}

.single-meta a {
	color: var(--wp--preset--color--white);
}

.single-meta .wp-block-avatar {
	margin: 0;
}

.single-meta .wp-block-avatar img {
	border-radius: 50%;
	display: block;
	border: 2px solid rgba(255, 255, 255, 0.35);
}

.single-meta__dot {
	margin: 0;
	color: rgba(255, 255, 255, 0.35);
}

.single-meta__category {
	font-weight: 700;
}

/* Mount azul atrás da imagem destacada — a imagem já nasce em 16:9 real
   (1200x675, tamanho "google-news"), então aspect-ratio não entra em conflito
   com altura fixa (não há max-height aqui, ver armadilha de aspect-ratio +
   max-height documentada na skill). O padding no mount revela a cor de fundo
   como uma moldura, mesmo quando a tela é exatamente 1200px de largura. */
/* Faixa do herói contém header (breadcrumb/título/meta) E a imagem
   destacada na mesma seção. O gradiente 80%/80% faz o fundo trocar de azul
   pro tom de papel do conteúdo nos últimos 20% da altura — como a imagem é
   o último elemento, a parte de baixo dela "vaza" pra fora da faixa azul. */
.hero-band.has-accent-background-color {
	background-color: #0066cc !important;
	background-image: linear-gradient(to bottom, #0066cc 80%, #faf8f3 80%);
}

.single-featured-image {
	margin: 0;
}

/* A imagem propositalmente "vaza" 24px pra fora do mount de cada lado (em
   vez de ficar do tamanho exato da faixa azul) — largura relativa ao próprio
   pai via calc(), nunca um valor de overflow negativo fixo em px absoluto,
   pra não arriscar ultrapassar a borda da viewport em telas menores. Acima
   de ~900px de largura só; abaixo disso a imagem volta a ocupar 100% do
   mount, sem vazamento (evita scroll horizontal em mobile/tablet). */
.single-featured-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 1rem;
}

@media (min-width: 900px) {
	.single-featured-image img {
		width: calc(100% + 48px);
		max-width: none;
		margin-left: -24px;
	}
}

/* Banner de anúncio (navival-banner-ads) — sem background próprio (o
   criativo já traz sua própria arte), só limitado a 980px e centralizado.
   Altura máxima 180px: como o plugin força width:100%/height:auto na
   imagem, é preciso trocar pra width:auto + max-height pra limitar pela
   altura sem que a largura force um estouro. */
.navbanners-slot {
	margin-block-start: 0 !important;
}

/* Dentro da barra lateral (sumário do post ou "Publicidade" das singles de
   Edital/Jornal), o banner vem depois de outro módulo (compartilhar ou o
   rótulo "Publicidade") — precisa de respiro próprio acima dele, já que
   .navbanners-slot zera esse espaço por padrão (ver comentário acima). */
.single-toc .navbanners-slot,
.archive-aside .navbanners-slot {
	margin-top: var(--wp--preset--spacing--3) !important;
}

/* O próprio banner nunca deixa espaço sobrando abaixo dele antes da
   próxima seção — mesmo bug recorrente de block-gap do WordPress, aqui
   aplicado ao elemento que vem DEPOIS do banner (ex.: faixa azul do herói
   das singles, logo após o banner do topo). */
.navbanners-slot + * {
	margin-top: 0 !important;
}

.navbanners-wrap {
	padding: 10px 0;
	text-align: center;
}

.navbanners-wrap img {
	width: auto !important;
	max-width: min(980px, 100%);
	max-height: 180px;
	margin: 0 auto;
	border-radius: 8px;
}

/* Banner dentro do conteúdo das singles (sumário do post e "Publicidade"
   de Edital/Jornal) — ocupa 100% da coluna (não é full-bleed de tela como
   o do topo, então mantém canto arredondado) em vez de ficar centralizado
   e mais estreito que a coluna por causa do limite de altura. */
.single-toc .navbanners-wrap img,
.archive-aside .navbanners-wrap img {
	width: 100% !important;
	max-width: 100%;
	height: auto;
	max-height: none;
	margin: 0;
	border-radius: 8px;
}

/* Coluna de leitura do post — largura máxima 680px dentro do grid de duas
   colunas (sumário + conteúdo). O grid já dá minmax(0, 1fr) de sobra; sem
   esse limite o texto esticaria até preencher todo o espaço disponível. */
.single-body {
	max-width: 680px;
}

/* Compartilhar — rótulo numa linha própria, ícones alinhados na linha de
   baixo (flex-basis:100% no rótulo força a quebra dentro do mesmo flex). */
.nv-compartilhar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: var(--wp--preset--spacing--2);
}

.nv-compartilhar__label {
	flex-basis: 100%;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-muted);
	margin-bottom: 2px;
}

.nv-compartilhar__icone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid #e7eaed;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--text-muted);
	cursor: pointer;
	transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.nv-compartilhar__icone svg {
	width: 18px;
	height: 18px;
}

.nv-compartilhar__icone:hover {
	color: var(--wp--preset--color--white);
	background-color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
}

.nv-compartilhar__icone.is-copiado {
	color: var(--wp--preset--color--white);
	background-color: var(--wp--preset--color--accent);
}

/* Bloco do breadcrumb / título / grid do post — largura fixa (1280px) e
   alinhados à esquerda em vez de centralizados: o layout "constrained" do
   WordPress aplica max-width + margin-inline:auto nos filhos diretos do
   grupo; zerar só a margem esquerda mantém o limite de largura e empurra o
   conteúdo pra esquerda, alinhado entre as três seções do template. */
.single-shell.is-layout-constrained > * {
	margin-left: 0 !important;
}

/* Layout de duas colunas: conteúdo à esquerda, sumário fixo à direita.
   max-width direto aqui (não só via contentSize do bloco) é essencial: o
   WordPress só limita a largura dos FILHOS do grupo constrained, não do
   próprio grupo — e como este mesmo elemento também é o container do CSS
   Grid, o cálculo de "1fr" usaria a largura cheia do <main> (sem limite)
   pra distribuir as colunas, empurrando a coluna fixa de 240px (sumário)
   muito além da borda da tela e causando scroll horizontal. */
.single-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 264px;
	gap: var(--wp--preset--spacing--3);
	align-items: start;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

/* Os filhos do grid (conteúdo e sumário) herdam o blockGap padrão do
   WordPress como margin-block-start — dentro de um grid isso vira um
   deslocamento extra no topo da célula (o espaçamento aqui é do gap do
   próprio grid), desalinhando conteúdo e sumário entre si. */
.single-layout > * {
	margin-block-start: 0;
}

.single-toc {
	order: 2;
	/* Itens de grid/flex têm min-width:auto implícito (usa o min-content do
	   conteúdo como piso), o que pode alargar essa coluna além dos 240px
	   fixos do grid-template-columns se o conteúdo interno for largo. Fixar
	   width/max-width aqui também, direto no elemento — min-width:0 sozinho
	   só corrige o cálculo do TRACK do grid, não impede o próprio elemento
	   de continuar maior que 240px se algum filho interno não quebrar linha. */
	min-width: 0;
	width: 264px;
	max-width: 264px;
	position: sticky;
	top: calc(var(--wp--preset--spacing--3) + 88px);
	border-left: 2px solid var(--wp--preset--color--surface);
	padding-left: var(--wp--preset--spacing--2);
}

.single-body {
	order: 1;
}

.single-toc__label {
	display: block;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
	margin-bottom: var(--wp--preset--spacing--1);
	/* summary do <details>: sem o marcador nativo; no desktop o clique fica
	   desativado (o sumário é sempre aberto — o JS garante o estado). */
	list-style: none;
	pointer-events: none;
	cursor: default;
}

.single-toc__label::-webkit-details-marker {
	display: none;
}

.single-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6em;
}

.single-toc__list a {
	display: block;
	font-family: var(--wp--preset--font-family--body);
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.3;
	text-decoration: none;
	transition: color 0.2s ease;
}

.single-toc__list a:hover {
	color: var(--wp--preset--color--primary);
}

.single-toc__list .is-active > a {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}

.single-toc__list .single-toc__sub {
	padding-left: 1em;
}

.single-toc__toc.is-empty {
	display: none;
}

.single-toc .nv-compartilhar {
	margin-top: var(--wp--preset--spacing--3);
	padding-top: var(--wp--preset--spacing--2);
	border-top: 1px solid var(--wp--preset--color--surface);
}

.single-toc__toc.is-empty + .nv-compartilhar {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}

@media (max-width: 900px) {
	.single-layout {
		grid-template-columns: 1fr;
	}

	/* Sumário ANTES do conteúdo no mobile (order:-1 inverte a ordem do
	   desktop, onde ele fica à direita), sem a caixa do aside — o <details>
	   vira o próprio cartão expansível. */
	.single-toc {
		order: -1;
		position: static;
		width: 100%;
		max-width: none;
		border-left: none;
		padding-left: 0;
	}

	/* Compartilhar não acompanha o bloco de navegação no mobile. */
	.single-toc .nv-compartilhar {
		display: none;
	}

	.single-toc__toc {
		background: var(--wp--preset--color--white);
		border: 1px solid #e7eaed;
		border-radius: 8px;
		overflow: hidden;
	}

	/* Summary vira botão de expandir: tocável, com chevron que gira. */
	.single-toc__label {
		pointer-events: auto;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 48px;
		margin: 0;
		padding: 12px 16px;
	}

	.single-toc__label::after {
		content: "";
		width: 14px;
		height: 14px;
		flex-shrink: 0;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 9 12 16.5 19.5 9' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%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'%3E%3Cpath d='M4.5 9 12 16.5 19.5 9' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
		transition: transform 0.2s ease;
	}

	.single-toc__toc[open] .single-toc__label::after {
		transform: rotate(180deg);
	}

	.single-toc__list {
		padding: 4px 16px 16px;
	}
}

/* Box do autor, ao final do conteúdo — grid de 2 colunas: no desktop o
   avatar ocupa as duas linhas (rótulo/nome na 1ª, bio na 2ª, ambos na
   coluna da direita); no mobile o avatar divide a 1ª linha com o
   rótulo/nome e a bio desce pra uma linha própria em largura total.
   display:grid com !important pra vencer o display:flex que o WordPress
   gera pro layout do bloco. */
.author-box {
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	column-gap: var(--wp--preset--spacing--2);
	row-gap: 4px;
	margin-top: var(--wp--preset--spacing--6) !important;
	padding: var(--wp--preset--spacing--3);
	border: 1px solid var(--wp--preset--color--surface);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
}

.author-box .wp-block-avatar {
	grid-row: 1 / span 3;
	margin: 0;
}

/* Links do autor (site + redes) na coluna do texto, abaixo da bio. */
.author-box__links {
	grid-column: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: var(--wp--preset--spacing--1);
}

.author-box__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--white);
	border: 1px solid #ebebee;
	transition: background 0.2s ease, color 0.2s ease;
}

.author-box__link:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

.author-box__link svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
}

.author-box__meta > * {
	margin-block-start: 0;
}

@media (max-width: 782px) {
	.author-box .wp-block-avatar {
		grid-row: 1;
	}

	.author-box .wp-block-avatar img {
		width: 56px;
		height: 56px;
	}

	.author-box .wp-block-post-author-biography {
		grid-column: 1 / -1;
		margin-top: var(--wp--preset--spacing--1);
	}

	.author-box__links {
		grid-column: 1 / -1;
	}
}

.author-box .wp-block-avatar img {
	border-radius: 50%;
}

.author-box__label {
	margin: 0 !important;
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-muted);
}

.author-box .wp-block-post-author-name {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	margin-top: 0.2em;
}

/* Nome do autor linka pro arquivo de autor (sinal E-E-A-T) — visual de
   nome, não de link: cor de texto, sublinha só no hover. */
.author-box .wp-block-post-author-name a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.author-box .wp-block-post-author-name a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.author-box .wp-block-post-author-biography {
	margin-top: 0.4em;
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--sm);
}

/* ==========================================================================
   Home (front-page.html) — hero com as 3 notícias mais recentes
   ========================================================================== */

.hero-noticias__titulo {
	margin: 0 0 var(--wp--preset--spacing--3);
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: normal;
	text-align: center;
}

/* Hero — wp:query nativo (3 posts, sem inherit), com wp:post-template
   gerando a MESMA marcação pros 3 itens (imagem + título). O grid
   assimétrico (1 grande + 2 pequenas empilhadas) é só CSS, via nth-child no
   próprio <li> do post-template — nenhum HTML diferente por item, então o
   loop inteiro fica editável pelos controles nativos de Query no inspector
   (tipo de post, ordenar por, itens por página etc.), sem PHP nenhum. */
.hero-grid .wp-block-post-template {
	display: grid;
	grid-template-columns: 2.5fr 2fr;
	grid-template-rows: repeat(2, 1fr);
	gap: var(--wp--preset--spacing--4);
	/* 425px = altura pra bater 16:9 exatamente na coluna principal (2.5fr),
	   calculada na largura de referência do container (1440px, menos padding
	   e gap). Valor fixo por causa da dependência circular explicada abaixo,
	   em vez de aspect-ratio direto nas duas linhas do grid. */
	min-height: 425px;
}

.hero-grid .wp-block-post-template > li:first-child {
	grid-column: 1;
	grid-row: 1 / 3;
}

.hero-grid__card {
	height: 100%;
	/* Grid/flex items têm min-height:auto implícito, que impede o item de
	   encolher abaixo do conteúdo (o texto do título "empurra" a linha do
	   grid pra ficar maior que os 194px calculados abaixo). Zerar aqui faz
	   o card respeitar de fato a altura da linha do grid. */
	min-height: 0;
}

.hero-grid .wp-block-post-template > li {
	min-height: 0;
	/* O <ul> do post-template tem a classe "is-layout-flow" do WordPress, que
	   aplica um margin-top automático (--wp--style--block-gap) em cada item
	   além do primeiro — some com o "gap" do nosso grid, deixando cada linha
	   24px mais alta do que a imagem realmente preenche. */
	margin-top: 0 !important;
}

/* Item 1 (principal): imagem full-bleed com degradê escuro e título
   sobreposto em branco. */
.hero-grid .wp-block-post-template > li:first-child .hero-grid__card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 425px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__thumb {
	position: absolute;
	inset: 0;
	margin: 0;
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* O link da imagem (isLink:true do post-featured-image) só envolve o <img>;
   forçar display:block + 100% garante que ele cubra o card inteiro (o
   figure já é inset:0), não só o retângulo exato da foto. */
.hero-grid .wp-block-post-template > li:first-child .hero-grid__thumb a {
	display: block;
	width: 100%;
	height: 100%;
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__card:hover .hero-grid__thumb img {
	transform: scale(1.05);
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__card::after {
	content: '';
	position: absolute;
	inset: 0;
	/* Sem isso, o degradê (que fica por cima na ordem de pintura) rouba o
	   clique do link da imagem por baixo — só o título (com z-index próprio)
	   permanecia clicável, dando a impressão de que só o texto tinha link. */
	pointer-events: none;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0) 65%);
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__titulo {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: var(--wp--preset--spacing--4);
	font-size: 32px;
	line-height: 1.2;
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__titulo a {
	color: var(--wp--preset--color--white);
	text-decoration: none;
}

/* Itens 2 e 3 (secundários): imagem pequena ao lado do título, empilhados na
   coluna estreita. */
.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__card {
	display: flex;
	align-items: stretch;
	gap: var(--wp--preset--spacing--3);
}

.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__thumb {
	display: block;
	flex-shrink: 0;
	/* Proporção 16:9, com a altura preenchendo exatamente metade da altura do
	   card em destaque (425px, ele também 16:9 — ver comentário no
	   .wp-block-post-template acima), descontando o gap entre as duas linhas —
	   valor fixo em vez de height:100% pra evitar dependência circular entre
	   o dimensionamento do grid (linhas 1fr) e a altura em % do item flex,
	   que faz o navegador cair no tamanho intrínseco da imagem e estourar a
	   coluna. */
	width: calc((425px - var(--wp--preset--spacing--4)) / 2 * 16 / 9);
	height: calc((425px - var(--wp--preset--spacing--4)) / 2);
	margin: 0;
	border-radius: 10px;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
}

.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__card:hover .hero-grid__thumb img {
	transform: scale(1.05);
}

.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__titulo {
	align-self: center;
	margin: 0;
	display: -webkit-box;
	min-height: 0;
	min-width: 0;
	font-size: var(--wp--preset--font-size--h-4);
	line-height: 1.3;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.hero-grid__titulo {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
}

.hero-grid__card:hover .hero-grid__titulo a {
	color: var(--wp--preset--color--accent);
}

/* Modo manchete única: só o Destaque 1, em coluna única (o card principal já
   é o :first-child grande; aqui ele passa a ocupar a largura toda). */
.hero-grid--manchete .wp-block-post-template {
	grid-template-columns: 1fr;
	grid-template-rows: auto;
	/* Full-bleed: escapa o container constrained (e o padding lateral do
	   .home-hero-wrap) pra ocupar a largura toda da viewport. */
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Box da manchete: 16:9, full width, sem cantos arredondados. */
.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__card {
	min-height: 0;
	aspect-ratio: 16 / 9;
	border-radius: 0;
}

/* O max-width fica SÓ no texto (não no card). Título e resumo alinhados pela
   MESMA borda esquerda (ancorada no conteúdo da home), com larguras diferentes:
   título até 60%, resumo até 50%. */
.hero-grid.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__titulo {
	width: 100%;
	max-width: 60%;
	margin-left: max(var(--wp--preset--spacing--4), calc((100vw - 1440px) / 2));
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}

.hero-grid.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__resumo {
	width: 100%;
	max-width: 50%;
	margin-left: max(var(--wp--preset--spacing--4), calc((100vw - 1440px) / 2));
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}

/* Resumo overlaid abaixo do título, só na manchete única e só no desktop — o
   modo 3 nem chega a renderizar o resumo (ver nv_hero_card_html). Fica escondido
   por padrão; a regra do :first-child abaixo é que o liga. */
.hero-grid__resumo {
	display: none;
}

/* Na maioria dos casos o título é o ÚLTIMO elemento do card, então ele fica com
   o padding de baixo inteiro que a regra base já dá (spacing--4). Só na manchete
   única no desktop vem um resumo embaixo dele: aí o 8px vira o respiro entre os
   dois e quem paga o padding de baixo do card é o resumo.
   O 8px era global aqui e sobrou colando o título na borda quando o resumo saiu
   do modo 3 — por isso agora está preso ao caso que o justifica. */
@media (min-width: 901px) {
	.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__titulo {
		padding-bottom: 8px;
	}
}

.hero-grid .wp-block-post-template > li:first-child .hero-grid__resumo {
	display: -webkit-box;
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0 var(--wp--preset--spacing--4) var(--wp--preset--spacing--4);
	max-width: 820px;
	color: var(--wp--preset--color--white);
	font-size: 16px;
	line-height: 1.5;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media (max-width: 900px) {
	/* Abaixo de 900px o card fica estreito, o título quebra em mais linhas e o
	   bloco de texto sobe pra fora do degradê — a letra branca perderia o fundo
	   escuro. Some com o resumo e o título volta pra faixa escura. Mesmo corte
	   do empilhamento do hero, que é onde o card muda de caráter. */
	.hero-grid .wp-block-post-template > li:first-child .hero-grid__resumo {
		display: none;
	}

	.hero-grid .wp-block-post-template {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.hero-grid .wp-block-post-template > li:first-child {
		grid-row: auto;
	}

	.hero-grid .wp-block-post-template > li:first-child .hero-grid__card {
		/* Abaixo de 900px o card em destaque empilha sozinho (grid-row:auto),
		   sem dividir linha com os cards secundários — sem a dependência
		   circular do desktop, dá pra usar aspect-ratio de verdade em vez de
		   um min-height fixo. */
		min-height: 0;
		aspect-ratio: 16 / 9;
	}
}

@media (max-width: 600px) {
	/* Card em destaque: imagem sangra até a borda da tela (sem padding
	   lateral da .home-hero-wrap) e perde o border-radius. */
	.hero-grid .wp-block-post-template > li:first-child .hero-grid__card {
		margin-left: -20px;
		margin-right: -20px;
		width: calc(100% + 40px);
		border-radius: 0;
	}

	/* Modo manchete no mobile: desfaz a sangria da regra acima. A <ul> do modo
	   manchete JÁ é full-bleed (100vw + margens negativas), então o card sangrar
	   de novo sangrava duas vezes. Somado ao min-width:auto do item de grid — que
	   deixa o conteúdo empurrar a track de 1fr — o li ia a 716px dentro de uma ul
	   de 390px e a página ganhava scroll horizontal (scrollWidth 736 x 390).
	   O min-width:0 corta a dependência; o resto devolve o card à largura da tela. */
	.hero-grid--manchete .wp-block-post-template > li {
		min-width: 0;
	}

	.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__card {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	/* O título a 60% e ancorado no grid de 1440px é regra de desktop: no celular
	   viraria uma coluna de ~230px. Volta pra largura cheia com o padding padrão. */
	.hero-grid.hero-grid--manchete .wp-block-post-template > li:first-child .hero-grid__titulo {
		max-width: 100%;
		margin-left: 0;
		padding-left: 20px;
		padding-right: 20px;
	}

	.hero-grid .wp-block-post-template > li:first-child .hero-grid__titulo {
		padding-left: 20px;
		padding-right: 20px;
		font-size: var(--wp--preset--font-size--h-3);
	}

	/* Itens 2 e 3: imagem em cima, título embaixo (empilhado). */
	.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__card {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__thumb {
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
	}

	.hero-grid .wp-block-post-template > li:nth-child(n+2) .hero-grid__titulo {
		align-self: center;
		width: 100%;
		padding: 16px 0 0;
	}
}

/* Home (front-page.html) — grid "Últimas notícias" logo abaixo do Hero.
   Fundo full-width de propósito: fica fora do grupo constrained de 1200px
   do Hero, como irmão direto do <main>, senão a cor não sangraria até a
   borda da tela. */
.ultimas-noticias {
	/* Zera o margin-top que o layout "flow" do WordPress aplica entre blocos
	   irmãos (--wp--style--block-gap) — mesmo ajuste já feito em
	   .home-categorias e .ensino-superior. */
	margin-top: 0 !important;
	background-color: #fff;
	padding: 60px var(--wp--preset--spacing--3);
}

.ultimas-noticias__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

/* O grid de 3 colunas de verdade é gerado pelo próprio wp:post-template
   (columnCount:3, vira uma classe wp-container-core-post-template-is-layout-*
   com grid-template-columns já correto) — essa classe aqui, no wp:query
   (elemento pai, com um único filho de verdade que é a <ul>), só define o
   gap. Declarar display:grid + grid-template-columns aqui de novo faria
   esse pai virar um grid de 3 colunas com 1 item só (a <ul> inteira),
   espremendo os cards reais em 1/3 da largura. */
.ultimas-noticias__grid .wp-block-post-template {
	gap: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
}

.ultimas-noticias__card {
	display: block;
	text-decoration: none;
}

/* Só o texto (categoria/data + título) recebe padding lateral — a imagem
   continua ocupando a largura cheia da célula do grid, mais larga que o
   bloco de texto abaixo dela. */
.ultimas-noticias__corpo {
	/* Zera o margin-top automático do block-gap do WordPress (24px) — sem
	   isso ele "vence" o margin-bottom de 16px do .ultimas-noticias__thumb
	   acima (margens verticais adjacentes colapsam pelo maior valor), e o
	   espaço visível fica 24px em vez dos 16px pretendidos. */
	margin-top: 0 !important;
	display: block;
	padding: 0 15px;
}

.ultimas-noticias__thumb {
	display: block;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: var(--wp--preset--spacing--2);
	background: var(--wp--preset--color--surface);
}

.ultimas-noticias__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.ultimas-noticias__card:hover .ultimas-noticias__thumb img {
	transform: scale(1.05);
}

/* wp:post-terms e wp:post-date nativos, lado a lado (layout flex do próprio
   bloco pai) — o "·" entre os dois vem de um ::before no segundo item, não
   de um caractere literal no HTML, já que são dois blocos dinâmicos
   separados, não um texto único como antes. */
.ultimas-noticias__kicker {
	/* Categoria e data SEMPRE na mesma linha, lado a lado (pedido do cliente).
	   nowrap segura os dois juntos; se um post tiver categoria muito longa (ou
	   2+ categorias) e não couber, é a categoria que trunca com "…" — a data
	   fica sempre visível (flex-shrink:0 nela). !important pra vencer o flexWrap
	   inline do bloco. */
	flex-wrap: nowrap !important;
	white-space: nowrap;
	align-items: center;
	gap: 6px;
	margin-bottom: 6px;
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.06em;
}

.ultimas-noticias__kicker .wp-block-post-terms {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ultimas-noticias__kicker .wp-block-post-date {
	flex-shrink: 0;
}

.ultimas-noticias__kicker .wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}

.ultimas-noticias__kicker .wp-block-post-date::before {
	content: "·";
	margin-right: 6px;
}

.ultimas-noticias__titulo {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 18px;
	line-height: 1.3;
}

.ultimas-noticias__titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	transition: color 0.2s ease;
}

.ultimas-noticias__card:hover .ultimas-noticias__titulo a {
	color: var(--wp--preset--color--primary);
}

.ultimas-noticias__botao-wrap {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

@media (max-width: 900px) {
	.ultimas-noticias__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.ultimas-noticias__grid {
		grid-template-columns: 1fr;
	}

	/* Espaço entre uma notícia e a próxima — 24px no mobile em vez dos 48px
	   de desktop, mesmo padrão já usado no arquivo/categoria. */
	.ultimas-noticias__grid .wp-block-post-template {
		gap: 24px;
	}

	.ultimas-noticias__corpo {
		padding-left: 0;
		padding-right: 0;
	}
}

/* Home (front-page.html) — editorias, logo abaixo do grid "Últimas notícias".
   As pills (.pagina-404__categorias/.pagina-404__categoria) já têm o visual
   pronto — só o fundo da seção é próprio daqui. */
.home-categorias {
	/* Zera o margin-top que o layout "flow" do WordPress aplica entre blocos
	   irmãos (--wp--style--block-gap) — essa seção já tem respiro próprio
	   via padding, não precisa somar mais um em cima. */
	margin-top: 0 !important;
	padding: 40px var(--wp--preset--spacing--3);
	background-color: var(--wp--preset--color--background);
}

.home-categorias__inner {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

/* Menu de Navegação nativo (Aparência → Editor → Navegação → "Editorias —
   home") — mesmo visual de pill já usado na 404, mas aqui o conteúdo (quais
   categorias aparecem e em que ordem) é 100% editável pelo usuário via UI,
   sem depender de código. Centralizado no desktop, à esquerda no responsivo. */
.home-categorias-nav.wp-block-navigation {
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
}

@media (max-width: 600px) {
	/* !important pra vencer o padding inline do bloco (style="padding-top:...")
	   — no mobile, o respiro de topo/entre seções da home fica bem menor. */
	.home-hero-wrap {
		padding-top: 20px !important;
		padding-right: 20px !important;
		padding-bottom: var(--wp--preset--spacing--5) !important;
		padding-left: 20px !important;
	}

	.ultimas-noticias {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}

	.home-categorias {
		padding-top: var(--wp--preset--spacing--4);
		padding-bottom: var(--wp--preset--spacing--4);
	}

	.home-categorias-nav.wp-block-navigation {
		justify-content: flex-start;
	}
}

/* Home (front-page.html) — "Ensino Superior" (Univale). O conteúdo em si
   (título, vídeo, texto/botão e as 2 notícias da tag Univale) vive num bloco
   reutilizável sincronizado ("Home — Ensino Superior (Univale)", editável em
   Aparência → Padrões) — aqui só o wrapper full-width com fundo branco. */
.ensino-superior {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: #fff;
}

.ensino-superior__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.ensino-superior__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.ensino-superior__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.ensino-superior__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.ensino-superior__colunas.wp-block-columns {
	gap: var(--wp--preset--spacing--3);
}

/* Vídeo + botão como um card único (cantos arredondados só no card como um
   todo — o vídeo fica reto embaixo, o botão vira uma barra colada nele). */
.ensino-superior__video-card {
	border-radius: 12px;
	overflow: hidden;
}

.ensino-superior__video-card .wp-block-embed {
	margin: 0;
}

.ensino-superior__video-btn-wrap {
	margin: 0;
}

/* width:100% no link (<a>) sozinho não basta — o próprio .wp-block-button
   (div pai, item do flex de .wp-block-buttons) só ocupa a largura do
   conteúdo por padrão, então "100%" dele vira 100% de um espaço já
   encolhido. Precisa esticar o próprio wrapper também. */
.ensino-superior__video-btn.wp-block-button {
	width: 100%;
}

.ensino-superior__video-btn.wp-block-button .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 14px;
	border-radius: 0;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: normal;
	text-transform: none;
}

.ensino-superior__video-btn.wp-block-button .wp-block-button__link::before {
	content: '';
	display: block;
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M23.5 6.2c-.3-1.1-1.1-1.9-2.2-2.2C19.4 3.5 12 3.5 12 3.5s-7.4 0-9.3.5c-1.1.3-1.9 1.1-2.2 2.2C0 8.1 0 12 0 12s0 3.9.5 5.8c.3 1.1 1.1 1.9 2.2 2.2 1.9.5 9.3.5 9.3.5s7.4 0 9.3-.5c1.1-.3 1.9-1.1 2.2-2.2.5-1.9.5-5.8.5-5.8s0-3.9-.5-5.8zM9.6 15.6V8.4l6.4 3.6-6.4 3.6z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.ensino-superior__video-btn.wp-block-button .wp-block-button__link:hover {
	background: var(--wp--preset--color--secondary);
}

.ensino-superior__coluna-noticia .wp-block-post-featured-image {
	margin: 0 0 var(--wp--preset--spacing--2);
	border-radius: 10px;
	overflow: hidden;
}

.ensino-superior__coluna-noticia .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.ensino-superior__coluna-noticia .wp-block-post-template > li:hover .wp-block-post-featured-image img {
	transform: scale(1.05);
}

.ensino-superior__noticia-titulo {
	margin: 0 0 4px;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--h-4);
	line-height: 1.3;
}

.ensino-superior__noticia-titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.ensino-superior__noticia-titulo a:hover {
	color: var(--wp--preset--color--primary);
}

.ensino-superior__noticia-data {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--text-muted);
}

@media (max-width: 782px) {
	.ensino-superior__colunas.wp-block-columns {
		flex-wrap: wrap;
	}

	.ensino-superior__coluna-video,
	.ensino-superior__coluna-noticia {
		flex-basis: 100% !important;
	}
}

@media (max-width: 600px) {
	.ensino-superior {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}
}

/* ==========================================================================
   Home (front-page.html) — "Colunistas". Grid nativo (wp:query, categoria
   "Colunistas", id 8) + lista lateral de todos os colunistas (shortcode,
   sem equivalente nativo pra listar usuários por papel).
   ========================================================================== */

.colunistas {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: var(--wp--preset--color--background);
}

.colunistas__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.colunistas__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.colunistas__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.colunistas__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.colunistas__colunas.wp-block-columns {
	gap: var(--wp--preset--spacing--4);
}

.colunistas__grid .wp-block-post-template {
	gap: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
}

.colunistas__card {
	display: block;
}

.colunistas__thumb {
	display: block;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: var(--wp--preset--spacing--2);
	background: var(--wp--preset--color--surface);
}

/* Mesmo bug do .ultimas-noticias__corpo: sem zerar, o margin-top automático
   do block-gap (24px) colapsa com o margin-bottom de 16px do thumb acima e
   vence por ser maior, deixando o espaço visível em 24px em vez de 16px. */
.colunistas__corpo {
	margin-top: 0 !important;
}

.colunistas__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.colunistas__card:hover .colunistas__thumb img {
	transform: scale(1.05);
}

.colunistas__kicker {
	/* Mesmo motivo do .ultimas-noticias__kicker: sem isso, em telas bem
	   estreitas os itens espremem e quebram em vários pedaços em vez de
	   simplesmente descer de linha. */
	flex-wrap: wrap !important;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
}

.colunistas__kicker-avatar.wp-block-avatar {
	flex-shrink: 0;
	margin: 0;
}

.colunistas__kicker-avatar.wp-block-avatar img {
	display: block;
	border-radius: 50%;
}

.colunistas__kicker .wp-block-post-author-name a,
.colunistas__kicker .wp-block-post-date {
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	text-decoration: none;
}

.colunistas__selo {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 999px;
	background: #f2b705;
	color: var(--wp--preset--color--ink);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.colunistas__card-titulo {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--h-4);
	line-height: 1.3;
}

.colunistas__card-titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.colunistas__card:hover .colunistas__card-titulo a {
	color: var(--wp--preset--color--primary);
}

/* Grid de retratos: foto circular grande com o nome numa pastilha
   sobrepondo a borda inferior do círculo — mesma lógica de "crachá de
   colunista" pedida como referência, com as cores nativas do tema
   (banner-tint/primary) em vez das cores literais da referência. */
.colunistas__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 14px 8px;
}

.colunistas__lista-item a {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
}

.colunistas__lista-foto {
	display: block;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	overflow: hidden;
	transition: transform 0.25s ease;
}

.colunistas__lista-avatar {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.colunistas__lista-item a:hover .colunistas__lista-foto {
	transform: scale(1.05);
}

.colunistas__lista-nome {
	position: relative;
	z-index: 1;
	margin-top: -18px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--wp--preset--color--banner-tint);
	color: var(--wp--preset--color--primary);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.15;
	max-width: 100%;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.colunistas__lista-item a:hover .colunistas__lista-nome {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

@media (max-width: 480px) {
	.colunistas__lista-foto {
		width: 88px;
		height: 88px;
	}

	.colunistas__lista-nome {
		padding: 5px 12px;
		font-size: 12px;
	}
}

@media (max-width: 782px) {
	.colunistas__colunas.wp-block-columns {
		flex-wrap: wrap;
	}

	.colunistas__coluna-grid,
	.colunistas__coluna-lista {
		flex-basis: 100% !important;
	}

	.colunistas__grid .wp-block-post-template {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.colunistas {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}
}

/* ==========================================================================
   Home (front-page.html) — "As mais lidas". Grid de 6 matérias com
   marcador numérico de ranking, fonte de dados em nv_mais_lidas_home_html()
   (inc/populares.php) — GA4 com fallback pro contador interno.
   ========================================================================== */

.mais-lidas-home {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: var(--wp--preset--color--background);
}

.mais-lidas-home__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.mais-lidas-home__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.mais-lidas-home__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.mais-lidas-home__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.mais-lidas-home__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
}

/* Sem box, sem fundo — o card é só o conteúdo (número + imagem + título)
   flutuando direto sobre o fundo da seção. */
.mais-lidas-home__card {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	/* Sem isso, o item de grid herda min-width:auto implícito — o tamanho
	   "natural" do título dentro do flex impede a coluna de encolher abaixo
	   dele, e o grid estoura a largura do container (mesmo bug de
	   min-height:auto já visto em .hero-grid__card, só que na horizontal). */
	min-width: 0;
	text-decoration: none;
}

/* Número grande e fino (fonte de corpo, não a de título — é a única com
   peso 400 disponível no projeto), alinhado ao topo da imagem ao lado. */
.mais-lidas-home__numero {
	flex-shrink: 0;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	font-size: 48px;
	line-height: 1;
	color: var(--wp--preset--color--ink);
}

.mais-lidas-home__thumb {
	display: block;
	flex-shrink: 0;
	width: 120px;
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
}

.mais-lidas-home__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mais-lidas-home__corpo {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.mais-lidas-home__card-titulo {
	margin: 0;
	min-width: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
	display: -webkit-box;
	/* 2 linhas com reticências no desktop/tablet (cards estreitos em grid);
	   no mobile (1 coluna, mais largura) sobe pra 3 — ver @media abaixo. */
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.mais-lidas-home__card:hover .mais-lidas-home__card-titulo {
	color: var(--wp--preset--color--primary);
}

.mais-lidas-home__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: var(--wp--preset--font-size--xs);
}

.mais-lidas-home__kicker {
	color: var(--wp--preset--color--primary);
	font-weight: 700;
}

/* Ponto separador entre categoria e data, só quando as duas existem. */
.mais-lidas-home__kicker + .mais-lidas-home__data::before {
	content: '·';
	margin-right: 6px;
	color: var(--wp--preset--color--text-muted);
}

.mais-lidas-home__data {
	color: var(--wp--preset--color--text-muted);
}

@media (max-width: 900px) {
	.mais-lidas-home__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.mais-lidas-home {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}

	.mais-lidas-home__grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	/* Reorganiza o card: número + imagem lado a lado na primeira linha,
	   título/categoria/data numa segunda linha alinhada com a imagem (não
	   com o número, que fica "pendurado" à esquerda das duas linhas). */
	.mais-lidas-home__card {
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-rows: auto auto;
		column-gap: 12px;
		row-gap: 8px;
	}

	.mais-lidas-home__numero {
		grid-column: 1;
		grid-row: 1 / 3;
		align-self: start;
		font-size: 36px;
	}

	.mais-lidas-home__thumb {
		grid-column: 2;
		grid-row: 1;
		width: 100%;
	}

	.mais-lidas-home__corpo {
		grid-column: 2;
		grid-row: 2;
	}

	/* No mobile (1 coluna, título mais largo) cabe 3 linhas. */
	.mais-lidas-home__card-titulo {
		-webkit-line-clamp: 3;
	}
}

/* ==========================================================================
   Home (front-page.html) — seções temáticas por categoria (Esportes,
   Política, Agropecuária...). Reaproveita o mesmo visual do archive-item
   do index.html (imagem 240x160 + corpo), sem o kicker de categoria (já
   redundante, já que a seção inteira é filtrada por uma única categoria).
   ========================================================================== */

.tema-categoria {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: var(--wp--preset--color--background);
}

.tema-categoria__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.tema-categoria__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.tema-categoria__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.tema-categoria__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

/* Duas colunas: lista (reaproveita .archive-item/.archive-aside do
   index.html, mesmo visual do archive de categoria) + publicidade lateral. */
.tema-categoria__layout {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	align-items: start;
	gap: var(--wp--preset--spacing--6);
}

.tema-categoria__botao-wrap {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

@media (max-width: 900px) {
	.tema-categoria__layout {
		grid-template-columns: 1fr;
	}

	.tema-categoria__layout .archive-aside {
		position: static;
		max-width: 320px;
		margin: 0 auto;
	}
}

@media (max-width: 600px) {
	.tema-categoria {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}
}

/* ==========================================================================
   Home (front-page.html) — "Editais" (CPT edital, sem imagem/campos, só
   título + data). Card com cantos arredondados sobre a seção branca, lista
   de títulos com um "chip" de data (dia + mês) no lugar de um selo de data
   comum, no lugar do texto corrido "dd/mm/aaaa" da referência.
   ========================================================================== */

.editais {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: #fff;
}

.editais__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.editais__card {
	background: #f3f3f3;
	border-radius: 28px;
	padding: var(--wp--preset--spacing--6);
}

.editais__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.editais__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.editais__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

/* O <ul> do post-template tem a classe "is-layout-flow" do WordPress, que
   aplica margin-top automático (--wp--style--block-gap) em cada <li> além
   do primeiro — zera aqui pra não somar com o padding/borda do item. */
.editais__lista .wp-block-post-template > li {
	margin-top: 0 !important;
}

.editais__item {
	align-items: center !important;
	justify-content: space-between !important;
	gap: var(--wp--preset--spacing--4) !important;
	padding: 10px 4px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	transition: padding-left 0.2s ease;
}

.editais__lista .wp-block-post-template > li:first-child .editais__item {
	padding-top: 0;
}

.editais__lista .wp-block-post-template > li:last-child .editais__item {
	border-bottom: none;
	padding-bottom: 0;
}

.editais__item:hover {
	padding-left: 8px;
}

.editais__item-titulo {
	margin: 0;
	min-width: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--h-4);
	line-height: 1.35;
}

.editais__item-titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	transition: color 0.2s ease;
}

.editais__item:hover .editais__item-titulo a {
	color: var(--wp--preset--color--primary);
}

.editais__data {
	flex-shrink: 0;
	display: flex;
	flex-direction: row;
	align-items: baseline;
	gap: 4px;
	padding: 7px 16px;
	border-radius: 999px;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--surface);
	transition: border-color 0.2s ease, transform 0.2s ease;
}

.editais__item:hover .editais__data {
	border-color: var(--wp--preset--color--primary);
	transform: translateY(-2px);
}

.editais__data-texto {
	display: block;
	margin: 0;
	color: var(--wp--preset--color--primary);
	font-size: 13px;
	font-weight: 700;
}

.editais__data-texto:last-child::before {
	content: 'de ';
}

.editais__botao-wrap {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

@media (max-width: 600px) {
	.editais {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}

	.editais__card {
		padding: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
		border-radius: 20px;
	}

	.editais__item-titulo {
		font-size: var(--wp--preset--font-size--sm);
	}

	.editais__data {
		padding: 6px 12px;
	}

	.editais__data-texto {
		font-size: 12px;
	}
}

/* ==========================================================================
   Home (front-page.html) — "Jornais" (CPT jornal). Capas verticais em rack,
   como um jornal físico numa banca — 5 por linha no desktop, 2 no mobile.
   ========================================================================== */

.jornais {
	margin-top: 0 !important;
	padding: 60px var(--wp--preset--spacing--3);
	background-color: #fff;
}

.jornais__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.jornais__titulo-wrap {
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	margin-bottom: var(--wp--preset--spacing--5);
}

.jornais__titulo {
	margin: 0;
	white-space: nowrap;
	color: var(--wp--preset--color--ink);
}

.jornais__divisor.wp-block-separator {
	flex: 1 1 auto;
	min-width: 40px;
	margin: 0;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.jornais__grid .wp-block-post-template {
	gap: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
}

.jornais__card {
	display: block;
}

.jornais__capa {
	display: block;
	margin: 0 0 var(--wp--preset--spacing--2);
	aspect-ratio: 3 / 4;
	border-radius: 8px;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
	box-shadow: 0 10px 24px rgba(0, 20, 60, 0.12);
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
}

.jornais__capa img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.jornais__card:hover .jornais__capa {
	transform: translateY(-6px);
	box-shadow: 0 16px 32px rgba(0, 20, 60, 0.18);
}

.jornais__card-titulo {
	margin: 0;
	padding: 0 15px;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.3;
}

.jornais__card-titulo a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.jornais__card:hover .jornais__card-titulo a {
	color: var(--wp--preset--color--primary);
}

.jornais__card-data {
	display: block;
	margin-top: 2px;
	padding: 0 15px;
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--xs);
}

@media (max-width: 900px) {
	/* !important pra vencer o style inline que o próprio bloco post-template
	   gera (grid-template-columns:repeat(5,...)) a partir do columnCount —
	   inline sempre vence regra externa, mesmo dentro de media query. */
	.jornais__grid .wp-block-post-template {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

@media (max-width: 600px) {
	.jornais {
		padding-top: var(--wp--preset--spacing--5);
		padding-bottom: var(--wp--preset--spacing--5);
	}

	.jornais__grid .wp-block-post-template {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 16px 12px !important;
	}
}

/* ==========================================================================
   Arquivo (index.html) — cabeçalho + listagem de duas colunas
   ========================================================================== */

/* Cabeçalho: mesma linguagem visual da faixa azul do single (H1 + resumo em
   branco sobre o accent do projeto). */
/* Cabeçalho editorial, quieto — sem faixa colorida. Vive no MESMO container
   de 1200px da listagem (não é mais um grupo full-bleed à parte), então H1
   e a lista compartilham a mesma margem esquerda automaticamente. O acento
   de marca fica só no traço curto abaixo do título, não na página toda. */
.archive-hero {
	margin-block-start: 0 !important;
	padding-bottom: var(--wp--preset--spacing--5);
	margin-bottom: var(--wp--preset--spacing--5);
	border-bottom: 1px solid var(--wp--preset--color--surface);
}

.archive-hero .nv-breadcrumb {
	margin-bottom: var(--wp--preset--spacing--2);
}

.archive-hero h1.wp-block-heading {
	color: var(--wp--preset--color--ink);
	margin: 0 0 var(--wp--preset--spacing--2);
}

.archive-hero .archive-dek {
	margin: 0;
	max-width: 680px;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

/* Data de publicação abaixo do H1 — single-edital.html (CPT sem os outros
   metadados do single de post: sem autor, sem tempo de leitura). */
.archive-hero__data.wp-block-post-date {
	display: block;
	margin: 0;
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--sm);
}

/* single-edital.html — mesma proporção de colunas do archive (2fr conteúdo
   / 1fr anúncio), não os 240px fixos do .single-layout do blog — o anúncio
   aqui deve ficar mais largo, como na referência do archive de categoria. */
.edital-layout {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	align-items: start;
	gap: var(--wp--preset--spacing--6);
}

/* .single-body herda "order:1" do single.html (que reordena visualmente
   contra .single-toc, com "order:2") — aqui não tem essa segunda peça, então
   sem zerar o order o anúncio (order:0 padrão) passa na frente do conteúdo. */
.edital-layout .single-body {
	order: 0;
}

@media (max-width: 900px) {
	.edital-layout {
		grid-template-columns: 1fr;
	}

	.edital-layout .archive-aside {
		position: static;
		max-width: 320px;
		margin: 0 auto;
	}
}

/* Layout de duas colunas: lista de notícias (~68%) + anúncio lateral fixo
   (~32%). Este grupo é filho direto do container constrained (contentSize
   1200px) — o WordPress já limita/centraliza ESTE elemento pela regra
   ">*" do bloco pai, então o grid calcula suas colunas com base numa
   largura já correta (diferente do bug do single, onde o próprio elemento
   "constrained" também virava o grid — aqui são dois níveis separados). */
.archive-layout {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	align-items: start;
	gap: var(--wp--preset--spacing--6);
}

.archive-list {
	min-width: 0;
}

.archive-item {
	/* No arquivo/categoria isso já vem de is-layout-flex (bloco real, com
	   layout:flex no Query Loop) — mas o card da busca (patterns/busca-
	   resultados.php via nv_busca_card_html()) é HTML feito à mão, sem
	   bloco nenhum por trás, então precisa do display:flex explícito aqui
	   ou a imagem cai empilhada em cima do texto (display:block padrão do
	   <article>). */
	display: flex !important;
	align-items: flex-start !important;
	gap: var(--wp--preset--spacing--3) !important;
	padding: var(--wp--preset--spacing--4) 0;
	border-bottom: 1px solid #ebebee;
}

.archive-list > .wp-block-post-template > li:first-child .archive-item {
	padding-top: 0;
}

.archive-item__thumb {
	flex-shrink: 0;
	margin: 0;
}

.archive-item__thumb img {
	display: block;
	width: 240px;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 12px;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.archive-item:hover .archive-item__thumb img {
	transform: scale(1.03);
}

.archive-item__body {
	min-width: 0;
}

.archive-item__body > * {
	margin-block-start: 0;
}

.archive-item__body > * + * {
	margin-block-start: 6px;
}

/* Linha de meta: categoria + data lado a lado, separadas por um ponto. */
.archive-item__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.archive-item__meta .archive-item__kicker::after {
	content: "·";
	margin-left: 8px;
	font-weight: 400;
	color: var(--wp--preset--color--text-muted);
}

.archive-item__kicker {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
}

.archive-item__title {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--h-2);
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.archive-item__title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.archive-item__title a:hover {
	color: var(--wp--preset--color--primary);
}

.archive-item__excerpt {
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.archive-item__date {
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--text-muted);
}

/* Anúncio lateral — sticky, acompanha a rolagem da lista sem invadir o
   footer (top compensa o header sticky do site). */
.archive-aside {
	position: sticky;
	top: calc(var(--wp--preset--spacing--3) + 88px);
	display: block;
	/* 2º filho do grupo is-layout-flow leva margin-top do block-gap do
	   WordPress — some com o gap no topo da coluna (bug recorrente do tema). */
	margin-top: 0 !important;
}

.archive-aside__label {
	display: block;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--text-muted);
	margin-bottom: 8px;
}

.archive-aside img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
	border: 1px solid var(--wp--preset--color--surface);
}

/* Filtro da coluna lateral (Tema / Cidade / Personagens) — nuvem de chips
   clicáveis acima do anúncio. Clicar num chip filtra; o chip ativo fica
   preenchido, com × pra remover. Todos os chips do mesmo tamanho. */
.nv-nuvem {
	margin: 0 0 var(--wp--preset--spacing--5);
}

.nv-nuvem__titulo {
	margin: 0 0 12px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
}

.nv-nuvem__grupo {
	margin-bottom: 14px;
}

.nv-nuvem__legenda {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	margin-bottom: 8px;
}

.nv-nuvem__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	line-height: 1.1;
}

.nv-nuvem__chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 12px;
	font-size: 12px;
	color: var(--wp--preset--color--primary);
	background: color-mix(in srgb, var(--wp--preset--color--primary) 12%, var(--wp--preset--color--white));
	border: 0;
	border-radius: 999px;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.nv-nuvem__chip:hover {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 22%, var(--wp--preset--color--white));
	color: var(--wp--preset--color--primary);
}

.nv-nuvem__chip.is-ativo {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-weight: 600;
}

.nv-nuvem__chip.is-ativo:hover {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

.nv-nuvem__x {
	font-size: 15px;
	line-height: 1;
	opacity: 0.85;
}

.nv-nuvem__limpar {
	display: inline-block;
	margin-top: 2px;
	font-size: 12.5px;
	color: var(--wp--preset--color--text-muted);
	text-decoration: underline;
}

/* Hero da página de entidade (taxonomy-entidade.html) — imagem 16:9 à
   esquerda, nome + resumo + links à direita. */
.ent-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: var(--wp--preset--spacing--6);
	align-items: center;
	margin: var(--wp--preset--spacing--4) 0 var(--wp--preset--spacing--6);
}

.ent-hero--sem-imagem {
	grid-template-columns: 1fr;
}

.ent-hero__media {
	min-width: 0;
}

.ent-hero__img,
.ent-hero__media img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 14px;
	border: 1px solid var(--wp--preset--color--surface);
}

.ent-hero__body {
	min-width: 0;
}

.ent-hero__tipo {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	margin-bottom: 8px;
}

.ent-hero__nome {
	margin: 0 0 12px;
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.1;
	color: var(--wp--preset--color--ink);
}

.ent-hero__resumo {
	color: var(--wp--preset--color--text-muted);
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 18px;
}

.ent-hero__resumo p {
	margin: 0 0 8px;
}

.ent-hero__links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.ent-hero__link,
.autor-hero__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--surface);
	border-radius: 50%;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.ent-hero__link:hover,
.autor-hero__link:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

.ent-hero__link svg,
.autor-hero__link svg {
	width: 20px;
	height: 20px;
}

@media (max-width: 782px) {
	.ent-hero {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--4);
		align-items: start;
	}
}

/* Hero da página do autor (author.html) — foto 1:1 redonda + nome à esquerda,
   bio + links à direita. */
.autor-hero {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--6);
	align-items: center;
	margin: var(--wp--preset--spacing--4) 0 var(--wp--preset--spacing--6);
}

.autor-hero__col-foto {
	text-align: center;
}

.autor-hero__foto {
	display: block;
	width: 160px;
	height: 160px;
	margin: 0 auto;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--wp--preset--color--surface);
}

.autor-hero__nome {
	margin: 14px 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--wp--preset--color--ink);
}

.autor-hero__col-info {
	min-width: 0;
}

.autor-hero__bio {
	max-width: 680px;
	color: var(--wp--preset--color--text-muted);
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 18px;
}

.autor-hero__bio p {
	margin: 0 0 8px;
}

.autor-hero__links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

@media (max-width: 782px) {
	.autor-hero {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--4);
		justify-items: center;
		text-align: center;
	}

	.autor-hero__col-info {
		text-align: center;
	}

	.autor-hero__links {
		justify-content: center;
	}
}

/* Resumo / pontos-chave no topo da matéria (pattern nv-resumo) — resposta
   extraível pro leitor e pra IA (GEO). */
.nv-resumo {
	margin: 0 0 var(--wp--preset--spacing--4);
	padding: 18px 20px;
	background: var(--wp--preset--color--banner-tint);
	border-left: 4px solid var(--wp--preset--color--accent);
	border-radius: 8px;
}

.nv-resumo__titulo {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
}

.nv-resumo ul {
	margin: 0;
	padding-left: 20px;
}

.nv-resumo li {
	margin: 4px 0;
	line-height: 1.55;
}

/* FAQ (shortcode [faq]) — acordeão nativo <details> + FAQPage schema. */
.nv-faq {
	border-bottom: 1px solid #ebebee;
}

.nv-faq__q {
	cursor: pointer;
	padding: 14px 0;
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}

.nv-faq__q::-webkit-details-marker {
	display: none;
}

.nv-faq__q::after {
	content: "+";
	font-weight: 400;
	font-size: 22px;
	line-height: 1;
	color: var(--wp--preset--color--primary);
}

.nv-faq[open] .nv-faq__q::after {
	content: "–";
}

.nv-faq__a {
	padding: 0 0 16px;
	color: var(--wp--preset--color--text-muted);
	line-height: 1.6;
}

.nv-faq__a p {
	margin: 0 0 8px;
}

/* Paginação rastreável dos arquivos (fallback sem JS / pro crawler; escondida
   quando o "Ver mais" por JS assume). */
.nv-paginacao ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	align-items: center;
}

.nv-paginacao li {
	margin: 0;
}

.nv-paginacao .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--surface);
	text-decoration: none;
}

.nv-paginacao a.page-numbers:hover {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 12%, var(--wp--preset--color--white));
	color: var(--wp--preset--color--primary);
}

.nv-paginacao .page-numbers.current {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

.nv-paginacao .page-numbers.dots {
	background: transparent;
	min-width: auto;
	padding: 0 4px;
}

/* Cidade + Personagens no fim da matéria (shortcode nv_post_taxonomias) —
   link interno pros hubs, na largura de leitura. */
.nv-post-tax {
	max-width: 680px;
	margin: var(--wp--preset--spacing--5) auto 0;
	padding-top: var(--wp--preset--spacing--4);
	border-top: 1px solid #ebebee;
}

.nv-post-tax__grupo {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px;
	margin-bottom: 10px;
}

.nv-post-tax__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
}

.nv-post-tax__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.nv-post-tax__chip {
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	font-size: 13px;
	color: var(--wp--preset--color--primary);
	background: color-mix(in srgb, var(--wp--preset--color--primary) 10%, var(--wp--preset--color--white));
	border-radius: 999px;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.nv-post-tax__chip:hover {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 20%, var(--wp--preset--color--white));
}

@media (max-width: 900px) {
	.archive-layout {
		grid-template-columns: 1fr;
	}

	.archive-aside {
		position: static;
		max-width: 320px;
		margin: 0 auto;
	}
}

@media (max-width: 600px) {
	/* Início do arquivo/categoria, busca, edital e jornal (wrapper logo abaixo
	   do banner do topo) — 64px de padding-top no desktop (spacing--6) é
	   espaço demais no mobile. */
	.pagina-topo {
		padding-top: 40px !important;
	}

	.archive-hero {
		margin-bottom: 0;
	}

	.archive-item {
		flex-wrap: wrap !important;
		/* Empilhado (imagem em cima, texto embaixo), o "gap" horizontal do
		   desktop vira o espaço vertical entre imagem e texto — 16px em vez
		   dos 24px de desktop. */
		gap: 16px !important;
		padding-top: 0;
		/* Espaço entre uma notícia e a próxima (padding-bottom antes da
		   borda divisória) — 24px no mobile em vez dos 32px de desktop. */
		padding-bottom: 24px;
	}

	/* A imagem já pedia width:100%, mas isso é 100% do próprio .archive-
	   item__thumb (a figure/link que a envolve) — sem flex-basis:100% nele
	   também, o thumb não estica pra ocupar a linha toda dentro do flex
	   quebrado, e a imagem acaba menor que a largura real da tela. */
	.archive-item__thumb {
		flex-basis: 100%;
		width: 100%;
	}

	.archive-item__thumb img {
		width: 100%;
		aspect-ratio: 16 / 9;
		height: auto;
	}

	.archive-item__body {
		flex-basis: 100%;
	}
}

/* Posts relacionados */
/* Navegação anterior/próximo — pills com chevron em SVG (via mask, herda a
   cor do texto), no lugar das setas de caractere ← →. */
.single-nav__link a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 20px;
	border: 1px solid #e7eaed;
	border-radius: 999px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: none;
	transition: color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.single-nav__link a:hover {
	color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	text-decoration: none;
	transform: translateY(-1px);
}

.single-nav__prev a::before,
.single-nav__next a::after {
	content: "";
	width: 15px;
	height: 15px;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 4.5 7.5 12 15 19.5' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%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'%3E%3Cpath d='M15 4.5 7.5 12 15 19.5' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.single-nav__next a::after {
	transform: scaleX(-1);
}

.nv-relacionados__eyebrow {
	display: block;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	letter-spacing: 0.08em;
}

.nv-relacionados__titulo {
	margin: 0.2em 0 0;
}

.nv-relacionados .post-card h3 {
	margin: 0;
}

@media (max-width: 900px) {
	.nv-relacionados .blog-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 600px) {
	.nv-relacionados .blog-grid {
		grid-template-columns: 1fr !important;
	}
}

/* Blocos nativos de conteúdo (post-content, páginas) — sem isso ficam no
   estilo cru do navegador assim que um post usar citação, tabela ou lista. */
.entry-content blockquote,
.wp-block-post-content blockquote {
	margin: var(--wp--preset--spacing--3) 0;
	padding-left: var(--wp--preset--spacing--2);
	border-left: 3px solid var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--lg);
	font-style: normal;
	color: var(--wp--preset--color--ink);
}

.entry-content blockquote cite,
.wp-block-post-content blockquote cite {
	display: block;
	margin-top: var(--wp--preset--spacing--1);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--sm);
	font-style: normal;
	color: var(--wp--preset--color--text-muted);
}

.entry-content table,
.wp-block-post-content table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--wp--preset--spacing--3) 0;
	font-size: var(--wp--preset--font-size--sm);
}

.entry-content th,
.entry-content td,
.wp-block-post-content th,
.wp-block-post-content td {
	padding: 0.6em 0.8em;
	border: 1px solid var(--wp--preset--color--surface);
	text-align: left;
}

.entry-content th,
.wp-block-post-content th {
	background: var(--wp--preset--color--surface);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
}

.entry-content ul,
.entry-content ol,
.wp-block-post-content ul,
.wp-block-post-content ol {
	padding-left: 1.4em;
	margin: var(--wp--preset--spacing--2) 0;
}

.entry-content li,
.wp-block-post-content li {
	margin-bottom: 0.4em;
}

.entry-content code,
.wp-block-post-content code {
	background: var(--wp--preset--color--surface);
	padding: 0.15em 0.4em;
	border-radius: 4px;
	font-size: 0.9em;
}

.entry-content pre,
.wp-block-post-content pre {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
	padding: var(--wp--preset--spacing--2);
	border-radius: 8px;
	overflow-x: auto;
	margin: var(--wp--preset--spacing--3) 0;
}

.entry-content pre code,
.wp-block-post-content pre code {
	background: none;
	padding: 0;
	color: inherit;
}

/* Alvos de toque — pills de paginação e abas de filtro um pouco pequenos
   pra toque confortável em mobile (recomendação Google: ~44px mínimo). */
.wp-block-query-pagination .page-numbers,
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
	min-height: 40px;
}

.nv-busca-filtro__item {
	min-height: 40px;
	display: inline-flex;
	align-items: center;
}

/* Barra de progresso de leitura — fixa na base da tela, só em posts. */
.reading-progress {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: var(--wp--preset--color--surface);
	z-index: 90;
}

.reading-progress__fill {
	height: 100%;
	width: 0%;
	background: var(--wp--preset--color--primary);
}

@media (prefers-reduced-motion: no-preference) {
	.reading-progress__fill {
		transition: width 0.1s linear;
	}
}

/* CTA de WhatsApp no meio do artigo — o card faz a ponte visual entre o
   verde do WhatsApp (ícone, reconhecimento imediato da marca) e o azul
   primário do projeto (botão). */
.cta-whats {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	background: linear-gradient(120deg, #e2ecf7 0%, #F0F4F8 70%);
	border: 1px solid #e7eaed;
	border-radius: 12px;
	padding: 20px 24px;
	margin: var(--wp--preset--spacing--3) 0 var(--wp--preset--spacing--4);
}

.cta-whats__icon {
	position: relative;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: #25d366;
	color: var(--wp--preset--color--white);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.cta-whats__icon svg {
	width: 26px;
	height: 26px;
}

/* Anéis de "transmissão ao vivo" pulsando a partir do ícone — dois anéis
   defasados pela metade do ciclo. Dentro do prefers-reduced-motion (WCAG
   2.3.3): quem pediu menos movimento vê só o ícone estático. */
@media (prefers-reduced-motion: no-preference) {
	.cta-whats__icon::before,
	.cta-whats__icon::after {
		content: "";
		position: absolute;
		inset: 0;
		border-radius: 50%;
		border: 2px solid rgba(37, 211, 102, 0.5);
		animation: cta-whats-pulse 2.6s ease-out infinite;
	}

	.cta-whats__icon::after {
		animation-delay: 1.3s;
	}
}

@keyframes cta-whats-pulse {
	from {
		transform: scale(1);
		opacity: 1;
	}
	to {
		transform: scale(1.65);
		opacity: 0;
	}
}

.cta-whats__texto {
	flex: 1 1 280px;
}

.cta-whats__eyebrow {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #128c7e;
	margin-bottom: 4px;
}

.cta-whats__texto p {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--wp--preset--color--ink);
}

.cta-whats__texto strong {
	color: #128c7e;
}

/* Botão — azul primário. Seletor com o pai pra vencer a cor de link do
   conteúdo (content-link, vermelho) definida via theme.json. */
.cta-whats .cta-whats__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-weight: 700;
	font-size: 14px;
	padding: 12px 22px;
	border-radius: 999px;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 6px 16px -6px rgba(0, 55, 131, 0.45);
	transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.cta-whats .cta-whats__btn:hover {
	background: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--white);
	text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 10px 20px -6px rgba(0, 55, 131, 0.5);
}

.cta-whats .cta-whats__btn:active {
	transform: scale(0.97);
}

@media (max-width: 600px) {
	.cta-whats .cta-whats__btn {
		width: 100%;
	}
}

/* Dock flutuante do mobile — compartilhar (destaque, azul) + categorias.
   Invisível até o JS liberar (.is-visible: 3s na página ou primeira
   rolagem); só existe visualmente em telas menores. */
.nv-dock {
	position: fixed;
	right: 5px;
	bottom: 5px;
	z-index: 95;
	display: none;
	opacity: 0;
	transform: translateY(14px);
	pointer-events: none;
}

.nv-dock.is-visible {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

@media (max-width: 900px) {
	.nv-dock {
		display: block;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.nv-dock {
		transition: opacity 0.35s ease, transform 0.35s ease;
	}
}

/* Grupo único em pill: os dois botões do mesmo tamanho dentro do mesmo
   container — compartilhar primeiro (destaque pela cor, não pelo tamanho). */
.nv-dock__botoes {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 5px;
	background: var(--wp--preset--color--white);
	border: 1px solid #e7eaed;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(28, 36, 48, 0.18);
}

.nv-dock__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: transform 0.15s ease;
}

.nv-dock__btn:active {
	transform: scale(0.92);
}

.nv-dock__btn svg {
	width: 20px;
	height: 20px;
}

/* Compartilhar: destaque em azul */
.nv-dock__btn--share {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

/* Hambúrguer: neutro */
.nv-dock__btn--menu {
	background: transparent;
	color: var(--wp--preset--color--ink);
}

.nv-dock__painel {
	position: absolute;
	right: 0;
	bottom: calc(100% + 10px);
	min-width: 264px;
	background: var(--wp--preset--color--white);
	border: 1px solid #e7eaed;
	border-radius: 12px;
	padding: 14px 16px;
	box-shadow: 0 14px 36px rgba(28, 36, 48, 0.2);
	transform-origin: bottom right;
}

@media (prefers-reduced-motion: no-preference) {
	.nv-dock__painel:not([hidden]) {
		animation: nv-dock-pop 0.16s ease-out;
	}
}

@keyframes nv-dock-pop {
	from {
		opacity: 0;
		transform: scale(0.92) translateY(6px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.nv-dock__titulo {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text-muted);
	margin-bottom: 8px;
}

/* --- Menu de categorias: drawer de tela cheia --- */
.nv-dock__backdrop {
	position: fixed;
	inset: 0;
	z-index: 110;
	background: rgba(0, 33, 77, 0.5);
	opacity: 0;
	pointer-events: none;
}

.nv-dock__backdrop.is-aberto {
	opacity: 1;
	pointer-events: auto;
}

.nv-dock__drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 120;
	height: 100dvh;
	width: 90%;
	max-width: 420px;
	background: var(--wp--preset--color--white);
	box-shadow: -16px 0 40px rgba(28, 36, 48, 0.25);
	padding: 18px 22px;
	overflow-y: auto;
	transform: translateX(105%);
}

.nv-dock__drawer.is-aberto {
	transform: translateX(0);
}

@media (prefers-reduced-motion: no-preference) {
	.nv-dock__backdrop {
		transition: opacity 0.25s ease;
	}

	.nv-dock__drawer {
		transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	}
}

@media (min-width: 901px) {
	.nv-dock__drawer,
	.nv-dock__backdrop {
		display: none;
	}
}

html.nv-scroll-lock {
	overflow: hidden;
}

.nv-dock__drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.nv-dock__drawer-head .nv-dock__titulo {
	margin-bottom: 0;
}

.nv-dock__fechar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: none;
	border-radius: 50%;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	cursor: pointer;
}

.nv-dock__fechar svg {
	width: 18px;
	height: 18px;
}

.nv-dock__categorias {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nv-dock__categorias a {
	display: block;
	padding: 14px 0;
	font-size: var(--wp--preset--font-size--base);
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--surface);
}

.nv-dock__categorias li:last-child a {
	border-bottom: none;
}

.nv-dock__categorias a:active,
.nv-dock__categorias a:hover {
	color: var(--wp--preset--color--primary);
}

/* O painel de compartilhar reusa o shortcode do sumário — só zera a margem
   e garante que os ícones aparecem aqui mesmo no mobile (a regra do sumário
   esconde .nv-compartilhar dentro de .single-toc, não aqui). */
.nv-dock .nv-compartilhar {
	margin-top: 0;
}

/* Responsivo — telas menores */
@media (max-width: 782px) {
	/* Grupos com fundo: respiro vertical maior, lateral padrão de 20px
	   (sobrescreve o padding 1.25em/2.375em default do WordPress — mesma
	   especificidade zero via :where, esta regra vence por vir depois). */
	:where(.wp-block-group.has-background) {
		padding: 40px 20px;
	}

	/* Logo menor no mobile — padrão pra todas as páginas do site (header
	   principal e o header-minimal da página Links). */
	.site-header__logo img {
		width: 150px;
	}

	/* Distância entre o título da seção (H2) e as matérias abaixo — 32px no
	   mobile em vez dos 48px de desktop. Mesma regra em todas as seções da
	   home que seguem o padrão título+divisor+conteúdo. */
	.ensino-superior__titulo-wrap,
	.colunistas__titulo-wrap,
	.tema-categoria__titulo-wrap,
	.editais__titulo-wrap,
	.jornais__titulo-wrap {
		margin-bottom: 32px;
	}

	/* Menu hamburguer do topo não é mais necessário no mobile — o dock fixo
	   na base da tela (mobile-dock.js, ver inc/blog.php) já cobre a mesma
	   função (categorias) com um botão sempre visível na rolagem. Usa
	   visibility (não display:none) pra manter o slot no layout flex
	   space-between do header e a logo continuar centralizada entre os dois
	   lados, em vez de ir pra esquerda por falta do 3º item. */
	.site-header__toggle {
		visibility: hidden;
		pointer-events: none;
	}

	/* Faixa de anúncio sem respiro vertical no mobile */
	.navbanners-wrap {
		padding-top: 0;
		padding-bottom: 0;
	}

	.navbanners-wrap img {
		border-radius: 0;
	}

	/* O plugin define min-height:90px no slot pra evitar layout shift
	   enquanto o banner carrega — no mobile isso sobra como espaço vazio
	   sempre que o criativo real renderiza mais baixo que 90px (banners
	   largos e baixos, comuns nesse formato). Altura 100% automática. */
	.navbanners-slot {
		min-height: 0;
	}

	/* Espaços laterais padronizados em 20px (sobrescreve o padding inline
	   dos blocos, por isso o !important) */
	.site-header__inner,
	.single-shell,
	.single-layout {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	/* Dentro da faixa azul, o grupo pai já dá os 20px laterais e os 40px de
	   topo — zerar o padding próprio do breadcrumb/título/meta pra não
	   somar (20+20 nas laterais, 40+24 no topo). */
	.hero-band .single-shell {
		padding-top: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Relacionados mais colados no fim do artigo (!important pra vencer o
	   padding inline do pattern). */
	.nv-relacionados {
		padding-top: 10px !important;
	}

	/* Resumo abaixo do H1 mais compacto no mobile */
	.hero-band .single-dek .wp-block-post-excerpt__excerpt {
		font-size: 14px;
	}
}

/* ==========================================================================
   Página 404
   ========================================================================== */

/* Largura garantida via CSS direto, não só via contentSize do bloco — o
   WordPress só limita/centraliza os FILHOS de um grupo "constrained", não
   o grupo em si (mesma armadilha já vista em .single-layout/.archive-layout
   neste tema). */
.pagina-404 {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

/* O WordPress aplica margin-left/right:auto !important em todo filho direto
   de um grupo "constrained" (pra centralizar) — qualquer filho aqui que
   receba um max-width mais estreito que o próprio (eyebrow, título, texto,
   busca) precisa forçar margin-left:0 de volta, senão fica centralizado
   dentro do próprio slot em vez de alinhado à esquerda junto com as seções
   full-width abaixo (categorias, recentes, populares). */
.pagina-404__eyebrow,
.pagina-404__titulo.wp-block-heading,
.pagina-404__texto,
.pagina-404__acoes {
	margin-left: 0 !important;
}

.pagina-404__eyebrow {
	display: block;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
	margin-bottom: var(--wp--preset--spacing--2);
}

.pagina-404__titulo.wp-block-heading {
	max-width: 25ch;
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--2);
	color: var(--wp--preset--color--ink);
}

.pagina-404__texto {
	max-width: 780px;
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--4);
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.55;
	color: var(--wp--preset--color--text-muted);
}

.pagina-404__texto a {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
	text-decoration-color: rgba(0, 55, 131, 0.35);
	text-underline-offset: 3px;
}

.pagina-404__texto a:hover {
	text-decoration-color: var(--wp--preset--color--primary);
}

/* Busca + editorias na mesma linha — busca cresce até um limite, pills de
   categoria ficam à direita e quebram pra baixo da busca em telas menores. */
.pagina-404__acoes {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--3) var(--wp--preset--spacing--5);
	margin-bottom: 60px;
}

.pagina-404__busca {
	flex: 1 1 300px;
	max-width: 420px;
	margin-bottom: 0;
}

.pagina-404__busca .wp-block-search__inside-wrapper {
	border: none;
	gap: 0;
	box-shadow: 0 1px 2px rgba(26, 26, 26, 0.05);
	border-radius: 999px;
}

.pagina-404__busca .wp-block-search__input {
	min-height: 46px;
	padding: 0 1.2em 0 2.6em;
	border: 1px solid #e7eaed;
	border-right: none;
	border-radius: 999px 0 0 999px;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink);
	background-color: var(--wp--preset--color--white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B6B6B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: 1.05em center;
	background-size: 15px;
	transition: border-color 0.2s ease;
}

.pagina-404__busca .wp-block-search__input::placeholder {
	color: var(--wp--preset--color--text-muted);
}

.pagina-404__busca .wp-block-search__input:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
}

.pagina-404__busca .wp-block-search__button {
	min-height: 46px;
	margin-inline-start: 0;
	padding: 0 1.5em;
	border: none;
	border-radius: 0 999px 999px 0;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	transition: background-color 0.2s ease;
}

.pagina-404__busca .wp-block-search__button:hover {
	background: var(--wp--preset--color--secondary);
}

.pagina-404__categorias-nav.wp-block-navigation {
	/* Mesmo bug recorrente do block-gap do WordPress: por ser o 2º filho
	   (depois da busca), herda 24px de margin-top automático, o que
	   desalinha ele verticalmente em relação à busca mesmo com
	   align-items:center no .pagina-404__acoes. */
	margin-top: 0 !important;
	flex: 1 1 auto;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px;
}

.pagina-404__secao {
	padding-top: var(--wp--preset--spacing--6);
	border-top: 1px solid var(--wp--preset--color--surface);
	margin-top: var(--wp--preset--spacing--6);
}

.pagina-404__secao:first-of-type {
	margin-top: 0;
}

.pagina-404__secao-label {
	display: block;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
	margin-bottom: var(--wp--preset--spacing--3);
}

/* Pills de categoria — Menu de Navegação nativo (mesmo menu "Editorias —
   home" reaproveitado da home). Estilo compartilhado com .home-categorias-nav. */
.home-categorias-nav .wp-block-navigation-item__content,
.pagina-404__categorias-nav .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	padding: 6px 18px;
	border: 1px solid rgba(0, 55, 131, 0.25);
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.home-categorias-nav .wp-block-navigation-item__content:hover,
.pagina-404__categorias-nav .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

/* Recentes / mais lidas — lista simplificada em duas colunas (imagem 1:1,
   só editoria + título, sem resumo/data — a densidade maior de cada card
   não cabe dividindo espaço em duas colunas lado a lado). */
.pagina-404__colunas {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: start;
	gap: var(--wp--preset--spacing--6);
}

.pagina-404__coluna {
	/* Mesmo bug recorrente do block-gap do WordPress: a 2ª coluna ("Mais
	   lidas") é o 2º filho de um grupo "flow" e herda 24px de margin-top
	   automático, descolando ela do topo em relação à 1ª coluna mesmo com
	   align-items:start no grid pai. */
	margin-top: 0 !important;
	min-width: 0;
}

.pagina-404__lista {
	display: flex;
	flex-direction: column;
}

/* "Notícias recentes" é wp:query nativo — o <li> do wp:post-template (não
   só o .pagina-404__item de dentro dele) também herda o margin-top de
   block-gap do WordPress nos itens 2+. */
.pagina-404__lista .wp-block-post-template > li {
	margin-top: 0 !important;
}

.pagina-404__item {
	/* Mesmo bug recorrente do block-gap do WordPress: itens 2+ herdam
	   24px de margin-top automático, somando ao padding e criando um
	   espaço maior entre eles do que entre o 1º e o 2º item. */
	margin-top: 0 !important;
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	padding: 12px 0;
	border-bottom: 1px solid #cfcfcf;
	text-decoration: none;
}

/* Primeiro/último item sem borda/padding extra — cobre tanto a coluna
   "Mais lidas" (shortcode, .pagina-404__item é filho direto de .lista)
   quanto "Notícias recentes" (wp:query nativo, .pagina-404__item fica um
   nível mais fundo, dentro do <li> do wp:post-template). */
.pagina-404__lista > .pagina-404__item:first-child,
.pagina-404__lista .wp-block-post-template > li:first-child .pagina-404__item {
	padding-top: 0;
}

.pagina-404__lista > .pagina-404__item:last-child,
.pagina-404__lista .wp-block-post-template > li:last-child .pagina-404__item {
	border-bottom: none;
	padding-bottom: 0;
}

.pagina-404__item-thumb {
	display: block;
	flex-shrink: 0;
	width: 80px;
	height: 80px;
	border-radius: 8px;
	overflow: hidden;
	background: var(--wp--preset--color--surface);
}

.pagina-404__item-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.pagina-404__item-body {
	min-width: 0;
}

.pagina-404__item-kicker {
	display: block;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
	margin-bottom: 3px;
}

.pagina-404__item-title {
	display: -webkit-box;
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 15px;
	line-height: 1.35;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.pagina-404__item-title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	transition: color 0.2s ease;
}

.pagina-404__item:hover .pagina-404__item-title a {
	color: var(--wp--preset--color--primary);
}

@media (max-width: 600px) {
	.pagina-404__titulo.wp-block-heading {
		max-width: none;
		font-size: 24px;
	}

	.pagina-404__texto {
		font-size: 16px;
	}

	.pagina-404__acoes {
		flex-direction: column;
		align-items: stretch;
		margin-bottom: var(--wp--preset--spacing--4);
	}

	.pagina-404__busca {
		/* Em linha (desktop) o flex-basis:300px vira largura; em coluna
		   (aqui) o mesmo valor viraria altura no eixo principal — reseta
		   pra não esticar a busca com um espaço vazio embaixo. */
		flex: 0 0 auto;
		max-width: none;
	}

	.pagina-404__categorias-nav.wp-block-navigation {
		justify-content: flex-start;
	}

	.pagina-404__colunas {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--5);
	}

	/* !important pra vencer o padding inline (style="padding-top:...") vindo
	   dos atributos de spacing do bloco no template — no mobile, 96px de
	   respiro no topo/base é espaço demais. */
	.pagina-404 {
		padding-top: var(--wp--preset--spacing--5) !important;
		padding-bottom: var(--wp--preset--spacing--5) !important;
	}

	.pagina-404__secao {
		margin-top: var(--wp--preset--spacing--4);
		padding-top: var(--wp--preset--spacing--4);
	}
}

/* ==========================================================================
   Rodapé (parts/footer.html) — faixa "Siga a gente nas redes sociais"
   ========================================================================== */

.footer-social {
	background-color: #0066cc;
	padding: 24px var(--wp--preset--spacing--3);
}

.footer-social__inner {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	align-items: center;
	gap: var(--wp--preset--spacing--4);
}

.footer-social__texto {
	max-width: 520px;
}

.footer-social__titulo {
	margin: 0 0 4px;
	color: #fff;
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.25;
}

.footer-social__subtitulo {
	margin: 0;
	color: rgba(255, 255, 255, 0.8);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.5;
}

.footer-social__icones {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

/* Botão "Seguir no Google News" — diferente dos ícones de rede social:
   precisa do rótulo por extenso porque não existe um ícone isolado
   universalmente reconhecível pra Google News como há pra Instagram/X. Link
   placeholder (#) até o site ser aprovado no Google Publisher Center. */
.footer-social__gnews {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: 999px;
	background: #fff;
	color: #0066cc;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.footer-social__gnews svg {
	display: block;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

.footer-social__gnews:hover {
	background: var(--wp--preset--color--background);
	transform: translateY(-3px);
}

.footer-social__icone {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.15);
	color: #fff;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.footer-social__icone svg {
	width: 20px;
	height: 20px;
}

.footer-social__icone:hover {
	background: #fff;
	color: #0066cc;
	transform: translateY(-3px);
}

@media (max-width: 782px) {
	.footer-social__inner {
		justify-content: flex-start;
		text-align: left;
	}

	.footer-social__texto {
		max-width: 100%;
	}

	.footer-social__icones {
		justify-content: flex-start;
		flex-wrap: wrap;
		flex-shrink: 1;
		width: 100%;
		row-gap: var(--wp--preset--spacing--2);
	}
}

/* Linha legal do rodapé (CNPJ, Política de Privacidade, créditos Navival) —
   a cor de link padrão do tema (--wp--preset--color--primary) praticamente
   some em cima do próprio azul primary do rodapé; força branco sublinhado
   pra manter contraste. */
.site-footer__legal a {
	color: var(--wp--preset--color--white);
	text-decoration: underline;
}

.site-footer__legal a:hover {
	color: var(--wp--preset--color--background);
}

/* ==========================================================================
   Página Links — link-tree pro bio do Instagram (templates/page-links.html)
   Mobile-first de propósito (uso real é abrir pelo link do bio, no celular):
   layout pensado pra caber inteiro num viewport só, sem exigir rolagem nos
   tamanhos de tela mais comuns.
   ========================================================================== */

.pagina-links {
	margin-top: 0 !important;
	background: var(--wp--preset--color--background);
}

/* Anúncio do topo — só no MOBILE fica 100% da largura da página (a regra
   geral do site limita o criativo a max-height e centraliza, sobrando
   espaço/fundo dos dois lados, que é exatamente o que queremos igual às
   outras páginas a partir do desktop — ver @media min-width:900px mais
   abaixo, que devolve o banner da Links pro comportamento padrão). */
@media (max-width: 899px) {
	.pagina-links .navbanners-slot {
		/* O plugin define min-height:90px no slot pra evitar layout shift
		   enquanto o banner carrega — aqui a imagem já é 100% da largura com
		   altura automática (proporção real do criativo), então esse mínimo
		   fixo só sobra como espaço vazio abaixo da imagem. */
		min-height: 0;
	}

	.pagina-links .navbanners-wrap {
		padding: 0;
	}

	.pagina-links .navbanners-wrap img {
		width: 100% !important;
		max-width: 100%;
		height: auto;
		max-height: none;
	}
}

.pagina-links__inner {
	max-width: 480px;
	margin: 0 auto;
	padding: 20px 16px 32px;
}

.pagina-links__titulo {
	margin: 0 0 24px;
	font-family: var(--wp--preset--font-family--body);
	font-size: 12px;
	line-height: 1.35;
	letter-spacing: normal;
	text-align: center;
	color: var(--wp--preset--color--primary);
}

.pagina-links__secao {
	margin-top: 20px !important;
}

.pagina-links__secao:first-of-type {
	margin-top: 0 !important;
}

.pagina-links__secao-titulo {
	margin: 0 0 10px;
	font-size: 0.9rem;
	color: var(--wp--preset--color--ink);
}

.pagina-links__secao--mais-lidas .pagina-links__secao-titulo {
	margin-top: 20px;
}

/* Duas formas de conteúdo alimentam a mesma lista visual: o Query Loop
   nativo ("Últimas notícias", com marcadores, dentro do <ul class="wp-
   block-post-template">) e o shortcode em PHP ("As mais lidas", lista
   numerada — não tem equivalente nativo de ordenação por visualizações,
   mesma lógica já usada em nv_mais_lidas/pagina-404). Só título, sem
   imagem: linha divisória mais escura separa cada item. */
.pagina-links__lista {
	margin-top: 0 !important;
}

.pagina-links__lista-numerada {
	margin: 0;
	padding-left: 20px;
	list-style: decimal;
}

/* O marcador nativo (list-style:disc) não alinha com a primeira linha do
   título quando ele quebra em 2 linhas (o <li> tem um <h3> como único
   filho, o que bagunça o cálculo de alinhamento do ::marker no Chrome) —
   por isso a bolinha aqui é um ::before manual dentro de um flex, igual
   o alinhamento que a numeração da lista de "As mais lidas" já tem certo. */
.pagina-links__lista .wp-block-post-template {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.pagina-links__lista .wp-block-post-template > li {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.pagina-links__lista .wp-block-post-template > li::before {
	content: "";
	flex-shrink: 0;
	align-self: flex-start;
	width: 4px;
	height: 4px;
	margin-top: 0.5em;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
}

.pagina-links__lista .wp-block-post-template > li,
.pagina-links__lista-numerada li {
	margin-top: 0 !important;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #cfcfcf;
}

.pagina-links__lista .wp-block-post-template > li:last-child,
.pagina-links__lista-numerada li:last-child {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}

.pagina-links__item-titulo {
	margin: 0;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: 0.8rem;
	line-height: 1.3;
	color: var(--wp--preset--color--ink);
}

.pagina-links__item-titulo a {
	color: inherit;
	text-decoration: none;
}

.pagina-links__item-titulo:hover,
.pagina-links__item-titulo a:hover {
	color: var(--wp--preset--color--primary);
}

.pagina-links__botoes {
	margin-top: 20px !important;
}

/* .btn-secondary global (assets/css, regra de CTA do site inteiro) usa
   .wp-block-button.btn-secondary .wp-block-button__link — 3 classes, mais
   específico que o seletor daqui — por isso o !important. */
.pagina-links__botoes .wp-block-button__link {
	padding: 0.6em 1.2em;
	font-size: 12px !important;
	text-transform: none !important;
}

.pagina-links__anuncie {
	margin-top: 14px;
	font-size: var(--wp--preset--font-size--xs);
}

.pagina-links__anuncie a {
	color: var(--wp--preset--color--text-muted);
	text-decoration: underline;
}

.pagina-links__footer {
	margin-top: 0 !important;
	padding: 16px;
	text-align: center;
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--text-muted);
}

.pagina-links__footer a {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

/* Acima de telefone (uso real é quase sempre mobile, mas evita ficar
   espremido demais se alguém abrir no desktop pelo link direto). */
@media (min-width: 560px) {
	.pagina-links__inner {
		padding-top: 32px;
		padding-bottom: 40px;
	}
}

/* Desktop — a partir daqui o banner do topo NÃO tem mais nenhuma regra
   própria da Links: cai de volta pro comportamento padrão do site inteiro
   (.navbanners-wrap img lá em cima — max-height:180px, max-width:980px,
   centralizado, canto arredondado), pra ficar exatamente igual à home e
   às outras páginas, como pedido. */
@media (min-width: 900px) {
	/* Desktop: largura de 1440px e as duas listas lado a lado (Últimas
	   notícias | As mais lidas) em vez de empilhadas como no mobile. */
	.pagina-links__inner {
		max-width: 1440px;
	}

	.pagina-links__colunas {
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-items: start;
		gap: 48px;
	}

	.pagina-links__secao,
	.pagina-links__secao:first-of-type {
		margin-top: 0 !important;
	}

	/* Esse margin-top é só pro empilhamento do mobile (respiro entre as duas
	   seções) — lado a lado no desktop ele só desalinha o título de "As
	   mais lidas" em relação ao de "Últimas notícias". */
	.pagina-links__secao--mais-lidas .pagina-links__secao-titulo {
		margin-top: 0;
	}

	/* Mesma altura mínima nas duas colunas, independente de quantas linhas
	   cada título ocupa — mantém as listas visualmente alinhadas mesmo
	   quando uma coluna tem texto mais curto que a outra. */
	.pagina-links__lista {
		min-height: 180px;
	}
}

/* Celulares mais baixos (ex.: iPhone SE, ~667px de altura) — aperta um
   pouco mais o respiro vertical pra chegar mais perto de caber tudo num
   viewport só, já que nos aparelhos mais comuns (844px+) isso já cabe
   exatamente sem precisar desse ajuste. */
@media (max-height: 700px) {
	.pagina-links__inner {
		padding-top: 10px;
		padding-bottom: 16px;
	}

	.pagina-links__secao {
		margin-top: 12px !important;
	}

	.pagina-links__secao-titulo {
		margin-bottom: 6px;
	}

	.pagina-links__footer {
		padding: 8px;
	}
}

/* ==========================================================================
   Página Anuncie Conosco (templates/page-anuncie-conosco.html) — página
   institucional simples, de propósito sem o .page-header azul padrão
   (templates/page.html): aqui o H1 é só centralizado sobre o fundo normal
   do site, e o conteúdo inteiro da página são os dois links de contato.
   ========================================================================== */

.pagina-anuncie {
	margin-top: 0 !important;
	background: var(--wp--preset--color--background);
}

.pagina-anuncie__inner {
	padding: 96px 24px 120px;
	text-align: center;
}

.pagina-anuncie__titulo {
	margin: 0 0 20px;
	color: var(--wp--preset--color--primary);
	font-size: clamp(2rem, 5vw, 2.75rem);
}

.pagina-anuncie__divisor.wp-block-separator {
	width: 64px;
	margin: 0 auto 28px;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.pagina-anuncie__subtitulo {
	max-width: 580px;
	margin: 0 auto 56px;
	color: var(--wp--preset--color--text-muted);
	font-size: 1.05rem;
	line-height: 1.65;
}

.pagina-anuncie__links {
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 560px;
	margin: 0 auto;
	text-align: left;
}

.pagina-anuncie__link {
	/* Zera o margin-top automático do block-gap do WordPress: os dois
	   <a> vêm de blocos wp:html irmãos dentro de um grupo "flow", e o
	   segundo herda 24px de margin-block-start — invisível empilhado no
	   mobile (soma ao gap), mas no desktop lado a lado isso empurra só o
	   card do WhatsApp pra baixo, deixando as alturas diferentes. */
	margin-top: 0 !important;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px 28px;
	border-radius: 20px;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--surface);
	box-shadow: 0 8px 24px rgba(0, 20, 60, 0.06);
	text-decoration: none;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease;
}

.pagina-anuncie__link:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 40px rgba(0, 20, 60, 0.14);
	border-color: transparent;
}

.pagina-anuncie__link-icone {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.pagina-anuncie__link:hover .pagina-anuncie__link-icone {
	transform: scale(1.08);
}

.pagina-anuncie__link-icone svg {
	width: 26px;
	height: 26px;
}

.pagina-anuncie__link--email .pagina-anuncie__link-icone {
	background: var(--wp--preset--color--banner-tint);
	color: var(--wp--preset--color--primary);
}

.pagina-anuncie__link--whatsapp .pagina-anuncie__link-icone {
	background: #e3f8ec;
	color: #22c35e;
}

.pagina-anuncie__link-texto {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	flex: 1 1 auto;
}

.pagina-anuncie__link-label {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
}

.pagina-anuncie__link-valor {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--wp--preset--color--ink);
	overflow-wrap: break-word;
}

.pagina-anuncie__link-seta {
	display: flex;
	flex-shrink: 0;
	color: var(--wp--preset--color--text-muted);
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s ease;
}

.pagina-anuncie__link-seta svg {
	width: 20px;
	height: 20px;
}

.pagina-anuncie__link:hover .pagina-anuncie__link-seta {
	transform: translateX(6px);
	color: var(--wp--preset--color--primary);
}

/* Desktop: os dois cartões lado a lado em vez de empilhados, ocupando a
   largura maior de 1440px da seção — o texto do e-mail cabe numa linha só
   nessa largura, então trava o wrap em vez de deixar quebrar como no mobile. */
@media (min-width: 900px) {
	.pagina-anuncie__links {
		flex-direction: row;
		max-width: 1300px !important;
	}

	.pagina-anuncie__link {
		flex: 1 1 0;
		min-width: 0;
	}

	/* overflow-wrap:break-word (regra base) junto com white-space:nowrap no
	   mesmo elemento faz o card do e-mail calcular uma altura maior que o
	   do WhatsApp mesmo com conteúdo de mesma altura visível — some os dois
	   cartões ficarem com altura diferente. "normal" remove esse conflito. */
	.pagina-anuncie__link-valor {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		overflow-wrap: normal;
	}
}

@media (max-width: 600px) {
	.pagina-anuncie__inner {
		padding: 56px 20px 72px;
	}

	.pagina-anuncie__subtitulo {
		margin-bottom: 40px;
	}

	/* Grid em vez de flex: ícone + rótulo na linha de cima, texto (e-mail/
	   telefone) sozinho na linha de baixo ocupando a largura toda do card
	   — sem isso o valor divide espaço com o ícone e quebra em 2-3 linhas
	   feias. display:contents no wrapper de texto "desmonta" o flex-column
	   original, deixando rótulo e valor virarem itens do grid direto. */
	.pagina-anuncie__link {
		display: grid;
		grid-template-columns: auto 1fr auto;
		grid-template-areas:
			"icone label seta"
			"valor valor valor";
		align-items: center;
		column-gap: 14px;
		row-gap: 4px;
		padding: 20px;
		border-radius: 16px;
	}

	.pagina-anuncie__link-icone {
		grid-area: icone;
		width: 46px;
		height: 46px;
	}

	.pagina-anuncie__link-icone svg {
		width: 22px;
		height: 22px;
	}

	.pagina-anuncie__link-texto {
		display: contents;
	}

	.pagina-anuncie__link-label {
		grid-area: label;
	}

	.pagina-anuncie__link-valor {
		grid-area: valor;
		font-size: 12px;
	}

	.pagina-anuncie__link-seta {
		grid-area: seta;
	}
}

/* ==========================================================================
   Página Redação (templates/page-redacao.html) — mesma estrutura da página
   Anuncie Conosco (classes próprias, .pagina-redacao__*, pra manter cada
   página independente): H1 centralizado sem o .page-header azul padrão,
   conteúdo só com os dois links de contato (e-mail e WhatsApp).
   ========================================================================== */

.pagina-redacao {
	margin-top: 0 !important;
	background: var(--wp--preset--color--background);
}

.pagina-redacao__inner {
	padding: 96px 24px 120px;
	text-align: center;
}

.pagina-redacao__titulo {
	margin: 0 0 20px;
	color: var(--wp--preset--color--primary);
	font-size: clamp(2rem, 5vw, 2.75rem);
}

.pagina-redacao__divisor.wp-block-separator {
	width: 64px;
	margin: 0 auto 28px;
	border: none;
	border-top: 3px solid #f2b705;
	opacity: 1;
}

.pagina-redacao__subtitulo {
	max-width: 580px;
	margin: 0 auto 56px;
	color: var(--wp--preset--color--text-muted);
	font-size: 1.05rem;
	line-height: 1.65;
}

.pagina-redacao__links {
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 560px;
	margin: 0 auto;
	text-align: left;
}

.pagina-redacao__link {
	/* Zera o margin-top automático do block-gap do WordPress: os dois
	   <a> vêm de blocos wp:html irmãos dentro de um grupo "flow", e o
	   segundo herda 24px de margin-block-start — invisível empilhado no
	   mobile (soma ao gap), mas no desktop lado a lado isso empurra só o
	   card do WhatsApp pra baixo, deixando as alturas diferentes. */
	margin-top: 0 !important;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px 28px;
	border-radius: 20px;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--surface);
	box-shadow: 0 8px 24px rgba(0, 20, 60, 0.06);
	text-decoration: none;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease;
}

.pagina-redacao__link:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 40px rgba(0, 20, 60, 0.14);
	border-color: transparent;
}

.pagina-redacao__link-icone {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.pagina-redacao__link:hover .pagina-redacao__link-icone {
	transform: scale(1.08);
}

.pagina-redacao__link-icone svg {
	width: 26px;
	height: 26px;
}

.pagina-redacao__link--email .pagina-redacao__link-icone {
	background: var(--wp--preset--color--banner-tint);
	color: var(--wp--preset--color--primary);
}

.pagina-redacao__link--whatsapp .pagina-redacao__link-icone {
	background: #e3f8ec;
	color: #22c35e;
}

.pagina-redacao__link-texto {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	flex: 1 1 auto;
}

.pagina-redacao__link-label {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
}

.pagina-redacao__link-valor {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--wp--preset--color--ink);
	overflow-wrap: break-word;
}

.pagina-redacao__link-seta {
	display: flex;
	flex-shrink: 0;
	color: var(--wp--preset--color--text-muted);
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s ease;
}

.pagina-redacao__link-seta svg {
	width: 20px;
	height: 20px;
}

.pagina-redacao__link:hover .pagina-redacao__link-seta {
	transform: translateX(6px);
	color: var(--wp--preset--color--primary);
}

/* Desktop: os dois cartões lado a lado em vez de empilhados, ocupando a
   largura maior de 1440px da seção — o texto do e-mail cabe numa linha só
   nessa largura, então trava o wrap em vez de deixar quebrar como no mobile. */
@media (min-width: 900px) {
	.pagina-redacao__links {
		flex-direction: row;
		max-width: 1300px !important;
	}

	.pagina-redacao__link {
		flex: 1 1 0;
		min-width: 0;
	}

	/* overflow-wrap:break-word (regra base) junto com white-space:nowrap no
	   mesmo elemento faz o card do e-mail calcular uma altura maior que o
	   do WhatsApp mesmo com conteúdo de mesma altura visível — some os dois
	   cartões ficarem com altura diferente. "normal" remove esse conflito. */
	.pagina-redacao__link-valor {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		overflow-wrap: normal;
	}
}

@media (max-width: 600px) {
	.pagina-redacao__inner {
		padding: 56px 20px 72px;
	}

	.pagina-redacao__subtitulo {
		margin-bottom: 40px;
	}

	/* Grid em vez de flex: ícone + rótulo na linha de cima, texto (e-mail/
	   telefone) sozinho na linha de baixo ocupando a largura toda do card
	   — sem isso o valor divide espaço com o ícone e quebra em 2-3 linhas
	   feias. display:contents no wrapper de texto "desmonta" o flex-column
	   original, deixando rótulo e valor virarem itens do grid direto. */
	.pagina-redacao__link {
		display: grid;
		grid-template-columns: auto 1fr auto;
		grid-template-areas:
			"icone label seta"
			"valor valor valor";
		align-items: center;
		column-gap: 14px;
		row-gap: 4px;
		padding: 20px;
		border-radius: 16px;
	}

	.pagina-redacao__link-icone {
		grid-area: icone;
		width: 46px;
		height: 46px;
	}

	.pagina-redacao__link-icone svg {
		width: 22px;
		height: 22px;
	}

	.pagina-redacao__link-texto {
		display: contents;
	}

	.pagina-redacao__link-label {
		grid-area: label;
	}

	.pagina-redacao__link-valor {
		grid-area: valor;
		font-size: 12px;
	}

	.pagina-redacao__link-seta {
		grid-area: seta;
	}
}

/* O plugin de banner injeta um slot "global" automático logo após o header
   (inject_after_header, posição vazia, sem toggle). O tema já coloca o banner
   do topo explicitamente via [navival_banner position="topo-do-site"], então
   esse slot automático fica sempre vazio e só cria um vão. Escondido: só o
   automático não tem data-position; todos os slots do tema têm. */
.navbanners-slot:not([data-position]) {
	display: none;
}

/* Single de JORNAL: o conteúdo é um flipbook/PDF em página inteira, não texto —
   precisa de largura total, não da coluna de leitura de 680px nem do grid com
   sidebar. Tira os limites só nesta CPT (body.single-jornal); o banner lateral
   passa a fluir full-width abaixo do PDF. */
body.single-jornal .edital-layout {
	grid-template-columns: 1fr;
}

body.single-jornal .single-body {
	max-width: none;
}

body.single-jornal .single-body .wp-block-post-content {
	max-width: none;
}

/* O iframe do flowpaper já é width:100% (segue o container, agora full-width),
   mas o height fixo de 500px do shortcode corta o PDF. Aqui ele fica alto de
   verdade pra ler a edição confortável. */
body.single-jornal .single-body iframe.flowpaper-class {
	width: 100% !important;
	height: 82vh !important;
	min-height: 640px;
}