/**
 * Primeira Essência — Home (Hero, Essência, Pilares, Estrutura de Som).
 * Específico da página inicial; não carregado nas demais páginas.
 */

.text-gold {
	color: var(--pe-color-gold);
}

/* ---------- Hero ---------- */

.hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	/* Banner cinematográfico compacto, na proporção da referência visual —
	   não um hero de altura de viewport inteira. */
	min-height: clamp(460px, 62vh, 640px);
	overflow: hidden;
	isolation: isolate;
}

.hero__media,
.hero__media--fallback {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.hero__media__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 38%;
}

.hero__media--fallback {
	background:
		radial-gradient(ellipse 60% 45% at 50% 0%, rgba(212, 175, 55, 0.16), transparent 70%),
		radial-gradient(circle at 12% 90%, rgba(184, 135, 74, 0.14), transparent 55%),
		repeating-linear-gradient(115deg, rgba(245, 242, 236, 0.025) 0px, rgba(245, 242, 236, 0.025) 1px, transparent 1px, transparent 68px),
		linear-gradient(160deg, var(--pe-graphite-light) 0%, var(--pe-black) 78%);
}

.hero__media--fallback::before {
	content: '';
	position: absolute;
	inset: clamp(1.25rem, 3vw, 2.5rem);
	border: 1px solid rgba(212, 175, 55, 0.2);
}

.hero__overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(0deg, rgba(13, 13, 16, 0.9) 0%, rgba(13, 13, 16, 0.45) 38%, rgba(13, 13, 16, 0.55) 100%),
		linear-gradient(90deg, rgba(13, 13, 16, 0.8) 0%, rgba(13, 13, 16, 0.2) 60%, rgba(13, 13, 16, 0.05) 100%);
}

.hero__inner {
	width: 100%;
	/* Respiro maior abaixo do header (sticky/transparente, 96px) — o título
	   não deve começar colado na navegação. */
	padding-block: clamp(8.5rem, 20vh, 10.5rem) clamp(3rem, 8vh, 4rem);
}

.hero__media--fallback ~ .hero__inner {
	/* Mínimo de 6.5rem garante espaço livre abaixo do header (96px) mesmo
	   em viewports baixos, evitando sobreposição com o título do Hero. */
	padding-block: clamp(6.5rem, 10vh, 7rem);
}

.hero:has(.hero__media--fallback) {
	align-items: center;
	/* Sem imagem real, o Hero não tem o que preencher um palco cinematográfico
	   inteiro — compactado para não parecer espaço desperdiçado. */
	min-height: clamp(420px, 52vh, 540px);
}

.hero__content {
	max-width: 800px;
}

.hero__title {
	color: #fff;
	font-size: var(--pe-text-display);
	margin-bottom: var(--pe-space-5);
}

.hero__subtitle {
	max-width: 48ch;
	font-size: 1.15rem;
	color: rgba(245, 242, 236, 0.88);
	margin-bottom: var(--pe-space-8);
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pe-space-3) var(--pe-space-6);
}

.hero__actions .btn--primary {
	padding: 1.05rem 2.25rem;
	font-size: 0.9rem;
}

.hero__actions .btn--text {
	font-size: 1.05rem;
}

.hero__scroll {
	position: absolute;
	left: 50%;
	bottom: var(--pe-space-6);
	transform: translateX(-50%);
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--pe-color-border-gold);
	border-radius: var(--pe-radius-pill);
	color: var(--pe-color-gold);
}

.hero__scroll svg {
	width: 16px;
	height: 16px;
}

@media (min-width: 768px) {
	.hero__scroll {
		display: flex;
	}
}

/* ---------- Essência ---------- */

.essencia {
	background: var(--pe-color-bg);
	padding-block: var(--pe-space-14) var(--pe-space-10);
}

.essencia__grid {
	display: grid;
	grid-template-columns: 1fr;
	align-items: center;
	gap: var(--pe-space-8);
}

.essencia__title {
	margin-bottom: var(--pe-space-5);
}

.essencia__text p {
	font-size: 1.1rem;
	line-height: var(--pe-leading-normal);
	margin-bottom: var(--pe-space-6);
}

.essencia__media {
	aspect-ratio: 4 / 5;
	border-radius: var(--pe-radius-lg);
	overflow: hidden;
}

.essencia__media--fallback {
	/* Mais contida que uma foto real (4/5) — um painel vazio não deve
	   reivindicar a mesma altura que uma imagem protagonista faria. */
	aspect-ratio: 4 / 3;
	border-radius: var(--pe-radius-lg);
	overflow: hidden;
	align-self: center;
}

.essencia__media__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.essencia__media--fallback {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background:
		radial-gradient(ellipse 70% 60% at 30% 20%, rgba(212, 175, 55, 0.16), transparent 60%),
		linear-gradient(160deg, var(--pe-graphite-light), var(--pe-black));
	border: 1px solid var(--pe-color-border-gold);
}

.essencia__media--fallback::before {
	content: '';
	position: absolute;
	inset: var(--pe-space-4);
	border: 1px solid rgba(212, 175, 55, 0.18);
	border-radius: var(--pe-radius-md);
}

/* Glifo decorativo (alianças) via mask-image — sem depender de um filho real
   dentro do fallback vazio de pe_media(), nunca finge ser fotografia. */
.essencia__media--fallback::after {
	content: '';
	position: relative;
	width: 84px;
	height: 84px;
	background-color: rgba(212, 175, 55, 0.35);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Ccircle cx='9' cy='14' r='5'/%3E%3Ccircle cx='15' cy='14' r='5'/%3E%3Cpath d='M9 9.5 10.3 5h3.4l1.3 4.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Ccircle cx='9' cy='14' r='5'/%3E%3Ccircle cx='15' cy='14' r='5'/%3E%3Cpath d='M9 9.5 10.3 5h3.4l1.3 4.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

@media (min-width: 1024px) {
	.essencia__grid {
		grid-template-columns: 0.9fr 1.1fr;
		gap: var(--pe-space-12);
	}

	.essencia__media,
	.essencia__media--fallback {
		order: 2;
	}
}

/* ---------- Pilares ---------- */

.pilares {
	background: var(--pe-color-bg);
	padding-block: 0 var(--pe-space-14);
}

.pilares__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--pe-space-10);
	max-width: 1140px;
	margin-inline: auto;
	padding-top: var(--pe-space-10);
	border-top: 1px solid var(--pe-color-border);
}

.pilar__icon {
	display: inline-flex;
	color: var(--pe-color-gold);
	width: 46px;
	height: 46px;
	margin-bottom: var(--pe-space-5);
}

.pilar__title {
	font-size: 1.25rem;
	margin-bottom: var(--pe-space-3);
}

.pilar__desc {
	font-size: 1rem;
	line-height: var(--pe-leading-normal);
	margin: 0;
}

@media (min-width: 768px) {
	.pilares__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--pe-space-10) var(--pe-space-8);
	}
}

@media (min-width: 1024px) {
	.pilares__grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.pilar {
		padding-left: var(--pe-space-6);
		border-left: 1px solid var(--pe-color-border);
	}

	.pilar:first-child {
		padding-left: 0;
		border-left: 0;
	}
}

/* ---------- Estrutura de Som (Home) ---------- */

.home-estrutura {
	position: relative;
	display: flex;
	align-items: center;
	/* Banner de contexto compacto, não um segundo Hero de altura de viewport. */
	min-height: clamp(380px, 48vh, 480px);
	overflow: hidden;
	isolation: isolate;
}

.home-estrutura:has(.home-estrutura__media--fallback) {
	/* Sem imagem real não há informação visual para preencher um banner
	   cinematográfico inteiro — compactado e tratado como bloco editorial. */
	min-height: 0;
}

.home-estrutura__media,
.home-estrutura__media--fallback {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.home-estrutura__media__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-estrutura__media--fallback {
	background:
		radial-gradient(ellipse 55% 70% at 85% 30%, rgba(212, 175, 55, 0.16), transparent 60%),
		radial-gradient(circle at 15% 85%, rgba(184, 135, 74, 0.12), transparent 50%),
		repeating-linear-gradient(115deg, rgba(245, 242, 236, 0.02) 0px, rgba(245, 242, 236, 0.02) 1px, transparent 1px, transparent 68px),
		linear-gradient(160deg, var(--pe-graphite-light) 0%, var(--pe-black) 80%);
}

.home-estrutura__overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(13, 13, 16, 0.9) 0%, rgba(13, 13, 16, 0.55) 48%, rgba(13, 13, 16, 0.25) 100%);
}

.home-estrutura__inner {
	width: 100%;
	padding-block: var(--pe-space-12);
}

.home-estrutura:has(.home-estrutura__media--fallback) .home-estrutura__inner {
	padding-block: var(--pe-space-10);
}

.home-estrutura__content {
	max-width: 600px;
	padding-left: var(--pe-space-4);
	border-left: 2px solid var(--pe-color-gold);
}

@media (min-width: 640px) {
	.home-estrutura__content {
		padding-left: var(--pe-space-6);
	}
}

.home-estrutura__content .eyebrow {
	margin-bottom: var(--pe-space-4);
}

.home-estrutura__content h2 {
	color: #fff;
	margin-bottom: var(--pe-space-5);
}

.home-estrutura__content p {
	font-size: 1.1rem;
	margin-bottom: var(--pe-space-8);
	color: rgba(245, 242, 236, 0.82);
}

/* ---------- Músicos ---------- */

.home-musicos {
	background: var(--pe-color-bg);
	padding-block: var(--pe-space-14);
}

.home-musicos--compact {
	padding-block: var(--pe-space-10);
}

.home-musicos__head {
	max-width: 640px;
	margin: 0 auto var(--pe-space-10);
	text-align: center;
}

.home-musicos--compact .home-musicos__head {
	margin-bottom: 0;
}

.home-musicos__head p {
	margin-top: var(--pe-space-4);
}

.home-musicos__head .btn {
	margin-top: var(--pe-space-6);
}

.home-musicos__row {
	display: flex;
	gap: var(--pe-space-5);
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	padding-bottom: var(--pe-space-2);
}

.home-musicos__row::-webkit-scrollbar {
	display: none;
}

.home-musicos__row .musico-card {
	flex: 0 0 190px;
	scroll-snap-align: start;
}

/* Cards maiores que o padrão compartilhado com as páginas internas — os
   profissionais precisam ler como protagonistas aqui, não como miniatura. */
.home-musicos .musico-card__media,
.home-musicos .musico-card__media--fallback {
	aspect-ratio: 4 / 5;
}

.home-musicos .musico-card__body {
	padding-top: var(--pe-space-4);
}

.home-musicos .musico-card__nome {
	font-size: 1.2rem;
}

.home-musicos .musico-card__instrumento {
	font-size: 0.9375rem;
	margin-bottom: var(--pe-space-3);
}

.home-musicos .musico-card__link {
	font-size: 0.875rem;
}

.home-musicos__cta {
	text-align: center;
	margin-top: var(--pe-space-10);
}

@media (min-width: 1024px) {
	.home-musicos__row {
		overflow-x: visible;
		/* nowrap + flex:1 1 0 (não wrap) — com até 6 itens variáveis, um
		   flex-wrap tradicional quebra o último card para uma 2ª linha assim
		   que a soma das larguras-base excede o container (mesma classe de
		   bug corrigida em Formações). Aqui os cards encolhem juntos em vez
		   de quebrar linha, sempre numa única fileira. */
		flex-wrap: nowrap;
		justify-content: center;
		gap: var(--pe-space-6);
	}

	.home-musicos__row .musico-card {
		flex: 1 1 0;
		min-width: 0;
		max-width: 220px;
	}
}

@media (min-width: 1280px) {
	.home-musicos .container {
		max-width: 1400px;
	}

	.home-musicos__row .musico-card {
		max-width: 230px;
	}
}

/* ---------- Histórias ---------- */

.home-historias {
	background: var(--pe-color-surface);
	padding-block: var(--pe-space-14);
}

.home-historias--compact {
	padding-block: var(--pe-space-10);
}

.home-historias__layout {
	display: flex;
	flex-direction: column;
	gap: var(--pe-space-8);
}

.home-historias__intro {
	max-width: 460px;
}

.home-historias__intro p {
	font-size: 1.1rem;
	margin: var(--pe-space-4) 0 var(--pe-space-5);
}

.home-historias__carousel {
	min-width: 0;
}

.home-historias__controls {
	display: flex;
	gap: var(--pe-space-2);
	justify-content: flex-end;
	margin-bottom: var(--pe-space-4);
}

.home-historias__controls[hidden] {
	display: none;
}

.home-historias__controls button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--pe-color-border-gold);
	border-radius: var(--pe-radius-pill);
	color: var(--pe-color-gold);
	transition: background-color var(--pe-transition-base), color var(--pe-transition-base);
}

.home-historias__controls button:hover:not(:disabled) {
	background: var(--pe-color-gold);
	color: var(--pe-black);
}

.home-historias__controls button:disabled {
	opacity: 0.35;
	cursor: default;
}

.home-historias__controls svg {
	width: 16px;
	height: 16px;
}

.home-historias__prev svg {
	transform: rotate(180deg);
}

.home-historias__track {
	display: flex;
	gap: var(--pe-space-5);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}

.home-historias__track::-webkit-scrollbar {
	display: none;
}

.home-historias__track .historia-card {
	flex: 0 0 260px;
	scroll-snap-align: start;
}

/* Fotografia com mais protagonismo que o padrão compartilhado com o archive
   interno — título/excerpt também maiores para acompanhar. */
.home-historias .historia-card__body {
	padding: var(--pe-space-5);
}

.home-historias .historia-card__body h3 {
	font-size: 1.25rem;
}

.home-historias .historia-card__excerpt {
	font-size: 0.9375rem;
}

@media (min-width: 1024px) {
	.home-historias__layout {
		flex-direction: row;
		gap: var(--pe-space-10);
	}

	.home-historias__intro {
		flex: 0 0 280px;
	}

	.home-historias__carousel {
		flex: 1;
	}

	.home-historias--compact .home-historias__layout {
		justify-content: center;
	}

	.home-historias--compact .home-historias__intro {
		flex: 0 1 640px;
		max-width: 640px;
		text-align: center;
		margin-inline: auto;
	}

	.home-historias__track .historia-card {
		flex-basis: 320px;
	}
}

@media (min-width: 1280px) {
	.home-historias .container {
		max-width: 1360px;
	}
}

/* ---------- Como Trabalhamos ---------- */

.processo {
	background: var(--pe-color-bg);
	padding-block: var(--pe-space-14);
}

.processo__title {
	text-align: center;
	max-width: 760px;
	margin: 0 auto var(--pe-space-10);
	font-size: var(--pe-text-h1);
}

.processo__timeline {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--pe-space-8);
	max-width: 1320px;
	margin-inline: auto;
}

.processo__step {
	position: relative;
	padding-left: var(--pe-space-12);
}

.processo__step::before {
	content: '';
	position: absolute;
	left: 35px;
	top: 84px;
	bottom: -32px;
	width: 1px;
	background: var(--pe-color-border-gold);
}

.processo__step:last-child::before {
	display: none;
}

.processo__number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 72px;
	height: 72px;
	border: 1px solid var(--pe-color-gold);
	border-radius: var(--pe-radius-pill);
	color: var(--pe-color-gold);
	font-family: var(--pe-font-display);
	font-size: 1.375rem;
	background: var(--pe-color-bg);
}

.processo__step-title {
	font-size: 1.625rem;
	margin-bottom: var(--pe-space-3);
}

.processo__step-text {
	font-size: 1.1rem;
	color: var(--pe-color-text-muted);
	margin: 0;
	max-width: 34ch;
}

.processo__frase {
	text-align: center;
	margin: var(--pe-space-10) 0 0;
	font-family: var(--pe-font-display);
	font-size: var(--pe-text-h2);
	color: var(--pe-color-text);
}

@media (min-width: 1024px) {
	.processo__timeline {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--pe-space-4);
	}

	.processo__timeline::before {
		content: '';
		position: absolute;
		left: 10%;
		right: 10%;
		top: 36px;
		height: 1px;
		background: var(--pe-color-border-gold);
	}

	.processo__step {
		flex: 1;
		padding-left: 0;
		padding-top: 5.5rem;
		text-align: center;
	}

	.processo__step-text {
		max-width: none;
		margin-inline: auto;
	}

	.processo__step::before {
		display: none;
	}

	.processo__number {
		left: 50%;
		top: 0;
		transform: translateX(-50%);
	}
}

/* ---------- Formações ---------- */

.home-formacoes {
	background: var(--pe-color-surface);
	padding-block: var(--pe-space-14);
}

.home-formacoes--compact {
	padding-block: var(--pe-space-10);
}

.home-formacoes--compact {
	padding-block: var(--pe-space-12);
}

.home-formacoes__layout {
	display: flex;
	flex-direction: column;
	gap: var(--pe-space-8);
}

.home-formacoes__intro {
	max-width: 460px;
}

.home-formacoes__intro p {
	font-size: 1.1rem;
	margin: var(--pe-space-4) 0 var(--pe-space-6);
}

.home-formacoes__row {
	display: flex;
	gap: var(--pe-space-4);
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	min-width: 0;
}

.home-formacoes__row::-webkit-scrollbar {
	display: none;
}

.home-formacoes__row .formacao-card {
	flex: 0 0 160px;
	scroll-snap-align: start;
}

.home-formacoes__row .formacao-card__body h3 {
	font-size: 1.0625rem;
}

.home-formacoes__row .formacao-card__body p {
	font-size: 0.9375rem;
}

@media (min-width: 1024px) {
	.home-formacoes__layout {
		flex-direction: row;
		gap: var(--pe-space-10);
		align-items: flex-start;
	}

	.home-formacoes__intro {
		flex: 0 0 280px;
		padding-top: var(--pe-space-4);
	}

	.home-formacoes__row {
		flex: 1;
		overflow-x: visible;
		flex-wrap: wrap;
	}

	.home-formacoes--compact .home-formacoes__layout {
		justify-content: center;
	}

	.home-formacoes--compact .home-formacoes__intro {
		flex: 0 1 640px;
		max-width: 640px;
		text-align: center;
		margin-inline: auto;
		padding-top: 0;
	}
}

@media (min-width: 1200px) {
	/* Na largura de aprovação desktop as formações (até 5, curadoria editorial
	   — nem sempre exatas 5) precisam caber numa única faixa horizontal
	   (referência visual). nowrap + flex:1 1 0 faz os cards encolherem juntos
	   em vez de quebrar linha (mesma correção aplicada em Músicos) — robusto
	   independente de quantos itens o editor selecionar, diferente de um grid
	   de colunas fixas que deixaria trilhas vazias com menos de 5. Container
	   desta seção alargado para dar respiro real aos cards em vez de
	   espremê-los. */
	.home-formacoes .container {
		max-width: 1400px;
	}

	.home-formacoes__row {
		flex-wrap: nowrap;
	}

	.home-formacoes__row .formacao-card {
		flex: 1 1 0;
		min-width: 0;
		max-width: 220px;
	}
}

/* ---------- Investimento ---------- */

.investimento {
	background: var(--pe-color-bg);
	padding-block: var(--pe-space-14);
}

.investimento__inner {
	/* Capítulo editorial apoiado direto no fundo da página — não mais um
	   card com moldura/fundo próprio flutuando isolado. */
	max-width: 900px;
	margin-inline: auto;
	padding: 0;
	text-align: center;
	background: none;
	border-top: 0;
	border-radius: 0;
}

.divider-gold--center {
	display: block;
	margin-inline: auto;
	margin-bottom: var(--pe-space-5);
}

.investimento__eyebrow {
	justify-content: center;
	margin-bottom: var(--pe-space-4);
}

.investimento h2 {
	font-size: var(--pe-text-h1);
	margin-bottom: var(--pe-space-5);
}

.investimento p {
	font-size: 1.15rem;
	max-width: 62ch;
	margin-inline: auto;
	margin-bottom: var(--pe-space-8);
}

/* ---------- Depoimentos ---------- */

.home-depoimentos {
	background: var(--pe-color-surface);
	padding-block: var(--pe-space-16);
}

.home-depoimentos__layout {
	display: flex;
	flex-direction: column;
	gap: var(--pe-space-8);
}

.home-depoimentos__intro {
	max-width: 420px;
}

.home-depoimentos__intro p {
	font-size: 1.1rem;
	margin: var(--pe-space-4) 0 var(--pe-space-5);
}

.home-depoimentos__carousel {
	min-width: 0;
}

.home-depoimentos__controls {
	display: flex;
	gap: var(--pe-space-2);
	justify-content: flex-end;
	margin-bottom: var(--pe-space-4);
}

.home-depoimentos__controls[hidden] {
	display: none;
}

.home-depoimentos__controls button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--pe-color-border-gold);
	border-radius: var(--pe-radius-pill);
	color: var(--pe-color-gold);
	transition: background-color var(--pe-transition-base), color var(--pe-transition-base);
}

.home-depoimentos__controls button:hover:not(:disabled) {
	background: var(--pe-color-gold);
	color: var(--pe-black);
}

.home-depoimentos__controls button:disabled {
	opacity: 0.35;
	cursor: default;
}

.home-depoimentos__controls svg {
	width: 18px;
	height: 18px;
}

.home-depoimentos__prev svg {
	transform: rotate(180deg);
}

.home-depoimentos__track {
	display: flex;
	gap: var(--pe-space-5);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}

.home-depoimentos__track::-webkit-scrollbar {
	display: none;
}

.depoimento-card {
	flex: 0 0 100%;
	scroll-snap-align: start;
	display: grid;
	grid-template-columns: 1fr;
	border-radius: var(--pe-radius-lg);
	overflow: hidden;
	border: 1px solid var(--pe-color-border);
	background: var(--pe-color-bg);
}

.depoimento-card__media,
.depoimento-card__media--fallback,
.depoimento-card__poster,
.depoimento-card__poster--fallback {
	aspect-ratio: 4 / 3;
	position: relative;
}

.depoimento-card__media__img,
.depoimento-card__poster__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.depoimento-card__media--fallback,
.depoimento-card__poster--fallback {
	background: linear-gradient(160deg, var(--pe-graphite-light), var(--pe-black));
}

.depoimento-card__media--video {
	position: relative;
	height: 100%;
}

.depoimento-card__play {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--pe-radius-pill);
	background: rgba(13, 13, 16, 0.55);
	border: 1px solid var(--pe-color-gold);
	color: var(--pe-color-gold);
	backdrop-filter: blur(2px);
	transition: background-color var(--pe-transition-base), transform var(--pe-transition-base);
}

.depoimento-card__play:hover {
	background: var(--pe-color-gold);
	color: var(--pe-black);
	transform: scale(1.05);
}

.depoimento-card__play svg {
	width: 20px;
	height: 20px;
}

.depoimento-card__media--video iframe {
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	display: block;
}

.depoimento-card__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--pe-space-8) var(--pe-space-6);
}

.depoimento-card__quote {
	font-family: var(--pe-font-display);
	font-size: 1.375rem;
	line-height: var(--pe-leading-snug);
	margin-bottom: var(--pe-space-5);
}

.depoimento-card__nome {
	font-size: 1.05rem;
	font-weight: 600;
	margin-bottom: 2px;
}

.depoimento-card__local {
	font-size: 0.9375rem;
	color: var(--pe-color-text-muted);
	margin-bottom: var(--pe-space-3);
}

.depoimento-card__link {
	display: inline-flex;
	align-items: center;
	gap: var(--pe-space-2);
	font-size: 0.8125rem;
	color: var(--pe-color-gold);
}

.depoimento-card__link svg {
	width: 14px;
	height: 14px;
}

@media (min-width: 768px) {
	.depoimento-card {
		/* Texto ganha um pouco mais de largura que a foto — evita que uma
		   citação real (mais longa que o texto de exemplo) vire uma coluna
		   estreita e desproporcionalmente alta. */
		grid-template-columns: 0.85fr 1.15fr;
		min-height: 420px;
	}

	.depoimento-card__media,
	.depoimento-card__media--fallback,
	.depoimento-card__media--video,
	.depoimento-card__poster,
	.depoimento-card__poster--fallback {
		aspect-ratio: auto;
		height: 100%;
	}

	.depoimento-card__body {
		padding: var(--pe-space-10);
	}

	.depoimento-card__quote {
		font-size: 1.5rem;
	}
}

@media (min-width: 1024px) {
	.home-depoimentos__layout {
		flex-direction: row;
		gap: var(--pe-space-10);
	}

	.home-depoimentos__intro {
		flex: 0 0 260px;
	}

	.home-depoimentos__carousel {
		flex: 1;
	}

	/* Coluna de depoimento mais larga que o mínimo — a citação não pode
	   ficar comprimida numa faixa estreita. */
	.depoimento-card {
		min-height: 460px;
	}

	.depoimento-card__quote {
		font-size: 1.5rem;
	}

	.depoimento-card__body {
		padding: var(--pe-space-10);
	}

	.depoimento-card__nome {
		font-size: 1.15rem;
	}

	.depoimento-card__local {
		font-size: 1rem;
	}
}

/* ---------- FAQ + Conversão — capítulo final compartilhado ---------- */
/* Na referência, dúvidas e formulário dividem uma única região visual
   (lado a lado no desktop) — não duas seções isoladas. Cada template-part
   continua dono do próprio conteúdo/campos ACF; só a moldura é comum. */

.home-faq-conversao {
	background: var(--pe-color-surface);
	padding-block: var(--pe-space-16);
}

.home-faq-conversao__grid {
	display: flex;
	flex-direction: column;
	gap: var(--pe-space-12);
}

.home-faq__head {
	max-width: 480px;
	margin-bottom: var(--pe-space-6);
}

.home-faq-conversao__faq .faq-list {
	max-width: none;
	margin-inline: 0;
}

/* .faq-list/.faq-item* moram em components.css (reaproveitados também em /faq/).
   Aqui só reforçamos escala + contraste: tanto os itens do FAQ quanto os campos
   do formulário abaixo usavam o mesmo fundo da seção (--pe-color-surface),
   ficando praticamente invisíveis a não ser pela borda de 12% de opacidade —
   por isso a leitura de "formulário técnico". Usar --pe-color-bg (preto) cria
   contraste real contra o grafite da seção, sem inventar um novo tom. */
.home-faq-conversao .faq-item {
	background: var(--pe-color-bg);
}

.home-faq-conversao .faq-item {
	transition: border-color var(--pe-transition-base);
}

.home-faq-conversao .faq-item:has(.faq-item__trigger:hover),
.home-faq-conversao .faq-item:has(.faq-item__trigger:focus-visible) {
	border-color: var(--pe-color-border-gold);
}

.home-faq-conversao .faq-item__trigger {
	padding: var(--pe-space-6) var(--pe-space-6);
	font-size: 1.125rem;
}

.home-faq-conversao .faq-item__answer {
	font-size: 1.0625rem;
}

.home-faq-conversao__form {
	width: 100%;
}

.home-faq-conversao .field input,
.home-faq-conversao .field textarea,
.home-faq-conversao .field select {
	background: var(--pe-color-bg);
	min-height: 3.25rem;
	padding: 0.95rem 1.15rem;
	font-size: 1.0625rem;
	border-color: rgba(245, 242, 236, 0.16);
	transition: border-color var(--pe-transition-base), box-shadow var(--pe-transition-base);
}

.home-faq-conversao .field input:focus,
.home-faq-conversao .field textarea:focus,
.home-faq-conversao .field select:focus {
	box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.16);
}

.home-faq-conversao .field label {
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: var(--pe-tracking-eyebrow);
	text-transform: uppercase;
	color: rgba(245, 242, 236, 0.55);
}

.home-faq-conversao .field {
	/* Mesmo objetivo de compactação de components.css, escopado aqui porque
	   os campos da Home são maiores (fonte/padding próprios) — gap um pouco
	   maior que o padrão para acompanhar a escala, ainda dentro da faixa
	   compacta pedida (4–7px label→input, 10–16px entre campos). */
	gap: 6px;
	margin-bottom: var(--pe-space-4);
}

.home-faq-conversao .field--destaque textarea {
	min-height: 8.5rem;
}

.home-faq-conversao .pe-form-submit {
	padding: 1.2rem 2.5rem;
	font-size: 0.9375rem;
	margin-top: var(--pe-space-4);
}

.conversao__intro {
	margin-bottom: var(--pe-space-6);
}

.conversao__intro .divider-gold {
	margin-bottom: var(--pe-space-5);
}

.conversao__intro h2 {
	margin-bottom: var(--pe-space-4);
}

.conversao__intro p {
	color: var(--pe-color-text-muted);
	font-size: 1.1rem;
	max-width: 46ch;
	margin: 0;
}

@media (min-width: 1024px) {
	.home-faq-conversao--split .home-faq-conversao__grid {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--pe-space-14);
	}

	.home-faq-conversao--split .home-faq-conversao__faq {
		flex: 0.9 1 0;
		min-width: 0;
	}

	.home-faq-conversao--split .home-faq-conversao__form {
		flex: 1.15 1 0;
		min-width: 0;
	}

	.conversao__intro h2 {
		font-size: var(--pe-text-h1);
	}
}

@media (min-width: 1280px) {
	.home-faq-conversao .container {
		max-width: 1360px;
	}
}