/**
 * Mainsail Testimonials — quote card styling.
 *
 * Matches the reference Testimonials page (mainsailre.com/testimonials):
 * light bordered boxes on a white page background, a 5-star row, centered
 * text, and the first card spanning the full row while the rest sit two
 * per row — verified against that page's own live computed styles
 * (border, padding, font sizes, star color) rather than guessed.
 *
 * This intentionally replaced an earlier dark-card design that echoed the
 * homepage carousel's "Satisfied Clients" section instead of this page's
 * own actual reference — that homepage carousel (Mainsail Core's
 * Components/Testimonials) is untouched and keeps its own separate,
 * unrelated stylesheet.
 *
 * No JavaScript accompanies this stylesheet — plain CSS Grid, no
 * slider/carousel.
 */

.mainsail-testimonials-grid {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	margin: 2.5rem 0;
}

@media (min-width: 700px) {
	.mainsail-testimonials-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mainsail-testimonials-grid > .mainsail-testimonial-card:first-child {
		grid-column: 1 / -1;
	}
}

.mainsail-testimonial-card {
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	margin: -1px 0 0 -1px;
	padding: clamp(40px, 5.5vw, 80px) clamp(24px, 3.5vw, 50px);
	border: 1px solid #000000;
	background-color: #ffffff;
	color: #000000;
	text-align: center;
}

.mainsail-testimonial-card__rating {
	display: flex;
	gap: 4px;
	color: #000000;
}

.mainsail-testimonial-card__quote {
	margin: 0;
	padding: 0;
	border: 0;
	max-width: 62ch;
	font-family: var(--global-body-font-family, "Roboto", sans-serif);
	font-size: 1.0625rem;
	font-style: normal;
	line-height: 1.7;
	color: #000000;
}

.mainsail-testimonial-card__quote p {
	margin: 0 0 0.75em;
}

.mainsail-testimonial-card__quote p:last-child {
	margin-bottom: 0;
}

.mainsail-testimonial-card__attribution {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-style: normal;
}

.mainsail-testimonial-card__name {
	font-family: var(--global-body-font-family, "Roboto", sans-serif);
	font-weight: 700;
	font-size: 1.35rem;
	color: #000000;
}

.mainsail-testimonial-card__location {
	font-size: 0.9rem;
	color: #555555;
	letter-spacing: 0.02em;
}
