/* Megadt Service Cards — Interactive Buttons ab84ded7 */

.megadt-service-card {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	cursor: pointer;
	transition:
		transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1),
		box-shadow 0.28s ease;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);
	will-change: transform, box-shadow;
	-webkit-tap-highlight-color: transparent;
}

.megadt-service-card:hover,
.megadt-service-card:focus-within {
	transform: scale(1.035) translateY(-6px);
	box-shadow:
		0 12px 36px rgba(5, 72, 255, 0.18),
		0 4px 12px rgba(0, 0, 0, 0.12);
}

.megadt-service-card:active {
	transform: scale(0.98) translateY(-2px);
	box-shadow: 0 4px 14px rgba(5, 72, 255, 0.14);
	transition-duration: 0.1s;
}

/* Overlay cubre toda la tarjeta y actúa como botón */
.megadt-service-card .megadt-card-overlay {
	position: absolute;
	inset: 0;
	z-index: 10;
	display: block;
	border-radius: inherit;
	background: transparent;
	cursor: pointer;
}

/* Shimmer sutil al hacer hover */
.megadt-service-card::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(
		135deg,
		rgba(255, 255, 255, 0.08) 0%,
		rgba(255, 255, 255, 0.00) 60%
	);
	opacity: 0;
	transition: opacity 0.28s ease;
	pointer-events: none;
	z-index: 5;
}

.megadt-service-card:hover::after {
	opacity: 1;
}

/* Las imágenes dentro de la tarjeta heredan el borde redondeado */
.megadt-service-card img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: inherit;
	transition: transform 0.28s ease;
}

.megadt-service-card:hover img {
	transform: scale(1.02);
}

/* Mobile: activar con touch */
@media (max-width: 767px) {
	.megadt-service-card:hover {
		transform: none;
		box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);
	}
	.megadt-service-card.is-touched {
		transform: scale(1.03) translateY(-4px);
		box-shadow:
			0 10px 28px rgba(5, 72, 255, 0.16),
			0 4px 10px rgba(0, 0, 0, 0.10);
	}
}