/*
 * page-a-vertex.css — Página "A Vertex"
 * Fidelidade ao Figma: node 89:4457
 * Carregado APENAS nesta página via functions.php
 */

/* ================================================================
   PÁGINA GERAL
   ================================================================ */

body:has(#vax-hero-historia) .vax-page,
.page-a-vertex .vax-page,
.page-template-page-a-vertex .vax-page,
.page-template-page-a-vertex-php .vax-page {
	width: 100%;
	max-width: 100%;
	padding-inline: 0;
	margin-inline: 0;
	margin-top: -106px;
}

.page-template-page-a-vertex #primary,
.page-template-page-a-vertex-php #primary {
	flex: 1 0 auto;
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

.page-template-page-a-vertex #page.site,
.page-template-page-a-vertex-php #page.site {
	min-height: auto !important;
}

/* Anula section { margin-bottom:64px } de servicos.css apenas no CTA (última seção antes do footer) */
.page-template-page-a-vertex .vax-page section.vax-cta,
.page-template-page-a-vertex-php .vax-page section.vax-cta {
	margin-bottom: 0 !important;
}

.page-template-page-a-vertex .site-footer,
.page-template-page-a-vertex-php .site-footer,
body.page-template-page-a-vertex .site-footer,
body.page-template-page-a-vertex-php .site-footer {
	margin-top: 0 !important;
	flex-shrink: 0;
}

/*
 * Alinhamento horizontal com o header: --vax-pl / --vax-pr definidos
 * em page-a-vertex.js (borda esquerda do logo vs .container).
 */
/* Padding horizontal alinhado ao logo — JS define --vax-pl/--vax-pr em .vax-unified-wrap */

#vax-hero-historia .container,
#vax-trajetoria .container,
#vax-mvv .container {
	padding-inline-start: max(var(--vax-pl), env(safe-area-inset-left, 0px)) !important;
	padding-inline-end: max(var(--vax-pr), env(safe-area-inset-right, 0px)) !important;
}

/* ================================================================
   WRAPPER UNIFICADO — A_Vertex-time.webp
   ================================================================ */

.vax-unified-wrap {
	--vax-pl: 24px;
	--vax-pr: 24px;
	position: relative;
	z-index: 0;
	overflow: hidden;
	margin-top: 0 !important;
	background-size: 100% 100%;
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #041020;
}

#vax-hero-historia.vax-block-hero-historia,
.vax-block-hero-historia {
	position: relative;
	margin-top: 0 !important;
}

.vax-block-hero-historia > section {
	position: relative;
	z-index: 1;
}

/* ================================================================
   MINI HERO (Figma 89:4527)
   ================================================================ */

.vax-hero {
	padding-top: calc(106px + 48px);
	padding-bottom: 48px;
	min-height: 320px;
}

.vax-hero__container {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* ---- Breadcrumb ---- */
.vax-breadcrumb {
	display: flex;
	align-items: center;
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 0.875rem;
	line-height: 1.43;
}

.vax-breadcrumb__link {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color 0.2s ease;
}

.vax-breadcrumb__link:hover,
.vax-breadcrumb__link:focus-visible {
	color: #fff;
	text-decoration: underline;
}

.vax-breadcrumb__sep {
	color: rgba(255, 255, 255, 0.7);
	padding: 0 10px;
	user-select: none;
}

.vax-breadcrumb__current {
	color: #fff;
}

/* ---- Conteúdo do Hero ---- */
.vax-hero__content {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* H1 — Figma: Inter Bold 60px */
.vax-hero__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(2rem, 5vw, 3.75rem);
	line-height: 1.1;
	color: #fff;
	margin: 0;
}

/* Subtítulo — Figma: Inter Regular 20px */
.vax-hero__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: clamp(1rem, 2vw, 1.25rem);
	font-weight: 400;
	line-height: 1.4;
	color: #fff;
	max-width: 672px;
	margin: 0;
}

/* ================================================================
   NOSSA HISTÓRIA (Figma 89:4542)
   Grid 2 colunas — texto | imagem+card
   ================================================================ */

.vax-historia {
	padding-top: 40px;
	padding-bottom: 120px;
}

.vax-historia__container {
	display: flex;
	align-items: center;
	gap: 64px;
}

.vax-historia__col {
	flex: 1 0 0;
	min-width: 0;
}

.vax-historia__col--text {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* Badge "NOSSA HISTÓRIA" — Figma: bg #ffba8e / color #f47726 */
.vax-badge--section {
	display: inline-flex;
	align-items: center;
	background-color: #ffba8e;
	color: #f47726;
	border-radius: 9999px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 0.875rem;
	line-height: 1.43;
	padding: 8px 16px;
	width: fit-content;
}

/* H2 — Figma: Inter Bold 48px / line-height 1.23 */
.vax-historia__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1.23;
	color: #fff;
	margin: 0;
}

/* Parágrafos — Figma: Inter Regular 18px */
.vax-historia__body {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.vax-historia__body p {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	font-weight: 400;
	line-height: 1.625;
	color: #fff;
	margin: 0;
}

/* Coluna mídia */
.vax-historia__col--media {
	display: flex;
	align-items: center;
	justify-content: center;
}

.vax-historia__img-wrap {
	position: relative;
	width: 100%;
	margin-right: 32px;
}

.vax-historia__img {
	display: block;
	width: 100%;
	height: 560px;
	object-fit: cover;
	border-radius: 16px;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/*
 * Card 500+ — Figma:
 * bg: #f47726 (var(--secondary)) — LARANJA
 * position: absolute, bottom: -32px, right: -32px
 */
.vax-historia__card {
	position: absolute;
	bottom: -32px;
	right: -32px;
	background-color: var(--color-secondary, #f47726);
	border-radius: 12px;
	padding: 32px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
	            0 8px 10px -6px rgba(0, 0, 0, 0.1);
	min-width: 160px;
}

/* Número animado + sufixo "+" — Figma: Inter Bold 48px */
.vax-historia__card-number {
	display: inline-block;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 3rem;
	line-height: 1;
	color: #fff;
}

.vax-historia__card-number__value {
	font: inherit;
}

/* "Clientes Atendidos" — Figma: Inter Medium 18px */
.vax-historia__card-label {
	display: block;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 500;
	font-size: 1.125rem;
	line-height: 1.56;
	color: #fff;
}

/* ================================================================
   ANIMAÇÕES DE ENTRADA
   ================================================================ */

@media (prefers-reduced-motion: no-preference) {
	.vax-hero__content,
	.vax-historia__col--text,
	.vax-historia__col--media {
		opacity: 0;
		transform: translateY(24px);
		transition: opacity 0.6s ease, transform 0.6s ease;
	}

	.vax-historia__col--media {
		transform: translateX(24px);
		transition-delay: 0.15s;
	}

	.vax-hero__content.vax-is-visible,
	.vax-historia__col--text.vax-is-visible,
	.vax-historia__col--media.vax-is-visible {
		opacity: 1;
		transform: none;
	}
}

/* ================================================================
   RESPONSIVIDADE
   ================================================================ */

@media (max-width: 767px) {
	.vax-historia__container {
		flex-direction: column;
		gap: 48px;
	}

	.vax-historia__col--media {
		order: -1;
		width: 100%;
		margin-right: 0;
	}

	.vax-historia__img-wrap {
		margin-right: 16px;
	}

	.vax-historia__img {
		height: 280px;
	}

	.vax-historia__card {
		bottom: -16px;
		right: -16px;
		padding: 20px 24px;
		min-width: 120px;
	}

	.vax-historia__card-number {
		font-size: 2rem;
	}

	.vax-historia__card-label {
		font-size: 0.9rem;
	}

	.vax-historia {
		padding-top: 48px;
		padding-bottom: 80px;
	}
}

/* ================================================================
   ACESSIBILIDADE
   ================================================================ */

.vax-breadcrumb__link:focus-visible {
	outline: 3px solid var(--color-secondary, #f47726);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ================================================================
   BLOCO 2 — NOSSA TRAJETÓRIA (Figma node 89:4715)
   margin-top negativo forte + body:has(#vax-hero-historia) (stack que funcionava).
   Mobile: clamp mais curto para não colidir com viewport.
   ================================================================ */

body:has(#vax-hero-historia) #vax-trajetoria.vax-block-trajetoria,
body.page-a-vertex #vax-trajetoria.vax-block-trajetoria,
body.page-template-page-a-vertex #vax-trajetoria.vax-block-trajetoria,
body.page-template-page-a-vertex-php #vax-trajetoria.vax-block-trajetoria,
#vax-trajetoria.vax-block-trajetoria {
	position: relative;
	z-index: 2;
	margin-top: clamp(-100px, -14vw, -280px) !important;
	padding-top: 40px;
	padding-bottom: 40px;
	background: transparent !important;
	scroll-margin-top: 24px;
}

.vax-trajetoria__container {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
}

/* ---- Cabeçalho ---- */
.vax-trajetoria__header {
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
	text-align: center;
}

.vax-trajetoria__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	/* Figma 89:4715 — título “Nossa Trajetória”: 48px / leading 40px */
	font-size: clamp(2rem, 4.2vw, 3rem);
	line-height: calc(40 / 48);
	color: #ffffff;
	margin: 0;
}

.vax-trajetoria__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: clamp(1rem, 2vw, 1.125rem);
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.7);
	max-width: 672px;
	margin: 0;
}

/* ================================================================
   TIMELINE — Figma 89:4715 (MCP): eixo ~4px gradiente laranja, nó 64px
   borda branca 4px, cartão branco sombra 0 4px 4px #00000040, gap 64px,
   tipografia ano 30px / título 20px lh28 / corpo 16px lh26, alinhamento
   do texto à direita no lado esquerdo do eixo.
   ================================================================ */

.vax-timeline {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 64px;
	padding: 16px 0 0;
	max-width: 1024px;
	margin-inline: auto;
	width: 100%;
	isolation: isolate;
}

.vax-timeline::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 4px;
	transform: translateX(-50%);
	border-radius: 2px;
	/* Figma: azul escuro no topo → azul médio → laranja na base */
	background: linear-gradient(
		180deg,
		#003d7a 0%,
		#0066cc 50%,
		#ff6600 100%
	);
	pointer-events: none;
	z-index: 0;
}

.vax-timeline__row {
	--vax-tl-year: #003d7a;
	--vax-tl-node: #003d7a;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
	align-items: center;
	gap: 0 clamp(32px, 4.5vw, 48px);
	position: relative;
	z-index: 1;
}

.vax-timeline__row--tone-1 {
	--vax-tl-year: #003d7a;
	--vax-tl-node: #003d7a;
	--vax-tl-border: rgba(0, 61, 122, 0.1);
}

.vax-timeline__row--tone-2 {
	--vax-tl-year: #0066cc;
	--vax-tl-node: #0066cc;
	--vax-tl-border: rgba(0, 102, 204, 0.1);
}

.vax-timeline__row--tone-3 {
	--vax-tl-year: #ff6600;
	--vax-tl-node: #ff6600;
	--vax-tl-border: rgba(255, 102, 0, 0.1);
}

.vax-timeline__row--tone-4 {
	--vax-tl-year: #003d7a;
	--vax-tl-node: #003d7a;
	--vax-tl-border: rgba(0, 61, 122, 0.1);
}

.vax-timeline__row--tone-5 {
	--vax-tl-year: #0066cc;
	--vax-tl-node: #0066cc;
	--vax-tl-border: rgba(0, 102, 204, 0.1);
}

.vax-timeline__row--tone-6 {
	--vax-tl-year: #ff6600;
	--vax-tl-node: #ff6600;
	--vax-tl-border: rgba(255, 102, 0, 0.1);
}

.vax-timeline__spacer {
	min-height: 1px;
}

.vax-timeline__axis {
	display: flex;
	align-items: center;
	justify-content: center;
	grid-column: 2;
	position: relative;
	z-index: 2;
}

/* Marco 64px — borda branca 4px, fundo por tom (Figma 89:4577) */
.vax-timeline__icon-wrap {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--vax-tl-node, #003d7a);
	display: flex;
	align-items: center;
	justify-content: center;
	border: 4px solid #fff;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	flex-shrink: 0;
}

/* Ícone ACF: fundo = tom do marco + contain — evita ícone branco “invisível” sobre branco */
.vax-timeline__icon-wrap--acf {
	background: var(--vax-tl-node, #003d7a);
	padding: 18px;
	box-sizing: border-box;
	overflow: hidden;
}

.vax-timeline__icon-wrap--acf .vax-timeline__icon-img {
	object-fit: contain;
}

/* SVG inline dentro do círculo 64px — reduzido conforme solicitado */
.vax-timeline__icon-wrap svg {
	display: block;
	flex-shrink: 0;
	width: 10px !important;
	height: 10px !important;
	max-width: 10px !important;
	max-height: 10px !important;
}

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

/* Card — padding 34px, borda 2px colorida por tom (Figma) */
.vax-timeline__card {
	max-width: 440px;
	width: 100%;
	padding: 34px;
	border-radius: 12px;
	background: #fff;
	border: 2px solid var(--vax-tl-border, rgba(0, 61, 122, 0.1));
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.vax-timeline__row--left .vax-timeline__card--left {
	grid-column: 1;
	justify-self: end;
	text-align: right;
	align-items: flex-end;
}

.vax-timeline__row--left .vax-timeline__axis {
	grid-column: 2;
}

.vax-timeline__row--left .vax-timeline__spacer {
	grid-column: 3;
}

.vax-timeline__row--right .vax-timeline__spacer {
	grid-column: 1;
}

.vax-timeline__row--right .vax-timeline__axis {
	grid-column: 2;
}

.vax-timeline__row--right .vax-timeline__card--right {
	grid-column: 3;
	justify-self: start;
	text-align: left;
	align-items: flex-start;
}

#vax-trajetoria .vax-timeline__card-year {
	display: block;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 1.875rem;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
	color: var(--vax-tl-year, #003d7a);
	margin: 0;
}

#vax-trajetoria .vax-timeline__card-title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1.4;
	color: #1a1a1a;
	margin: 0;
}

#vax-trajetoria .vax-timeline__card-desc {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.625;
	color: #4b5563;
}

#vax-trajetoria .vax-timeline__card-desc p {
	margin: 0 0 0.75em;
	color: inherit;
}

#vax-trajetoria .vax-timeline__card-desc a {
	color: #003d7a;
	text-decoration: underline;
	text-underline-offset: 2px;
}

#vax-trajetoria .vax-timeline__card-desc a:hover {
	color: #f47726;
}

#vax-trajetoria .vax-timeline__card-desc strong {
	color: #181818;
	font-weight: 600;
}

#vax-trajetoria .vax-timeline__card-desc p:last-child {
	margin-bottom: 0;
}

/* ================================================================
   STATS — .vax-traj-stats (4 itens no PHP)
   ================================================================ */

.vax-traj-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	width: 100%;
	margin-top: 64px;
}

.vax-traj-stats__item {
	background: #fff;
	border-radius: 12px;
	padding: 20px 16px;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: center;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);
}

.vax-traj-stats__value {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	/* Figma: 56px */
	font-size: clamp(2rem, 5vw, 3.5rem);
	line-height: 1.1;
	color: var(--color-secondary, #f47726);
}

.vax-traj-stats__label {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 500;
	font-size: 0.8125rem;
	line-height: 1.4;
	color: #003d7a;
	margin: 0;
}

.vax-traj-stats__number {
	font: inherit;
}

/* ================================================================
   MVV — classes reais do PHP (.vax-mvv__inner, __grid, __card)
   ================================================================ */

#vax-mvv.vax-block-mvv {
	position: relative;
	z-index: 2;
	margin-top: -48px !important;
	padding-top: 80px;
	padding-bottom: 120px;
}

.vax-mvv__inner {
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
}

.vax-mvv__header {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
}

.vax-mvv__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1.15;
	color: #fff;
	margin: 0;
}

.vax-mvv__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	/* Figma: 20px */
	font-size: clamp(1rem, 2vw, 1.25rem);
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.75);
	max-width: 640px;
	margin: 0;
}

.vax-mvv__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	width: 100%;
}

.vax-mvv__card {
	background: #fff;
	border-radius: 16px;
	padding: 40px 40px 32px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
	border: 1px solid rgba(0, 61, 122, 0.08);
}

.vax-mvv__icon-wrap {
	/* Figma: 80px, circular */
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: rgba(0, 61, 122, 0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-bottom: 24px;
}

.vax-mvv__icon-wrap--values {
	background: rgba(244, 119, 38, 0.1);
}

.vax-mvv__card-title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	/* Figma: 24px */
	font-size: 1.5rem;
	line-height: 1.33;
	color: #1a1a1a;
	margin: 0 0 12px;
	text-align: center;
	width: 100%;
}

/* Separador — entre título e corpo (Figma: linha em cinza, 32px) */
.vax-mvv__divider {
	display: block;
	width: 32px;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1;
	color: #9ca3af;
	margin: 0 0 20px;
	font-weight: 400;
}

.vax-mvv__body {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.625;
	color: #4b5563;
	width: 100%;
}

.vax-mvv__body--center {
	text-align: center;
}

.vax-mvv__body--center p {
	margin: 0 0 0.75em;
}

.vax-mvv__body--values {
	text-align: left;
}

.vax-mvv__body--values .vax-mvv__checklist {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
	width: 100%;
}

.vax-mvv__body--values li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-bottom: 0.625em;
	font-size: 1rem;
	color: #4b5563;
	line-height: 1.5;
}

.vax-mvv__body--values li::before {
	content: '';
	display: inline-block;
	width: 14px;
	height: 16px;
	min-width: 14px;
	margin-top: 3px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' fill='none'%3E%3Cpath d='M2 8l4 4 6-7' stroke='%23f47726' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.vax-mvv__empty {
	color: #94a3b8;
	margin: 0;
}

/* ================================================================
   RESPONSIVIDADE — trajetória + stats + MVV
   ================================================================ */

@media (max-width: 1024px) {
	.vax-timeline {
		max-width: 100%;
		gap: 56px;
	}

	.vax-timeline__row {
		grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
		gap: 0 clamp(16px, 3vw, 32px);
	}

	.vax-timeline__card {
		max-width: none;
		padding: 28px 24px;
	}

	.vax-traj-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vax-mvv__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.vax-timeline {
		gap: 48px;
	}

	.vax-timeline::before {
		display: none;
	}

	.vax-timeline__row,
	.vax-timeline__row--left,
	.vax-timeline__row--right {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
	}

	.vax-timeline__row .vax-timeline__spacer {
		display: none;
	}

	.vax-timeline__row .vax-timeline__axis {
		order: -1;
		align-self: center;
	}

	.vax-timeline__row--left .vax-timeline__card--left,
	.vax-timeline__row--right .vax-timeline__card--right {
		justify-self: stretch;
		max-width: none;
		text-align: left;
		align-items: flex-start;
	}

	.vax-timeline__icon-wrap {
		width: 56px;
		height: 56px;
		border-width: 3px;
	}

	.vax-traj-stats {
		grid-template-columns: 1fr;
	}

	.vax-traj-stats__item {
		flex-direction: row;
		justify-content: space-between;
		text-align: left;
		padding: 16px 20px;
	}

	.vax-traj-stats__value {
		font-size: 1.75rem;
	}

	body:has(#vax-hero-historia) #vax-trajetoria.vax-block-trajetoria,
	body.page-a-vertex #vax-trajetoria.vax-block-trajetoria,
	body.page-template-page-a-vertex #vax-trajetoria.vax-block-trajetoria,
	body.page-template-page-a-vertex-php #vax-trajetoria.vax-block-trajetoria,
	#vax-trajetoria.vax-block-trajetoria {
		margin-top: clamp(-56px, -10vw, -140px) !important;
		padding-top: 36px;
	}

	#vax-mvv.vax-block-mvv {
		margin-top: -24px !important;
		padding-bottom: 80px;
	}
}

/* ================================================================
   SEÇÃO: ESTRUTURA E ATUAÇÃO (Figma node 89:4566)
   ================================================================ */

.vax-estrutura {
	position: relative;
	z-index: 1;
	background: #fff;
	padding: 80px 0;
}

.vax-estrutura__header {
	text-align: center;
	margin-bottom: 48px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

.vax-estrutura__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 3vw, 2.25rem); /* Figma: 36px */
	line-height: 1.11;
	color: #181818;
	margin: 0;
}

.vax-estrutura__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1.25rem; /* Figma: 20px */
	line-height: 1.4;
	color: #9d9d9d;
	margin: 0;
}

/* Container geral alinhado com o restante da página */
.vax-estrutura__main-cards,
.vax-estrutura__diff-cards {
	max-width: 1232px;
	margin-inline: auto;
	padding-inline: 24px;
}

/* ── Cards coloridos (Infraestrutura + Equipe) ── */
.vax-estrutura__main-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	margin-bottom: 32px;
}

.vax-estrutura__card {
	border-radius: 12px;
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 0;
	color: #fff;
	min-height: 376px;
}

/* Figma: linear-gradient(147.93deg, #13284C → #27529D) */
.vax-estrutura__card--blue {
	background: linear-gradient(147.93deg, #13284c 0%, #27529d 100%);
}

/* Figma: linear-gradient(147.93deg, #F47726 → #EA512E) */
.vax-estrutura__card--orange {
	background: linear-gradient(147.93deg, #f47726 0%, #ea512e 100%);
}

.vax-estrutura__card-header {
	display: flex;
	align-items: center;
	gap: 0;
	margin-bottom: 48px; /* cabeçalho ocupa até top 128px — 40px padding + 64px ícone + 24px gap */
}

/* Ícone: overlay translúcido 64×64, border-radius 8px, padding 16px à direita (Figma) */
.vax-estrutura__icon-wrap {
	width: 64px;
	height: 64px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-right: 16px;
}

.vax-estrutura__icon-wrap svg {
	display: block;
	flex-shrink: 0;
}

.vax-estrutura__card-title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 1.5rem; /* Figma: 24px */
	line-height: 1.33;
	color: #fff;
	margin: 0;
}

.vax-estrutura__card-body {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1rem; /* Figma: 16px */
	line-height: 1.625;
	color: #fff;
	margin: 0 0 24px;
}

/* Lista com checkmark — Figma: gap 8px entre itens */
.vax-estrutura__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
}

.vax-estrutura__list-item {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.5;
	color: #fff;
}

.vax-estrutura__check {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

/* ── Cards brancos (Diferenciais) ── */
.vax-estrutura__diff-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}

.vax-estrutura__diff-card {
	background: #fff;
	border-radius: 12px;
	padding: 32px;
	display: flex;
	flex-direction: column;
	gap: 0;
	min-height: 306px;
}

/* Ícone overlay 56×56px, border-radius 8px, cor varia por card (Figma) */
.vax-estrutura__diff-icon {
	width: 56px;
	height: 56px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-bottom: 48px; /* posição do título: top 104px — 32px pad + 56px ícone + 16px gap */
}

.vax-estrutura__diff-icon svg {
	display: block;
}

.vax-estrutura__diff-icon--blue {
	background: rgba(0, 102, 204, 0.1);
}

.vax-estrutura__diff-icon--darkblue {
	background: rgba(0, 61, 122, 0.1);
}

.vax-estrutura__diff-icon--orange {
	background: rgba(255, 102, 0, 0.1);
}

.vax-estrutura__diff-title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 1.25rem; /* Figma: 20px */
	line-height: 1.4;
	color: #181818;
	margin: 0 0 16px;
}

.vax-estrutura__diff-body {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1rem; /* Figma: 16px */
	line-height: 1.625;
	color: #9d9d9d;
	margin: 0;
}

/* ── Responsive: tablet ── */
@media (max-width: 1023px) {
	.vax-estrutura__main-cards {
		grid-template-columns: 1fr 1fr;
		gap: 24px;
	}

	.vax-estrutura__diff-cards {
		grid-template-columns: 1fr 1fr;
		gap: 24px;
	}

	.vax-estrutura__diff-cards .vax-estrutura__diff-card:last-child {
		grid-column: 1 / -1;
		max-width: calc(50% - 12px);
	}
}

/* ── Responsive: mobile ── */
@media (max-width: 767px) {
	.vax-estrutura {
		padding: 48px 0;
	}

	.vax-estrutura__main-cards,
	.vax-estrutura__diff-cards {
		grid-template-columns: 1fr;
		gap: 16px;
		padding-inline: 16px;
	}

	.vax-estrutura__diff-cards .vax-estrutura__diff-card:last-child {
		grid-column: auto;
		max-width: none;
	}

	.vax-estrutura__card {
		min-height: auto;
		padding: 28px 24px;
	}

	.vax-estrutura__diff-card {
		min-height: auto;
	}

	.vax-estrutura__card-header {
		margin-bottom: 24px;
	}

	.vax-estrutura__diff-icon {
		margin-bottom: 24px;
	}
}

/* ================================================================
   VÍDEO INSTITUCIONAL (Figma 89:4656)
   ================================================================ */

.vax-video {
	background: #ffffff;
	padding: 80px 0 64px;
}

.vax-video__inner {
	max-width: 1120px;
	margin: 0 auto;
	padding-inline: 24px;
}

.vax-video__header {
	text-align: center;
	margin-bottom: 48px;
}

.vax-video__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 2.25rem;
	line-height: 1.11;
	color: #181818;
	margin: 0 0 16px;
}

.vax-video__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.4;
	color: #9d9d9d;
	margin: 0;
}

.vax-video__player-wrap {
	position: relative;
	width: 100%;
	max-width: 896px;
	margin: 0 auto 24px;
	border-radius: 16px;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, #13284c 0%, #003d7a 100%);
}

.vax-video__iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.vax-video__placeholder {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.vax-video__thumb {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vax-video__play {
	position: relative;
	z-index: 1;
	filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
	transition: transform 0.25s ease;
}

.vax-video__placeholder:hover .vax-video__play,
.vax-video__link:hover .vax-video__play {
	transform: scale(1.1);
}

.vax-video__link {
	display: block;
	width: 100%;
	height: 100%;
}

.vax-video__caption {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.5;
	color: #9d9d9d;
	text-align: center;
	margin: 0;
}

@media (max-width: 767px) {
	.vax-video {
		padding: 48px 0 40px;
	}

	.vax-video__title {
		font-size: 1.75rem;
	}

	.vax-video__subtitle {
		font-size: 1rem;
	}

	.vax-video__header {
		margin-bottom: 32px;
	}
}

/* ================================================================
   FALE COM UM ESPECIALISTA (Figma 89:4673)
   ================================================================ */

.vax-cta {
	background: linear-gradient(to right, #13284c 0%, #27529d 100%);
	padding: 80px 0;
}

.vax-cta__inner {
	max-width: 896px;
	margin: 0 auto;
	padding-inline: 24px;
	text-align: center;
}

.vax-cta__header {
	margin-bottom: 48px;
}

.vax-cta__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 700;
	font-size: 2.25rem;
	line-height: 1.11;
	color: #ffffff;
	margin: 0 0 24px;
}

.vax-cta__subtitle {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.625;
	color: #ffffff;
	margin: 0;
	max-width: 700px;
	margin-inline: auto;
}

.vax-cta__buttons {
	display: flex;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 48px;
}

.vax-cta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 19px 40px;
	border-radius: 8px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.556;
	text-decoration: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	cursor: pointer;
}

.vax-cta__btn:hover {
	opacity: 0.9;
	transform: translateY(-1px);
}

.vax-cta__btn--whatsapp {
	background: #f07e26;
	color: #ffffff;
}

.vax-cta__btn--contato {
	background: #ffffff;
	color: #13284c;
}

.vax-cta__contacts {
	display: flex;
	justify-content: center;
	gap: 64px;
	flex-wrap: wrap;
}

.vax-cta__contact-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

.vax-cta__contact-icon {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 4px;
}

.vax-cta__contact-label {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.5;
	color: #ffffff;
}

.vax-cta__contact-value {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 767px) {
	.vax-cta {
		padding: 48px 0;
	}

	.vax-cta__title {
		font-size: 1.75rem;
	}

	.vax-cta__subtitle {
		font-size: 1rem;
	}

	.vax-cta__buttons {
		flex-direction: column;
		align-items: stretch;
		margin-bottom: 48px;
	}

	.vax-cta__btn {
		padding: 16px 24px;
		font-size: 1rem;
	}

	.vax-cta__contacts {
		gap: 32px;
		flex-direction: column;
		align-items: center;
	}
}

/* ================================================================
   ANIMAÇÃO — seletores iguais a page-a-vertex.js (TARGETS)
   ================================================================ */

@media (prefers-reduced-motion: no-preference) {
	.vax-trajetoria__header,
	.vax-timeline__card--left,
	.vax-timeline__card--right,
	.vax-timeline__icon-wrap,
	.vax-traj-stats__item,
	.vax-mvv__header,
	.vax-mvv__card,
	.vax-estrutura__header,
	.vax-estrutura__card,
	.vax-estrutura__diff-card,
	.vax-video__header,
	.vax-video__player-wrap,
	.vax-cta__header,
	.vax-cta__buttons,
	.vax-cta__contact-item {
		opacity: 0;
		transform: translateY(20px);
		transition: opacity 0.6s ease, transform 0.6s ease;
	}

	.vax-trajetoria__header.vax-is-visible,
	.vax-timeline__card--left.vax-is-visible,
	.vax-timeline__card--right.vax-is-visible,
	.vax-timeline__icon-wrap.vax-is-visible,
	.vax-traj-stats__item.vax-is-visible,
	.vax-mvv__header.vax-is-visible,
	.vax-mvv__card.vax-is-visible,
	.vax-estrutura__header.vax-is-visible,
	.vax-estrutura__card.vax-is-visible,
	.vax-estrutura__diff-card.vax-is-visible,
	.vax-video__header.vax-is-visible,
	.vax-video__player-wrap.vax-is-visible,
	.vax-cta__header.vax-is-visible,
	.vax-cta__buttons.vax-is-visible,
	.vax-cta__contact-item.vax-is-visible {
		opacity: 1;
		transform: none;
	}
}