/* ==========================================================================
   IMPULZO STUDIO - SECCIÓN DE SERVICIOS (impulzo-seccion-servicios-v2)
   Cero CSS en línea - Gobernado por Variables CSS de Elementor
   ========================================================================== */

.impulzo-seccion-servicios-v2-container {
	/* Variables del Contenedor y Grid */
	--impulzo-srv-max-width: 1180px;
	--impulzo-srv-custom-width: 1140px;
	--impulzo-srv-min-height: 0px;
	--impulzo-srv-padding: 24px 20px;
	--impulzo-srv-cols: 2;
	--impulzo-srv-rows: 1;
	--impulzo-srv-flow: row;
	--impulzo-srv-gap-x: 42px;
	--impulzo-srv-gap-y: 24px;
	--impulzo-srv-inner-dir: row;

	/* Variables de la Tarjeta y Grow en % */
	--impulzo-srv-card-min-height: 98px;
	--impulzo-srv-card-padding: 18px 44px 18px 22px;
	--impulzo-srv-card-radius: 2px;
	--impulzo-srv-card-bg-1: #ffffff;
	--impulzo-srv-card-bg-2: #f8fafc;
	--impulzo-srv-card-bg-angle: 135deg;
	--impulzo-srv-card-hover-bg-1: #0084c2;
	--impulzo-srv-card-hover-bg-2: #005885;
	--impulzo-srv-card-hover-angle: 135deg;
	--impulzo-srv-card-grow-pct: 2.5;
	--impulzo-srv-card-duration: 360ms;

	/* Variables del Rectángulo con Icono y Slice Diagonal */
	--impulzo-srv-icon-box-w: 76px;
	--impulzo-srv-icon-box-h: 56px;
	--impulzo-srv-icon-size: 38px;
	--impulzo-srv-icon-box-radius: 7px;
	--impulzo-srv-icon-align: center;
	--impulzo-srv-icon-offset-y: 0px;
	--impulzo-srv-icon-shadow-color: rgba(0, 126, 196, 0.32);
	--impulzo-srv-icon-box-bg: #007ec4;
	--impulzo-srv-icon-color: #ffffff;
	--impulzo-srv-icon-box-hover-bg: #ffffff;
	--impulzo-srv-icon-hover-color: #007ec4;
	--impulzo-srv-slice-angle: -24deg;
	--impulzo-srv-slice-duration: 420ms;

	/* Variables del Texto */
	--impulzo-srv-text-color: #007ec4;
	--impulzo-srv-text-hover-color: #ffffff;
	--impulzo-srv-text-align: left;
	--impulzo-srv-text-v-align: center;
	--impulzo-srv-inner-gap: 28px;
	--impulzo-srv-text-x: 0px;
	--impulzo-srv-text-y: 0px;
	--impulzo-srv-text-padding: 0px;

	/* Variables de Semicírculo y Flecha Pulsante */
	--impulzo-srv-corner-size: 42px;
	--impulzo-srv-arrow-size: 16px;
	--impulzo-srv-corner-bg: #f4f5f7;
	--impulzo-srv-corner-hover-bg: #f4f5f7;
	--impulzo-srv-arrow-color: #9ca3af;
	--impulzo-srv-arrow-hover-color: #6b7280;
	--impulzo-srv-arrow-loop-sec: 0.85s;
	--impulzo-srv-arrow-push-x: 5px;

	/* Variables de Animación de Entrada Escalonada */
	--impulzo-srv-entrance-duration: 650ms;
	--impulzo-srv-entrance-stagger: 110ms;
	--impulzo-srv-entrance-distance: 36px;
	--impulzo-srv-entrance-scale: 0.92;

	position: relative;
	width: 100%;
	min-height: var(--impulzo-srv-min-height);
	padding: var(--impulzo-srv-padding);
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

.impulzo-seccion-servicios-v2-container *,
.impulzo-seccion-servicios-v2-container *::before,
.impulzo-seccion-servicios-v2-container *::after {
	box-sizing: border-box;
}

.impulzo-seccion-servicios-v2-grid {
	display: grid;
	grid-template-columns: repeat(var(--impulzo-srv-cols), minmax(0, 1fr));
	grid-template-rows: repeat(var(--impulzo-srv-rows), auto);
	grid-auto-flow: var(--impulzo-srv-flow);
	column-gap: var(--impulzo-srv-gap-x);
	row-gap: var(--impulzo-srv-gap-y);
	margin-left: auto;
	margin-right: auto;
}

.impulzo-seccion-servicios-v2-container.layout-boxed .impulzo-seccion-servicios-v2-grid {
	width: 100%;
	max-width: var(--impulzo-srv-max-width);
}

.impulzo-seccion-servicios-v2-container.layout-full .impulzo-seccion-servicios-v2-grid {
	width: 100%;
	max-width: 100%;
}

.impulzo-seccion-servicios-v2-container.layout-custom .impulzo-seccion-servicios-v2-grid {
	width: var(--impulzo-srv-custom-width);
	max-width: 100%;
}

/* ==========================================================================
   TARJETA DE SERVICIO (TODA LA TARJETA ES ZONA ACTIVA DE LINK)
   ========================================================================== */
.impulzo-seccion-servicios-v2-card {
	--impulzo-srv-order-delay: 0ms;
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	min-height: var(--impulzo-srv-card-min-height);
	padding: var(--impulzo-srv-card-padding);
	border-radius: var(--impulzo-srv-card-radius);
	text-decoration: none !important;
	overflow: hidden;
	isolation: isolate;
	cursor: pointer;
	box-shadow: 0 12px 28px -6px rgba(15, 23, 42, 0.11), 0 4px 12px -2px rgba(15, 23, 42, 0.06);
	transition: transform var(--impulzo-srv-card-duration) cubic-bezier(0.22, 1, 0.36, 1),
	            box-shadow var(--impulzo-srv-card-duration) ease,
	            background var(--impulzo-srv-card-duration) ease;
}

/* Fondo Normal (Sólido, Lineal, Radial) */
.impulzo-seccion-servicios-v2-container.card-bg-solid .impulzo-seccion-servicios-v2-card {
	background: var(--impulzo-srv-card-bg-1);
}

.impulzo-seccion-servicios-v2-container.card-bg-linear .impulzo-seccion-servicios-v2-card {
	background: linear-gradient(var(--impulzo-srv-card-bg-angle), var(--impulzo-srv-card-bg-1) 0%, var(--impulzo-srv-card-bg-2) 100%);
}

.impulzo-seccion-servicios-v2-container.card-bg-radial .impulzo-seccion-servicios-v2-card {
	background: radial-gradient(circle at center, var(--impulzo-srv-card-bg-1) 0%, var(--impulzo-srv-card-bg-2) 100%);
}

/* Capa de Fondo Hover de la Tarjeta */
.impulzo-seccion-servicios-v2-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: 0;
	transition: opacity var(--impulzo-srv-card-duration) ease;
	pointer-events: none;
}

.impulzo-seccion-servicios-v2-container.card-hover-bg-solid .impulzo-seccion-servicios-v2-card::before {
	background: var(--impulzo-srv-card-hover-bg-1);
}

.impulzo-seccion-servicios-v2-container.card-hover-bg-linear .impulzo-seccion-servicios-v2-card::before {
	background: linear-gradient(var(--impulzo-srv-card-hover-angle), var(--impulzo-srv-card-hover-bg-1) 0%, var(--impulzo-srv-card-hover-bg-2) 100%);
}

.impulzo-seccion-servicios-v2-container.card-hover-bg-radial .impulzo-seccion-servicios-v2-card::before {
	background: radial-gradient(circle at center, var(--impulzo-srv-card-hover-bg-1) 0%, var(--impulzo-srv-card-hover-bg-2) 100%);
}

.impulzo-seccion-servicios-v2-card:hover::before {
	opacity: 1;
}

/* Ligero Grow del Ítem en Hover (Controlado por %) */
.impulzo-seccion-servicios-v2-container.has-card-grow .impulzo-seccion-servicios-v2-card:hover {
	transform: scale(calc(1 + (var(--impulzo-srv-card-grow-pct) / 100)));
	box-shadow: 0 18px 36px -8px rgba(0, 100, 160, 0.26);
}

/* ==========================================================================
   CUERPO INTERNO E INTERCAMBIO DE ORDEN (1° ICONO - 2° TEXTO Y VICEVERSA)
   ========================================================================== */
.impulzo-seccion-servicios-v2-card-body {
	display: flex;
	flex-direction: var(--impulzo-srv-inner-dir);
	align-items: center;
	gap: var(--impulzo-srv-inner-gap);
	width: 100%;
	position: relative;
	z-index: 2;
}

.impulzo-seccion-servicios-v2-card.item-dir-row .impulzo-seccion-servicios-v2-card-body {
	flex-direction: row;
}

.impulzo-seccion-servicios-v2-card.item-dir-row-reverse .impulzo-seccion-servicios-v2-card-body {
	flex-direction: row-reverse;
	justify-content: space-between;
}

/* ==========================================================================
   RECTÁNGULO CON ICONO + SOMBRA FX + ANIMACIÓN SLICE DIAGONAL EN HOVER
   ========================================================================== */
.impulzo-seccion-servicios-v2-icon-box {
	position: relative;
	width: var(--impulzo-srv-icon-box-w);
	height: var(--impulzo-srv-icon-box-h);
	border-radius: var(--impulzo-srv-icon-box-radius);
	background-color: var(--impulzo-srv-item-rect-bg, var(--impulzo-srv-icon-box-bg));
	color: var(--impulzo-srv-item-icon-color, var(--impulzo-srv-icon-color));
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	align-self: var(--impulzo-srv-icon-align);
	transform: translateY(var(--impulzo-srv-icon-offset-y));
	overflow: hidden;
	isolation: isolate;
	transition: color var(--impulzo-srv-slice-duration) ease,
	            box-shadow var(--impulzo-srv-slice-duration) ease,
	            transform var(--impulzo-srv-slice-duration) ease;
}

.impulzo-seccion-servicios-v2-container.has-icon-shadow .impulzo-seccion-servicios-v2-icon-box {
	box-shadow: 6px 6px 18px 0 var(--impulzo-srv-icon-shadow-color);
}

.impulzo-seccion-servicios-v2-container.no-icon-shadow .impulzo-seccion-servicios-v2-icon-box {
	box-shadow: none !important;
}

/* Capa de Slice Diagonal que revela el nuevo color del rectángulo */
.impulzo-seccion-servicios-v2-icon-slice {
	position: absolute;
	top: -25%;
	left: -35%;
	width: 170%;
	height: 150%;
	background-color: var(--impulzo-srv-item-rect-hover-bg, var(--impulzo-srv-icon-box-hover-bg));
	transform: translateX(-105%) skewX(var(--impulzo-srv-slice-angle));
	transform-origin: center;
	transition: transform var(--impulzo-srv-slice-duration) cubic-bezier(0.22, 1, 0.36, 1);
	z-index: -1;
	pointer-events: none;
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-icon-slice {
	transform: translateX(0%) skewX(var(--impulzo-srv-slice-angle));
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-icon-box {
	color: var(--impulzo-srv-item-icon-hover-color, var(--impulzo-srv-icon-hover-color));
}

.impulzo-seccion-servicios-v2-icon-glyph {
	position: relative;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--impulzo-srv-icon-size);
	height: var(--impulzo-srv-icon-size);
	font-size: var(--impulzo-srv-icon-size);
	color: var(--impulzo-srv-item-icon-color, var(--impulzo-srv-icon-color)) !important;
	line-height: 1;
	transition: color var(--impulzo-srv-slice-duration) ease;
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-icon-glyph {
	color: var(--impulzo-srv-item-icon-hover-color, var(--impulzo-srv-icon-hover-color)) !important;
}

.impulzo-seccion-servicios-v2-icon-glyph i,
.impulzo-seccion-servicios-v2-icon-glyph i::before {
	color: inherit !important;
	font-size: var(--impulzo-srv-icon-size);
	transition: color var(--impulzo-srv-slice-duration) ease;
}

.impulzo-seccion-servicios-v2-icon-glyph svg,
.impulzo-seccion-servicios-v2-icon-img {
	width: var(--impulzo-srv-icon-size) !important;
	height: var(--impulzo-srv-icon-size) !important;
	object-fit: contain;
	display: block;
	color: inherit !important;
	transition: fill var(--impulzo-srv-slice-duration) ease,
	            stroke var(--impulzo-srv-slice-duration) ease,
	            color var(--impulzo-srv-slice-duration) ease;
}

/* Modo Automático Inteligente: colorea iconos nativos de Elementor y SVGs subidos (tanto fill como stroke) */
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg:not([fill="none"]) {
	fill: currentColor !important;
}

.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg path:not([fill="none"]),
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg circle:not([fill="none"]),
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg rect:not([fill="none"]),
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg polygon:not([fill="none"]),
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg ellipse:not([fill="none"]) {
	fill: currentColor !important;
	transition: fill var(--impulzo-srv-slice-duration) ease, stroke var(--impulzo-srv-slice-duration) ease;
}

.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg[stroke]:not([stroke="none"]),
.impulzo-seccion-servicios-v2-container.svg-mode-auto .impulzo-seccion-servicios-v2-icon-glyph svg [stroke]:not([stroke="none"]) {
	stroke: currentColor !important;
	transition: stroke var(--impulzo-srv-slice-duration) ease;
}

/* Modo Forzar Relleno (Fill) */
.impulzo-seccion-servicios-v2-container.svg-mode-fill .impulzo-seccion-servicios-v2-icon-glyph svg,
.impulzo-seccion-servicios-v2-container.svg-mode-fill .impulzo-seccion-servicios-v2-icon-glyph svg * {
	fill: currentColor !important;
}

/* Modo Forzar Trazo (Stroke) */
.impulzo-seccion-servicios-v2-container.svg-mode-stroke .impulzo-seccion-servicios-v2-icon-glyph svg,
.impulzo-seccion-servicios-v2-container.svg-mode-stroke .impulzo-seccion-servicios-v2-icon-glyph svg * {
	fill: none !important;
	stroke: currentColor !important;
}

/* ==========================================================================
   TEXTO DEL SERVICIO (POSICIÓN, ALINEACIÓN, JUSTIFICACIÓN Y HOVER)
   ========================================================================== */
.impulzo-seccion-servicios-v2-text-wrap {
	display: flex;
	flex-direction: column;
	justify-content: var(--impulzo-srv-text-v-align);
	align-self: var(--impulzo-srv-text-v-align);
	flex: 1;
	padding: var(--impulzo-srv-text-padding);
	text-align: var(--impulzo-srv-text-align);
	transform: translate(var(--impulzo-srv-text-x), var(--impulzo-srv-text-y));
}

.impulzo-seccion-servicios-v2-title {
	display: block;
	color: var(--impulzo-srv-text-color);
	font-size: 1.28rem;
	font-weight: 700;
	line-height: 1.22;
	letter-spacing: -0.01em;
	transition: color var(--impulzo-srv-card-duration) ease;
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-title {
	color: var(--impulzo-srv-text-hover-color);
}

/* ==========================================================================
   SEMICÍRCULO EN ESQUINA SUPERIOR DERECHA + FLECHA PULSANTE EN LOOP
   ========================================================================== */
.impulzo-seccion-servicios-v2-corner {
	position: absolute;
	top: 0;
	right: 0;
	width: var(--impulzo-srv-corner-size);
	height: var(--impulzo-srv-corner-size);
	border-bottom-left-radius: 100%;
	background-color: var(--impulzo-srv-corner-bg);
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding-top: calc(var(--impulzo-srv-corner-size) * 0.20);
	padding-right: calc(var(--impulzo-srv-corner-size) * 0.20);
	z-index: 3;
	transition: background-color var(--impulzo-srv-card-duration) ease;
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-corner {
	background-color: var(--impulzo-srv-corner-hover-bg);
}

.impulzo-seccion-servicios-v2-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--impulzo-srv-arrow-size);
	height: var(--impulzo-srv-arrow-size);
	font-size: var(--impulzo-srv-arrow-size);
	color: var(--impulzo-srv-arrow-color);
	transition: color var(--impulzo-srv-card-duration) ease, transform 0.25s ease;
}

.impulzo-seccion-servicios-v2-arrow svg {
	width: 100%;
	height: 100%;
}

.impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-arrow {
	color: var(--impulzo-srv-arrow-hover-color);
}

@keyframes impulzoArrowRightLoop {
	0%, 100% {
		transform: translateX(0);
	}
	50% {
		transform: translateX(var(--impulzo-srv-arrow-push-x));
	}
}

.impulzo-seccion-servicios-v2-container.has-arrow-pulse .impulzo-seccion-servicios-v2-card:hover .impulzo-seccion-servicios-v2-arrow {
	animation: impulzoArrowRightLoop var(--impulzo-srv-arrow-loop-sec) infinite ease-in-out;
}

/* ==========================================================================
   ANIMACIÓN DE ENTRADA ESCALONADA SEGÚN ORDEN DE LISTA (1°, 2°, 3°...)
   ========================================================================== */
.impulzo-seccion-servicios-v2-container.has-entrance-anim .impulzo-seccion-servicios-v2-card {
	opacity: 0;
	transition: opacity var(--impulzo-srv-entrance-duration) cubic-bezier(0.22, 1, 0.36, 1),
	            transform var(--impulzo-srv-entrance-duration) cubic-bezier(0.22, 1, 0.36, 1),
	            box-shadow var(--impulzo-srv-card-duration) ease,
	            background var(--impulzo-srv-card-duration) ease;
	transition-delay: var(--impulzo-srv-order-delay, 0ms);
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.entrance-fade-grow-up .impulzo-seccion-servicios-v2-card {
	transform: translateY(var(--impulzo-srv-entrance-distance)) scale(var(--impulzo-srv-entrance-scale));
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.entrance-fade-left .impulzo-seccion-servicios-v2-card {
	transform: translateX(calc(-1 * var(--impulzo-srv-entrance-distance)));
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.entrance-fade-right .impulzo-seccion-servicios-v2-card {
	transform: translateX(var(--impulzo-srv-entrance-distance));
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.entrance-fade-alt .impulzo-seccion-servicios-v2-card.is-order-even {
	transform: translateX(calc(-1 * var(--impulzo-srv-entrance-distance)));
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.entrance-fade-alt .impulzo-seccion-servicios-v2-card.is-order-odd {
	transform: translateX(var(--impulzo-srv-entrance-distance));
}

/* Estado Visible una vez activada la entrada */
.impulzo-seccion-servicios-v2-container.has-entrance-anim.is-in-view .impulzo-seccion-servicios-v2-card {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

.impulzo-seccion-servicios-v2-container.has-entrance-anim.is-in-view.has-card-grow .impulzo-seccion-servicios-v2-card:hover {
	transform: scale(calc(1 + (var(--impulzo-srv-card-grow-pct) / 100)));
	transition-delay: 0ms;
}

/* ==========================================================================
   MEDIA QUERIES OBLIGATORIAS (TABLET <= 1024px Y MÓVIL <= 768px)
   ========================================================================== */
@media (max-width: 1024px) {
	.impulzo-seccion-servicios-v2-title {
		font-size: 1.12rem;
	}
}

@media (max-width: 768px) {
	.impulzo-seccion-servicios-v2-grid {
		grid-template-columns: repeat(var(--impulzo-srv-cols, 1), minmax(0, 1fr));
	}

	.impulzo-seccion-servicios-v2-card {
		padding: 16px 38px 16px 18px;
		min-height: 84px;
	}

	.impulzo-seccion-servicios-v2-title {
		font-size: 1.05rem;
	}
}
