.agb-color-layer {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.agb-stripes {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: flex;
	pointer-events: none;
}

.agb-stripe {
	flex: 0 0 auto;
	height: 100%;
}

.agb-stripe.agb-down {
	transform-origin: bottom;
	clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}

.agb-stripe.agb-up {
	transform-origin: top;
	clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
}

/* Envuelve el contenido original del contenedor para garantizar que quede por encima del fondo. */
.agb-content-wrap {
	position: relative;
	z-index: 1;
}

/* --- Animación: crecimiento de rayas --- */
.agb-anim-grow .agb-color-layer { opacity: 0; }
.agb-anim-grow.agb-play .agb-color-layer {
	animation: agb-fade-in 900ms ease-out 80ms forwards;
}
.agb-anim-grow .agb-stripe { transform: scaleY(0); }
.agb-anim-grow.agb-play .agb-stripe {
	animation: agb-grow 620ms cubic-bezier(.22, .9, .32, 1) forwards;
}

/* --- Animación: aparición suave --- */
.agb-anim-fade .agb-color-layer,
.agb-anim-fade .agb-stripe {
	opacity: 0;
}
.agb-anim-fade.agb-play .agb-color-layer {
	animation: agb-fade-in 900ms ease-out forwards;
}
.agb-anim-fade.agb-play .agb-stripe {
	animation: agb-fade-in 900ms ease-out 200ms forwards;
}

/* --- Animación: barrido izquierda a derecha --- */
.agb-anim-sweep .agb-color-layer,
.agb-anim-sweep .agb-stripes {
	clip-path: inset(0 100% 0 0);
}
.agb-anim-sweep.agb-play .agb-color-layer,
.agb-anim-sweep.agb-play .agb-stripes {
	animation: agb-sweep 900ms cubic-bezier(.65, 0, .35, 1) forwards;
}

@keyframes agb-fade-in {
	to { opacity: 1; }
}

@keyframes agb-grow {
	to { transform: scaleY(1); }
}

@keyframes agb-sweep {
	to { clip-path: inset(0 0 0 0); }
}

@media (prefers-reduced-motion: reduce) {
	.agb-enhanced .agb-color-layer,
	.agb-enhanced .agb-stripe,
	.agb-enhanced .agb-stripes {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
	}
}