.taofoods-spin-carousel {
	--taofoods-spin-item-size: 250px;
	--taofoods-spin-gap: 90px;
	--taofoods-spin-curve: 125px;
	--taofoods-spin-baseline: 74%;
	--taofoods-spin-side-scale: 0.78;
	--taofoods-spin-center-scale: 1.06;
	--taofoods-spin-hover-scale: 1.07;
	--taofoods-spin-hover-duration: 260ms;

	contain: style;
	margin-inline: auto;
	overflow: visible;
	position: relative;
	width: 100%;
}

.taofoods-spin-carousel *,
.taofoods-spin-carousel *::before,
.taofoods-spin-carousel *::after {
	box-sizing: border-box;
}

.taofoods-spin-carousel__stage {
	min-height: 420px;
	overflow: visible;
	position: relative;
	width: 100%;
}

.taofoods-spin-carousel__track {
	inset: 0;
	overflow: visible;
	position: absolute;
}

.taofoods-spin-carousel__item {
	align-items: center;
	color: inherit;
	display: flex;
	flex-direction: column;
	left: 0;
	outline-offset: 10px;
	position: absolute;
	text-decoration: none;
	top: 0;
	transform-origin: 50% 50%;
	width: var(--taofoods-spin-item-size);
	will-change: transform;
}

.taofoods-spin-carousel__item:hover,
.taofoods-spin-carousel__item:focus {
	color: inherit;
	text-decoration: none;
}

/* Inner wrapper: holds image + title together and drives the grow animation. */
/* Kept separate from the GSAP-controlled __item so transforms never conflict. */
.taofoods-spin-carousel__inner {
	align-items: center;
	display: flex;
	flex-direction: column;
	transform-origin: 50% 0;
	transition:
		transform var(--taofoods-spin-hover-duration, 260ms) cubic-bezier(0.34, 1.56, 0.64, 1);
	will-change: transform;
	width: 100%;
}

.taofoods-spin-carousel__item:hover .taofoods-spin-carousel__inner,
.taofoods-spin-carousel__item:focus-visible .taofoods-spin-carousel__inner {
	transform: scale(var(--taofoods-spin-hover-scale, 1.07));
}

.taofoods-spin-carousel__image-shell {
	aspect-ratio: 1;
	border-radius: 50%;
	display: block;
	overflow: hidden;
	width: 100%;
}

.taofoods-spin-carousel__image {
	border-radius: 50%;
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.taofoods-spin-carousel__title {
	color: #1d1d1d;
	display: block;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	margin-top: 14px;
	max-width: 100%;
	overflow-wrap: anywhere;
	text-align: center;
}

.taofoods-spin-carousel:not(.is-ready) .taofoods-spin-carousel__stage {
	overflow-x: auto;
	overflow-y: visible;
	scrollbar-width: none;
}

.taofoods-spin-carousel:not(.is-ready) .taofoods-spin-carousel__stage::-webkit-scrollbar {
	display: none;
}

.taofoods-spin-carousel:not(.is-ready) .taofoods-spin-carousel__track {
	align-items: center;
	display: flex;
	gap: var(--taofoods-spin-gap);
	inset: auto;
	justify-content: center;
	min-height: inherit;
	padding-inline: var(--taofoods-spin-gap);
	position: relative;
	width: max-content;
}

.taofoods-spin-carousel:not(.is-ready) .taofoods-spin-carousel__item {
	flex: 0 0 auto;
	left: auto;
	position: relative;
	top: auto;
	transform: none;
}

@media (max-width: 767px) {
	.taofoods-spin-carousel {
		--taofoods-spin-item-size: min(58vw, 220px);
		--taofoods-spin-gap: 38px;
		--taofoods-spin-curve: 80px;
	}

	.taofoods-spin-carousel__stage {
		min-height: 340px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.taofoods-spin-carousel__item {
		will-change: auto;
	}

	.taofoods-spin-carousel__inner {
		transition: none;
		will-change: auto;
	}
}
