/********************************************************/
/*
/*      Image fan CSS
/*
/********************************************************/
.wp-block-cke-image-fan {
	--extra-max-width: 0px;
	
	justify-self: center;
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	max-width: min(calc(800px + var(--extra-max-width)), var(--wp--custom--max-size));
}

:not(.wp-block-cke-cta > .acf-innerblocks-container) > .wp-block-cke-image-fan:not([style*="margin-bottom"]) {
	margin-block-end: var(--wp--preset--spacing--6-5) !important;
}

.wp-block-cke-image-fan.st:not(.revealed) {
	pointer-events: none;
}

.wp-block-cke-image-fan > .wp-block-image {
	--st-initial-rotation: 0deg;
	--st-initial-translation-h: 0%;
	--st-initial-translation-v: 0px;
	--st-final-rotation: 0deg;
	--st-final-translation-h: 0%;
	--st-final-translation-v: 0px;
	
	grid-row: 1;
	justify-self: center;
	position: relative;
	height: auto;
	aspect-ratio: 1;
	margin-block-start: unset;
	z-index: var(--z-index);
}

.wp-block-cke-image-fan > .wp-block-image:not(.target) {
	rotate: var(--st-final-rotation);
	translate: var(--st-final-translation-h) var(--st-final-translation-v);
}

.wp-block-cke-image-fan > .wp-block-image > img {
	--overshoot-easing: linear(0, 0.224 2.9%, 0.426 6%, 0.593 9.1%, 0.739 12.4%, 0.802 14.1%, 0.861 15.9%, 0.912 17.7%, 0.956 19.5%, 0.996 21.4%, 1.031 23.4%, 1.06 25.4%, 1.084 27.5%, 1.108 30.4%, 1.117 32%, 1.124 33.6%, 1.128 35.3%, 1.131 37%, 1.13 40.7%, 1.125 43.7%, 1.115 47.1%, 1.047 64.3%, 1.031 69.2%, 1.019 73.9%, 1.009 79.2%, 1.003 84.9%, 1.001 91.1%, 1);
	--return-easing: cubic-bezier(0.33, 1, 0.68, 1);
	
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	translate: 0% 0%;
	transition: translate .3s var(--return-easing);
}

/* Hover animation */
.wp-block-cke-image-fan > .wp-block-image:is(:hover, :focus) > img {
	translate: 0% -50%;
	transition: translate .9s var(--overshoot-easing);
}

.wp-block-cke-image-fan > .wp-block-image.medium:is(:hover, :focus) > img {
	translate: 0% -35%;
}

.wp-block-cke-image-fan > .wp-block-image.large:is(:hover, :focus) > img {
	translate: 0% -20%;
}

/* Image sizes */
.wp-block-cke-image-fan > .wp-block-image.small								{ width: 320px; min-width: 320px; max-width: 320px; }
.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 450px; min-width: 450px; max-width: 450px; }
.wp-block-cke-image-fan > .wp-block-image.large								{ width: 640px; min-width: 640px; max-width: 640px; }

/* Image alignments */
.wp-block-cke-image-fan > .wp-block-image:first-child						{ justify-self: start; }
.wp-block-cke-image-fan > .wp-block-image:last-child						{ justify-self: end; }

/* Image angles */
.wp-block-cke-image-fan > .wp-block-image:nth-child(1) 						{ --st-initial-rotation: -2deg; --st-final-rotation: -16deg; }
.wp-block-cke-image-fan > .wp-block-image:nth-child(2) 						{ --st-final-rotation: -1deg; --st-final-rotation: -8deg; }
.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2):nth-last-child(2), :nth-child(3):nth-last-child(3))
																			{ --st-initial-rotation: 0deg; --st-final-rotation: 0deg; }
.wp-block-cke-image-fan > .wp-block-image:nth-last-child(2)					{ --st-initial-rotation: 1deg; --st-final-rotation: 8deg; }
.wp-block-cke-image-fan > .wp-block-image:nth-last-child(1)					{ --st-initial-rotation: 2deg; --st-final-rotation: 16deg; }

/* Image positions */
.wp-block-cke-image-fan > .wp-block-image:first-child						{ --st-initial-translation-h: 45%; --st-final-translation-h: 5%; }
.wp-block-cke-image-fan > .wp-block-image:nth-child(2)						{ --st-initial-translation-h: 33%; --st-final-translation-h: 10%; }
.wp-block-cke-image-fan > .wp-block-image:nth-last-child(2)					{ --st-initial-translation-h: -33%; --st-final-translation-h: -10%; }
.wp-block-cke-image-fan > .wp-block-image:last-child						{ --st-initial-translation-h: -45%; --st-final-translation-h: -5%; }
.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(1), :nth-last-child(1))
																			{ --st-final-translation-v: var(--wp--preset--spacing--3); }
.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2), :nth-last-child(2))
																			{ --st-final-translation-v: var(--wp--preset--spacing--0-50); }
.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2):nth-last-child(2), :nth-child(3):nth-last-child(3))
																			{ --st-initial-translation-h: 0%; --st-final-translation-h: 0%; --st-final-translation-v: 0px; }
.wp-block-cke-image-fan:has(:nth-child(4):last-child) > .wp-block-image:nth-child(2)
																			{ --st-initial-translation-h: 20%; }
.wp-block-cke-image-fan:has(:nth-child(4):last-child) > .wp-block-image:nth-last-child(2)
																			{ --st-initial-translation-h: -20%; }

/******************************/
/* Responsive
/******************************/
@media (width <= 1200px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 280px; min-width: 280px; max-width: 280px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 380px; min-width: 380px; max-width: 380px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 500px; min-width: 500px; max-width: 500px; }
}

@media (width <= 1000px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 240px; min-width: 240px; max-width: 240px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 320px; min-width: 320px; max-width: 320px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 400px; min-width: 400px; max-width: 400px; }
}

@media (width <= 800px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 220px; min-width: 220px; max-width: 220px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 280px; min-width: 280px; max-width: 280px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 340px; min-width: 340px; max-width: 340px; }
	
	/* Image angles */
	.wp-block-cke-image-fan > .wp-block-image:nth-child(1) 						{ --st-final-rotation: -12deg; }
	.wp-block-cke-image-fan > .wp-block-image:nth-child(2) 						{ --st-final-rotation: -6deg; }
	.wp-block-cke-image-fan > .wp-block-image:nth-last-child(2)					{ --st-final-rotation: 6deg; }
	.wp-block-cke-image-fan > .wp-block-image:nth-last-child(1)					{ --st-final-rotation: 12deg; }
	
	/* Image positions */
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(1), :nth-last-child(1))
																				{ --st-final-translation-v: var(--wp--preset--spacing--2); }
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2), :nth-last-child(2))
																				{ --st-final-translation-v: var(--wp--preset--spacing--0-25); }	
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2):nth-last-child(2), :nth-child(3):nth-last-child(3))
																				{ --st-final-translation-v: calc(var(--wp--preset--spacing--0-50) * -1); }
}

@media (width <= 600px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 200px; min-width: 200px; max-width: 200px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 240px; min-width: 240px; max-width: 240px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 300px; min-width: 300px; max-width: 300px; }
	
	/* Image positions */
	.wp-block-cke-image-fan > .wp-block-image:first-child						{ --st-initial-translation-h: 35%; }
	.wp-block-cke-image-fan > .wp-block-image:nth-child(2)						{ --st-initial-translation-h: 30%; }
	.wp-block-cke-image-fan > .wp-block-image:nth-last-child(2)					{ --st-initial-translation-h: -30%; }
	.wp-block-cke-image-fan > .wp-block-image:last-child						{ --st-initial-translation-h: -35%; }
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(1), :nth-last-child(1))
																				{ --st-final-translation-v: var(--wp--preset--spacing--1-5); }
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2):nth-last-child(2), :nth-child(3):nth-last-child(3))
																				{ --st-final-translation-v: calc(var(--wp--preset--spacing--0-25) * -1); }
}

@media (width <= 500px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 160px; min-width: 160px; max-width: 160px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 200px; min-width: 200px; max-width: 200px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 240px; min-width: 240px; max-width: 240px; }
	
	/* Image positions */
	.wp-block-cke-image-fan > .wp-block-image:is(:nth-child(1), :nth-last-child(1))
																				{ --st-final-translation-v: var(--wp--preset--spacing--1); }
    .wp-block-cke-image-fan > .wp-block-image:is(:nth-child(2), :nth-last-child(2))
																				{ --st-final-translation-v: 0; }	
}

@media (width <= 400px) {
	/* Image sizes */
	.wp-block-cke-image-fan > .wp-block-image.small								{ width: 140px; min-width: 140px; max-width: 140px; }
	.wp-block-cke-image-fan > .wp-block-image.medium							{ width: 180px; min-width: 180px; max-width: 180px; }
	.wp-block-cke-image-fan > .wp-block-image.large								{ width: 200px; min-width: 200px; max-width: 200px; }
	
	/* Image positions */
	.wp-block-cke-image-fan > .wp-block-image:first-child						{ --st-initial-translation-h: 22.5%; }
	.wp-block-cke-image-fan > .wp-block-image:nth-child(2)						{ --st-initial-translation-h: 25%; }
	.wp-block-cke-image-fan > .wp-block-image:nth-last-child(2)					{ --st-initial-translation-h: -25%; }
	.wp-block-cke-image-fan > .wp-block-image:last-child						{ --st-initial-translation-h: -22.5%; }
}