/*
Theme Name: SanPioTur
Description: Tema próprio do site SanPioTur — só aparência (layout, tipografia, header/footer, templates). Os dados vivem no plugin sanpio-core; trocar este tema não perde nenhum dado (docs/entrega-D, §1).
Version: 1.24.2
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.2
Author: SanPioTur
Text Domain: sanpio
*/

/* A aparência é definida quase toda em theme.json (tokens).
   Abaixo: aparência dos blocos dinâmicos do sanpio-core
   (a lógica vive no plugin; o visual, aqui — entrega D §5). */

/* ── tokens locais (ÚNICO lugar com hex fora do theme.json) ──
   Quando a identidade nova chegar, a troca de cores acontece
   aqui e no theme.json, em nenhum outro lugar. */
:root {
	--sanpio-microbar-altura: 40px;
	--sanpio-sombra-repouso: 0 2px 10px rgba(0, 0, 0, 0.08);
	--sanpio-sombra-hover: 0 6px 16px rgba(0, 0, 0, 0.18);
	--sanpio-sombra-flutuante: 0 4px 14px rgba(0, 0, 0, 0.35);
	--sanpio-atencao: #92400E;        /* avisos, últimas vagas, esforço */
	--sanpio-atencao-bg: #FEF7ED;
	--sanpio-cinza: #78736A;          /* neutros de apoio (quentes: o Pilar 3 proíbe frio/azulado) */
	--sanpio-cinza-escuro: #423E37;
	--sanpio-texto-suave: #55504A;
	--sanpio-borda-suave: #E7E2D4;
	--sanpio-dourado: #7A5417;        /* dourado de TEXTO em fundo claro (kickers, selos) — passa contraste AA */
	--sanpio-dourado-claro: #C9A45C;  /* dourado de TEXTO/detalhe em fundo ESCURO (contraste sobre Cipreste) */
	--sanpio-filete: #B08D3E;         /* Dourado Litúrgico (Pilar 3): SÓ filete/linha/borda decorativa, nunca texto */
}

/* ── movimento: reveals de entrada ───────────────────────────
   html.sanpio-anima é ligada por script inline no head (antes do
   primeiro paint, sem flash). Seletores estruturais escondem; o JS
   observa e marca .is-visivel. O cover fica de fora (só os filhos
   dele animam, escalonados). Rede de segurança: se o observer nunca
   rodar, a animação de 2.5s força tudo visível. */
/* Alvos do reveal. Três consertos da auditoria:
   1. Seções que contêm itens animados individualmente (pilares,
      cards, depoimentos) ficam fora do alvo genérico, senão o item
      anima em dobro (pai + filho somados).
   2. Nas páginas internas o conteúdo vive em .entry-content: os
      FILHOS dela animam (antes a entry-content inteira subia num
      bloco só e o hero nascia invisível).
   3. O primeiro bloco de main (título/cabeçalho da página) nunca
      anima: LCP não nasce escondida. */
/* :where() zera a especificidade dos :not(): sem ele, esta regra
   ganharia da regra .is-visivel e os blocos ficariam escondidos
   para sempre (bug de 07/07 à noite: "blocos brancos"). */
.sanpio-anima main > :where(*:not(.wp-block-cover):not(.entry-content):not(:first-child):not(:has(.sanpio-pilar, .sanpio-viagem-card, .sanpio-depoimento, .sanpio-card))),
.sanpio-anima .entry-content > :where(*:not(.wp-block-cover):not(:first-child):not(:has(.sanpio-pilar, .sanpio-viagem-card, .sanpio-depoimento, .sanpio-card))),
.sanpio-anima .sanpio-pilar,
.sanpio-anima .sanpio-viagem-card,
.sanpio-anima .sanpio-depoimento,
.sanpio-anima .sanpio-card,
.sanpio-anima .sanpio-dia {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 600ms ease, transform 600ms ease;
}
/* Failsafe: SÓ enquanto o observer não assumiu (html sem
   .sanpio-observa). Antes rodava sempre e, passados 2,5s, o reveal
   inteiro virava enfeite: quem rolava no ritmo normal nunca o via. */
.sanpio-anima:not(.sanpio-observa) main > *,
.sanpio-anima:not(.sanpio-observa) .entry-content > *,
.sanpio-anima:not(.sanpio-observa) .sanpio-pilar,
.sanpio-anima:not(.sanpio-observa) .sanpio-viagem-card,
.sanpio-anima:not(.sanpio-observa) .sanpio-depoimento,
.sanpio-anima:not(.sanpio-observa) .sanpio-card,
.sanpio-anima:not(.sanpio-observa) .sanpio-dia {
	animation: sanpio-forcar-visivel 0s 2.5s forwards;
}
.sanpio-anima main > *.is-visivel,
.sanpio-anima .is-visivel {
	opacity: 1;
	transform: none;
}
/* Filhos escalonados: cada item de grade entra 90ms depois do
   irmão anterior (coreografia, não efeito) */
.sanpio-anima .is-visivel:nth-child(2 of .sanpio-pilar),
.sanpio-anima .is-visivel:nth-child(2 of .sanpio-viagem-card),
.sanpio-anima .is-visivel:nth-child(2 of .sanpio-depoimento) { transition-delay: 90ms; }
.sanpio-anima .is-visivel:nth-child(3 of .sanpio-pilar),
.sanpio-anima .is-visivel:nth-child(3 of .sanpio-viagem-card) { transition-delay: 180ms; }
.sanpio-anima .is-visivel:nth-child(4 of .sanpio-pilar) { transition-delay: 270ms; }
.sanpio-anima .is-visivel:nth-child(5 of .sanpio-pilar) { transition-delay: 360ms; }
.sanpio-anima .is-visivel:nth-child(6 of .sanpio-pilar) { transition-delay: 450ms; }
@keyframes sanpio-forcar-visivel {
	to {
		opacity: 1;
		transform: none;
	}
}
.sanpio-anima .sanpio-reveal-hero > * {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 600ms ease, transform 600ms ease;
}
.sanpio-anima .sanpio-reveal-hero.is-visivel > * {
	opacity: 1;
	transform: none;
}
.sanpio-anima .sanpio-reveal-hero.is-visivel > *:nth-child(2) { transition-delay: 90ms; }
.sanpio-anima .sanpio-reveal-hero.is-visivel > *:nth-child(3) { transition-delay: 180ms; }
.sanpio-anima .sanpio-reveal-hero.is-visivel > *:nth-child(4) { transition-delay: 270ms; }
.sanpio-anima .sanpio-reveal-hero.is-visivel > *:nth-child(5) { transition-delay: 360ms; }
@media (prefers-reduced-motion: reduce) {
	.sanpio-anima main > *,
	.sanpio-anima .entry-content > *,
	.sanpio-anima .sanpio-pilar,
	.sanpio-anima .sanpio-viagem-card,
	.sanpio-anima .sanpio-depoimento,
	.sanpio-anima .sanpio-card,
	.sanpio-anima .sanpio-dia,
	.sanpio-anima .sanpio-reveal-hero > * {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		animation: none !important;
	}
}

/* ── kickers: o rótulo pequeno acima dos títulos de seção ──
   Com a assinatura da casa: o fio dourado da estrada. */
.sanpio-kicker {
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 600;
	font-size: 1rem;
	color: var(--sanpio-dourado);
	margin-bottom: 0.35rem;
}
.sanpio-kicker::after {
	content: "";
	display: block;
	width: 44px;
	height: 2px;
	border-radius: 1px;
	background: var(--sanpio-filete);
	margin-top: 0.55rem;
}
.sanpio-kicker.has-text-align-center::after {
	margin-inline: auto;
}
.sanpio-kicker--claro {
	color: var(--sanpio-dourado-claro);
}
/* Gruda o kicker no título: vence o margin-block-start do layout
   constrained (que usa :where, especificidade zero). */
.sanpio-kicker + h1,
.sanpio-kicker + h2,
.sanpio-kicker + h3,
p.sanpio-kicker + * {
	margin-block-start: 0.35rem;
}

/* ── pilares editoriais (home): número + régua, sem caixas ── */
.sanpio-pilares {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 2.5rem 2rem;
	margin-top: 2.5rem;
}
/* Cada pilar espelha as linhas do grid pai (subgrid): número,
   título e texto ficam na MESMA altura em todos os itens lado a
   lado, mesmo quando um título quebra em duas linhas. */
.sanpio-pilar {
	border-top: 2px solid var(--sanpio-filete);
	padding-top: 1.25rem;
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 3;
	align-content: start;
}
.sanpio-pilar-numero {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.5rem;
	color: var(--sanpio-dourado);
	margin-bottom: 0.5rem;
}
.sanpio-pilar h3 {
	margin: 0 0 0.5rem;
	font-size: 1.375rem;
}
.sanpio-pilar p {
	margin: 0;
}

/* ── botões: regra da casa ───────────────────────────────────
   Verde WhatsApp: SÓ para ações que abrem o WhatsApp.
   Primário (verde SanPioTur) ou contorno: navegação interna.
   Todo botão tem hover, active e foco visível. */
.wp-block-button__link {
	transition: transform 150ms ease, box-shadow 150ms ease;
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: var(--sanpio-sombra-hover);
}
.wp-block-button__link:active {
	transform: translateY(0);
	box-shadow: var(--sanpio-sombra-repouso);
}
.wp-block-button__link:focus-visible,
a:focus-visible {
	outline: 3px solid var(--wp--preset--color--primario);
	outline-offset: 2px;
}
/* Nas superfícies escuras (CTA final, rodapé, capas) o anel verde
   sumiria: vira branco para nunca perder o cursor do teclado. */
.sanpio-cta-final a:focus-visible,
.sanpio-cta-final .wp-block-button__link:focus-visible,
.sanpio-footer-escuro a:focus-visible,
.wp-block-cover a:focus-visible,
.wp-block-cover .wp-block-button__link:focus-visible {
	outline-color: var(--wp--preset--color--base);
}
/* Menu mobile com direção de arte: a tela branca com 4 links
   pequenos vira um ato verde-noite com serifa display, fios
   dourados e a página atual marcada (achado 4 da remedição) */
@media (max-width: 781px) {
	.wp-block-navigation__responsive-container.is-menu-open {
		background: var(--wp--preset--color--verde-noite) !important;
		color: var(--wp--preset--color--fundo-suave);
		padding: 6rem 2.25rem 2.5rem;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		align-items: flex-start;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		width: 100%;
		border-bottom: 1px solid rgba(201, 164, 92, 0.28);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		font-family: var(--wp--preset--font-family--sistema);
		font-size: 1.65rem;
		color: var(--wp--preset--color--fundo-suave);
		padding: 0.85rem 0;
		display: block;
		width: 100%;
	}
	.wp-block-navigation__responsive-container.is-menu-open a[aria-current="page"] {
		color: var(--sanpio-dourado-claro);
	}
	.wp-block-navigation__responsive-container-close {
		color: var(--wp--preset--color--fundo-suave) !important;
	}
	.wp-block-navigation__responsive-container-close svg {
		width: 28px;
		height: 28px;
	}
}

/* Botão do menu mobile do WP: área de toque de 44px */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	padding: 10px;
	margin: -10px;
}

/* ── Hero da home: corpo inteiro, sem faixa branca embaixo (o
   min-height inline de 560px vira piso, não teto), e a régua de
   diferenciais na borda de baixo, à Scott Dunn: os 4 motivos na
   cara, sem rolar nada. ── */
.sanpio-hero {
	min-height: max(560px, calc(100svh - 112px)) !important;
	position: relative;
}
/* O core posiciona o inner-container (position:relative) e a régua
   de diferenciais ancorava NELE (baixo e estreito). Estático, a
   régua ancora no próprio hero, de ponta a ponta na borda de baixo. */
.sanpio-hero > .wp-block-cover__inner-container {
	position: static;
}
@media (max-width: 781px) {
	.sanpio-hero {
		min-height: max(500px, calc(100svh - 96px)) !important;
	}
}
.sanpio-hero-diferenciais {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.4rem 3rem;
	padding: 1.1rem 1.5rem;
	background: rgba(26, 37, 18, 0.55);
	backdrop-filter: blur(4px);
	border-top: 1px solid rgba(201, 164, 92, 0.35);
	color: var(--wp--preset--color--fundo-suave);
	font-size: 1rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.sanpio-hero-diferenciais span {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}
.sanpio-hero-diferenciais span::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--sanpio-filete);
}
@media (max-width: 781px) {
	.sanpio-hero-diferenciais {
		display: none; /* no celular o hero fica limpo; os pilares vêm logo abaixo */
	}
}
/* Hero da HOME no celular: kicker + H1 sobem para o topo e o chip da próxima
   saída ancora perto da base (o padrão centralizado fica ótimo no desktop; no
   celular o split lê melhor). Com a régua de diferenciais oculta, a base fica
   livre. O inner-container é static, então o absoluto ancora no próprio hero. */
@media (max-width: 600px) {
	.sanpio-hero.has-custom-content-position.is-position-center-left {
		align-items: flex-start;
		padding-top: 2.5rem !important;
	}
	.sanpio-hero-proxima {
		position: absolute;
		left: 1.5rem;
		bottom: 2rem;
		margin-top: 0 !important;
	}
}
/* O chip virou irmão do grupo de texto (para ancorar no hero no mobile); no
   desktop, limita à largura da coluna do texto para o pill continuar compacto,
   huggiando o conteúdo em vez de virar uma barra larga. */
.sanpio-hero-proxima {
	max-width: 46rem;
}

/* Hero das páginas internas: o bloco de texto alinha com a coluna
   larga (72rem) da página, em vez de colar na borda esquerda. */
.sanpio-hero-miolo {
	margin-left: max(0px, calc((100% - 72rem) / 2)) !important;
}

/* Logo do Retiro sobre Rodas: assinatura centralizada da experiência, na
   página do Retiro (depois da explicação, antes do fecho). */
.sanpio-retiro-logo img {
	width: 510px;
	max-width: 100%;
	height: auto;
}
@media (max-width: 600px) {
	.sanpio-retiro-logo img { width: 300px; }
}
/* Destaque "e a alegria da viagem": painel Broto que garante ao cliente a
   parte de conhecer/admirar/descansar, sem virar texto perdido. */
.sanpio-retiro-viagem .sanpio-kicker {
	margin-bottom: 0.75rem;
}

/* Tabela de composição: no celular o valor pode quebrar linha
   (nowrap estourava a 360px com rótulos longos) */
@media (max-width: 480px) {
	.sanpio-composicao td:last-child {
		white-space: normal;
	}
}

/* Pill da próxima saída no celular: trava a largura ao viewport (era
   inline-flex e expandia com a linha da data, empurrando o hero além da
   tela e causando overflow horizontal). Vira cartão block, com quebra
   limpa e canto suave. */
/* (A regra compacta do pill no celular vive depois da base .sanpio-proxima-saida,
   mais abaixo no arquivo, para vencer na ordem de origem.) */

/* Compartilhar a viagem: linha discreta no topo, botões redondos
   de 44px; o nativo só aparece quando o navegador tem a folha de
   compartilhamento (JS revela). */
.sanpio-compartilhar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-top: 1.25rem;
}
.sanpio-compartilhar-rotulo {
	font-size: 1rem;
	font-weight: 600;
	color: var(--sanpio-texto-suave);
	margin-right: 0.25rem;
}
.sanpio-compartilhar a,
.sanpio-compartilhar button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid var(--sanpio-borda-suave);
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primario);
	cursor: pointer;
	transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
	position: relative;
}
.sanpio-compartilhar a:hover,
.sanpio-compartilhar a:focus-visible,
.sanpio-compartilhar button:hover,
.sanpio-compartilhar button:focus-visible {
	background: var(--wp--preset--color--primario);
	border-color: var(--wp--preset--color--primario);
	color: var(--wp--preset--color--base);
}
.sanpio-compartilhar-nativo {
	width: auto !important;
	padding: 0 1.1rem;
	gap: 0.5rem;
	border-radius: 999px !important;
	font-weight: 600;
	font-size: 1rem;
}
.sanpio-copiar-aviso {
	position: absolute;
	bottom: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--wp--preset--color--base);
	background: var(--wp--preset--color--verde-noite);
	padding: 0.25rem 0.6rem;
	border-radius: 6px;
	pointer-events: none;
}
.sanpio-copiar-aviso:empty {
	display: none;
}

/* Seta como SVG (o caractere de texto desalinhava da baseline) */
.sanpio-seta {
	vertical-align: -0.125em;
	margin-left: 0.25em;
}

/* Breadcrumb: o link ganha a cor da marca (antes link e texto
   corrente tinham a mesma cor suave) */
.sanpio-breadcrumb a {
	color: var(--wp--preset--color--primario);
}

/* Página atual marcada no menu ("você está aqui") */
.sanpio-barra-fixa .wp-block-navigation a[aria-current="page"],
.sanpio-barra-fixa .wp-block-navigation .current-menu-item > a {
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--sanpio-filete);
}

/* O letter-spacing negativo dos títulos grandes prejudica a serifa
   em corpo pequeno: h3 e h4 ficam isentos. */
h3, h4 {
	letter-spacing: 0;
}

/* Guarda: nenhum preset de fonte do editor fura o piso de 16px */
.has-small-font-size {
	font-size: 1rem !important;
}

/* Dentro de uma grade, o respiro automático de bloco do WP (24px
   acima de cada filho, exceto o primeiro) desalinha a primeira
   linha: o item 01 fica mais alto que o 02. Zerado; o espaçamento
   da grade é o gap. */
.sanpio-pilares > *,
.sanpio-cards > * {
	margin-block-start: 0;
}

/* Regra da casa: itens lado a lado têm SEMPRE a mesma altura.
   Cobre os cards dentro de colunas (turista/peregrino no Retiro) e
   qualquer card/depoimento em grade. */
.wp-block-column > .sanpio-card,
.wp-block-column > .wp-block-group {
	height: 100%;
	box-sizing: border-box;
}
.sanpio-cards,
.sanpio-depoimentos {
	align-items: stretch;
}
.sanpio-card,
.sanpio-depoimento {
	height: 100%;
	box-sizing: border-box;
}

/* Títulos quebram equilibrado, sem viúva de uma palavra */
h1, h2, h3 {
	text-wrap: balance;
}

/* Degrau DISPLAY (Ato I do plano Punch): a voz alta dos heros.
   Leading apertado e tracking levemente negativo, como manda a
   escala grande; o resto do site continua em voz baixa, e é o
   contraste que dá o punch. */
.has-display-font-size {
	font-family: var(--wp--preset--font-family--fraunces);
	font-weight: 460;
	line-height: 1.04;
	letter-spacing: -0.01em;
	font-variation-settings: "opsz" 144;
}

/* Hero mais enxuto no celular: sem isso os botões do hero da home
   ficam inteiros abaixo da primeira dobra (viewport 360x640).
   O !important vence o padding inline do bloco cover. */
@media (max-width: 600px) {
	.wp-block-cover.alignfull {
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
		min-height: 480px !important;
	}
	.wp-block-cover .has-titulo-1-font-size {
		font-size: 2.125rem !important;
	}
	.wp-block-cover .has-display-font-size {
		font-size: 2.375rem !important;
	}
}

/* ── header em dois níveis, com sticky DE VERDADE ──────────
   O sticky na barra interna não funcionava: ficava preso à altura
   do próprio header. O truque: o header inteiro é sticky com top
   negativo do tamanho da microbarra, que desliza para fora e deixa
   a barra principal fixa. */
header.wp-block-template-part {
	position: sticky;
	top: calc(var(--sanpio-microbar-altura) * -1);
	z-index: 60;
}
/* Logado no WordPress, a barra de administração (32px fixa) fica por
   cima: o header desce o equivalente para o menu nunca ser coberto.
   Visitante não logado não é afetado. */
body.admin-bar header.wp-block-template-part {
	top: calc(32px - var(--sanpio-microbar-altura));
}
@media (max-width: 782px) {
	body.admin-bar header.wp-block-template-part {
		top: 46px; /* altura da admin bar no tablet */
	}
}
@media (max-width: 600px) {
	body.admin-bar header.wp-block-template-part {
		top: 0; /* abaixo de 600px a admin bar rola junto com a página */
	}
}
.sanpio-microbar {
	height: var(--sanpio-microbar-altura);
	display: flex;
	align-items: center;
}
.sanpio-microbar > .wp-block-group {
	width: 100%;
}
@media (max-width: 781px) {
	header.wp-block-template-part {
		top: 0; /* microbarra some no mobile, nada a esconder */
	}
}
.sanpio-microbar p {
	margin: 0;
}
.sanpio-microbar .sanpio-selo-marca {
	margin-bottom: 0;
	color: var(--wp--preset--color--fundo-suave);
}
.sanpio-barra-fixa {
	z-index: 50;
	box-shadow: var(--sanpio-sombra-repouso);
	border-bottom: 1px solid var(--sanpio-borda-suave);
}
/* Logo dimensionado pela ALTURA (o lockup é horizontal; travar a largura
   deixava o tríptico minúsculo). A largura segue a proporção. */
.sanpio-barra-fixa .wp-block-site-logo,
.sanpio-barra-fixa .wp-block-site-logo a {
	width: auto;
	line-height: 0;
}
.sanpio-barra-fixa .custom-logo {
	height: 40px;
	width: auto;
	max-width: 100%;
}
/* Logo do mobile: o tríptico compacto entra abaixo de 600px; o lockup
   horizontal (largo demais para o celular) sai. Resolve o overflow do header. */
.sanpio-logo-mobile { display: none; }
@media (max-width: 600px) {
	.sanpio-barra-fixa .wp-block-site-logo { display: none; }
	.sanpio-logo-mobile { display: inline-block; line-height: 0; }
	.sanpio-logo-mobile img { height: 40px; width: auto; display: block; }
}
.sanpio-barra-fixa .wp-block-navigation a {
	text-transform: uppercase;
	font-size: 1rem;
	letter-spacing: 0.05em;
	font-weight: 600;
	color: var(--wp--preset--color--contraste);
}
.sanpio-barra-fixa .wp-block-navigation a:hover,
.sanpio-barra-fixa .wp-block-navigation a:focus-visible {
	color: var(--wp--preset--color--primario);
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 2px;
}

/* ── botão flutuante de WhatsApp (circular, com ícone) ───── */
.sanpio-flutuante-btn {
	position: fixed;
	right: 1.1rem;
	bottom: 1.1rem;
	z-index: 90;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--wp--preset--color--whatsapp);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--sanpio-sombra-flutuante);
	transition: transform 150ms ease, box-shadow 150ms ease;
}
.sanpio-flutuante-btn:hover {
	transform: scale(1.06);
	box-shadow: var(--sanpio-sombra-hover), var(--sanpio-sombra-flutuante);
}
.sanpio-flutuante-btn svg {
	width: 32px;
	height: 32px;
	fill: var(--wp--preset--color--base);
}

/* ── navegação secundária: breadcrumb e âncoras ──────────── */
[id] {
	scroll-margin-top: 6.5rem; /* âncora não some atrás da barra fixa */
}
.sanpio-breadcrumb {
	font-size: 1rem;
	color: var(--sanpio-texto-suave);
	margin-bottom: 1rem;
}
.sanpio-breadcrumb a {
	color: var(--sanpio-texto-suave);
}
.sanpio-ancoras {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	padding: 0.75rem 0;
	border-top: 1px solid var(--sanpio-borda-suave);
	border-bottom: 1px solid var(--sanpio-borda-suave);
	margin-bottom: 0.5rem;
}
.sanpio-ancoras a {
	text-decoration: none;
	font-weight: 600;
	font-size: 1rem;
	padding: 0.6rem 0; /* área de toque >= 44px */
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.sanpio-ancoras a:hover,
.sanpio-ancoras a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ── destaque da próxima saída (hero) ────────────────────── */
.sanpio-proxima-saida {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.9rem;
	margin-top: 1.75rem;
	padding: 0.7rem 1.25rem;
	border: 1px solid rgba(244, 241, 231, 0.45);
	border-radius: 999px;
	background: rgba(26, 37, 18, 0.66); /* Cipreste profundo translúcido (preto puro é banido); opaco o bastante para o rótulo dourado passar em contraste */
	color: var(--wp--preset--color--base);
	text-decoration: none;
	backdrop-filter: blur(3px);
	transition: background 150ms ease, border-color 150ms ease;
}
.sanpio-proxima-saida:hover {
	background: rgba(26, 37, 18, 0.54);
	border-color: var(--sanpio-filete);
}
.sanpio-proxima-saida-rotulo {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 1rem; /* piso da casa: nada abaixo de 16px */
	color: var(--sanpio-dourado-claro);
	font-weight: 700;
}
.sanpio-proxima-saida strong {
	font-family: var(--wp--preset--font-family--display);
}
.sanpio-proxima-saida-seta {
	font-weight: 700;
}

/* Chip da próxima saída no CELULAR: caixa compacta que encolhe ao conteúdo
   (block + fit-content), empilhando rótulo/nome/data. Fontes menores — é um
   selo glanceável sobre o hero, e a mesma info está nos cards logo abaixo, então
   pode ir abaixo do piso de leitura. Fica DEPOIS da base para vencer na ordem. */
@media (max-width: 600px) {
	.sanpio-proxima-saida {
		display: block;
		width: fit-content;
		max-width: calc(100vw - 3rem);
		border-radius: 14px;
		padding: 0.45rem 0.85rem;
		margin-top: 1rem;
		gap: 0;
		line-height: 1.35;
		font-size: 0.8rem;
	}
	.sanpio-proxima-saida-rotulo {
		display: block;
		font-size: 0.7rem;
		letter-spacing: 0.08em;
	}
	.sanpio-proxima-saida strong {
		display: block;
		font-size: 0.95rem;
	}
	.sanpio-proxima-saida > span:not([class]) {
		display: block;
	}
	.sanpio-proxima-saida-seta {
		display: none;
	}
}

/* ── selos de credencial no rodapé (badges) ──────────────── */
.sanpio-selo-credencial {
	border: 1px solid rgba(244, 241, 231, 0.4);
	border-radius: 8px;
	padding: 0.4rem 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
}
/* Selos: os dois chips brancos têm o MESMO tamanho (knobs abaixo)
   e cada logo se centraliza dentro do seu chip, sem distorcer. */
.sanpio-selo-img {
	margin: 0;
}
.sanpio-selo-img img {
	width: 168px; /* knob: largura igual dos dois chips */
	height: 56px; /* knob: altura igual dos dois chips */
	object-fit: contain;
	display: block;
	background: var(--wp--preset--color--base);
	padding: 10px 14px;
	border-radius: 8px;
	box-sizing: content-box;
}

/* ── CTA final: faixa escura de clímax ─────────────────────
   O botão sólido vira branco com texto verde WhatsApp; o !important
   é necessário porque a classe .has-*-background-color do WP também
   usa !important e senão o botão fica verde sobre verde. O botão de
   contorno fica fora do escopo para não virar pílula branca gêmea. */
.sanpio-cta-final .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--whatsapp) !important;
}
.sanpio-cta-final .is-style-outline .wp-block-button__link {
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--base);
	background: transparent !important;
}
/* Texto de apoio e links soltos precisam ser claros sobre a faixa */
.sanpio-cta-final .sanpio-texto-suave {
	color: rgba(255, 255, 255, 0.88);
}
.sanpio-cta-final a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--base);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Botão contorno claro (sobre foto ou fundo escuro) */
.sanpio-botao-claro .wp-block-button__link {
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--base);
}

/* H3 do inclui/não inclui: mesmo degrau dos títulos de card
   (saíam sem classe e caíam no default do navegador) */
.sanpio-inclui-grid h3 {
	font-size: 1.25rem;
	margin: 0 0 0.5rem;
}

/* Depoimento sem foto autorizada: iniciais num círculo */
.sanpio-depoimento-avatar {
	position: absolute;
	top: -1.25rem;
	left: 1.5rem;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--primario);
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.25rem;
	font-weight: 600;
	border: 3px solid var(--wp--preset--color--base);
}

/* Lockup Retiro sobre Rodas: a estrada como prefixo do selo */
.sanpio-selo-marca::before {
	content: "";
	display: inline-block;
	width: 22px;
	height: 2px;
	border-radius: 1px;
	margin-right: 0.5rem;
	vertical-align: 0.22em;
	background: var(--sanpio-filete);
}

/* divisor do rodapé: a estrada atravessa */
.sanpio-copyright {
	border-top: none !important;
	padding-top: 1.25rem;
	position: relative;
}
.sanpio-copyright::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: rgba(201, 164, 92, 0.45);
}

/* A frase de missão da casa (resgatada do site antigo) */
.sanpio-missao {
	font-family: var(--wp--preset--font-family--display);
	color: var(--sanpio-dourado);
	max-width: 38rem !important;
}
.sanpio-missao + .sanpio-kicker::after {
	margin-left: auto;
	margin-right: auto;
}

/* Timeline da estrada (quem-somos): anos em display dourado sobre
   a linha vertical da casa */
.sanpio-marcos {
	list-style: none;
	padding: 0;
	margin: 2rem 0 1rem;
	position: relative;
}
.sanpio-marcos::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 12px;
	bottom: 12px;
	width: 2px;
	background: var(--sanpio-filete);
}
.sanpio-marcos li {
	position: relative;
	padding: 0 0 2.25rem 2.5rem;
	margin: 0;
}
.sanpio-marcos li:last-child {
	padding-bottom: 0.5rem;
}
.sanpio-marcos li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 14px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	border: 2px solid var(--sanpio-dourado);
}
.sanpio-marco-ano {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 2.6vw, 2.5rem);
	line-height: 1.1;
	color: var(--sanpio-dourado);
	margin-bottom: 0.35rem;
}

/* Cards do contato com ícone */
.sanpio-card h2 svg,
.sanpio-card h3 svg {
	vertical-align: -0.15em;
	margin-right: 0.5rem;
	color: var(--sanpio-dourado);
}

/* Especificações tipográficas (acompanhamento da viagem): rótulo
   forte + valor, com o fio da casa, sem caixas (Ato III) */
.sanpio-especificacoes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 0.75rem 3rem;
	margin: 1.25rem 0 1.5rem;
}
.sanpio-especificacoes > div {
	display: grid;
	grid-template-columns: 9rem 1fr;
	gap: 1rem;
	padding: 0.65rem 0;
	border-bottom: 1px solid var(--sanpio-borda-suave);
}
.sanpio-especificacoes dt {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 1rem;
	color: var(--sanpio-texto-suave);
}
.sanpio-especificacoes dd {
	margin: 0;
}
@media (max-width: 480px) {
	.sanpio-especificacoes > div {
		grid-template-columns: 1fr;
		gap: 0.15rem;
	}
}

/* Depoimento solo (viagem): vira pull-quote de destaque */
.sanpio-depoimentos--solo {
	grid-template-columns: 1fr;
	max-width: 42rem;
}
.sanpio-depoimentos--solo .sanpio-depoimento blockquote {
	font-size: 1.4rem;
	line-height: 1.45;
}

/* Retratos em arco romano: forma nativa de igreja, nossa e de
   mais ninguém no ramo (Ato II) */
.sanpio-lider-foto {
	border-radius: 999px 999px 12px 12px;
}

/* Líder ainda não confirmado: card honesto, sem foto falsa */
.sanpio-lider-card--pendente {
	border-left: 4px solid var(--sanpio-filete);
}

/* Bloco das peregrinações já realizadas na agenda */
.sanpio-realizadas-titulo {
	margin: 3rem 0 0.5rem;
	font-size: 1.5rem;
	color: var(--sanpio-texto-suave);
}

/* Kicker sobre superfície verde: o dourado-claro reprova contraste
   ali (3,3:1); vira areia, que passa com folga. */
.sanpio-cta-final .sanpio-kicker,
.has-primario-background-color .sanpio-kicker {
	color: var(--wp--preset--color--fundo-suave);
}

/* Flutuante escondido enquanto o hero está na tela */
.sanpio-flutuante-btn {
	transition: opacity 300ms ease, transform 300ms ease;
}
.sanpio-flutuante--fora {
	opacity: 0;
	transform: translateY(12px);
	pointer-events: none;
}

/* Links legais do rodapé: lado a lado, no estilo do NAVEGUE */
.sanpio-legais {
	display: flex;
	justify-content: center;
	gap: 2.5rem;
	margin-bottom: 0.9rem;
}
.sanpio-legais a {
	color: var(--wp--preset--color--base);
	text-decoration: none;
	font-size: 1rem;
}
.sanpio-legais a::before {
	content: "›";
	color: var(--sanpio-dourado-claro);
	margin-right: 0.5rem;
	font-weight: 700;
}
.sanpio-legais a:hover,
.sanpio-legais a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* NAVEGUE do rodapé: seta dourada ancora cada link */
.sanpio-footer-escuro .wp-block-navigation a::before {
	content: "›";
	color: var(--sanpio-dourado-claro);
	margin-right: 0.5rem;
	font-weight: 700;
}

/* Linhas de contato do rodapé: ícone dourado antes, sem respiro
   solto entre elas (pedido do André, 08/07) */
.sanpio-linha-contato {
	margin-block-start: 1rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.sanpio-linha-contato a {
	text-decoration: none;
}
.sanpio-linha-contato a:hover,
.sanpio-linha-contato a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}
.sanpio-linha-contato + .sanpio-linha-contato {
	margin-block-start: 0.35rem;
}
.sanpio-linha-contato::before {
	content: "";
	flex: none;
	width: 15px;
	height: 15px;
	background: var(--sanpio-filete);
	-webkit-mask: var(--sanpio-icone) center / contain no-repeat;
	mask: var(--sanpio-icone) center / contain no-repeat;
}
.sanpio-linha--tel {
	--sanpio-icone: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z"/></svg>');
}
.sanpio-linha--mail {
	--sanpio-icone: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z"/></svg>');
}

/* Frase sobre foto (faixa do contato): serifa display com sombra
   suave, nunca a fonte de sistema em itálico bold (efeito Paint) */
.sanpio-frase-faixa {
	font-family: var(--wp--preset--font-family--display);
	font-style: normal !important;
	font-weight: 500 !important;
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	line-height: 1.25;
	letter-spacing: -0.01em;
	max-width: 24ch;
	margin-left: auto;
	margin-right: auto;
	text-shadow: 0 2px 22px rgba(0, 0, 0, 0.5);
}

/* Contato: WhatsApp protagonista num cartão escuro, canais ao lado */
.sanpio-canais {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 1.25rem;
	align-items: stretch;
}
@media (max-width: 781px) {
	.sanpio-canais {
		grid-template-columns: 1fr;
	}
}
.sanpio-canal-whats {
	background: var(--wp--preset--color--verde-noite);
	color: var(--wp--preset--color--fundo-suave);
	border-radius: 14px;
	padding: 2rem 2.25rem;
}
.sanpio-canal-whats h2 {
	color: var(--wp--preset--color--base);
	margin-top: 0;
}
.sanpio-canal-whats .wp-block-buttons {
	margin: 1.25rem 0 1.5rem;
}
/* Links (telefones) claros sobre o cartão escuro: o global pintava
   de verde primário sobre verde-noite, ilegível */
.sanpio-canal-whats a {
	color: var(--wp--preset--color--base);
}
.sanpio-canal-whats .sanpio-linha-contato a:hover,
.sanpio-canal-whats .sanpio-linha-contato a:focus-visible {
	text-decoration-color: var(--sanpio-filete);
}
.sanpio-canais-lado {
	display: grid;
	gap: 1.25rem;
	align-content: stretch;
}
.sanpio-canais-lado > .sanpio-card {
	margin-block-start: 0;
}
.sanpio-redes--linha {
	flex-direction: row;
	gap: 1.25rem;
	flex-wrap: wrap;
}
.sanpio-redes--linha a {
	color: var(--wp--preset--color--primario);
}

/* Redes sociais com ícone (identidade atual, sem esperar redesign) */
.sanpio-redes {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.sanpio-redes a {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	font-size: 1rem;
	text-decoration: none;
	min-height: 32px;
}
.sanpio-redes a:hover,
.sanpio-redes a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}
.sanpio-redes svg {
	flex: none;
	opacity: 0.85;
}

/* ── rodapé escuro (âncora da página) ────────────────────── */
.sanpio-footer-col {
	min-width: 220px;
	flex: 1;
}
.sanpio-footer-marca {
	max-width: 24rem;
}
.sanpio-footer-titulo {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--fundo-suave);
	margin-bottom: 0.75rem;
}
.sanpio-footer-escuro a,
.sanpio-footer-escuro .wp-block-site-title a {
	color: var(--wp--preset--color--base);
}
.sanpio-footer-escuro .wp-block-navigation a {
	font-weight: 400;
}
.sanpio-footer-escuro .sanpio-selo-marca {
	color: var(--wp--preset--color--fundo-suave);
}
.sanpio-footer-escuro p {
	color: rgba(244, 246, 233, 0.92);
}
.sanpio-credenciais {
	margin-top: 2.5rem;
	/* A coluna de leitura encolheu para 40rem; a faixa de selos precisa de um
	   respiro a mais para os dois chips e o CNPJ caberem na mesma linha. */
	max-width: 45rem;
}
/* A régua fica no copyright (sempre presente); se ficasse na linha de
   credenciais, sumia junto com ela quando vazia. */
.sanpio-copyright {
	padding-top: 1rem;
	border-top: 1px solid rgba(244, 246, 233, 0.25);
}
.sanpio-footer-escuro .sanpio-credenciais,
.sanpio-footer-escuro .sanpio-copyright {
	color: rgba(244, 246, 233, 0.75);
}
/* No rodapé escuro o botão verde-WhatsApp sumia (1,02:1 de contraste
   com o fundo): vira botão claro com o texto na cor do WhatsApp. */
.sanpio-footer-escuro .wp-block-button__link {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--whatsapp);
}

/* F7: cover sem imagem destacada degrada para painel escuro digno
   (texto branco nunca cai sobre fundo branco). */
.wp-block-cover {
	background-color: var(--wp--preset--color--verde-noite);
}

/* ── vazios não desenham nada (bindings sem valor) ───────── */
p:empty {
	display: none;
}
.sanpio-credenciais:empty {
	display: none;
}
.sanpio-card:has(p:empty) {
	display: none;
}

/* ── garantia dos 100% em destaque ───────────────────────── */
.sanpio-garantia {
	border-left: 4px solid var(--wp--preset--color--primario);
	background: var(--wp--preset--color--fundo-suave);
	border-radius: 0 12px 12px 0;
	padding: 1rem 1.5rem;
	font-weight: 600;
}

/* ── selos e status ─────────────────────────────────────── */
.sanpio-selo-marca {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 600;
	margin-bottom: 0.25rem;
}
.sanpio-status {
	display: inline-block;
	padding: 0.35rem 0.9rem;
	border-radius: 999px;
	font-size: 1rem;
	font-weight: 600;
	margin-bottom: 1rem;
	background: var(--wp--preset--color--fundo-suave);
	border: 1.5px solid var(--wp--preset--color--primario);
	color: var(--wp--preset--color--primario);
}
.sanpio-status--formacao  { border-color: var(--sanpio-dourado); color: var(--sanpio-dourado); }
.sanpio-status--ultimas   { border-color: var(--sanpio-atencao); color: var(--sanpio-atencao); }
.sanpio-status--encerrada { border-color: var(--sanpio-cinza); color: var(--sanpio-cinza-escuro); }
.sanpio-status--realizada { border-color: var(--wp--preset--color--oliva); color: var(--wp--preset--color--primario); }

.sanpio-selo {
	display: inline-block;
	font-size: 1rem;
	padding: 0.2rem 0.7rem;
	border-radius: 8px;
	margin-right: 0.5rem;
	background: var(--wp--preset--color--fundo-suave);
}
.sanpio-selo--esforco { border: 1px solid var(--sanpio-atencao); color: var(--sanpio-atencao); background: var(--sanpio-atencao-bg); }
.sanpio-selo--missa { border: 1px solid var(--sanpio-dourado); color: var(--sanpio-dourado); background: #FBF6EC; font-weight: 700; }

/* Chip de viagem realizada: eixo neutro + check, nunca o mesmo verde
   da "confirmada" (os dois verdes tinham 1,08:1 entre si) */
.sanpio-status--realizada {
	border-color: var(--sanpio-borda-suave) !important;
	color: var(--sanpio-texto-suave) !important;
	background: var(--wp--preset--color--fundo-suave) !important;
}
.sanpio-status--realizada::before {
	content: "✓ ";
}

/* ── split editorial: rótulo à esquerda, conteúdo à direita ── */
@media (min-width: 1024px) {
	.sanpio-split {
		display: grid;
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		gap: 1rem 3.5rem;
		align-items: start;
	}
	.sanpio-split-esq {
		position: sticky;
		top: 7.5rem;
	}
}

/* ── fatos-chave do topo: grade de decisão rápida ───────── */
.sanpio-fatos {
	list-style: none;
	padding: 0;
	margin: 0 0 1.5rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem 2rem;
}
.sanpio-fatos li {
	padding: 0.85rem 0 0.25rem;
	border-top: 2px solid var(--sanpio-filete);
}
.sanpio-fatos li strong {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 1rem; /* piso da casa */
	color: var(--sanpio-texto-suave);
	margin-bottom: 0.2rem;
}
@media (max-width: 781px) {
	/* Grade 2x2 em vez de carrossel: o 4o fato (Investimento) ficava
	   escondido fora da tela sem nenhum indicador. */
	.sanpio-fatos {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}
}
@media (max-width: 420px) {
	.sanpio-fatos {
		grid-template-columns: 1fr;
	}
}
.sanpio-fato-lider {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}
.sanpio-lider-foto-mini {
	width: 56px;
	height: 56px;
	flex-shrink: 0; /* com 2 líderes o flex esmagava a 2ª foto (Agostinho ~28px) */
	border-radius: 50%;
	object-fit: cover;
}

/* ── cards genéricos (destaques, acompanhamento) ────────── */
.sanpio-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1rem;
	margin: 1.5rem 0;
}
.sanpio-card {
	background: var(--wp--preset--color--fundo-suave);
	border-radius: 12px;
	padding: 1.25rem 1.5rem;
}
@media (max-width: 480px) {
	/* No celular os cards viram lista de fio: mesma informação,
	   metade da altura, zero caixa (Ato III: densidade sem caixa) */
	.sanpio-card {
		background: none;
		border-radius: 0;
		border-bottom: 1px solid var(--sanpio-borda-suave);
		padding: 0.85rem 0;
	}
	.sanpio-cards {
		gap: 0;
		margin: 1rem 0;
	}
	.sanpio-numero strong {
		font-size: 2.25rem;
	}
	.sanpio-numeros {
		gap: 1rem 1.5rem;
	}
}
.sanpio-card h3 { margin: 0 0 0.5rem; font-size: 1.25rem; }
.sanpio-card p  { margin: 0; }

.sanpio-destaque-saude {
	border-left: 4px solid var(--wp--preset--color--primario);
	background: var(--wp--preset--color--fundo-suave);
	border-radius: 0 12px 12px 0;
	padding: 1rem 1.5rem;
	margin: 1.5rem 0;
}
.sanpio-destaque-saude p { margin: 0; }

.sanpio-lider-card {
	display: flex;
	gap: 1.5rem;
	align-items: flex-start;
	flex-wrap: wrap;
	background: var(--wp--preset--color--fundo-suave);
	border-radius: 12px;
	padding: 1.5rem;
	margin-top: 1.5rem;
}
.sanpio-lider-foto {
	width: 170px;
	height: 200px;
	border-radius: 999px 999px 12px 12px; /* o ARCO da casa (o 12px antigo matava a assinatura) */
	object-fit: cover;
}
.sanpio-lider-card > div { flex: 1; min-width: 240px; }
.sanpio-lider-card h3 { margin-top: 0; }

/* ── prova social ───────────────────────────────────────── */
.sanpio-numeros {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	margin: 1.5rem 0;
}
/* ── ATO ESCURO (Ato II do plano Punch): a prova social da home
   sobre verde-noite, com números dourados e cartões translúcidos.
   As regras valem para qualquer seção com fundo verde-noite. */
.has-verde-noite-background-color .sanpio-numero {
	border-left-color: rgba(201, 164, 92, 0.55);
}
.has-verde-noite-background-color .sanpio-numero strong {
	color: var(--sanpio-dourado-claro);
}
.has-verde-noite-background-color .sanpio-numero span {
	color: #B8B5A5;
}
.has-verde-noite-background-color .sanpio-depoimento {
	background: rgba(255, 255, 255, 0.07);
	border-color: rgba(255, 255, 255, 0.16);
}
.has-verde-noite-background-color .sanpio-depoimento blockquote {
	color: var(--wp--preset--color--fundo-suave);
}
.has-verde-noite-background-color .sanpio-depoimento figcaption {
	color: #B8B5A5;
}
.has-verde-noite-background-color .sanpio-depoimento::before {
	color: var(--sanpio-dourado-claro);
}
.has-verde-noite-background-color .sanpio-depoimento-avatar {
	border-color: var(--wp--preset--color--verde-noite);
}
.has-verde-noite-background-color .sanpio-video-intro {
	color: var(--wp--preset--color--fundo-suave);
}

/* Na home o cabeçalho da seção é centrado: números acompanham o eixo */
.sanpio-prova-home .sanpio-numeros {
	/* bloco centralizado no wide, mas os itens alinham à ESQUERDA quando
	   quebram linha (com o inspect aberto / telas estreitas). Antes era
	   justify-content:center, e a linha que quebrava ficava centralizada,
	   desalinhando o contador de peregrinos dos demais. */
	justify-content: flex-start;
	width: fit-content;
	max-width: 100%;
	margin-inline: auto;
}
/* O primeiro depoimento da home fala mais alto (pull-quote) */
.sanpio-prova-home .sanpio-depoimento:first-child blockquote {
	font-size: 1.4rem;
	line-height: 1.45;
}
.sanpio-numero {
	border-left: 2px solid var(--sanpio-filete);
	padding-left: 1.25rem;
}
.sanpio-numero strong {
	display: block;
	font-family: var(--wp--preset--font-family--fraunces);
	font-weight: 470;
	font-variation-settings: "opsz" 144;
	font-size: clamp(2.5rem, 3.6vw, 3.5rem);
	line-height: 1.05;
	color: var(--wp--preset--color--primario);
}
.sanpio-numero span {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 1rem; /* piso da casa */
	color: var(--sanpio-texto-suave);
}
.sanpio-video {
	aspect-ratio: 16 / 9;
	margin: 1.5rem 0;
}
.sanpio-video iframe {
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: 12px;
}
/* Fileira única com rolagem lateral (pedido do André: 4 fotos
   quebravam em 2 linhas; 20 fariam 6) */
.sanpio-galeria-wrap {
	position: relative;
	margin-top: 1.5rem;
}
.sanpio-galeria {
	display: flex;
	gap: 0.75rem;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	padding-bottom: 0.75rem;
	scrollbar-color: var(--sanpio-filete) var(--wp--preset--color--fundo-suave);
	scrollbar-width: thin;
}
.sanpio-galeria-item {
	flex: 0 0 auto;
	width: min(300px, 72vw);
	scroll-snap-align: start;
}
.sanpio-galeria-seta {
	position: absolute;
	top: 50%;
	transform: translateY(-60%);
	z-index: 2;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid var(--sanpio-borda-suave);
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primario);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: var(--sanpio-sombra-repouso);
	transition: background 150ms ease, color 150ms ease;
}
.sanpio-galeria-seta:hover,
.sanpio-galeria-seta:focus-visible {
	background: var(--wp--preset--color--primario);
	color: var(--wp--preset--color--base);
}
.sanpio-galeria-seta--ant { left: -8px; }
.sanpio-galeria-seta--prox { right: -8px; }
@media (max-width: 781px) {
	.sanpio-galeria-seta {
		display: none; /* no toque, o dedo rola naturalmente */
	}
}
.sanpio-galeria img {
	width: 100%;
	object-fit: cover;
	border-radius: 8px;
	display: block;
	/* proporção 4:3 definida na seção do véu de imagem */
}
.sanpio-galeria-item {
	padding: 0;
	border: none;
	background: none;
	cursor: zoom-in;
	border-radius: 8px;
}
.sanpio-galeria-item:hover img {
	filter: brightness(1.06);
}

/* Galeria com 1 ou 2 fotos: imagem editorial larga, sem grade manca */
.sanpio-galeria-solo {
	margin: 1.5rem 0 0;
}
.sanpio-galeria-solo img {
	width: 100%;
	height: auto;
	border-radius: 8px;
	display: block;
}

/* Fachada do vídeo: thumbnail + play; o player só carrega no clique */
.sanpio-video-fachada {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	border: none;
	background: var(--wp--preset--color--verde-noite);
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	aspect-ratio: 16 / 9;
}
.sanpio-video-fachada img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.85;
	display: block;
}
.sanpio-video-play {
	/* o "botão do YouTube" universal: lozenge vermelho; sem ele,
	   com a capa de marca, ninguém identificava que era vídeo */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 84px;
	height: 58px;
	border-radius: 14px;
	background: #FF0000;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
	transition: background 150ms ease, transform 150ms ease;
}
.sanpio-video-play::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	transform: translate(-50%, -50%);
	border-style: solid;
	border-width: 14px 0 14px 24px;
	border-color: transparent transparent transparent var(--wp--preset--color--base);
}
.sanpio-video-fachada:hover .sanpio-video-play,
.sanpio-video-fachada:focus-visible .sanpio-video-play {
	background: #CC0000;
	transform: translate(-50%, -50%) scale(1.06);
}
.sanpio-video-rotulo {
	position: absolute;
	right: 0.9rem;
	bottom: 0.8rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: #fff;
	background: rgba(26, 37, 18, 0.65);
	padding: 0.25rem 0.7rem;
	border-radius: 6px;
}
.sanpio-video iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
	border: none;
	border-radius: 8px;
}

/* Lightbox nativo (dialog) */
.sanpio-lightbox-nav {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	width: 52px;
	height: 52px;
	border-radius: 50%;
	border: none;
	background: rgba(22, 29, 10, 0.7);
	color: #fff;
	font-size: 2rem;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
}
.sanpio-lightbox-ant { left: 1rem; }
.sanpio-lightbox-prox { right: 1rem; }
.sanpio-lightbox-nav:hover,
.sanpio-lightbox-nav:focus-visible {
	background: rgba(22, 29, 10, 0.95);
	outline: 3px solid #fff;
}

.sanpio-lightbox-figura {
	margin: 0;
}
.sanpio-lightbox-legenda {
	color: #fff;
	background: rgba(22, 29, 10, 0.82);
	font-size: 1.05rem;
	padding: 0.6rem 1rem;
	border-radius: 0 0 10px 10px;
	text-align: center;
	margin-top: -6px;
}
.sanpio-lightbox {
	border: none;
	padding: 0;
	background: transparent;
	max-width: min(92vw, 1400px);
	max-height: 90vh;
}
.sanpio-lightbox::backdrop {
	background: rgba(0, 0, 0, 0.82);
}
.sanpio-lightbox img {
	max-width: 100%;
	max-height: 85vh;
	display: block;
	border-radius: 8px;
}
.sanpio-lightbox-fechar {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.6);
	color: var(--wp--preset--color--base);
	font-size: 1.25rem;
	cursor: pointer;
}

/* ── sem vão entre header, conteúdo e rodapé ────────────── */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* ── véu de marca nas imagens (amarra fotos de origens
      diferentes) e proporções por contexto ────────────────── */
.sanpio-viagem-capa,
.sanpio-galeria img,
.wp-block-media-text__media,
.wp-block-cover__image-background {
	/* tratamento único: verdes aprofundados e altas-luzes quentes,
	   para toda foto (de banco ou real) parecer da mesma família */
	filter: saturate(0.88) contrast(1.05) sepia(0.10) brightness(0.99);
}
.sanpio-viagem-capa {
	aspect-ratio: 3 / 2;
	height: auto; /* sem isto, o atributo height do WP pinava a altura
	                 e cada capa saía numa proporção (cards mancos) */
}
.sanpio-galeria img {
	height: auto;
	aspect-ratio: 4 / 3;
}

/* ── mobile como experiência própria ────────────────────── */
.sanpio-barra-acao {
	display: none;
}
@media (max-width: 781px) {
	/* F9 + auditoria: sem o botão do header no mobile (flutuante e
	   barra de ação cobrem o papel), o header nunca dobra de altura.
	   O corte acompanha o do menu hambúrguer (781px). */
	.sanpio-barra-fixa .wp-block-buttons {
		display: none;
	}
}
@media (max-width: 781px) {
	/* F8: gradiente lateral era de desktop; no celular o texto cruza
	   a zona clara da foto. Véu uniforme. */
	.wp-block-cover .wp-block-cover__gradient-background {
		background: linear-gradient(180deg, rgba(26, 37, 18, 0.78), rgba(26, 37, 18, 0.55)) !important;
	}
	.sanpio-microbar {
		display: none; /* no celular, direto ao que importa */
	}
	body.sanpio-viagem .sanpio-barra-acao {
		display: flex;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 95;
		gap: 0.5rem;
		padding: 0.45rem 0.75rem calc(0.45rem + env(safe-area-inset-bottom));
		background: var(--wp--preset--color--base);
		border-top: 1px solid var(--sanpio-borda-suave);
	}
	body.sanpio-viagem .sanpio-barra-acao a {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box; /* o min-height é o TOTAL (padding/borda contam dentro) */
		text-align: center;
		text-decoration: none;
		font-weight: 600;
		font-size: 0.9rem;
		white-space: nowrap; /* label curta ("Conversar"): uma linha só, sem inchar */
		padding: 0.35rem 0.5rem;
		border-radius: 999px;
		min-height: 46px; /* compacto e confortável, ainda acessível (≥44) */
	}
	body.sanpio-viagem .sanpio-acao-roteiro {
		border: 2px solid var(--wp--preset--color--primario);
		color: var(--wp--preset--color--primario);
	}
	body.sanpio-viagem .sanpio-acao-whats {
		background: var(--wp--preset--color--whatsapp);
		color: var(--wp--preset--color--base);
	}
	body.sanpio-viagem {
		padding-bottom: 72px; /* nada fica escondido atrás da barra (mais enxuta) */
	}
	body.sanpio-viagem .sanpio-flutuante-btn {
		display: none; /* a barra de ação substitui o flutuante */
	}
}

/* ── itinerário como timeline: a estrada da viagem ──────── */
.sanpio-itinerario {
	position: relative;
}
.sanpio-itinerario::before {
	content: "";
	position: absolute;
	left: 18px;
	top: 8px;
	bottom: 8px;
	width: 2px;
	background: var(--sanpio-filete);
}
.sanpio-dia {
	position: relative;
	padding: 0 0 2.25rem 3.75rem;
	margin: 0;
}
.sanpio-dia:last-child {
	padding-bottom: 0.5rem;
}
/* F16: cobre a linha abaixo da última parada (a estrada termina lá) */
.sanpio-dia:last-child::after {
	content: "";
	position: absolute;
	left: 19px;
	top: 44px;
	bottom: 0;
	width: 2px;
	background: var(--wp--preset--color--base);
}
.sanpio-dia-numero {
	position: absolute;
	left: 0;
	top: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	border: 2px solid var(--sanpio-filete);
	color: var(--wp--preset--color--primario);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sanpio-dia header {
	margin-bottom: 0.15rem;
}
.sanpio-dia-data {
	font-size: 1rem; /* piso da casa */
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--sanpio-texto-suave);
	font-weight: 600;
}
.sanpio-dia h3 { margin: 0 0 0.5rem; font-size: 1.375rem; }
.sanpio-dia p { margin: 0 0 0.5rem; }
/* O summary do dia carrega data e título; o título faz papel de h3 */
.sanpio-dia-corpo > summary {
	list-style: none;
	cursor: pointer;
	display: block; /* o summary genérico é flex (FAQ); aqui a data
	                   fica em cima e o título embaixo */
}
.sanpio-dia-corpo .sanpio-dia-data {
	display: block;
	margin-bottom: 0.15rem;
}
.sanpio-dia-corpo > summary::-webkit-details-marker { display: none; }
.sanpio-dia-corpo .sanpio-dia-titulo {
	display: inline-block; /* o chevron do summary segue na mesma linha */
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.375rem;
	font-weight: 500;
	margin: 0.15rem 0 0.5rem;
	letter-spacing: 0;
}
/* F6: a seta vale para TODO acordeão (itinerário e FAQ); sem ela,
   para o público 45-70 a pergunta parece texto estático. */
details summary::after {
	content: "❯";
	margin-left: 0.5rem;
	font-size: 0.85em;
	transition: transform 150ms ease;
}
details[open] summary::after {
	transform: rotate(90deg);
}

/* ── acordeões nativos (itinerário e FAQ) ───────────────── */
details {
	margin-top: 0.5rem;
}
details summary {
	cursor: pointer;
	font-weight: 600;
	color: var(--wp--preset--color--primario);
	padding: 0.5rem 0;
	min-height: 44px; /* área de toque generosa */
	display: flex;
	align-items: center;
}
details summary:focus-visible {
	outline: 3px solid var(--wp--preset--color--primario);
	outline-offset: 2px;
	border-radius: 4px;
}
.sanpio-faq details {
	border-bottom: 1px solid var(--wp--preset--color--fundo-suave);
	margin: 0;
	padding: 0.25rem 0;
}

/* ── investimento ───────────────────────────────────────── */
.sanpio-preco-principal {
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--wp--preset--color--primario);
}
.sanpio-preco-principal span {
	display: block;
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--contraste);
}
.sanpio-composicao {
	width: 100%;
	border-collapse: collapse;
	margin: 1rem 0;
}
.sanpio-composicao td {
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--wp--preset--color--fundo-suave);
}
.sanpio-composicao td:last-child {
	text-align: right;
	font-weight: 600;
	white-space: nowrap;
}
.sanpio-inclui-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.5rem;
	margin-top: 2rem;
}
.sanpio-lista-inclui,
.sanpio-lista-nao-inclui {
	list-style: none;
	padding: 0;
	margin: 0;
}
.sanpio-lista-inclui li,
.sanpio-lista-nao-inclui li {
	padding: 0.35rem 0 0.35rem 1.75rem;
	position: relative;
}
.sanpio-lista-inclui li::before {
	content: "✓";
	position: absolute;
	left: 0;
	font-weight: 700;
	color: var(--wp--preset--color--primario);
}
.sanpio-lista-nao-inclui li::before {
	content: "✕";
	position: absolute;
	left: 0;
	color: var(--sanpio-cinza);
}

/* ── navegação do header ────────────────────────────────── */
.wp-block-navigation {
	--wp--style--block-gap: 1.25rem;
}
.wp-block-navigation a {
	text-decoration: none;
	font-weight: 600;
}
/* Fonte de sistema só na navegação do HEADER (interface). O "Navegue" do
   rodapé é conteúdo e segue na Lora do corpo, junto do resto do rodapé. */
.sanpio-barra-fixa .wp-block-navigation a {
	font-family: var(--wp--preset--font-family--sistema);
}
.wp-block-navigation a:hover,
.wp-block-navigation a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ── home: próximas peregrinações ───────────────────────── */
.sanpio-proximas {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 2rem;
	margin-top: 1.5rem;
}
.sanpio-viagem-cta {
	display: inline-block;
	margin-top: auto; /* ancora o CTA na base do card: todos alinham mesmo com metas de alturas diferentes */
	padding-top: 0.75rem;
	font-weight: 600;
	color: var(--wp--preset--color--primario);
}
.sanpio-viagem-card {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--sanpio-borda-suave);
	border-radius: 12px;
	overflow: hidden;
	transition: box-shadow 300ms ease, transform 300ms ease;
}
@media (prefers-reduced-motion: no-preference) {
	.sanpio-viagem-card:hover {
		transform: translateY(-3px);
	}
	.sanpio-viagem-capa {
		transition: transform 300ms ease;
	}
	.sanpio-viagem-card:hover .sanpio-viagem-capa {
		transform: scale(1.03);
	}
}
.sanpio-viagem-card a {
	text-decoration: none;
	color: inherit;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.sanpio-viagem-capa {
	width: 100%;
	object-fit: cover;
	display: block;
	/* proporção 3:2 definida na seção do véu de imagem */
}
.sanpio-viagem-corpo {
	padding: 1.25rem 1.5rem 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1; /* preenche a altura do card para o CTA descer à base */
}
/* Dentro do card o status é microlabel discreto (o chip com borda
   gritava mais que o destino, hierarquia invertida). O chip cheio
   continua valendo na linha de status da página da viagem. */
.sanpio-viagem-corpo .sanpio-status {
	border: none;
	padding: 0;
	background: transparent;
	font-size: 1rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	margin-bottom: 0;
	display: block;
	margin-top: 0.35rem;
}
.sanpio-viagem-corpo h3 {
	margin: 0.5rem 0 0.5rem;
	font-size: 1.375rem;
}
.sanpio-viagem-meta {
	margin: 0.15rem 0;
	color: var(--sanpio-texto-suave);
	font-size: 1rem;
}
.sanpio-viagem-card:hover {
	box-shadow: var(--sanpio-sombra-repouso);
}

/* ── contagem regressiva ────────────────────────────────── */
.sanpio-status-linha {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.75rem;
	margin-bottom: 1rem;
}
.sanpio-status-linha .sanpio-status {
	margin-bottom: 0;
}
.sanpio-contagem {
	font-size: 1rem;
	font-weight: 600;
	color: var(--sanpio-texto-suave);
}
.sanpio-contagem--urgente {
	color: var(--sanpio-atencao);
}

/* ── depoimentos ────────────────────────────────────────── */
.sanpio-depoimentos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
	margin: 1.5rem 0;
}
.sanpio-depoimento {
	position: relative;
	background: var(--wp--preset--color--base);
	border-radius: 12px;
	padding: 3rem 1.5rem 1.5rem;
	margin: 0;
	border: 1px solid var(--sanpio-borda-suave);
}
.sanpio-depoimento::before {
	content: "\201C";
	position: absolute;
	top: 0.25rem;
	left: 1.25rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 4rem;
	line-height: 1;
	color: var(--sanpio-dourado-claro);
}
.sanpio-depoimento-foto {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
	margin-bottom: 0.75rem;
}
.sanpio-depoimento blockquote {
	margin: 0 0 0.75rem;
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: 1.2rem;
	line-height: 1.5;
	border: none;
	padding: 0;
}
.sanpio-depoimento figcaption {
	font-weight: 600;
	font-size: 1rem;
}

/* ── mapa do roteiro (paradas numeradas) ────────────────── */
.sanpio-mapa {
	height: 420px;
	border-radius: 12px;
	margin: 1.5rem 0;
	background: var(--wp--preset--color--fundo-suave);
	/* O Leaflet usa z-index até ~1000 nos painéis/controles; sem stacking
	   context próprio eles subiam ACIMA do header (50) e da barra de ação (95),
	   cobrindo tudo ao rolar. isolate confina esses z-index dentro do mapa, e o
	   mapa inteiro fica no nível 0 do fluxo (abaixo de header, rodapé e barra). */
	position: relative;
	z-index: 0;
	isolation: isolate;
}
.sanpio-marcador-wrap { background: none; border: none; }
.sanpio-marcador {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--wp--preset--color--primario);
	color: var(--wp--preset--color--base);
	font-weight: 700;
	font-size: 15px;
	border: 2px solid var(--wp--preset--color--base);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* ── conversão e miudezas ───────────────────────────────── */
.sanpio-conversao { text-align: center; }
.sanpio-conversao .wp-block-buttons { justify-content: center; }
.sanpio-texto-suave { color: var(--sanpio-texto-suave); font-size: 1rem; }
.sanpio-subtitulo { margin-top: 0; color: var(--sanpio-cinza-escuro); }
