/* Testimonials — Figma Frame 69 + Nicole 1 photo / 2 quotes. ITG min(rem, vw) against 1920. */

.kaya-testimonials {
	--kaya-stories-pad-x: min(6.25rem, 5.2083333333vw);
	--kaya-stories-pad-y: min(7.5rem, 6.25vw);
	--kaya-stories-inner: min(107.5625rem, 89.6354166667vw);
	--kaya-stories-gap: min(2.5rem, 2.0833333333vw);
	--kaya-stories-header-gap: min(1.25rem, 1.0416666667vw);
	--kaya-stories-header-w: min(49.1875rem, 40.9895833333vw);
	--kaya-stories-tag-py: min(0.5rem, 0.4166666667vw);
	--kaya-stories-tag-px: min(0.75rem, 0.625vw);
	--kaya-stories-tag-radius: min(0.625rem, 0.5208333333vw);
	--kaya-stories-tag-fs: min(0.75rem, 0.625vw);
	--kaya-stories-heading-fs: min(2.5rem, 2.0833333333vw);
	--kaya-stories-card-w: min(34.1875rem, 28.4895833333vw);
	--kaya-stories-card-min-h: min(19.25rem, 16.0416666667vw);
	--kaya-stories-card-pad: min(2rem, 1.6666666667vw);
	--kaya-stories-card-gap: min(1.25rem, 1.0416666667vw);
	--kaya-stories-card-radius: min(1.25rem, 1.0416666667vw);
	--kaya-stories-name-fs: min(1.5rem, 1.25vw);
	--kaya-stories-role-fs: min(1rem, 0.8333333333vw);
	--kaya-stories-quote-fs: min(1.25rem, 1.0416666667vw);
	--kaya-stories-quote-lh: min(1.5rem, 1.25vw);
	--kaya-stories-person-gap: min(0.25rem, 0.2083333333vw);
	--kaya-stories-more-fs: min(0.875rem, 0.7291666667vw);
	--kaya-stories-more-lh: min(1.0625rem, 0.8854166667vw);
	--kaya-stories-more-gap: min(0.5rem, 0.4166666667vw);
	--kaya-stories-more-box-w: min(0.875rem, 0.7291666667vw);
	--kaya-stories-more-box-h: min(0.8125rem, 0.6770833333vw);
	--kaya-stories-more-leaf-w: min(0.87985rem, 0.7332083333vw);
	--kaya-stories-more-leaf-h: min(0.94231875rem, 0.785265625vw);
	--kaya-stories-viewport-w: min(70.875rem, 59.0625vw);
	--kaya-stories-nav-gap: min(0.75rem, 0.625vw);
	--kaya-stories-nav-w: min(3rem, 2.5vw);
	--kaya-stories-nav-h: min(2.91974375rem, 2.4331197917vw);
	--kaya-stories-nav-arrow-l: min(0.875rem, 0.7291666667vw);
	--kaya-stories-nav-arrow-t: min(1.0625rem, 0.8854166667vw);
	--kaya-stories-nav-arrow-box-w: min(1.25rem, 1.0416666667vw);
	--kaya-stories-nav-arrow-box-h: min(0.875rem, 0.7291666667vw);
	--kaya-stories-nav-leaf-w: min(1.31735rem, 1.0977916667vw);
	--kaya-stories-nav-leaf-h: min(0.94231875rem, 0.785265625vw);
	--kaya-stories-nav-leaf-t: min(0.0336875rem, 0.0280729167vw);

	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--kaya-stories-gap);
	width: 100%;
	box-sizing: border-box;
	padding: var(--kaya-stories-pad-y) var(--kaya-stories-pad-x);
	background-color: var(--kaya-white);
}

.kaya-testimonials__header,
.kaya-testimonials__row,
.kaya-testimonials__nav {
	width: var(--kaya-stories-inner);
	max-width: 100%;
}

.kaya-testimonials__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--kaya-stories-header-gap);
}

.kaya-testimonials__eyebrow {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: var(--kaya-stories-tag-py) var(--kaya-stories-tag-px);
	border: 1px solid var(--kaya-orange);
	border-radius: var(--kaya-stories-tag-radius);
	background: var(--kaya-orange);
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	font-size: var(--kaya-stories-tag-fs);
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--kaya-brown);
	white-space: nowrap;
}

.kaya-testimonials__heading {
	margin: 0;
	padding: 0;
	width: var(--kaya-stories-header-w);
	max-width: 100%;
	font-family: "Montserrat", sans-serif;
	font-weight: 900;
	font-size: var(--kaya-stories-heading-fs);
	line-height: var(--kaya-stories-heading-fs);
	letter-spacing: -0.03em;
	text-transform: uppercase;
	text-align: center;
	color: var(--kaya-brown);
}

.kaya-testimonials__row {
	display: flex;
	align-items: stretch;
	gap: var(--kaya-stories-gap);
}

.kaya-testimonials__photo {
	position: relative;
	flex: 0 0 var(--kaya-stories-card-w);
	width: var(--kaya-stories-card-w);
	min-height: var(--kaya-stories-card-min-h);
	border-radius: var(--kaya-stories-card-radius);
	overflow: hidden;
}

.kaya-testimonials__photo img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
}

.kaya-testimonials__viewport {
	flex: 0 0 var(--kaya-stories-viewport-w);
	width: var(--kaya-stories-viewport-w);
	max-width: 100%;
	overflow: hidden;
}

.kaya-testimonials__track {
	display: flex;
	align-items: stretch;
	gap: var(--kaya-stories-gap);
	transition: transform 0.35s ease;
	will-change: transform;
}

.kaya-testimonials__card {
	display: flex;
	flex: 0 0 var(--kaya-stories-card-w);
	flex-direction: column;
	align-items: flex-start;
	gap: var(--kaya-stories-card-gap);
	width: var(--kaya-stories-card-w);
	min-height: var(--kaya-stories-card-min-h);
	box-sizing: border-box;
	padding: var(--kaya-stories-card-pad);
	border-radius: var(--kaya-stories-card-radius);
	background-color: var(--kaya-orange-light);
}

.kaya-testimonials__person {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--kaya-stories-person-gap);
	width: 100%;
}

.kaya-testimonials__name {
	margin: 0;
	padding: 0;
	width: 100%;
	font-family: "Montserrat", sans-serif;
	font-weight: 900;
	font-size: var(--kaya-stories-name-fs);
	line-height: var(--kaya-stories-name-fs);
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--kaya-brown);
}

.kaya-testimonials__role {
	margin: 0;
	padding: 0;
	width: 100%;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	font-size: var(--kaya-stories-role-fs);
	line-height: var(--kaya-stories-name-fs);
	letter-spacing: 0;
	color: var(--kaya-brown);
}

.kaya-testimonials__quote {
	margin: 0;
	padding: 0;
	width: 100%;
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	font-size: var(--kaya-stories-quote-fs);
	line-height: var(--kaya-stories-quote-lh);
	letter-spacing: -0.03em;
	color: var(--kaya-brown);
}

.kaya-testimonials__card:not(.is-open) .kaya-testimonials__quote {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.kaya-testimonials__more[hidden] {
	display: none;
}

.kaya-testimonials__more {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--kaya-stories-more-gap);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	color: var(--kaya-maroon);
}

.kaya-testimonials__more-label {
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	font-size: var(--kaya-stories-more-fs);
	line-height: var(--kaya-stories-more-lh);
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--kaya-maroon);
	white-space: nowrap;
}

.kaya-testimonials__more-icon {
	display: block;
	position: relative;
	width: var(--kaya-stories-more-box-w);
	height: var(--kaya-stories-more-box-h);
	overflow: visible;
	flex: 0 0 var(--kaya-stories-more-box-w);
}

.kaya-testimonials__more-icon img {
	display: block;
	position: absolute;
	left: 0;
	top: 50%;
	width: var(--kaya-stories-more-leaf-w);
	height: var(--kaya-stories-more-leaf-h);
	max-width: none;
	transform: translateY(-50%) rotate(90deg);
	transform-origin: center;
}

.kaya-testimonials__card.is-open .kaya-testimonials__more-icon img {
	transform: translateY(-50%) rotate(-90deg);
}

.kaya-testimonials__topic {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: var(--kaya-stories-tag-py) var(--kaya-stories-tag-px);
	border: 1px solid var(--kaya-orange);
	border-radius: var(--kaya-stories-tag-radius);
	background: transparent;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	font-size: var(--kaya-stories-tag-fs);
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--kaya-brown);
	white-space: nowrap;
}

.kaya-testimonials__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--kaya-stories-nav-gap);
}

.kaya-testimonials.is-static .kaya-testimonials__nav {
	display: none;
}

.kaya-testimonials__nav-btn {
	position: relative;
	width: var(--kaya-stories-nav-w);
	height: var(--kaya-stories-nav-h);
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	line-height: 0;
}

.kaya-testimonials__nav-btn--prev {
	transform: rotate(180deg);
}

.kaya-testimonials__nav-btn:disabled {
	opacity: 0.4;
	cursor: default;
}

.kaya-testimonials__nav-circle {
	display: block;
	position: absolute;
	inset: 0;
	width: var(--kaya-stories-nav-w);
	height: var(--kaya-stories-nav-h);
}

.kaya-testimonials__nav-circle img {
	display: block;
	width: var(--kaya-stories-nav-w);
	height: var(--kaya-stories-nav-h);
	max-width: none;
}

.kaya-testimonials__nav-arrow {
	display: block;
	position: absolute;
	left: var(--kaya-stories-nav-arrow-l);
	top: var(--kaya-stories-nav-arrow-t);
	width: var(--kaya-stories-nav-arrow-box-w);
	height: var(--kaya-stories-nav-arrow-box-h);
	overflow: visible;
}

.kaya-testimonials__nav-arrow img {
	display: block;
	position: absolute;
	top: calc(-1 * var(--kaya-stories-nav-leaf-t));
	left: 0;
	width: var(--kaya-stories-nav-leaf-w);
	height: var(--kaya-stories-nav-leaf-h);
	max-width: none;
}

@media only screen and (max-width: 999px) {
	.kaya-testimonials {
		--kaya-stories-gap: 32px;
		--kaya-stories-header-gap: 24px;
		--kaya-stories-tag-py: 6px;
		--kaya-stories-tag-px: 12px;
		--kaya-stories-tag-radius: 12px;
		--kaya-stories-tag-fs: 12px;
		--kaya-stories-heading-fs: 28px;
		--kaya-stories-card-pad: 32px 20px 24px;
		--kaya-stories-card-gap: 16px;
		--kaya-stories-card-radius: 20px;
		--kaya-stories-card-min-h: 0px;
		--kaya-stories-name-fs: 18px;
		--kaya-stories-role-fs: 16px;
		--kaya-stories-quote-fs: 16px;
		--kaya-stories-quote-lh: 24px;
		--kaya-stories-person-gap: 4px;
		--kaya-stories-more-fs: 14px;
		--kaya-stories-more-lh: 17px;
		--kaya-stories-more-gap: 8px;
		--kaya-stories-more-box-w: 14px;
		--kaya-stories-more-box-h: 13px;
		--kaya-stories-more-leaf-w: 14px;
		--kaya-stories-more-leaf-h: 15px;
		--kaya-stories-nav-gap: 8px;
		--kaya-stories-nav-w: 36px;
		--kaya-stories-nav-h: 35px;
		--kaya-stories-nav-arrow-l: 11px;
		--kaya-stories-nav-arrow-t: 13px;
		--kaya-stories-nav-arrow-box-w: 15px;
		--kaya-stories-nav-arrow-box-h: 11px;
		--kaya-stories-nav-leaf-w: 16px;
		--kaya-stories-nav-leaf-h: 11px;
		--kaya-stories-nav-leaf-t: 0px;

		align-items: stretch;
		padding: 40px 0 48px;
	}

	.kaya-testimonials__header,
	.kaya-testimonials__row,
	.kaya-testimonials__nav {
		width: 100%;
	}

	.kaya-testimonials__header {
		padding: 0 20px;
	}

	.kaya-testimonials__heading {
		width: 100%;
		max-width: 220px;
		line-height: 28px;
	}

	.kaya-testimonials__photo {
		display: none;
	}

	.kaya-testimonials__row {
		display: block;
	}

	.kaya-testimonials__viewport {
		container-type: inline-size;
		width: 100%;
		flex: none;
	}

	.kaya-testimonials__track {
		gap: 20px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.kaya-testimonials__card {
		flex: 0 0 calc(100cqi - 73px);
		width: calc(100cqi - 73px);
	}

	.kaya-testimonials__name {
		line-height: 22px;
	}

	.kaya-testimonials__role {
		line-height: 22px;
	}

	.kaya-testimonials__card:not(.is-open) .kaya-testimonials__quote {
		display: block;
		-webkit-line-clamp: unset;
		line-clamp: unset;
		overflow: visible;
	}

	.kaya-testimonials__nav-btn:disabled {
		opacity: 1;
	}
}