/* Home editorial em todos os tamanhos e moldura comum às páginas do site. */

/* A marca permanece legível sobre o grafite; o vermelho marca só o contorno. */
.ap-cabecalho,
.ap-cabecalho__interno {
	background: var(--ap-escuro);
}

.ap-cabecalho {
	position: sticky;
	inset: auto;
	top: 0;
	border-bottom: 2px solid var(--ap-marca);
	box-shadow: none;
}

@media (min-width: 721px) {
	.ap-cabecalho__interno {
		max-width: var(--ap-largura-max);
		margin-inline: auto;
		padding-inline: 1.5rem;
	}
	.ap-cabecalho .ap-marca,
	.ap-cabecalho .ap-marca__custom { padding-inline: 0; }
	.ap-menu ul { justify-content: flex-end; }
}

.ap-cabecalho .ap-marca,
.ap-cabecalho .ap-marca:hover,
.ap-cabecalho .ap-marca:focus-visible {
	background: transparent;
}

.ap-cabecalho .ap-marca:focus-visible,
.ap-menu-botao:focus-visible {
	outline-color: var(--ap-claro);
}

@media screen and (min-width: 961px) {
	body.admin-bar .ap-cabecalho { top: 32px; }
}

@media screen and (min-width: 783px) and (max-width: 960px) {
	body.admin-bar .ap-cabecalho { top: 32px; }
}

@media screen and (min-width: 601px) and (max-width: 782px) {
	body.admin-bar .ap-cabecalho { top: 46px; }
}

/* Abertura: a fotografia conduz a cena, com uma só ideia e um só caminho. */
body.home .ap-abertura {
	display: grid;
	grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
	align-items: center;
	min-height: max(39rem, calc(100svh - 4.625rem));
	padding: clamp(3.5rem, 6vw, 6rem) max(1.5rem, calc((100% - var(--ap-largura-max)) / 2 + 1.5rem)) 0;
}

body.home .ap-abertura__interno {
	padding-bottom: clamp(3rem, 5vw, 5rem);
}

body.home .ap-abertura__olho {
	font-size: .73rem;
	letter-spacing: .13em;
}

body.home .ap-abertura__titulo {
	max-width: 14ch;
	font-size: clamp(2.75rem, 4.2vw, 4.75rem);
	line-height: 1.08;
	letter-spacing: -.052em;
	text-wrap: pretty;
	margin-bottom: 2rem;
}

body.home .ap-abertura .ap-acoes,
body.home .ap-abertura .ap-botao {
	width: auto;
}

body.home .ap-abertura .ap-botao {
	justify-content: flex-start;
	min-height: 2.75rem;
	padding: 0 0 .4rem;
	border: 0;
	border-bottom: 2px solid var(--ap-marca);
	border-radius: 0;
	background: transparent;
	color: #fff;
	font-size: .77rem;
	letter-spacing: .09em;
}

body.home .ap-abertura .ap-botao:hover,
body.home .ap-abertura .ap-botao:focus-visible {
	border-bottom-color: #fff;
}

/* Retratos e faixa vermelha partilham o mesmo recuo nas telas largas.
   O limite preserva a escala dos retratos em monitores ultralargos. */
@media (min-width: 1200px) {
	body.home .ap-abertura {
		--ap-recuo-figuras: min(15rem, max(0px, (100vw - var(--ap-largura-max)) / 4));
	}

	body.home .ap-abertura__figuras {
		width: calc(100% + min(30rem, max(0px, (100vw - var(--ap-largura-max)) / 2)));
		transform: translateX(calc(0px - var(--ap-recuo-figuras)));
	}

	body.home .ap-abertura__cenario::after {
		right: calc(clamp(1rem, 6vw, 6rem) + var(--ap-recuo-figuras));
	}
}

/* Uma explicação substitui a sequência anterior de destaques e etapas. */
.ap-home-visao {
	display: flex;
	align-items: center;
	min-height: 32rem;
	padding-block: clamp(5rem, 8vw, 8rem);
	background: var(--ap-fundo);
}

.ap-home-visao .ap-container {
	max-width: 50rem;
	text-align: center;
}

.ap-home-visao h2 {
	max-width: 16ch;
	margin: 0 auto 2rem;
	font-size: clamp(2.45rem, 4.3vw, 4.2rem);
	line-height: 1.11;
	letter-spacing: -.052em;
	text-wrap: balance;
}

.ap-home-visao p {
	max-width: 48ch;
	margin: 0 auto;
	color: var(--ap-texto-suave);
	font-size: clamp(1rem, 1.3vw, 1.17rem);
	line-height: 1.78;
}

/* Quatro áreas com a mesma importância, sempre em duas colunas. */
.ap-areas {
	padding-block: clamp(4.5rem, 7vw, 8rem);
	background: var(--ap-escuro);
	scroll-margin-top: 5rem;
}

.ap-areas__intro {
	display: block;
	min-height: 0;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
	padding: 0;
	background: none;
}

.ap-areas__intro h2 {
	max-width: none;
	font-size: clamp(2.35rem, 4vw, 4.25rem);
	line-height: 1.1;
}

.ap-areas__grade {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: rgba(244, 244, 244, .36);
}

.ap-area,
.ap-area:last-child {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	min-width: 0;
	min-height: clamp(14rem, 22vw, 21rem);
	gap: 2rem;
	padding: clamp(1.4rem, 3vw, 3rem);
	border: 0;
	background: linear-gradient(155deg, rgba(47, 47, 61, .16), rgba(34, 34, 44, .8)), repeating-linear-gradient(115deg, #393947 0 54px, #30303e 54px 58px);
}

.ap-area:nth-child(2) {
	background: linear-gradient(155deg, rgba(47, 47, 61, .18), rgba(34, 34, 44, .75)), repeating-linear-gradient(115deg, #333341 0 68px, #272733 68px 72px);
}

.ap-area:nth-child(3) {
	background: linear-gradient(100deg, rgba(34, 34, 44, .55), rgba(47, 47, 61, .45)), repeating-linear-gradient(115deg, #3b3b49 0 84px, #292936 84px 88px);
}

.ap-area:nth-child(4) {
	background: linear-gradient(135deg, transparent 77%, rgba(200, 16, 46, .17) 77%), linear-gradient(155deg, rgba(47, 47, 61, .16), rgba(34, 34, 44, .8)), repeating-linear-gradient(115deg, #393947 0 54px, #30303e 54px 58px);
}

.ap-area::before { display: none; }

.ap-area h3 {
	max-width: 14ch;
	margin: 0;
	color: var(--ap-claro);
	font-size: clamp(1.45rem, 2.65vw, 2.9rem);
	line-height: 1.14;
	letter-spacing: -.045em;
	text-wrap: balance;
}

.ap-area__chamada {
	align-self: flex-start;
	justify-self: auto;
	max-width: none;
	margin: 0;
	padding-bottom: .25rem;
	border-bottom: 1px solid var(--ap-marca);
	color: var(--ap-claro);
	font-size: .82rem;
	font-weight: 600;
	text-decoration: none;
}

.ap-area--link:hover h3,
.ap-area:focus-within h3 { color: #fff; }

.ap-area--link:hover { box-shadow: inset 0 0 0 1px rgba(244, 244, 244, .45); }

.ap-area:focus-within {
	outline: 2px solid var(--ap-claro);
	outline-offset: -4px;
}

/* O formulário é o caminho direto; WhatsApp permanece uma alternativa. */
/* Artigos recentes: so existe no HTML depois do primeiro artigo publicado. */
.ap-home-conteudos {
	padding-block: clamp(4.5rem, 7vw, 7rem);
	background: var(--ap-fundo-alt);
}

.ap-home-conteudos h2 {
	margin: 0 0 clamp(2rem, 4vw, 3rem);
	font-size: clamp(2.15rem, 4vw, 3.6rem);
	line-height: 1.1;
}

.ap-home-conteudos .ap-post-resumo h3 {
	max-width: 32ch;
	margin: 0 0 .6rem;
	font-size: clamp(1.25rem, 2vw, 1.6rem);
	line-height: 1.3;
	letter-spacing: -.02em;
}

.ap-home-conteudos .ap-post-resumo h3 a { color: var(--ap-texto); text-decoration: none; }
.ap-home-conteudos .ap-post-resumo h3 a:hover,
.ap-home-conteudos .ap-post-resumo h3 a:focus-visible { color: var(--ap-marca); }
.ap-home-conteudos .ap-post-resumo { padding-block: 1.75rem; }
.ap-home-conteudos .ap-post-resumo:first-child { padding-top: 0; }

.ap-home-conteudos__todos { margin: 2rem 0 0; font-weight: 600; }
.ap-home-conteudos__todos a { color: var(--ap-marca); }

.ap-home-contato {
	padding-block: clamp(4.5rem, 7vw, 7rem);
	background: var(--ap-fundo);
	scroll-margin-top: 5rem;
}

.ap-home-contato__grade {
	display: grid;
	grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
	grid-template-areas: "intro formulario" "alternativa formulario";
	grid-template-rows: auto 1fr;
	gap: 2.5rem clamp(3rem, 7vw, 8rem);
	align-items: start;
	max-width: var(--ap-largura-max);
	padding-inline: 1.5rem;
	border: 0;
	background: transparent;
}

.ap-home-contato__intro {
	grid-area: intro;
	display: block;
	min-height: 0;
	padding: 1rem 0 0;
	background: var(--ap-fundo);
}

.ap-home-contato__intro h2 {
	max-width: 12ch;
	margin: 0 0 1.4rem;
	color: var(--ap-texto);
	font-size: clamp(2.7rem, 4vw, 4.2rem);
	line-height: 1.1;
}

.ap-home-contato__intro > p:not(.ap-home-contato__rotulo) {
	max-width: 34ch;
	margin: 0;
	color: var(--ap-texto-suave);
	font-size: clamp(1rem, 1.25vw, 1.15rem);
	line-height: 1.75;
}

.ap-home-contato__formulario {
	grid-area: formulario;
	justify-self: end;
	width: 100%;
	max-width: 43rem;
	padding: clamp(1.4rem, 3vw, 3rem);
	border: 1px solid var(--ap-linha);
	border-radius: .5rem;
	background: var(--ap-fundo-alt);
	scroll-margin-top: 5rem;
}

.ap-home-contato .ap-contato__formulario {
	padding: 0;
	background: transparent;
}

.ap-home-contato__limite {
	margin: 1.75rem 0 0;
	padding-top: 1.25rem;
	border-top: 1px solid var(--ap-linha);
	color: var(--ap-texto-suave);
	font-size: .78rem;
	line-height: 1.7;
}

.ap-home-contato__alternativa {
	grid-area: alternativa;
	align-self: start;
}

.ap-home-contato__alternativa p {
	margin: 0 0 1rem;
	color: var(--ap-texto-suave);
	font-size: .9rem;
}

.ap-home-contato__whatsapp {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3.25rem;
	max-width: 100%;
	padding: .8rem 1.2rem;
	border: 1px solid var(--ap-marca);
	border-radius: .4rem;
	background: transparent;
	color: var(--ap-marca);
	font-size: .85rem;
	font-weight: 700;
	text-decoration: none;
}

.ap-home-contato__whatsapp:hover,
.ap-home-contato__whatsapp:focus-visible {
	background: var(--ap-marca);
	color: #fff;
}

/* Rodapé vermelho, com contato, páginas, áreas e informação legal. */
.ap-rodape {
	padding: clamp(3.25rem, 5vw, 5rem) 0 2rem;
	background: var(--ap-marca-escura);
}

.ap-geometria--rodape { display: none; }

.ap-rodape__grade {
	grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr) minmax(0, .9fr) minmax(0, .85fr);
	gap: 2.5rem clamp(1.5rem, 3vw, 4rem);
}

.ap-rodape__identidade { padding-bottom: 2rem; }
.ap-rodape__marca-link { display: inline-block; }
.ap-rodape__identidade .ap-rodape__marca img { width: min(100%, 20rem); height: auto; }
.ap-rodape__grade .ap-rodape__contato { grid-column: 1; }
.ap-rodape__grade .ap-rodape__paginas { grid-column: 2; }
.ap-rodape__grade .ap-rodape__areas { grid-column: 3; }
.ap-rodape__grade .ap-rodape__info { grid-column: 4; }
.ap-rodape__grade .ap-rodape__contato h2,
.ap-rodape__grade .ap-rodape__paginas h2,
.ap-rodape__grade .ap-rodape__areas h2,
.ap-rodape__grade .ap-rodape__info h2 {
	margin-bottom: 1.25rem;
	color: rgba(var(--ap-claro-rgb), .8);
	font-size: .8rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.ap-rodape__paginas li,
.ap-rodape__areas li { margin-bottom: .85rem; }
.ap-rodape__base { margin-top: 2rem; }

.ap-politica-indice {
	margin: 2.5rem 0 3rem;
	padding: 1.5rem clamp(1.25rem, 4vw, 2rem);
	border-left: 3px solid var(--ap-marca);
	background: #f6f6f7;
}

.ap-politica-indice strong { display: block; margin-bottom: .6rem; }
.ap-politica-indice ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 1.5rem;
	margin: 0;
	padding-left: 1.25rem;
}
.ap-politica-indice li { margin: .2rem 0; }
.ap-politica-indice a { color: var(--ap-texto); text-underline-offset: .2em; }
.ap-politica-indice a:hover { color: var(--ap-marca); }
.ap-politica-indice + h2 { margin-top: 0; }
.ap-conteudo h2[id] { scroll-margin-top: 5rem; }

.ap-atuacao__indice-fecho { padding-block: 5rem; }

@media (min-width: 961px) and (max-width: 1199px) {
	body.home .ap-abertura__figuras { width: calc(100% + max(0px, (100vw - var(--ap-largura-max)) / 4)); }
}

@media (max-width: 960px) {
	.ap-rodape__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ap-rodape__grade .ap-rodape__contato,
	.ap-rodape__grade .ap-rodape__areas { grid-column: 1; grid-row: auto; }
	.ap-rodape__grade .ap-rodape__paginas,
	.ap-rodape__grade .ap-rodape__info { grid-column: 2; grid-row: auto; }

	.ap-home-contato__grade { column-gap: 3rem; }
}

/* Abertura empilhada: até 960 px e em qualquer janela em retrato, inclusive
   monitores verticais largos. Os retratos escalam pela largura; por isso a
   altura do cenário, o esmaecimento e a posição do texto derivam dessa mesma
   largura, e nunca da altura da tela. Assim a base reta dos recortes fica
   sempre sob o esmaecimento e o texto vem logo abaixo das pessoas. */
@media (max-width: 960px), (orientation: portrait) {
	body.home .ap-abertura {
		--ap-fig-topo: 1.25rem;
		--ap-fig-escala: 1.16;
		--ap-fig-base: calc(var(--ap-fig-topo) + var(--ap-fig-escala) * 100vw / 1.52);
		--ap-cabecalho-altura: 4.625rem;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		align-items: stretch;
		gap: 0;
		min-height: min(calc(100svh - var(--ap-cabecalho-altura)), calc(var(--ap-fig-base) + 24rem));
		padding: 0;
	}

	body.home .ap-abertura__cenario {
		bottom: auto;
		height: var(--ap-fig-base);
		mask-image: none;
		-webkit-mask-image: none;
		background-image: repeating-linear-gradient(115deg, var(--ap-escuro) 0 68px, var(--ap-escuro-forte) 68px 73px);
	}

	body.home .ap-abertura__cenario::after {
		display: block;
		/* O plano atravessa o limite superior do cenário também no celular. */
		top: -18%;
		right: -8%;
		bottom: auto;
		width: 44%;
		min-width: 0;
		height: 128%;
		border-radius: 0;
		box-shadow: none;
		transform: rotate(-7deg);
	}

	body.home .ap-abertura__figuras {
		position: absolute;
		grid-column: auto;
		grid-row: auto;
		top: var(--ap-fig-topo);
		left: calc((1 - var(--ap-fig-escala)) * 50%);
		width: calc(var(--ap-fig-escala) * 100%);
		max-width: none;
		margin: 0;
		aspect-ratio: 1.52;
		overflow: visible;
		transform: none;
	}

	body.home .ap-abertura__figuras::before { content: none; }

	/* Cobre a base dos dois recortes e a parte da figura da direita que passa
	   da caixa; termina em grafite liso, que segue sob o texto. */
	body.home .ap-abertura__figuras::after {
		content: "";
		position: absolute;
		z-index: 3;
		left: 0;
		right: 0;
		top: 55%;
		bottom: -32%;
		background: linear-gradient(180deg, rgba(34, 34, 44, 0) 0%, rgba(34, 34, 44, .5) 30%, rgba(34, 34, 44, .9) 45%, var(--ap-escuro-forte) 55%);
	}

	body.home .ap-abertura::after { content: none; }

	body.home .ap-abertura__interno {
		position: relative;
		width: 100%;
		max-width: 42rem;
		margin: 0 auto;
		padding: calc(var(--ap-fig-topo) + var(--ap-fig-escala) * 100% / 1.52) 2rem 2.75rem;
	}

	body.home .ap-abertura__titulo {
		max-width: 13ch;
		font-size: clamp(2.4rem, 5.5vw, 3.4rem);
	}
}

/* Em paisagem, a altura não passa de uma proporção da largura, para que os
   retratos não fiquem pequenos no pé de uma abertura alta demais. */
@media (min-width: 961px) and (orientation: landscape) {
	body.home .ap-abertura { min-height: max(39rem, min(calc(100svh - 4.625rem), 66vw)); }
}

@media (max-width: 720px) {
	.ap-politica-indice ul { grid-template-columns: minmax(0, 1fr); }
	:root { --ap-margem-ancora: 3.75rem; }
	.ap-cabecalho__interno { background: var(--ap-escuro); }
	.ap-cabecalho .ap-marca,
	.ap-cabecalho .ap-marca__custom { min-height: 3.625rem; padding-inline: 1.25rem; }
	body.home .ap-abertura {
		--ap-fig-topo: clamp(2.25rem, 7svh, 4.25rem);
		--ap-fig-escala: 1.1;
		--ap-cabecalho-altura: 3.75rem;
	}

	/* Os rostos ocupam a metade esquerda da caixa técnica das fotos. Este recuo
	   centraliza a silhueta visível da dupla, mantendo margem nos dois lados. */
	body.home .ap-abertura__figuras {
		left: calc((1 - var(--ap-fig-escala)) * 50% + 3.15vw);
	}

	/* A escala menor devolve margem à cabeça de Jeferson. O tratamento de cor
	   e a sombra mais leve integram os recortes ao cenário sem apagar detalhes. */
	body.home .ap-abertura__figura {
		filter: drop-shadow(0 .15rem .45rem rgba(0, 0, 0, .55))
			drop-shadow(.15rem .35rem 1rem rgba(0, 0, 0, .4));
	}

	body.home .ap-abertura__figura img {
		filter: saturate(.85) contrast(.96) brightness(.9);
	}

	/* Filtro mais leve na foto dele, que ja chega mais apagada (ver style.css). */
	body.home .ap-abertura__figura--jefferson img {
		filter: saturate(.97) brightness(.96);
	}

	body.home .ap-abertura__interno {
		max-width: 34rem;
		padding-inline: clamp(1.4rem, 6vw, 2rem);
	}

	body.home .ap-abertura__olho {
		margin-bottom: 1.2rem;
		font-size: .7rem;
		letter-spacing: .08em;
	}

	body.home .ap-abertura__titulo {
		font-size: clamp(2.15rem, 8.6vw, 3.25rem);
		margin-bottom: 1.75rem;
	}

	.ap-home-visao {
		min-height: 29rem;
		padding-block: 5.25rem;
	}

	.ap-home-visao .ap-container {
		max-width: 39rem;
		padding-inline: clamp(1.5rem, 7vw, 2.5rem);
	}

	.ap-home-visao h2 {
		max-width: 14ch;
		margin-bottom: 1.8rem;
		font-size: clamp(2rem, 8vw, 2.85rem);
	}

	.ap-home-visao p { max-width: 39ch; font-size: 1rem; }

	.ap-areas { padding-block: 4.5rem 4.75rem; }
	.ap-areas > .ap-container { padding-inline: 1.25rem; }
	.ap-areas__intro { margin-bottom: 2rem; }
	.ap-areas__intro h2 { font-size: clamp(2.15rem, 8vw, 3rem); }

	.ap-area,
	.ap-area:last-child {
		min-height: 13rem;
		gap: 1.5rem;
		padding: 1.4rem 1.2rem;
	}

	.ap-area h3 {
		max-width: 11ch;
		font-size: clamp(1.3rem, 5.2vw, 1.8rem);
		line-height: 1.18;
	}

	.ap-area__chamada { font-size: .75rem; }

	.ap-home-contato { padding-block: 4.5rem; }
	.ap-home-contato__grade {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: "intro" "formulario" "alternativa";
		gap: 2rem;
		padding-inline: clamp(1.25rem, 6vw, 2rem);
	}
	.ap-home-contato__intro {
		display: block;
		min-height: 0;
		padding: 0;
	}

	.ap-home-contato__intro h2 {
		max-width: 15ch;
		margin-bottom: 1.1rem;
		font-size: clamp(2.25rem, 8vw, 3.1rem);
	}

	.ap-home-contato__intro > p:not(.ap-home-contato__rotulo) {
		max-width: 34ch;
		margin-bottom: 0;
		font-size: 1rem;
	}

	.ap-home-contato__formulario {
		justify-self: stretch;
		max-width: none;
		padding: clamp(1.25rem, 5vw, 2rem);
	}

	.ap-rodape__grade {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.8rem;
	}

	.ap-rodape__grade .ap-rodape__contato,
	.ap-rodape__grade .ap-rodape__paginas,
	.ap-rodape__grade .ap-rodape__areas,
	.ap-rodape__grade .ap-rodape__info { grid-column: 1; grid-row: auto; }
	.ap-rodape__identidade { padding-bottom: 1.75rem; }
	.ap-rodape__identidade .ap-rodape__marca img { width: min(100%, 18rem); }
	.ap-rodape__contatos .ap-rodape__contato-item { margin-bottom: 1rem; }

	/* No celular o rodape inteiro fica centralizado, em uma coluna. */
	.ap-rodape__grade,
	.ap-rodape__base { text-align: center; }
	.ap-rodape__identidade { align-items: center; justify-content: center; }
	.ap-rodape__contatos .ap-rodape__contato-item {
		display: flex;
		justify-content: center;
		align-items: flex-start;
	}
	.ap-rodape__whatsapp { display: inline-flex; margin-inline: auto; }
	.ap-rodape__base { align-items: center; }
	.ap-atuacao__indice-fecho { padding-block: 3.5rem; }
}

@media (max-width: 360px) {
	body.home .ap-abertura { --ap-fig-topo: 4.25rem; }
	.ap-area,
	.ap-area:last-child { padding-inline: 1rem; }
}