/*
 * Animazioni d'ingresso del tema, selezionabili in Elementor:
 * Avanzate > Effetti di movimento > Animazione d'ingresso > gruppo "Insinga Dental".
 * Elementor aggiunge le classi "animated <nome>" quando l'elemento entra nello schermo.
 * Durata: "Veloce" 320ms · "Normale" 700ms · "Lento" 1000ms. Ritardo: campo nativo.
 * fill-mode "backwards": a fine animazione non resta alcun transform/clip.
 */

.elementor-element.animated:is(.insFadeUp, .insMaskUp, .insBlurIn, .insSoftZoom, .insWipe) {
	animation-duration: var(--ins-dur-slow, 700ms);
	animation-timing-function: var(--ins-ease-out, cubic-bezier(.22, 1, .36, 1));
	animation-fill-mode: backwards;
}
.elementor-element.animated.animated-fast:is(.insFadeUp, .insMaskUp, .insBlurIn, .insSoftZoom, .insWipe) { animation-duration: var(--ins-dur-base, 320ms); }
.elementor-element.animated.animated-slow:is(.insFadeUp, .insMaskUp, .insBlurIn, .insSoftZoom, .insWipe) { animation-duration: var(--ins-dur-hero, 1000ms); }

.elementor-element.animated.insFadeUp { animation-name: insFadeUp; }
.elementor-element.animated.insMaskUp { animation-name: insMaskUp; }
.elementor-element.animated.insBlurIn { animation-name: insBlurIn; }
.elementor-element.animated.insSoftZoom { animation-name: insSoftZoom; }
.elementor-element.animated.insWipe { animation-name: insWipe; animation-duration: 900ms; animation-timing-function: var(--ins-ease-inout, cubic-bezier(.65, 0, .35, 1)); }
.elementor-element.animated.insWipe img { animation: insWipeImg 1100ms var(--ins-ease-out, cubic-bezier(.22, 1, .36, 1)) backwards; }

@keyframes insFadeUp { from { opacity: 0; transform: translate3d(0, var(--ins-dist-md, 28px), 0); } to { opacity: 1; transform: none; } }
@keyframes insMaskUp { from { clip-path: inset(100% 0 0 0); transform: translate3d(0, var(--ins-dist-md, 28px), 0); } to { clip-path: inset(0 0 0 0); transform: none; } }
@keyframes insBlurIn { from { opacity: 0; filter: blur(10px); transform: scale(1.03); } to { opacity: 1; filter: none; transform: none; } }
@keyframes insSoftZoom { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@keyframes insWipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes insWipeImg { from { transform: scale(1.15); } to { transform: none; } }

/* Cascata: il contenitore diventa visibile, i figli diretti salgono in sequenza. */
.elementor-element.animated.insCascade { animation-name: none; }
.elementor-element.animated.insCascade > .elementor-element,
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element {
	animation: insFadeUp var(--ins-dur-slow, 700ms) var(--ins-ease-out, cubic-bezier(.22, 1, .36, 1)) backwards;
	animation-delay: calc(var(--ins-i, 0) * var(--ins-stagger, 90ms));
}

.elementor-element.animated.insCascade > .elementor-element:nth-child(2),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(2) { --ins-i: 1; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(3),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(3) { --ins-i: 2; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(4),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(4) { --ins-i: 3; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(5),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(5) { --ins-i: 4; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(6),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(6) { --ins-i: 5; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(7),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(7) { --ins-i: 6; }
.elementor-element.animated.insCascade > .elementor-element:nth-child(n+8),
.elementor-element.animated.insCascade > .e-con-inner > .elementor-element:nth-child(n+8) { --ins-i: 7; }

@media (prefers-reduced-motion: reduce) {
	.elementor-element.animated:is(.insFadeUp, .insMaskUp, .insBlurIn, .insSoftZoom, .insWipe),
	.elementor-element.animated.insWipe img,
	.elementor-element.animated.insCascade > .elementor-element,
	.elementor-element.animated.insCascade > .e-con-inner > .elementor-element { animation: none; }
}
