.coaching-intro { 
	background: var(--color-background); 
}

.coaching-intro > .container { 
	padding-block: var(--space-80) var(--space-40); 
}

.coaching-intro h1 { 
	max-width: 40em; 
	margin-bottom: var(--space-20); 
}

.coaching-intro p { 
	font-size: var(--font-size-standard); 
}

.service-list > .container { 
	padding-bottom: var(--space-96); 
}

.service-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-24);
}

.service-card {
	display: flex;
	min-height: 40em;
	flex-direction: column;
	gap: var(--space-24);
	padding: var(--space-24);
	border-radius: var(--radius-24);
	background: var(--color-card);
}

.image-mask--service { 
	width: 100%; 
	height: 200px; 
	flex: 0 0 200px; 
}

.service-card:nth-child(1) .image-mask--service {
	background-image: url("../images/mindfulness_banner.jpg");
}

.service-card:nth-child(3) .image-mask--service {
	background-image: url("../images/natuurcoaching_banner.jpg");
}

.service-card:nth-child(5) .image-mask--service {
	background-image: url("../images/natuursessie_banner.jpg");
}

.service-card__content { 
	display: grid; 
	align-content: start; 
	gap: var(--space-16); 
	min-height: 20em; 
}

.service-card__content p { 
	font-size: var(--font-size-standard); 
}

.service-card__content ul {
	margin: 0;
	padding-inline-start: var(--space-20);
}

.service-card__content li { 
	line-height: var(--font-line-height-standard);
	color: var(--color-secondary);
}

.service-card__footer { 
	display: grid; 
	justify-items: start; 
	gap: var(--space-20); 
	margin-top: auto; 
}

.price { 
	padding: var(--space-8) var(--space-12); 
	border-radius: var(--radius-8); 
	background: var(--color-background); 
	color: var(--color-heading); 
	font-size: var(--font-size-standard); 
	font-weight: var(--font-weight-semibold); 
}

.service-card__additional-info { 
	font-size: var(--font-size-small); 
	font-style: italic;
}

.service-card__additional-info p { 
	padding-block: var(--space-8); 
}

@media (max-width: 72em) {
	.service-grid { 
		grid-template-columns: repeat(2, minmax(0, 1fr)); 
	}
}

@media (max-width: 42em) {
	.service-grid { 
		grid-template-columns: 1fr; 
	}

	.service-card { 
		min-height: 0; 
	}

	.service-card__content { 
		min-height: 0; 
	}
}
