*,
*::before,
*::after {
	box-sizing: border-box;
}

:host {
	display: block;
}

.testimonials {
	padding-block: var(--g-spacing-3xl);
}

.testimonials__title {
	margin: 0 0 var(--g-spacing-2xl);
	font: var(--g-typography-h3-font);
	text-align: center;
	color: var(--g-color-content-default);
}

.testimonials__grid--cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: var(--g-spacing-lg);
	padding: 0;
	margin: 0;
	list-style: none;
}

.testimonials__grid--list {
	display: flex;
	flex-direction: column;
	gap: var(--g-spacing-xl);
	max-width: 65ch;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.testimonials__quote {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--g-spacing-lg);
	height: 100%;
}

.testimonials__text {
	margin: 0;
	font: var(--g-typography-body-default);
	font-style: italic;
	color: var(--g-color-content-default);
	flex: 1;
}

.testimonials__attribution {
	margin-top: auto;
}