.wp-block-wrd-testimonials__wrapper {
	position: relative;
}

.wp-block-wrd-testimonials__wrapper .wp-block-wrd-testimonials-item {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	min-height: fit-content;
}

.wp-block-wrd-testimonials__wrapper:not(.init)
	.wp-block-wrd-testimonials-item[aria-expanded="true"] {
	position: static;
}

.wp-block-wrd-testimonials-item {
	.wp-block-wrd-testimonials-item__image {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
		transform: scale(1.2) translateY(0%);
		transition: clip-path 1200ms var(--ease-in-out-circ),
			transform 1200ms var(--ease-in-out-circ);
	}

	.wp-block-wrd-testimonials-item__prose > p,
	.wp-block-wrd-testimonials-item__cite,
	.wp-block-wrd-testimonials-item__role {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
		opacity: 1;
		transition: clip-path 700ms var(--ease-in-out-circ),
			opacity 500ms var(--ease-in-out-circ);
		transition-delay: calc((var(--tw-canon-index)+1) * 400ms);
	}

	.wp-block-wrd-testimonials-item__cite {
		transition-delay: 200ms;
	}
	.wp-block-wrd-testimonials-item__role {
		transition-delay: 400ms;
	}

	.wp-block-wrd-testimonials-item__controls {
		opacity: 1;
		transition: opacity 300ms ease;
	}

	&[aria-expanded="false"] {
		pointer-events: none;
		z-index: -1;

		.wp-block-wrd-testimonials-item__image {
			transition-duration: 0ms, 0ms;
			transition-delay: 1200ms, 1200ms;
			transform: scale(1.2) translateY(-10%);
			clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
		}

		.wp-block-wrd-testimonials-item__prose > p,
		.wp-block-wrd-testimonials-item__cite,
		.wp-block-wrd-testimonials-item__role {
			clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
			opacity: 0;
			transition-delay: calc((var(--tw-canon-index)-1) * 400ms);
		}

		.wp-block-wrd-testimonials-item__cite {
			transition-delay: 0ms;
		}
		.wp-block-wrd-testimonials-item__role {
			transition-delay: 0ms;
		}

		.wp-block-wrd-testimonials-item__controls {
			opacity: 0;
		}
	}
}