.team-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-m);
}

.team-card {
	background-color: white;
	border: 1px solid var(--hairline);
	border-radius: var(--radius-lg);
	padding: var(--space-m-l);
	box-shadow: var(--card-shadow);
	text-align: center;
}

.team-card .team-avatar {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	margin: 0 auto var(--space-s);
	background-color: var(--tint-green-strong);
	color: var(--primary);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: var(--step-3);
}

.team-card h3 {
	font-size: var(--step-1);
	font-weight: 600;
	margin-bottom: var(--space-3xs);
}

.team-card .role {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: var(--step--1);
	color: var(--primary);
	margin-bottom: var(--space-xs);
}

.team-card p {
	color: var(--light-grey);
	font-size: var(--step--1);
	text-align: justify;
}

@media (min-width: 640px) {
	.team-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}