.testimonials {
	grid-template-rows: 1fr auto 1fr auto;
}

.testimonials .bg-img {
	position: absolute;
	height: 100%;
	width: 100%;
}

.testimonials .testimonials-slider-container {
	grid-area: 1/3/span 3/span 3;
}

.testimonials .testimonials-slider-container .testimonial-rating {
	display: flex;
	gap: 4px;
}

.testimonials .testimonials-slider-container .testimonial-rating .star {
	display: block;
	width: max(24px, 1.171875vw);
	aspect-ratio: 1/1;
	mask: url(../../img/icon-star.svg) no-repeat center/contain;
	background: currentColor;
}

.testimonials .testimonials-slider-nav {
	grid-area: 2/2/span 1/span 5;
	width: 100%;
}

.testimonials .headline {
	grid-area: 2/8/span 1/span 5;
	position: relative;
}

.testimonials .btns-container {
	grid-area: 3/8/span 1/span 5;
}

@media (max-width: 1399.98px) {
	.testimonials .testimonials-slider-container {
		grid-area: 1/3/span 3/span 4;
	}

	.testimonials .testimonials-slider-nav {
		grid-area: 1/2/span 3/span 6;
	}

	.testimonials .headline {
		grid-area: 2/9/span 1/span 5;
	}

	.testimonials .btns-container {
		grid-area: 3/9/span 1/span 5;
	}
}

@media (max-width: 991.98px) {
	.testimonials {
		grid-template-rows: auto;
	}
	
	.testimonials .testimonials-slider-container {
		grid-area: 1/5/span 1/span 6;
	}

	.testimonials .testimonials-slider-nav {
		grid-area: 1/4/span 1/span 8;
	}

	.testimonials .headline {
		grid-area: 2/5/span 1/span 6;
		margin-top: var(--m-md);
	}

	.testimonials .btns-container {
		grid-area: 3/5/span 1/span 6;
		margin-top: var(--m-sm);
	}
}

@media (max-width: 767.98px) {
	.testimonials .testimonials-slider-container {
		grid-area: 1/4/span 1/span 8;
	}

	.testimonials .testimonials-slider-nav {
		grid-area: 1/3/span 1/span 10;
	}

	.testimonials .headline {
		grid-area: 2/4/span 1/span 8;
	}

	.testimonials .btns-container {
		grid-area: 3/4/span 1/span 8;
	}
}

@media (max-width: 575.98px) {
	.testimonials .testimonials-slider-container {
		grid-area: 1/2/span 1/span 12;
	}

	.testimonials .testimonials-slider-nav {
		grid-area: 2/2/span 1/span 12;
		justify-content: center;
		gap: var(--m-sm);
		margin-top: var(--m-sm)
	}

	.testimonials .headline {
		grid-area: 3/2/span 1/span 12;
	}

	.testimonials .btns-container {
		grid-area: 4/2/span 1/span 12;
	}
}