
/* Feedback (testimonials slider) — the one stylesheet for this section, site-wide.
   Design reference: the Book a Demo page. Typography comes from the global sd-type-*
   classes in the markup; this file owns only layout, colours and spacing. The doubled
   class keeps it ahead of any page stylesheet without !important. */

/* The section resolves its own font, whatever page renders it. */
.feedback.feedback, .feedback.feedback * {
	font-family: "Google Sans Flex", sans-serif;
}

/* Spacing: inline --ns-* values (page field → Theme Settings → 80/80/48/48). */
.feedback.feedback {
	position: relative;
	padding-top: var(--ns-desktop-padding-top, 80px);
	padding-bottom: var(--ns-desktop-padding-bottom, 80px);
	background-color: #fff;
	color: #524f4f;
}

.feedback.feedback .feedback-inner {
	position: relative;
}

.feedback.feedback .feedback-header {
	max-width: 702px;
	margin-bottom: 48px;
}

.feedback.feedback .feedback-title {
	margin: 24px 0 0;
	color: #282828;
}

.feedback.feedback .feedback-title span {
	color: #409a65;
}

.feedback.feedback .feedback-desc {
	margin-top: 24px;
	color: rgba(0, 0, 0, .75);
}

.feedback.feedback .feedback-desc br {
	display: none;
}

/* Per-page Title/Description max width (feedback_title_max_width / feedback_desc_max_width). */
.feedback.feedback .compare-v2-text-width-control[data-compare-width="1"] {
	max-width: var(--compare-v2-max-width);
}

.feedback.feedback .splide__arrows:has(.feedback-arrows) {
	position: absolute;
	top: -100px;
	right: 0;
}

.feedback.feedback .feedback-arrows .splide__arrow:hover rect, .feedback.feedback .feedback-arrows .splide__arrow:hover path {
	stroke: #333;
}

.feedback.feedback .splide__pagination {
	display: none;
}

.feedback.feedback .feedback-item {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 24px;
	border-radius: 16px;
	background: #f7f7f7;
}

.feedback.feedback .feedback-item__person {
	display: flex;
	flex-direction: column;
	align-items: start;
	margin-bottom: 24px;
}

.feedback.feedback .feedback-item__person-soc {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 12px;
}

.feedback.feedback .feedback-item__avatar {
	width: 56px;
	height: 56px;
	border-radius: 100%;
	object-fit: cover;
}

.feedback.feedback .feedback-item__name {
	color: #282828;
}

.feedback.feedback .feedback-item__position {
	margin-bottom: 10px;
	color: rgba(0, 0, 0, .55);
}

.feedback.feedback .feedback-item__desc {
	color: rgba(0, 0, 0, .75);
}

@media (max-width: 1200px) {
	.feedback.feedback {
		padding-top: var(--ns-mobile-padding-top, 48px);
		padding-bottom: var(--ns-mobile-padding-bottom, 48px);
	}
	
	.feedback.feedback .feedback-title, .feedback.feedback .feedback-desc {
		margin-top: 16px;
	}
	
	.feedback.feedback .feedback-item__person {
		margin-bottom: 20px;
	}
	
	.feedback.feedback .splide-feedback {
		display: flex;
		flex-direction: column-reverse;
		gap: 32px;
	}
	
	.feedback.feedback .splide__arrows:has(.feedback-arrows) {
		position: static;
		display: flex;
		flex-direction: row-reverse;
	}
}

@media (max-width: 767px) {
	.feedback.feedback {
		overflow: hidden;
	}
	
	.feedback.feedback .feedback-header {
		margin-bottom: 32px;
	}
	
	.feedback.feedback .compare-v2-text-width-control[data-compare-width="1"] {
		max-width: unset;
	}
	
	.feedback.feedback .splide__arrows:has(.feedback-arrows) {
		display: none;
	}
	
	.feedback.feedback .splide__track {
		overflow: unset;
	}
	
	.feedback.feedback .feedback-arrows {
		display: flex;
		gap: 16px;
	}
	
	.feedback.feedback .splide__arrow {
		display: block;
		padding: 0;
	}
	
	.feedback.feedback .splide__arrow svg {
		width: 48px;
		height: 48px;
	}
}
