/**
 * Röster om Impact Accelerator — testimonial cards in a horizontal carousel.
 * Built with native Gutenberg blocks.
 */
.roster-section {
	padding-top: clamp(50px, 7vh, 100px);
	padding-bottom: clamp(30px, 4vh, 60px);
	padding-left: clamp(20px, 4vw, 60px);
	padding-right: clamp(20px, 4vw, 60px);
}

.roster-section__heading {
	text-align: center;
	font-family: var(--wp--preset--font-family--ivymode, "ivymode", serif);
	font-weight: 300;
	font-size: clamp(2.5rem, 5vw, 4.5rem);
	line-height: 1.1;
	margin: 0 auto clamp(40px, 6vh, 80px);
	max-width: 1094px;
}

.roster-section__grid {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 638px;
	gap: 36px;
	max-width: 1312px;
	margin: 0 auto;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 4px;
	cursor: grab;
	align-items: stretch;
}
.roster-section__grid > .roster-section__card {
	height: 100%;
}
/* WP's `.wp-block-group + .wp-block-group` rule otherwise adds 24px top
   margin to every grid child after the first, which pushes them 24px
   below their row's top edge and clips the bottom rounded corner under
   the row boundary. */
.roster-section__grid > * {
	margin: 0 !important;
}
.roster-section__grid::-webkit-scrollbar {
	display: none;
}
.roster-section__grid.is-dragging {
	cursor: grabbing;
	scroll-behavior: auto;
	user-select: none;
	-webkit-user-select: none;
}
.roster-section__grid.is-dragging * {
	pointer-events: none;
}

@media (max-width: 600px) {
	.roster-section__grid {
		grid-auto-columns: 90%;
	}
}

.roster-section__card {
	background-color: #fff;
	border-radius: 10px;
	overflow: hidden;
	display: grid;
	grid-template-columns: 277px 1fr;
	min-height: 448px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
	scroll-snap-align: start;
}

.roster-section__card-image {
	margin: 0;
	height: 100%;
}
.roster-section__card-image img {
	width: 100%;
	height: 100%;
	min-height: 448px;
	object-fit: cover;
	display: block;
}

.roster-section__card-body {
	padding: 40px 38px 40px 42px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 20px;
}

.roster-section__card-quote {
	font-size: 16px;
	line-height: 1.44;
	color: var(--wp--preset--color--contrast, #000);
	margin: 0;
}

.roster-section__card-author {
	font-size: 16px;
	line-height: 1.2;
	margin: 0;
	color: var(--wp--preset--color--contrast, #000);
}
.roster-section__card-author strong {
	font-weight: 500;
}

@media (max-width: 820px) {
	.roster-section__card {
		grid-template-columns: 1fr;
		grid-template-rows: 200px 1fr;
		min-height: 0;
	}
	.roster-section__card-image img {
		min-height: 0;
		height: 200px;
	}
	.roster-section__card-body {
		padding: 20px 22px;
		gap: 12px;
		justify-content: flex-start;
	}
	.roster-section__card-quote {
		font-size: 15px;
		line-height: 1.4;
	}
}

@media (max-width: 600px) {
	.roster-section {
		padding-top: clamp(32px, 5vh, 50px);
		padding-bottom: clamp(20px, 3vh, 32px);
	}
	.roster-section__heading {
		margin-bottom: clamp(20px, 4vh, 32px);
	}
	.roster-section__card-body {
		padding: 18px 20px 22px;
		gap: 10px;
	}
}

/* Override carousel control color for light bg */
.roster-section + .ka-controls,
.roster-section .ka-controls {
	color: var(--wp--preset--color--mine-shaft);
}
