/** Testimonials / Referenzen v1.0.0 */
.mm-tr {
	--color-sky-50: #e2edf4;
	--color-sky-100: #c5d8e6;
	--color-sky-200: #a6c1d5;
	--color-sky-500: #2f516a;
	--color-sky-700: #233d50;
	--color-emerald-50: #e8f3e2;
	--color-emerald-100: #d2e7c7;
	--color-emerald-500: #79b255;
	--color-emerald-700: #5f8e43;
	position: relative
}

.mm-tr--bg-white {
	background: #fff
}

.mm-tr--bg-sky {
	background: linear-gradient(135deg, var(--color-sky-50), #fff 62%)
}

.mm-tr--bg-emerald {
	background: linear-gradient(to right bottom in oklab, rgb(121, 178, 85) 0%, rgb(81, 124, 58) 50%, rgb(41, 71, 93) 100%)
}

.mm-tr--bg-neutral {
	background: #f9fafb
}

.mm-tr--bg-transparent {
	background: transparent
}

.mm-tr--space-compact {
	padding-block: 4rem
}

.mm-tr--space-default {
	padding-block: 5rem
}

.mm-tr--space-large {
	padding-block: 6rem
}

.mm-tr__container {
	position: relative;
	z-index: 1;
	padding-inline: 1rem
}

.mm-tr__container--wide {
	max-width: 80rem;
	margin-inline: auto
}

.mm-tr__container--fluid {
	padding-inline: clamp(1rem, 4vw, 3rem)
}

.mm-tr__header {
	margin-bottom: 3rem
}

.mm-tr--header-center .mm-tr__header {
	text-align: center
}

.mm-tr__badge {
	display: inline-flex;
	align-items: center;
	margin-bottom: 1rem;
	padding: .5rem 1rem;
	border-radius: 999rem;
	font-size: .875rem;
	font-weight: 800;
	line-height: 1.4
}

.mm-tr-design--sky {
	color: var(--color-sky-700);
	background: var(--color-sky-100)
}

.mm-tr-design--emerald {
	color: var(--color-emerald-700);
	background: var(--color-emerald-100)
}

.mm-tr-design--amber {
	color: #92400e;
	background: #fef3c7
}

.mm-tr-design--rose {
	color: #be123c;
	background: #ffe4e6
}

.mm-tr-design--neutral {
	color: #374151;
	background: #f3f4f6
}

.mm-tr__title {
	margin: 0 0 1rem;
	color: #fff;
	font-size: clamp(1.875rem, 4vw, 2.5rem);
	font-weight: 800;
	line-height: 1.2
}

.mm-tr__intro {
	max-width: 40rem;
	margin: 0;
	color: #fff;
	line-height: 1.65
}

.mm-tr--header-center .mm-tr__intro {
	margin-inline: auto
}

.mm-tr__grid {
	display: grid
}

.mm-tr--gap-4 .mm-tr__grid {
	gap: 1rem
}

.mm-tr--gap-5 .mm-tr__grid {
	gap: 1.5rem
}

.mm-tr--gap-6 .mm-tr__grid {
	gap: 2rem
}

.mm-tr--cols-mobile-1 .mm-tr__grid {
	grid-template-columns: 1fr
}

.mm-tr--cols-mobile-2 .mm-tr__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media(min-width:768px) {
	.mm-tr--cols-tablet-1 .mm-tr__grid {
		grid-template-columns: 1fr
	}

	.mm-tr--cols-tablet-2 .mm-tr__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}

	.mm-tr--cols-tablet-3 .mm-tr__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media(min-width:992px) {
	.mm-tr--cols-desktop-1 .mm-tr__grid {
		grid-template-columns: 1fr
	}

	.mm-tr--cols-desktop-2 .mm-tr__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}

	.mm-tr--cols-desktop-3 .mm-tr__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}

	.mm-tr--cols-desktop-4 .mm-tr__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}

	.mm-tr--cols-desktop-5 .mm-tr__grid {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

.mm-tr__slider {
	position: relative
}

.mm-tr__slider .splide__track {
	overflow: hidden
}

.mm-tr__slider .splide__list {
	align-items: stretch
}

.mm-tr__item {
	min-width: 0
}

.mm-tr--equal-height .mm-tr__item,
.mm-tr--equal-height .splide__slide {
	display: flex
}

.mm-tr-card {
	--tr-accent: var(--color-sky-500);
	--tr-accent-strong: var(--color-sky-700);
	--tr-soft: var(--color-sky-50);
	--tr-border: var(--color-sky-100);
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 100%;
	padding: 1.5rem;
	border: .0625rem solid oklab(0.999994 0.0000455678 0.0000200868 / 0.2);
	border-radius: 1.5rem;
	background: var(--tr-soft);
	box-shadow: 0 .75rem 1.5rem rgba(15, 23, 42, .06);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease
}

.mm-tr-card:hover,
.mm-tr-card:focus-within {
	border-color: color-mix(in srgb, var(--tr-accent) 40%, var(--tr-border));
	box-shadow: 0 1.25rem 2.5rem rgba(15, 23, 42, .1);
	transform: translateY(-.15rem)
}

.mm-tr-card--sky {
	--tr-accent: var(--color-sky-500);
	--tr-accent-strong: var(--color-sky-700);
	--tr-soft: var(--color-sky-50);
	--tr-border: var(--color-sky-100)
}

.mm-tr-card--emerald {
	--tr-accent: #fff;
	--tr-accent-strong: color-mix(in oklab, #fff 70%, transparent);
	--tr-soft: oklab(0.999994 0.0000455678 0.0000200868 / 0.1);
	--tr-border: var(--color-emerald-100)	
}

.mm-tr-card--amber {
	--tr-accent: #f59e0b;
	--tr-accent-strong: #b45309;
	--tr-soft: #fffbeb;
	--tr-border: #fde68a
}

.mm-tr-card--rose {
	--tr-accent: #f43f5e;
	--tr-accent-strong: #be123c;
	--tr-soft: #fff1f2;
	--tr-border: #ffe4e6
}

.mm-tr-card--neutral {
	--tr-accent: #6b7280;
	--tr-accent-strong: #374151;
	--tr-soft: #f9fafb;
	--tr-border: #e5e7eb
}

.mm-tr-card--align-center {
	text-align: center
}

.mm-tr-card__rating {
	display: inline-flex;
	gap: .125rem;	
	color: #d1d5db;
	font-size: 1.1rem
}

.mm-tr-card--align-center .mm-tr-card__rating {
	justify-content: center
}

.mm-tr-card__star.is-active {
	color: #f59e0b
}

.mm-tr-card__quote {
	margin: 0 0 1.5rem;
	color: var(--tr-accent);
	font-size: 1rem;
	line-height: 1.75
}

.mm-tr-card__quote>*:last-child {
	margin-bottom: 0
}

.mm-tr-card__person {
	display: flex;
	align-items: center;
	gap: .875rem;
	margin-top: auto;
	margin-bottom: 1rem;
}

.mm-tr-card--align-center .mm-tr-card__person {
	justify-content: center
}

.mm-tr-card__image-wrap {
	flex: 0 0 auto;
	width: 3.5rem;
	height: 3.5rem;
	overflow: hidden;
	background: var(--tr-soft)
}

.mm-tr-card--image-circle .mm-tr-card__image-wrap {
	border-radius: 999rem
}

.mm-tr-card--image-rounded .mm-tr-card__image-wrap {
	border-radius: 1rem
}

.mm-tr-card--image-square .mm-tr-card__image-wrap {
	border-radius: .25rem
}

.mm-tr-card__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover
}

.mm-tr-card__person-text {
	display: flex;
	min-width: 0;
	flex-direction: column
}

.mm-tr-card__name {
	color: var(--tr-accent);
	font-size: .95rem;
	font-weight: 800;
	line-height: 1.35
}

.mm-tr-card__role {
	color: var(--tr-accent-strong);
	font-size: .85rem;
	font-weight: 400;
	line-height: 1.4
}

.mm-tr-card__source {
	color:  color-mix(in oklab, #fff 70%, transparent);
	font-size: .75rem;
	line-height: 1.4
}

.mm-tr .splide__arrow {
	width: 2.75rem;
	height: 2.75rem;
	background: #fff;
	box-shadow: 0 .75rem 1.5rem rgba(15, 23, 42, .12);
	opacity: 1
}

.mm-tr .splide__arrow svg {
	fill: var(--color-sky-700)
}

.mm-tr .splide__pagination {
	position: static;
	margin-top: 1.5rem;
	padding: 0
}

.mm-tr .splide__pagination__page {
	background: var(--color-sky-200);
	opacity: 1
}

.mm-tr .splide__pagination__page.is-active {
	background: var(--color-sky-500);
	transform: scale(1.2)
}

.mm-tr--animate .mm-tr__header,
.mm-tr--animate .mm-tr__grid,
.mm-tr--animate .mm-tr__slider {
	opacity: 0;
	transform: translateY(1rem);
	transition: opacity .55s ease, transform .55s ease
}

.mm-tr--animate.is-visible .mm-tr__header,
.mm-tr--animate.is-visible .mm-tr__grid,
.mm-tr--animate.is-visible .mm-tr__slider {
	opacity: 1;
	transform: translateY(0)
}

.mm-tr--animate.is-visible .mm-tr__grid,
.mm-tr--animate.is-visible .mm-tr__slider {
	transition-delay: .08s
}

@media(max-width:575.98px) {
	.mm-tr--space-default {
		padding-block: 4rem
	}

	.mm-tr--space-large {
		padding-block: 5rem
	}

	.mm-tr-card {
		padding: 1.25rem
	}
}

@media(prefers-reduced-motion:reduce) {

	.mm-tr-card,
	.mm-tr--animate .mm-tr__header,
	.mm-tr--animate .mm-tr__grid,
	.mm-tr--animate .mm-tr__slider {
		opacity: 1;
		transform: none;
		transition: none
	}
}