/**
 * Fundara · Efectos de menú: apertura
 *
 * Dos maneras de que los enlaces entren al abrirse el menú. Se pone una
 * de las dos en Avanzado → Clases CSS:
 *
 *   .fundara-menu-cascada   los enlaces suben escalonados desde abajo
 *   .fundara-menu-cortina   cada enlace se descubre con un barrido lateral
 *
 * Son efectos de apertura: no hacen nada al pasar el cursor. Están
 * pensados para combinarse con un efecto de cursor, que llegará en su
 * propio módulo. Lo que no se combina es uno de estos con la banda
 * (fundara-menu-banda), porque aquella ya resuelve la apertura a su
 * manera y los dos movimientos se pisarían.
 *
 * La clase va en el widget Menú, o en el contenedor que lo envuelve.
 *
 * Marcado esperado (widget Menú de Elementor):
 *   ul.elementor-nav-menu > li > a.elementor-item
 */

/* --------------------------------------------------------------------
   Ajustes. Van dentro de la propia clase para no verter variables al
   documento.
   -------------------------------------------------------------------- */
.fundara-menu-cascada{
	--apertura-curva:cubic-bezier(.22,.61,.36,1);
	--apertura-duracion:.55s;
	--apertura-escalonado:.06s;   /* retardo entre un enlace y el siguiente */
	--apertura-recorrido:.7em;    /* cuánto sube cada enlace */
}

.fundara-menu-cortina{
	--apertura-curva:cubic-bezier(.22,.61,.36,1);
	--apertura-duracion:.6s;
	--apertura-escalonado:.08s;
	--apertura-aire:.12em;        /* holgura lateral para que el recorte no roce las letras */
}

/* --------------------------------------------------------------------
   Cascada
   Los enlaces entran desde abajo, escalonados. Es la opción más neutra
   y la que mejor aguanta un menú largo.
   -------------------------------------------------------------------- */
.fundara-menu-cascada .elementor-nav-menu > li > .elementor-item{
	opacity:0;
	transform:translateY(var(--apertura-recorrido));
	animation:fundara-menu-cascada var(--apertura-duracion) var(--apertura-curva) forwards;
}

@keyframes fundara-menu-cascada{
	to{
		opacity:1;
		transform:translateY(0);
	}
}

/* --------------------------------------------------------------------
   Cortina
   Cada enlace se descubre con un barrido de izquierda a derecha, como si
   se retirase un encofrado. Más rotundo que la cascada.

   El acolchado lateral existe para que el recorte final caiga fuera de
   las letras y no les roce los bordes; se compensa en la lista para no
   perder la alineación izquierda del menú.
   -------------------------------------------------------------------- */
.fundara-menu-cortina .elementor-nav-menu{
	margin-left:calc(var(--apertura-aire) * -1);
}

.fundara-menu-cortina .elementor-nav-menu > li > .elementor-item{
	padding-left:var(--apertura-aire);
	padding-right:var(--apertura-aire);
	clip-path:inset(0 100% 0 0);
	animation:fundara-menu-cortina var(--apertura-duracion) var(--apertura-curva) forwards;
}

@keyframes fundara-menu-cortina{
	to{ clip-path:inset(0 0 0 0); }
}

/* --------------------------------------------------------------------
   Escalonado, común a los dos.
   Ocho posiciones; a partir de la novena todos entran con el mismo
   retardo, que es preferible a una espera larguísima.
   -------------------------------------------------------------------- */
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(1) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 0.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(2) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 1.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(3) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 2.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(4) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 3.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(5) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 4.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(6) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 5.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(7) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 6.8); }
:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li:nth-child(n+8) > .elementor-item{ animation-delay:calc(var(--apertura-escalonado) * 7.8); }

/* --------------------------------------------------------------------
   En el editor no animamos: al repintar el widget la animación se
   dispararía en cada cambio y estorba para maquetar.
   -------------------------------------------------------------------- */
.elementor-editor-active :is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li > .elementor-item{
	animation:none;
	opacity:1;
	transform:none;
	clip-path:none;
}

/* --------------------------------------------------------------------
   Movimiento reducido: el menú aparece entero, sin entrada.
   -------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
	:is(.fundara-menu-cascada, .fundara-menu-cortina) .elementor-nav-menu > li > .elementor-item{
		animation:none;
		opacity:1;
		transform:none;
		clip-path:none;
	}
}