/* =========================================================
   CARD PATOLOGIE ELEMENTOR
   Classe contenitore: dl-path-card

   Il bordo non viene gestito da questo CSS.
   Impostalo direttamente da Elementor.
========================================================= */

.dl-path-card {
	--dl-card-accent: #df6669;
	--dl-card-hover-bg: #fffafa;

	position: relative;
	overflow: hidden;
	isolation: isolate;

	transition:
		transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.4s ease;
}

/* Sfondo hover molto leggero */

.dl-path-card::before {
	position: absolute;
	inset: 0;
	z-index: 0;

	content: "";
	background-color: var(--dl-card-hover-bg);

	opacity: 0;
	pointer-events: none;

	transition: opacity 0.35s ease;
}

/* Mantiene i contenuti sopra lo sfondo animato */

.dl-path-card > *,
.dl-path-card > .e-con-inner,
.dl-path-card > .elementor-container {
	position: relative;
	z-index: 2;
}

/* Evita che i wrapper interni coprano l'effetto */

.dl-path-card > .e-con-inner,
.dl-path-card > .elementor-container {
	background-color: transparent !important;
	background-image: none !important;
}

/* =========================================================
   HOVER GENERALE
========================================================= */

.dl-path-card:hover,
.dl-path-card:focus-within {
	box-shadow: 0 18px 42px rgba(20, 20, 20, 0.08);
	transform: translateY(-6px);
}

.dl-path-card:hover::before,
.dl-path-card:focus-within::before {
	opacity: 1;
}

/* =========================================================
   TITOLO
========================================================= */

.dl-path-card :is(
	h2,
	h3,
	h4,
	.elementor-heading-title
) {
	transition:
		color 0.3s ease,
		transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.dl-path-card:hover :is(
	h2,
	h3,
	h4,
	.elementor-heading-title
),
.dl-path-card:focus-within :is(
	h2,
	h3,
	h4,
	.elementor-heading-title
) {
	color: #151515;
	transform: translateX(4px);
}

/* =========================================================
   TESTI ED ETICHETTE
========================================================= */

.dl-path-card :is(
	.elementor-widget-text-editor,
	.elementor-widget-text-editor p,
	.elementor-icon-list-text
) {
	transition:
		color 0.3s ease,
		transform 0.35s ease;
}

/* =========================================================
   PILL / VOCI LISTA
========================================================= */

.dl-path-card .elementor-icon-list-item {
	transition:
		background-color 0.3s ease,
		color 0.3s ease,
		transform 0.3s ease;
}

.dl-path-card .elementor-icon-list-item:hover {
	background-color: rgba(223, 102, 105, 0.055);
	transform: translateY(-2px);
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

	.dl-path-card:hover,
	.dl-path-card:focus-within {
		box-shadow: 0 12px 28px rgba(20, 20, 20, 0.07);
		transform: translateY(-3px);
	}

	.dl-path-card:hover :is(
		h2,
		h3,
		h4,
		.elementor-heading-title
	),
	.dl-path-card:focus-within :is(
		h2,
		h3,
		h4,
		.elementor-heading-title
	) {
		transform: translateX(2px);
	}

}

/* =========================================================
   ACCESSIBILITÀ
========================================================= */

@media (prefers-reduced-motion: reduce) {

	.dl-path-card,
	.dl-path-card::before,
	.dl-path-card * {
		transition: none !important;
	}

	.dl-path-card:hover,
	.dl-path-card:focus-within {
		transform: none;
	}

}