.coach-cards-container {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	max-width: 1060px;
	margin: 0 auto;
	.coach-card {
		background-image: linear-gradient(180deg, color-mix(in oklab, #8cc6c1 12%, #fff), #fff 60%),
			radial-gradient(120% 80% at -20% -10%, color-mix(in oklab, #8cc6c1 16%, transparent) 0%, transparent 60%);
		outline: 1px solid color-mix(in oklab, #8cc6c1 28%, transparent);
		border-radius: 1.125em;
		overflow: hidden;
		box-shadow: 0 10px 28px rgba(2, 6, 23, 0.08);
		display: flex;
		flex-direction: column;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
		&:hover {
			transform: translateY(-2px);
			box-shadow: 0 1em 36px rgba(2, 6, 23, 0.12);
			cursor: pointer;
		}
		.coach-card-header.rich-text {
			aspect-ratio: 6/4;
			margin: 0;
			width: 100%;
			max-width: 100%;
			height: auto;
			display: block;
			object-fit: cover;
			object-position: top;
			border-radius: 0; /* we handle rounding on the card */
			filter: saturate(1.02) contrast(1.03);
			border-bottom: 1px solid rgba(0, 0, 0, 0.06);
			overflow: hidden;
			background-size: cover;
			background-position: top;
			border-bottom: none;
		}
		.coach-card-body.rich-text {
			padding: 1.6rem;
			display: flex;
			flex-direction: column;
			gap: 6px;
			h3 {
				margin: 0;
				text-transform: none;
				letter-spacing: -0.2px;
				font-weight: 800;
				color: #8bc5c0 !important;
				--fs: 2.1rem;
				font-size: var(--fs);
				@media (max-width: 960px) {
					font-size: calc(var(--laptop_scale) * var(--fs));
				}
				@media (max-width: 768px) {
					font-size: calc(var(--tablet_scale) * var(--fs));
				}
				@media (max-width: 480px) {
					font-size: calc(var(--phone_scale) * var(--fs));
				}
			}
			.coach-card-bio {
				p {
					color: var(--brand_text);
					--fs: 1.6rem;
					font-size: var(--fs);
					@media (max-width: 960px) {
						font-size: calc(var(--laptop_scale) * var(--fs));
					}
					@media (max-width: 768px) {
						font-size: calc(var(--tablet_scale) * var(--fs));
					}
					@media (max-width: 480px) {
						font-size: calc(var(--phone_scale) * var(--fs));
					}
					margin: 0 0 8px 0;
					&:first-child {
						display: -webkit-box;
						-webkit-line-clamp: 6;
						line-clamp: 6;
						@media (max-width: 768px) {
							-webkit-line-clamp: 8 !important;
						}
						-webkit-box-orient: vertical;
						overflow: hidden;
						position: relative;
						&::after {
							content: '';
							position: absolute;
							left: 0;
							right: 0;
							bottom: 0;
							height: 2.8em;
							background: linear-gradient(180deg, transparent, #fff);
						}
					}
					& ~ p {
						display: none;
					}
					strong {
						font-weight: inherit;
					}
				}
				span {
					color: inherit !important;
					background: transparent !important;
				}
				br.softbreak {
					display: none;
				}
			}
		}
		.coach-card-footer {
			display: none;
		}
	}
}
