/*
 * Vecturex · Landing (Elementor)
 *
 * Estilos de la landing replicada con elementos de Elementor.
 * Reutiliza los tokens --vtx-* definidos en style.css.
 *
 * Todo va scopeado bajo .vtx-landing para no filtrarse al resto del sitio.
 *
 * IMPORTANTE (layout): Elementor envuelve los hijos de cada contenedor en
 * `.e-con-inner`. Por eso las rejillas se declaran sobre ese wrapper interior
 * (`.vtx-xxx > .e-con-inner`) y no sobre la clase del contenedor.
 */

.vtx-landing {
	--vtx-r: 16px;
	--vtx-r-lg: 24px;
	background: var(--vtx-paper);
	color: var(--vtx-text);
	overflow-x: clip;
}

.vtx-landing *,
.vtx-landing *::before,
.vtx-landing *::after {
	box-sizing: border-box;
}

.vtx-landing img {
	display: block;
	max-width: 100%;
}

.vtx-landing a {
	text-decoration: none;
}

.vtx-landing .vtx-wrap {
	margin-inline: auto;
	max-width: 1200px !important;
	padding-inline: 28px;
	width: 100%;
}

/* ---------- Tipografía base ---------- */

.vtx-landing .vtx-eyebrow {
	align-items: center;
	color: var(--vtx-accent);
	display: inline-flex;
	font-family: var(--vtx-font-mono);
	font-size: 0.72rem;
	font-weight: 700;
	gap: 0.55rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.vtx-landing .vtx-eyebrow::before {
	background: var(--vtx-accent);
	content: "";
	height: 2px;
	width: 26px;
}

.vtx-landing .vtx-eyebrow.on-dark {
	color: var(--vtx-accent-2);
}

.vtx-landing .vtx-eyebrow.on-dark::before {
	background: var(--vtx-accent-2);
}

.vtx-landing h1,
.vtx-landing h2,
.vtx-landing h3 {
	color: var(--vtx-brand);
	font-family: var(--vtx-font-display);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.08;
	margin: 0;
}

/* ---------- Botones ---------- */

.vtx-landing .vtx-btn {
	align-items: center;
	border: none;
	border-radius: 999px;
	cursor: pointer;
	display: inline-flex;
	font-family: var(--vtx-font-display);
	font-size: 0.98rem;
	font-weight: 600;
	gap: 0.5rem;
	justify-content: center;
	padding: 0.85rem 1.5rem;
	text-decoration: none;
	transition: transform 0.2s var(--vtx-ease), box-shadow 0.25s var(--vtx-ease), background 0.2s;
	white-space: nowrap;
}

.vtx-landing .vtx-btn-lg {
	font-size: 1.05rem;
	padding: 1rem 1.9rem;
}

.vtx-landing .vtx-btn-primary {
	background: linear-gradient(135deg, var(--vtx-accent), #584fc6);
	box-shadow: 0 10px 28px -10px rgba(108, 99, 214, 0.75);
	color: #fff;
}

.vtx-landing .vtx-btn-primary:hover {
	box-shadow: 0 16px 34px -12px rgba(108, 99, 214, 0.9);
	color: #fff;
	transform: translateY(-2px);
}

.vtx-landing .vtx-btn-ghost {
	background: transparent;
	border: 1.5px solid var(--vtx-mist);
	color: var(--vtx-brand);
}

.vtx-landing .vtx-btn-ghost:hover {
	border-color: var(--vtx-accent);
	color: var(--vtx-accent);
}

.vtx-landing .vtx-btn-ghost.on-dark {
	border-color: rgba(255, 255, 255, 0.26);
	color: #edecf8;
}

.vtx-landing .vtx-btn-ghost.on-dark:hover {
	border-color: var(--vtx-accent-2);
	color: #fff;
}

/* ---------- Bandas / secciones ---------- */

/*
 * Elementor aplica `gap: var(--row-gap) var(--column-gap)` a TODOS los
 * elementos (frontend.min.css) y el kit define 20px. Eso mete aire extra
 * entre cada widget. Lo anulamos en toda la landing; las rejillas que
 * necesitan separacion la declaran explicitamente con `gap`.
 */
.vtx-landing .elementor-element {
	--row-gap: 0;
	--column-gap: 0;
	--widgets-spacing: 0;
	--widgets-spacing-row: 0;
	--widgets-spacing-column: 0;
	--kit-widget-spacing: 0;
}

.vtx-landing .vtx-band {
	padding: 48px 0;
	position: relative;
}

.vtx-landing .vtx-sec-head {
	margin-bottom: 36px;
	max-width: 660px;
}

.vtx-landing .vtx-sec-head h2 {
	font-size: clamp(1.9rem, 3.4vw, 2.7rem);
	margin: 16px 0 14px;
}

.vtx-landing .vtx-sec-head p {
	color: var(--vtx-slate);
	font-size: 1.1rem;
	margin: 0;
}

.vtx-landing .vtx-center {
	margin-inline: auto;
	text-align: center;
}

.vtx-landing .vtx-center .vtx-eyebrow {
	justify-content: center;
}

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

.vtx-landing .vtx-hero {
	background:
		radial-gradient(1100px 560px at 82% -6%, rgba(143, 135, 240, 0.28), transparent 60%),
		radial-gradient(820px 460px at 4% 112%, rgba(108, 99, 214, 0.22), transparent 60%),
		linear-gradient(180deg, var(--vtx-brand) 0%, #332f50 100%);
	color: #edecf8;
	overflow: hidden;
	position: relative;
}

.vtx-landing .vtx-hero::after {
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 58px 58px;
	content: "";
	inset: 0;
	mask-image: radial-gradient(1000px 520px at 50% 16%, #000, transparent 82%);
	opacity: 0.5;
	pointer-events: none;
	position: absolute;
}

.vtx-landing .vtx-hero-inner {
	padding-block: 64px 56px;
	position: relative;
	z-index: 2;
}

.vtx-landing .vtx-hero .vtx-tagline {
	color: var(--vtx-accent-2);
	font-family: var(--vtx-font-mono);
	font-size: 0.72rem;
	letter-spacing: 0.24em;
	margin: 0 0 16px;
	text-transform: uppercase;
}

.vtx-landing .vtx-hero h1 {
	color: #fff;
	font-size: clamp(2.35rem, 4.5vw, 3.75rem);
	margin: 0 0 20px;
}

.vtx-landing .vtx-hero h1 .hl {
	color: var(--vtx-accent-2);
}

.vtx-landing .vtx-hero .vtx-lead {
	color: #c6c3e4;
	font-size: 1.16rem;
	margin: 0 0 30px;
	max-width: 44ch;
}

.vtx-landing .vtx-hero-ctas {
	display: flex;
	flex-direction: row !important;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 28px;
}

.vtx-landing .vtx-trust {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vtx-landing .vtx-trust li {
	align-items: center;
	color: #9e9ac4;
	display: inline-flex;
	font-family: var(--vtx-font-mono);
	font-size: 0.72rem;
	gap: 0.45rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.vtx-landing .vtx-trust li::before {
	background: var(--vtx-accent-2);
	border-radius: 50%;
	content: "";
	height: 6px;
	width: 6px;
}

/* Marco tipo navegador */

.vtx-landing .vtx-frame {
	background: #2b2846;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 16px;
	box-shadow: 0 44px 90px -44px rgba(0, 0, 0, 0.65);
	overflow: hidden;
}

.vtx-landing .vtx-frame .vtx-bar {
	align-items: center;
	background: rgba(255, 255, 255, 0.05);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	display: flex;
	gap: 8px;
	padding: 11px 14px;
}

.vtx-landing .vtx-frame .vtx-bar i {
	background: rgba(255, 255, 255, 0.22);
	border-radius: 50%;
	height: 11px;
	width: 11px;
}

.vtx-landing .vtx-frame .vtx-bar .url {
	background: rgba(255, 255, 255, 0.06);
	border-radius: 7px;
	color: #a7a3ce;
	flex: 1;
	font-family: var(--vtx-font-mono);
	font-size: 0.72rem;
	margin-left: 12px;
	max-width: 280px;
	padding: 4px 12px;
}

.vtx-landing .vtx-frame img {
	background: #fff;
	width: 100%;
}

.vtx-landing .vtx-hero-visual {
	position: relative;
}

.vtx-landing .vtx-hero-badge {
	align-items: center;
	background: #fff;
	border-radius: 14px;
	bottom: -16px;
	box-shadow: 0 24px 44px -20px rgba(0, 0, 0, 0.5);
	color: var(--vtx-brand);
	display: flex;
	gap: 12px;
	padding: 12px 16px;
	position: absolute;
	right: -14px;
}

.vtx-landing .vtx-hero-badge .m {
	font-family: var(--vtx-font-display);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
}

.vtx-landing .vtx-hero-badge .m .pos {
	color: var(--vtx-positive);
}

.vtx-landing .vtx-hero-badge small {
	color: var(--vtx-slate);
	display: block;
	font-family: var(--vtx-font-mono);
	font-size: 0.6rem;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ---------- Marquee ---------- */

.vtx-landing .vtx-marquee {
	background: var(--vtx-accent);
	color: #fff;
	overflow: hidden;
}

.vtx-landing .vtx-marquee-track {
	animation: vtx-slide 34s linear infinite;
	display: flex;
	white-space: nowrap;
	will-change: transform;
}

.vtx-landing .vtx-marquee:hover .vtx-marquee-track {
	animation-play-state: paused;
}

.vtx-landing .vtx-marquee-track span {
	align-items: center;
	display: inline-flex;
	font-family: var(--vtx-font-display);
	font-size: 1rem;
	font-weight: 700;
	gap: 26px;
	padding: 14px 26px;
}

.vtx-landing .vtx-marquee-track span::after {
	color: rgba(255, 255, 255, 0.55);
	content: "\25C6";
	font-size: 0.58rem;
}

@keyframes vtx-slide {
	to {
		transform: translateX(-50%);
	}
}

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

.vtx-landing .vtx-pillar {
	background: var(--vtx-cloud);
	border: 1px solid var(--vtx-mist);
	border-radius: var(--vtx-r-lg);
	padding: 32px 28px;
	transition: transform 0.3s var(--vtx-ease), box-shadow 0.3s var(--vtx-ease), border-color 0.3s;
}

.vtx-landing .vtx-pillar:hover {
	border-color: var(--vtx-accent);
	box-shadow: 0 26px 50px -30px rgba(62, 58, 95, 0.28);
	transform: translateY(-4px);
}

.vtx-landing .vtx-pillar .ic {
	align-items: center;
	background: linear-gradient(150deg, var(--vtx-accent), #584fc6);
	border-radius: 14px;
	color: #fff;
	display: flex;
	height: 52px;
	justify-content: center;
	margin-bottom: 20px;
	width: 52px;
}

.vtx-landing .vtx-pillar .ic svg {
	height: 26px;
	width: 26px;
}

.vtx-landing .vtx-pillar h3 {
	font-size: 1.28rem;
	margin-bottom: 10px;
}

.vtx-landing .vtx-pillar p {
	color: var(--vtx-slate);
	font-size: 1rem;
	margin: 0;
}

/* ---------- Features ---------- */

.vtx-landing .vtx-feat {
	background: var(--vtx-cloud);
	border: 1px solid var(--vtx-mist);
	border-radius: var(--vtx-r);
	display: flex;
	flex-direction: column;
	min-height: 214px;
	overflow: hidden;
	padding: 24px 22px 22px;
	position: relative;
	transition: transform 0.28s var(--vtx-ease), box-shadow 0.28s var(--vtx-ease), border-color 0.28s;
}

.vtx-landing .vtx-feat::before {
	background: var(--vtx-accent);
	content: "";
	height: 3px;
	left: 0;
	position: absolute;
	top: 0;
	transition: width 0.3s var(--vtx-ease);
	width: 0;
}

.vtx-landing .vtx-feat:hover {
	border-color: transparent;
	box-shadow: 0 24px 46px -28px rgba(62, 58, 95, 0.32);
	transform: translateY(-5px);
}

.vtx-landing .vtx-feat:hover::before {
	width: 100%;
}

.vtx-landing .vtx-feat .cat {
	color: var(--vtx-accent);
	font-family: var(--vtx-font-mono);
	font-size: 0.66rem;
	letter-spacing: 0.14em;
	margin-bottom: 14px;
	text-transform: uppercase;
}

.vtx-landing .vtx-feat .fic {
	align-items: center;
	background: var(--vtx-mist-2);
	border-radius: 11px;
	color: var(--vtx-brand);
	display: flex;
	height: 40px;
	justify-content: center;
	margin-bottom: 14px;
	transition: background 0.28s, color 0.28s;
	width: 40px;
}

.vtx-landing .vtx-feat:hover .fic {
	background: var(--vtx-brand);
	color: var(--vtx-accent-2);
}

.vtx-landing .vtx-feat .fic svg {
	height: 22px;
	width: 22px;
}

.vtx-landing .vtx-feat h3 {
	font-size: 1.1rem;
	letter-spacing: -0.01em;
	margin-bottom: 7px;
}

.vtx-landing .vtx-feat p {
	color: var(--vtx-slate);
	flex: 1;
	font-size: 0.9rem;
	margin: 0;
}

/* ---------- Showcase / carrusel ---------- */

.vtx-landing .vtx-showcase {
	background: var(--vtx-brand);
	color: #edecf8;
	overflow: hidden;
}

.vtx-landing .vtx-showcase .vtx-sec-head h2 {
	color: #fff;
}

.vtx-landing .vtx-showcase .vtx-sec-head p {
	color: #c6c3e4;
}

.vtx-landing .vtx-carousel {
	margin-inline: auto;
	max-width: 900px;
	position: relative;
}

.vtx-landing .vtx-viewport {
	border-radius: 16px;
	overflow: hidden;
}

.vtx-landing .vtx-track {
	display: flex;
	transition: transform 0.55s var(--vtx-ease);
}

.vtx-landing .vtx-slide {
	min-width: 100%;
	padding: 0 2px;
}

.vtx-landing .vtx-slide .vtx-frame {
	background: var(--vtx-paper);
}

.vtx-landing .vtx-car-ctrl {
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-top: 26px;
}

.vtx-landing .vtx-dots {
	display: flex;
	flex-direction: row;
	gap: 9px;
}

.vtx-landing .vtx-dots button {
	background: rgba(255, 255, 255, 0.3);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	height: 9px;
	padding: 0;
	transition: 0.25s;
	width: 9px;
}

.vtx-landing .vtx-dots button.active {
	background: var(--vtx-accent-2);
	border-radius: 5px;
	width: 26px;
}

.vtx-landing .vtx-arrows {
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.vtx-landing .vtx-arrows button {
	align-items: center;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	display: flex;
	height: 46px;
	justify-content: center;
	transition: 0.25s;
	width: 46px;
}

.vtx-landing .vtx-arrows button:hover {
	background: var(--vtx-accent);
	border-color: var(--vtx-accent);
}

.vtx-landing .vtx-arrows svg {
	height: 20px;
	width: 20px;
}

/* ---------- Integraciones ---------- */

.vtx-landing .vtx-integ .vtx-lead {
	color: var(--vtx-slate);
	margin: 0 auto 34px;
	max-width: 660px;
	text-align: center;
}

.vtx-landing .vtx-logos {
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	overflow: hidden;
	position: relative;
}

.vtx-landing .vtx-logos-track {
	animation: vtx-slide 30s linear infinite;
	display: flex;
	gap: 14px;
	white-space: nowrap;
	width: max-content;
}

.vtx-landing .vtx-logos:hover .vtx-logos-track {
	animation-play-state: paused;
}

.vtx-landing .vtx-chip {
	align-items: center;
	background: var(--vtx-cloud);
	border: 1px solid var(--vtx-mist);
	border-radius: 12px;
	color: var(--vtx-slate-dark);
	display: inline-flex;
	font-family: var(--vtx-font-display);
	font-size: 1rem;
	font-weight: 600;
	gap: 9px;
	padding: 14px 22px;
}

.vtx-landing .vtx-chip .d {
	background: var(--vtx-accent);
	border-radius: 50%;
	height: 8px;
	width: 8px;
}

.vtx-landing .vtx-ota-eco {
	margin-top: 34px;
	text-align: center;
}

.vtx-landing .vtx-ota-eco .cap {
	color: var(--vtx-slate);
	font-family: var(--vtx-font-mono);
	font-size: 0.7rem;
	letter-spacing: 0.12em;
	margin-bottom: 16px;
	text-transform: uppercase;
}

.vtx-landing .vtx-ota-eco img {
	background: #fff;
	border: 1px solid var(--vtx-mist);
	border-radius: var(--vtx-r-lg);
	margin: 0 auto;
	max-width: 760px;
	padding: 22px;
	width: 100%;
}

/* ---------- Modelo ---------- */

.vtx-landing .vtx-model {
	background: var(--vtx-cloud);
}

.vtx-landing .vtx-model .vtx-lead {
	color: var(--vtx-slate);
	font-size: 1.08rem;
	margin: 14px 0 20px;
}

.vtx-landing .vtx-bullets {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vtx-landing .vtx-bullets li {
	align-items: flex-start;
	color: var(--vtx-slate-dark);
	display: flex;
	gap: 11px;
}

.vtx-landing .vtx-bullets li svg {
	color: var(--vtx-accent);
	flex: none;
	height: 21px;
	margin-top: 3px;
	width: 21px;
}

.vtx-landing .vtx-bullets li b {
	color: var(--vtx-brand);
	font-weight: 600;
}

.vtx-landing .vtx-demo-card {
	background: linear-gradient(160deg, var(--vtx-brand), #332f50);
	border-radius: var(--vtx-r-lg);
	box-shadow: 0 40px 80px -50px rgba(62, 58, 95, 0.6);
	color: #edecf8;
	padding: 34px 32px;
}

.vtx-landing .vtx-demo-card h3 {
	color: #fff;
	font-size: 1.35rem;
	margin-bottom: 20px;
}

.vtx-landing .vtx-demo-card ul {
	display: grid;
	gap: 13px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vtx-landing .vtx-demo-card li {
	align-items: flex-start;
	color: #d7d5ee;
	display: flex;
	font-size: 0.97rem;
	gap: 11px;
}

.vtx-landing .vtx-demo-card li svg {
	color: var(--vtx-accent-2);
	flex: none;
	height: 20px;
	margin-top: 2px;
	width: 20px;
}

/* ---------- Talento ---------- */

.vtx-landing .vtx-talent {
	background: var(--vtx-paper);
}

.vtx-landing .vtx-talent .vtx-lead {
	color: var(--vtx-slate);
	font-size: 1.08rem;
	margin: 14px 0 22px;
}

.vtx-landing .vtx-points {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vtx-landing .vtx-points li {
	align-items: center;
	color: var(--vtx-slate-dark);
	display: flex;
	font-weight: 500;
	gap: 11px;
}

.vtx-landing .vtx-points li svg {
	color: var(--vtx-accent);
	flex: none;
	height: 21px;
	width: 21px;
}

.vtx-landing .vtx-join {
	background: linear-gradient(160deg, var(--vtx-brand), #332f50);
	border-radius: var(--vtx-r-lg);
	box-shadow: 0 40px 80px -50px rgba(62, 58, 95, 0.6);
	color: #edecf8;
	padding: 38px 34px;
	text-align: center;
}

.vtx-landing .vtx-join .ring {
	align-items: center;
	background: rgba(143, 135, 240, 0.18);
	border-radius: 50%;
	color: var(--vtx-accent-2);
	display: flex;
	height: 64px;
	justify-content: center;
	margin: 0 auto 18px;
	width: 64px;
}

.vtx-landing .vtx-join .ring svg {
	height: 30px;
	width: 30px;
}

.vtx-landing .vtx-join h3 {
	color: #fff;
	font-size: 1.4rem;
	margin-bottom: 8px;
}

.vtx-landing .vtx-join p {
	color: #c6c3e4;
	margin-bottom: 22px;
}

.vtx-landing .vtx-join .vtx-btn + .vtx-btn {
	margin-top: 12px;
}

/* ---------- ROI ---------- */

.vtx-landing .vtx-roi {
	background: linear-gradient(120deg, #584fc6, var(--vtx-accent));
}

.vtx-landing .vtx-roi .stat .n {
	color: #fff;
	font-family: var(--vtx-font-display);
	font-size: clamp(1.9rem, 3.8vw, 2.9rem);
	font-weight: 700;
	letter-spacing: -0.02em;
}

.vtx-landing .vtx-roi .stat .l {
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.95rem;
	font-weight: 500;
	margin-top: 4px;
}

.vtx-landing .vtx-roi .stat + .stat {
	border-left: 1px solid rgba(255, 255, 255, 0.2);
}

/* ---------- Precios ---------- */

.vtx-landing .vtx-pricing {
	background: var(--vtx-cloud);
}

.vtx-landing .vtx-price-card {
	background: linear-gradient(165deg, var(--vtx-brand), #332f50);
	border-radius: var(--vtx-r-lg);
	box-shadow: 0 40px 90px -50px rgba(62, 58, 95, 0.6);
	color: #edecf8;
	overflow: hidden;
	padding: 44px;
	position: relative;
}

.vtx-landing .vtx-price-offer {
	align-items: center;
	background: var(--vtx-positive);
	border-radius: 999px;
	color: var(--vtx-brand);
	display: inline-flex;
	font-family: var(--vtx-font-mono);
	font-size: 0.7rem;
	font-weight: 700;
	gap: 0.45rem;
	letter-spacing: 0.12em;
	margin-bottom: 18px;
	padding: 6px 13px;
	text-transform: uppercase;
}

.vtx-landing .vtx-price-tiles {
	margin: 6px 0 30px;
}

.vtx-landing .vtx-price-tile {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 16px;
	padding: 22px;
}

.vtx-landing .vtx-price-tile .k {
	color: #a7a3ce;
	font-family: var(--vtx-font-mono);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.vtx-landing .vtx-price-tile .v {
	color: #fff;
	font-family: var(--vtx-font-display);
	font-size: 2.1rem;
	font-weight: 700;
	line-height: 1;
	margin: 6px 0 2px;
}

.vtx-landing .vtx-price-tile .v .cur {
	font-size: 1.2rem;
	margin-right: 1px;
	vertical-align: top;
}

.vtx-landing .vtx-price-tile .note {
	color: #c6c3e4;
	font-size: 0.84rem;
}

.vtx-landing .vtx-incl h3,
.vtx-landing .vtx-faq h3 {
	color: #fff;
	font-size: 1.12rem;
	margin-bottom: 16px;
}

.vtx-landing .vtx-incl ul {
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr 1fr;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vtx-landing .vtx-incl li {
	align-items: flex-start;
	color: #d7d5ee;
	display: flex;
	font-size: 0.9rem;
	gap: 9px;
}

.vtx-landing .vtx-incl li svg {
	color: var(--vtx-positive);
	flex: none;
	height: 18px;
	margin-top: 3px;
	width: 18px;
}

.vtx-landing .vtx-faq .qa {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding: 14px 0;
}

.vtx-landing .vtx-faq .qa:last-child {
	border-bottom: none;
}

.vtx-landing .vtx-faq .q {
	color: #fff;
	font-family: var(--vtx-font-display);
	font-size: 0.98rem;
	font-weight: 600;
	margin-bottom: 4px;
}

.vtx-landing .vtx-faq .a {
	color: #b9b6d8;
	font-size: 0.87rem;
}

.vtx-landing .vtx-price-cta {
	display: flex;
	flex-direction: row !important;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 32px;
}

/* ---------- CTA / formulario ---------- */

.vtx-landing .vtx-cta-sec {
	background: var(--vtx-paper);
}

.vtx-landing .vtx-cta-card {
	background: var(--vtx-cloud);
	border: 1px solid var(--vtx-mist);
	border-radius: var(--vtx-r-lg);
	box-shadow: 0 40px 80px -50px rgba(62, 58, 95, 0.4);
	overflow: hidden;
}

.vtx-landing .vtx-cta-aside {
	background: linear-gradient(165deg, var(--vtx-brand), #332f50);
	color: #edecf8;
	display: flex;
	flex-direction: column;
	padding: 44px 40px;
}

.vtx-landing .vtx-cta-aside h2 {
	color: #fff;
	font-size: 1.9rem;
	margin: 16px 0 14px;
}

.vtx-landing .vtx-cta-aside p {
	color: #c6c3e4;
	margin-bottom: 26px;
}

.vtx-landing .vtx-cta-aside .re {
	display: grid;
	gap: 14px;
	list-style: none;
	margin: auto 0 0;
	padding: 0;
}

.vtx-landing .vtx-cta-aside .re li {
	align-items: center;
	color: #d7d5ee;
	display: flex;
	font-size: 0.95rem;
	gap: 11px;
}

.vtx-landing .vtx-cta-aside .re li svg {
	color: var(--vtx-accent-2);
	flex: none;
	height: 20px;
	width: 20px;
}

.vtx-landing .vtx-cta-aside .contact {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	color: #a7a3ce;
	font-size: 0.9rem;
	margin-top: 28px;
	padding-top: 22px;
}

.vtx-landing .vtx-cta-aside .contact a {
	color: var(--vtx-accent-2);
	font-family: var(--vtx-font-display);
	font-weight: 600;
}

.vtx-landing .vtx-cta-form {
	padding: 40px;
}

.vtx-landing .vtx-toggle {
	background: var(--vtx-mist-2);
	border-radius: 999px;
	display: inline-flex;
	gap: 4px;
	margin-bottom: 26px;
	padding: 5px;
}

.vtx-landing .vtx-toggle button {
	background: none;
	border: none;
	border-radius: 999px;
	color: var(--vtx-slate-dark);
	cursor: pointer;
	font-family: var(--vtx-font-display);
	font-size: 0.92rem;
	font-weight: 600;
	padding: 0.6rem 1.3rem;
	transition: 0.25s;
}

.vtx-landing .vtx-toggle button.active {
	background: var(--vtx-brand);
	color: #fff;
}

.vtx-landing .vtx-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.vtx-landing .vtx-field.full {
	grid-column: 1 / -1;
}

.vtx-landing .vtx-field label {
	color: var(--vtx-slate-dark);
	font-size: 0.82rem;
	font-weight: 600;
}

.vtx-landing .vtx-field label .req {
	color: var(--vtx-accent);
}

.vtx-landing .vtx-field input,
.vtx-landing .vtx-field select,
.vtx-landing .vtx-field textarea {
	background: #fff;
	border: 1.5px solid var(--vtx-mist);
	border-radius: 11px;
	color: var(--vtx-text);
	font-family: var(--vtx-font-body);
	font-size: 0.95rem;
	padding: 0.75rem 0.9rem;
	transition: border-color 0.2s, box-shadow 0.2s;
	width: 100%;
}

.vtx-landing .vtx-field textarea {
	min-height: 88px;
	resize: vertical;
}

.vtx-landing .vtx-field input:focus,
.vtx-landing .vtx-field select:focus,
.vtx-landing .vtx-field textarea:focus {
	border-color: var(--vtx-accent);
	box-shadow: 0 0 0 4px rgba(108, 99, 214, 0.16);
	outline: none;
}

.vtx-landing .vtx-form-submit {
	align-items: center;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 22px;
}

.vtx-landing .vtx-form-note {
	color: var(--vtx-slate);
	font-size: 0.8rem;
}

.vtx-landing .vtx-form-ok {
	background: rgba(52, 199, 168, 0.12);
	border: 1px solid var(--vtx-positive);
	border-radius: 12px;
	color: #1e8e76;
	display: none;
	font-size: 0.95rem;
	font-weight: 600;
	margin-top: 14px;
	padding: 16px 18px;
}

.vtx-landing .vtx-form-ok.show {
	display: block;
}

/* ---------- Reveal ---------- */

.vtx-landing .vtx-reveal {
	transition: opacity 0.7s var(--vtx-ease), transform 0.7s var(--vtx-ease);
}

.vtx-landing .vtx-reveal.pre {
	opacity: 0;
	transform: translateY(26px);
}

.vtx-landing .vtx-reveal.in {
	opacity: 1;
	transform: none;
}

/* ---------- Layout de contenedores de Elementor ---------- */

/*
 * Elementor aplica un padding por defecto de 10px a los contenedores via
 * custom properties. Lo anulamos en los contenedores de la landing.
 */
.vtx-landing .vtx-band,
.vtx-landing .vtx-hero,
.vtx-landing .vtx-roi,
.vtx-landing .vtx-marquee,
.vtx-landing .vtx-wrap,
.vtx-landing .vtx-hero-inner,
.vtx-landing .vtx-pillars,
.vtx-landing .vtx-feat-grid,
.vtx-landing .vtx-roi-grid,
.vtx-landing .vtx-price-tiles,
.vtx-landing .vtx-price-grid,
.vtx-landing .vtx-model-grid,
.vtx-landing .vtx-talent-grid,
.vtx-landing .vtx-cta-card,
.vtx-landing .vtx-form-grid,
.vtx-landing .vtx-hero-ctas,
.vtx-landing .vtx-trust,
.vtx-landing .vtx-price-card,
.vtx-landing .vtx-cta-aside,
.vtx-landing .vtx-cta-form,
.vtx-landing .vtx-pillar,
.vtx-landing .vtx-feat,
.vtx-landing .vtx-demo-card,
.vtx-landing .vtx-join,
.vtx-landing .vtx-price-tile,
.vtx-landing .vtx-sec-head,
.vtx-landing .vtx-hero-copy,
.vtx-landing .vtx-hero-visual,
.vtx-landing .vtx-price-cta,
.vtx-landing .vtx-form-submit,
.vtx-landing .vtx-car-ctrl,
.vtx-landing .vtx-carousel,
.vtx-landing .vtx-viewport,
.vtx-landing .vtx-ota-eco,
.vtx-landing .vtx-logos,
.vtx-landing .vtx-incl,
.vtx-landing .vtx-faq,
.vtx-landing .vtx-price-offer,
.vtx-landing .vtx-toggle,
.vtx-landing .vtx-bullets,
.vtx-landing .vtx-points,
.vtx-landing .vtx-demo-card ul,
.vtx-landing .vtx-cta-aside .re,
.vtx-landing .vtx-incl ul,
.vtx-landing .vtx-faq .qa,
.vtx-landing .vtx-roi .stat,
.vtx-landing .vtx-slide,
.vtx-landing .vtx-frame,
.vtx-landing .vtx-frame .vtx-bar,
.vtx-landing .vtx-hero-badge,
.vtx-landing .vtx-pillar .ic,
.vtx-landing .vtx-feat .fic,
.vtx-landing .vtx-join .ring,
.vtx-landing .vtx-chip,
.vtx-landing .vtx-field,
.vtx-landing .vtx-dots,
.vtx-landing .vtx-arrows {
	--padding-top: 0;
	--padding-right: 0;
	--padding-bottom: 0;
	--padding-left: 0;
}

/*
 * La home EN todavia se renderiza con el widget HTML antiguo dentro de
 * secciones clasicas de Elementor (`elementor-section`), no con los
 * contenedores nuevos (`e-con`). Esas secciones y sus columnas anaden
 * margen/padding por defecto que en la home ES no existen, y por eso
 * aparecen franjas en blanco entre el header, el hero y el marquee.
 *
 * La home ES no usa `elementor-section`, asi que este bloque solo
 * afecta a la version antigua (EN) y no toca el diseno nuevo.
 */
.vtx-landing .elementor-section,
.vtx-landing .elementor-section > .elementor-container,
.vtx-landing .elementor-section .elementor-column,
.vtx-landing .elementor-section .elementor-widget-wrap,
.vtx-landing .elementor-section .elementor-widget,
.vtx-landing .elementor-section .elementor-widget-container {
	margin-block: 0 !important;
	padding-block: 0 !important;
}

.vtx-landing .elementor-section .elementor-widget:not(:last-child) {
	margin-bottom: 0 !important;
}

/*
 * Elementor envuelve los hijos de los contenedores `boxed` en `.e-con-inner`,
 * pero los contenedores `full` no lo generan. Por eso las rejillas se aplican
 * tanto al contenedor como a su posible wrapper interior.
 */
.vtx-landing .vtx-hero-inner,
.vtx-landing .vtx-hero-inner > .e-con-inner,
.vtx-landing .vtx-pillars,
.vtx-landing .vtx-pillars > .e-con-inner,
.vtx-landing .vtx-feat-grid,
.vtx-landing .vtx-feat-grid > .e-con-inner,
.vtx-landing .vtx-roi-grid,
.vtx-landing .vtx-roi-grid > .e-con-inner,
.vtx-landing .vtx-price-tiles,
.vtx-landing .vtx-price-tiles > .e-con-inner,
.vtx-landing .vtx-price-grid,
.vtx-landing .vtx-price-grid > .e-con-inner,
.vtx-landing .vtx-model-grid,
.vtx-landing .vtx-model-grid > .e-con-inner,
.vtx-landing .vtx-talent-grid,
.vtx-landing .vtx-talent-grid > .e-con-inner,
.vtx-landing .vtx-cta-card,
.vtx-landing .vtx-cta-card > .e-con-inner,
.vtx-landing .vtx-form-grid,
.vtx-landing .vtx-form-grid > .e-con-inner {
	display: grid !important;
	width: 100%;
}

.vtx-landing .vtx-hero-inner,
.vtx-landing .vtx-hero-inner > .e-con-inner {
	align-items: center;
	gap: 52px;
	grid-template-columns: 1.02fr 1.05fr;
}

.vtx-landing .vtx-pillars,
.vtx-landing .vtx-pillars > .e-con-inner {
	gap: 22px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vtx-landing .vtx-feat-grid,
.vtx-landing .vtx-feat-grid > .e-con-inner {
	gap: 18px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.vtx-landing .vtx-roi-grid,
.vtx-landing .vtx-roi-grid > .e-con-inner {
	gap: 20px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	text-align: center;
}

.vtx-landing .vtx-price-tiles,
.vtx-landing .vtx-price-tiles > .e-con-inner {
	gap: 18px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vtx-landing .vtx-price-grid,
.vtx-landing .vtx-price-grid > .e-con-inner {
	align-items: start;
	gap: 44px;
	grid-template-columns: 1.1fr 0.9fr;
}

.vtx-landing .vtx-model-grid,
.vtx-landing .vtx-model-grid > .e-con-inner {
	align-items: center;
	gap: 56px;
	grid-template-columns: 1.05fr 0.95fr;
}

.vtx-landing .vtx-talent-grid,
.vtx-landing .vtx-talent-grid > .e-con-inner {
	align-items: center;
	gap: 52px;
	grid-template-columns: 1.1fr 0.9fr;
}

.vtx-landing .vtx-cta-card,
.vtx-landing .vtx-cta-card > .e-con-inner {
	grid-template-columns: 0.85fr 1.15fr;
}

.vtx-landing .vtx-form-grid,
.vtx-landing .vtx-form-grid > .e-con-inner {
	gap: 16px;
	grid-template-columns: 1fr 1fr;
}

/* ---------- Normalización de widgets nativos de Elementor ---------- */

/*
 * Elementor genera un CSS por pagina (uploads/elementor/css/post-XX.css) que
 * se carga DESPUES de este archivo y aplica la tipografia y los colores
 * globales del kit a headings, texto y botones. Aqui lo neutralizamos dentro
 * de la landing para recuperar el diseno original.
 */

.vtx-landing .elementor-widget-heading .elementor-heading-title {
	color: var(--vtx-brand) !important;
	font-family: var(--vtx-font-display) !important;
	font-weight: 700 !important;
	margin: 0;
}

.vtx-landing .elementor-widget-text-editor {
	color: inherit !important;
	font-family: inherit !important;
	font-weight: inherit !important;
}

/*
 * El widget Button de Elementor aplica `_css_classes` al WRAPPER, no al
 * <a class="elementor-button"> interior. Por eso replicamos el estilo de
 * `.vtx-btn` sobre el enlace y usamos el wrapper solo como modificador.
 */
.vtx-landing .elementor-widget-button.vtx-btn {
	background: none;
	border: none;
	box-shadow: none;
	display: block;
	padding: 0;
}

.vtx-landing .elementor-widget-button .elementor-button {
	align-items: center;
	background-color: transparent !important;
	border: 1.5px solid transparent;
	border-radius: 999px;
	display: inline-flex;
	font-family: var(--vtx-font-display) !important;
	font-size: 0.98rem;
	font-weight: 600 !important;
	justify-content: center;
	padding: 0.85rem 1.5rem;
	text-decoration: none;
	transition: transform 0.2s var(--vtx-ease), box-shadow 0.25s var(--vtx-ease), background 0.2s;
	white-space: nowrap;
}

.vtx-landing .vtx-btn-lg .elementor-button {
	font-size: 1.05rem;
	padding: 1rem 1.9rem;
}

.vtx-landing .vtx-btn-primary .elementor-button {
	background-image: linear-gradient(135deg, var(--vtx-accent), #584fc6) !important;
	box-shadow: 0 10px 28px -10px rgba(108, 99, 214, 0.75);
	color: #fff !important;
}

.vtx-landing .vtx-btn-primary .elementor-button:hover {
	box-shadow: 0 16px 34px -12px rgba(108, 99, 214, 0.9);
	color: #fff !important;
	transform: translateY(-2px);
}

.vtx-landing .vtx-btn-ghost .elementor-button {
	background: transparent !important;
	border-color: var(--vtx-mist);
	color: var(--vtx-brand) !important;
}

.vtx-landing .vtx-btn-ghost.on-dark .elementor-button {
	border-color: rgba(255, 255, 255, 0.26);
	color: #edecf8 !important;
}

.vtx-landing .vtx-btn-ghost.on-dark .elementor-button:hover {
	border-color: var(--vtx-accent-2);
	color: #fff !important;
}

/* Titulos sobre fondo oscuro. Deben ir despues de la regla base de arriba. */
.vtx-landing .vtx-hero .elementor-heading-title,
.vtx-landing .vtx-showcase .elementor-heading-title,
.vtx-landing .vtx-demo-card .elementor-heading-title,
.vtx-landing .vtx-join .elementor-heading-title,
.vtx-landing .vtx-cta-aside .elementor-heading-title,
.vtx-landing .vtx-incl .elementor-heading-title,
.vtx-landing .vtx-faq .elementor-heading-title {
	color: #fff !important;
}

.vtx-landing .elementor-widget-icon-list .elementor-icon-list-item {
	align-items: center;
}

.vtx-landing .elementor-widget-image img {
	display: block;
}

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
	.vtx-landing .vtx-hero-inner,
	.vtx-landing .vtx-hero-inner > .e-con-inner {
		gap: 48px;
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-hero-visual {
		max-width: 560px;
	}

	.vtx-landing .vtx-feat-grid,
	.vtx-landing .vtx-feat-grid > .e-con-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtx-landing .vtx-model-grid,
	.vtx-landing .vtx-model-grid > .e-con-inner,
	.vtx-landing .vtx-talent-grid,
	.vtx-landing .vtx-talent-grid > .e-con-inner {
		gap: 40px;
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-cta-card,
	.vtx-landing .vtx-cta-card > .e-con-inner {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 820px) {
	/*
	 * En movil el track del marquee es mucho mas estrecho, asi que con
	 * la misma duracion (34s) recorre menos pixeles por segundo y se
	 * percibe lento. Reducimos la duracion para mantener una velocidad
	 * de lectura similar a la de escritorio.
	 */
	.vtx-landing .vtx-marquee-track {
		animation-duration: 6s;
	}

	.vtx-landing .vtx-logos-track {
		animation-duration: 6s;
	}

	.vtx-landing .vtx-pillars,
	.vtx-landing .vtx-pillars > .e-con-inner {
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-roi-grid,
	.vtx-landing .vtx-roi-grid > .e-con-inner {
		gap: 30px 20px;
		grid-template-columns: 1fr 1fr;
	}

	.vtx-landing .vtx-roi .stat + .stat {
		border-left: none;
	}

	.vtx-landing .vtx-price-tiles,
	.vtx-landing .vtx-price-tiles > .e-con-inner {
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-price-grid,
	.vtx-landing .vtx-price-grid > .e-con-inner {
		gap: 30px;
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-incl ul {
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-price-card {
		padding: 30px 24px;
	}
}

@media (max-width: 560px) {
	.vtx-landing .vtx-marquee-track {
		animation-duration: 6s;
	}

	.vtx-landing .vtx-logos-track {
		animation-duration: 6s;
	}

	.vtx-landing .vtx-wrap {
		padding-inline: 20px;
	}

	.vtx-landing .vtx-band {
		padding: 40px 0;
	}

	.vtx-landing .vtx-hero-inner {
		padding-block: 44px;
	}

	.vtx-landing .vtx-feat-grid,
	.vtx-landing .vtx-feat-grid > .e-con-inner,
	.vtx-landing .vtx-form-grid,
	.vtx-landing .vtx-form-grid > .e-con-inner,
	.vtx-landing .vtx-roi-grid,
	.vtx-landing .vtx-roi-grid > .e-con-inner {
		grid-template-columns: 1fr;
	}

	.vtx-landing .vtx-cta-aside,
	.vtx-landing .vtx-cta-form {
		padding: 30px 24px;
	}

	.vtx-landing .vtx-toggle {
		display: flex;
		width: 100%;
	}

	.vtx-landing .vtx-toggle button {
		flex: 1;
		font-size: 0.82rem;
		padding: 0.55rem 0.6rem;
	}

	.vtx-landing .vtx-hero-ctas,
	.vtx-landing .vtx-price-cta {
		flex-direction: column !important;
	}

	.vtx-landing .vtx-hero-ctas > *,
	.vtx-landing .vtx-price-cta > *,
	.vtx-landing .vtx-hero-ctas .vtx-btn,
	.vtx-landing .vtx-price-cta .vtx-btn,
	.vtx-landing .vtx-hero-ctas .elementor-button,
	.vtx-landing .vtx-price-cta .elementor-button {
		width: 100%;
	}

	.vtx-landing .vtx-arrows {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.vtx-landing *,
	.vtx-landing *::before,
	.vtx-landing *::after {
		animation: none !important;
		transition: none !important;
	}

	.vtx-landing .vtx-reveal.pre {
		opacity: 1;
		transform: none;
	}
}