/**
 * Efectos globales — paridad WEBMENTE (blobs + carrusel servicios).
 * Los blobs son exactamente los de WEBMENTE/style.css; el wrapper solo evita
 * que el blur aumente la altura del documento (espacio bajo el pie).
 */

.wpc-blobs {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: -1;
}

/* Background Animated Blobs — WEBMENTE/style.css */
.blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	z-index: -1;
	opacity: 0.6;
	animation: float 20s infinite alternate ease-in-out;
	pointer-events: none;
}

.blob-1 {
	top: -10%;
	left: -10%;
	width: 600px;
	height: 600px;
	background: var(--accent-1);
	animation-delay: 0s;
}

.blob-2 {
	top: 40%;
	right: -10%;
	width: 500px;
	height: 500px;
	background: var(--primary);
	animation-delay: -5s;
}

.blob-3 {
	bottom: -10%;
	left: 20%;
	width: 700px;
	height: 700px;
	background: var(--accent-2);
	animation-delay: -10s;
	opacity: 0.4;
}

@keyframes float {
	0% { transform: translate(0, 0) scale(1); }
	33% { transform: translate(30px, -50px) scale(1.1); }
	66% { transform: translate(-20px, 20px) scale(0.9); }
	100% { transform: translate(0, 0) scale(1); }
}

body {
	overflow-x: hidden;
	position: relative;
}

/* ——— Services section (WEBMENTE) ——— */
.wpc-services.services,
section.services {
	padding: 0;
}

.services-grid,
.wpc-services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 2rem;
	overflow: visible;
	position: relative;
	z-index: 1;
}

.wpc-services__surface,
.services__surface,
.wpc-services .container,
.elementor-widget-wpc_home_servicios,
.elementor-widget-wpc_home_servicios .elementor-widget-container,
.elementor-widget-wpc_home_full,
.elementor-widget-wpc_home_full .elementor-widget-container,
.elementor-widget-wpc_home_servicios .e-con,
.elementor-widget-wpc_home_full .e-con {
	overflow: visible !important;
}

/* Reglas base WEBMENTE — sin tocar transition (gana .reveal como en el original) */
.services-grid .service-card,
.wpc-services-grid .service-card {
	padding: 2.5rem;
	border-radius: 20px;
	position: relative;
	overflow: hidden;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform-origin: center center;
	will-change: transform, opacity;
}

.services-grid .service-card::before,
.wpc-services-grid .service-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(800px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255, 255, 255, 0.4), transparent 40%);
	opacity: 0;
	transition: opacity 0.3s;
	pointer-events: none;
	z-index: 1;
}

.services-grid .service-card:hover::before,
.wpc-services-grid .service-card:hover::before {
	opacity: 1;
}

/* Interactive carousel effect — WEBMENTE index.html */
.services-grid:hover .service-card,
.wpc-services-grid:hover .service-card,
.services-grid.is-carousel-hover .service-card,
.wpc-services-grid.is-carousel-hover .service-card {
	transform: scale(0.8) !important;
	opacity: 0.7 !important;
}

.services-grid .service-card:hover,
.wpc-services-grid .service-card:hover,
.services-grid .service-card.is-carousel-active,
.wpc-services-grid .service-card.is-carousel-active {
	transform: scale(1.2) !important;
	opacity: 1 !important;
	z-index: 10;
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.services-grid .card-custom-img,
.wpc-services-grid .card-custom-img {
	width: 100%;
	height: auto;
	border-radius: 16px;
	margin-bottom: 1.5rem;
	position: relative;
	z-index: 2;
	display: block;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
	transition: transform 0.4s ease;
}

.services-grid .service-card:hover .card-custom-img,
.wpc-services-grid .service-card:hover .card-custom-img,
.services-grid .service-card.is-carousel-active .card-custom-img,
.wpc-services-grid .service-card.is-carousel-active .card-custom-img {
	transform: scale(1.05);
}

.services-grid .service-card h3,
.wpc-services-grid .service-card h3 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	position: relative;
	z-index: 2;
}

.services-grid .service-card p,
.wpc-services-grid .service-card p {
	color: var(--text-secondary);
	margin: 0 0 1.5rem;
	position: relative;
	z-index: 2;
}

.services-grid .card-link,
.wpc-services-grid .card-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	position: relative;
	z-index: 2;
}

.services-grid .card-link i,
.wpc-services-grid .card-link i {
	transition: transform 0.3s ease;
}

.services-grid .card-link:hover i,
.wpc-services-grid .card-link:hover i {
	transform: translateX(5px);
}

/* Carrusel compartido — Proyectos / Capacitaciones (mismo efecto del home) */
[data-service-cards] {
	overflow: visible;
	position: relative;
	z-index: 1;
}

[data-service-cards] [data-service-card] {
	position: relative;
	overflow: hidden;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform-origin: center center;
	will-change: transform, opacity;
}

[data-service-cards] [data-service-card]::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(800px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255, 255, 255, 0.4), transparent 40%);
	opacity: 0;
	transition: opacity 0.3s;
	pointer-events: none;
	z-index: 1;
}

[data-service-cards] [data-service-card]:hover::before {
	opacity: 1;
}

[data-service-cards]:hover [data-service-card],
[data-service-cards].is-carousel-hover [data-service-card] {
	transform: scale(0.8) !important;
	opacity: 0.7 !important;
}

[data-service-cards] [data-service-card]:hover,
[data-service-cards] [data-service-card].is-carousel-active {
	transform: scale(1.2) !important;
	opacity: 1 !important;
	z-index: 10;
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

[data-service-cards] [data-service-card] > * {
	position: relative;
	z-index: 2;
}

.wpc-proyectos-lineas__surface,
.wpc-proyectos-lineas .container,
.wpc-cap-lineas__surface,
.wpc-cap-lineas .container,
.wpc-cap-colegios .container,
.elementor-widget-wpc_proyectos_lineas,
.elementor-widget-wpc_proyectos_lineas .elementor-widget-container,
.elementor-widget-wpc_proyectos_full,
.elementor-widget-wpc_proyectos_full .elementor-widget-container,
.elementor-widget-wpc_capacitaciones_lineas,
.elementor-widget-wpc_capacitaciones_lineas .elementor-widget-container,
.elementor-widget-wpc_capacitaciones_colegios,
.elementor-widget-wpc_capacitaciones_colegios .elementor-widget-container,
.elementor-widget-wpc_capacitaciones_full,
.elementor-widget-wpc_capacitaciones_full .elementor-widget-container {
	overflow: visible !important;
}