/**
 * Component: Team
 *
 * Portret, naam, functie en één zin. Bewust geen kader: een rij
 * gezichten is al genoeg structuur, en kaders eromheen maken er een
 * personeelsadministratie van.
 */

.bw-team__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bw-team__item {
	display: grid;
	gap: var(--bw-space-2xs);
	align-content: start;
}

.bw-team__portrait {
	margin-block-end: var(--bw-space-3xs);
	border-radius: var(--bw-radius);
	overflow: hidden;
	background-color: var(--bw-oat-deep);
}

.bw-team__portrait img,
.bw-team__portrait .bw-placeholder {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 0;
}

.bw-team__name {
	margin: 0;
	font-family: var(--bw-font-heading);
	font-size: var(--bw-text-lg);
	font-weight: 600;
	line-height: 1.2;
	color: var(--bw-surface-text);
}

.bw-team__role {
	margin: 0;
	font-size: var(--bw-text-sm);
	font-weight: 500;
	color: var(--bw-accent-text);
}

.bw-team__text {
	margin: 0;
	font-size: var(--bw-text-sm);
	line-height: 1.55;
	color: var(--bw-surface-muted, var(--bw-text-muted));
}