.TESTIMONIALS {
	position: relative;
	margin: 80rem 0;
}

.TESTIMONIALS::before,
.TESTIMONIALS::after {
	content: "";
	display: block;
	overflow: hidden;
}

.TESTIMONIALS .testimonial {
	overflow: hidden;
	position: relative;
	height: 100%;
	box-sizing: border-box;
	background: var(--light-pink) url(../../assets/images/ui-quote.svg) no-repeat 40rem 40rem / 63rem 46rem;
	padding: 120rem 40rem 40rem;
	border-radius: 40rem;
	color: var(--dark-purple);
	display: flex;
	flex-direction: column;
}

.TESTIMONIALS .quote {
	font-size: 28rem;
	line-height: 1.5;
	flex-grow: 1;
}

.TESTIMONIALS .author {
	margin-top: 30rem;
	display: flex;
	align-items: center;
}

.TESTIMONIALS .image {
	width: 100rem;
	height: 100rem;
	border-radius: 100%;
	overflow: hidden;
	margin-right: 30rem;
	align-self: flex-start;
}

.TESTIMONIALS .details {
	line-height: 1.5;
	flex-grow: 1;
}

.TESTIMONIALS .deco {
	pointer-events: none;
}

.TESTIMONIALS .deco .top-left {
	position: absolute;
	top: -80rem;
	left: -80rem;
	width: 516rem;
	height: 255rem;
	background: url(images/deco-top-left.svg) no-repeat center / 100%;
}

.TESTIMONIALS .deco .bottom-right {
	z-index: 1;
	position: absolute;
	bottom: -80rem;
	right: -120rem;
	width: 397rem;
	height: 424rem;
	background: url(images/deco-bottom-right.svg) no-repeat center / 100%;
}

@media screen and (max-width: 960px) {
	.TESTIMONIALS {margin: 0;}
	.TESTIMONIALS .testimonial {padding: 60rem 20rem 20rem; background-size: 31.5rem 23rem; background-position: 20rem 20rem; border-radius: 20rem;}
	.TESTIMONIALS .quote {font-size: 18rem;}
	.TESTIMONIALS .author {margin-top: 20rem;}
	.TESTIMONIALS .image {width: 80rem; height: 80rem; margin-right: 20rem;}
	.TESTIMONIALS .deco {display: none;}
}