.ebm-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin: 0;
}

.ebm-cols-1 { grid-template-columns: repeat(1, 1fr); }
.ebm-cols-2 { grid-template-columns: repeat(2, 1fr); }
.ebm-cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 991px) {
	.ebm-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 599px) {
	.ebm-grid { grid-template-columns: 1fr; }
}

.ebm-card {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border-radius: 2px;
	outline: 1px solid rgba(0, 45, 114, 0.08);
	outline-offset: -1px;
	box-shadow: 0 2px 14px rgba(0, 24, 68, 0.05);
	overflow: hidden;
}

.ebm-photo-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 366 / 219;
	overflow: hidden;
	background: #e5e7eb;
}

.ebm-photo,
.ebm-photo--placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ebm-photo--placeholder {
	background: #d9dde3;
}

.ebm-photo-overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(
		0deg,
		rgba(0, 16, 32, 0.55) 0%,
		rgba(0, 13, 27, 0.5) 9%,
		rgba(0, 9, 22, 0.45) 18%,
		rgba(0, 7, 17, 0.4) 27%,
		rgba(0, 4, 12, 0.35) 36%,
		rgba(0, 3, 8, 0.3) 45%,
		rgba(0, 2, 4, 0.25) 55%,
		rgba(0, 1, 2, 0.2) 64%,
		rgba(0, 0, 1, 0.15) 73%,
		rgba(0, 0, 0, 0.1) 82%,
		rgba(0, 0, 0, 0.05) 91%,
		rgba(0, 0, 0, 0) 100%
	);
}

.ebm-badge {
	position: absolute;
	left: 16px;
	bottom: 16px;
	display: inline-block;
	padding: 4px 11px;
	background: rgba(201, 150, 56, 0.15);
	outline: 1px solid rgba(201, 150, 56, 0.45);
	outline-offset: -1px;
	border-radius: 999px;
	color: #c99638;
	font-size: 9px;
	font-weight: 700;
	line-height: 13px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	white-space: nowrap;
}

.ebm-body {
	display: flex;
	flex-direction: column;
	padding: 24px;
}

.ebm-role {
	/* #c99638 is only 2.66:1 on this card's white body — fails WCAG AA
	   (needs 4.5:1 at this size). This darker shade clears 5:1. */
	color: #8a6215;
	font-size: 10px;
	font-weight: 700;
	line-height: 15px;
	text-transform: uppercase;
	letter-spacing: 1.3px;
}

.ebm-name {
	margin: 4px 0 0;
	color: #001844;
	font-family: 'Montserrat', 'Poppins', sans-serif;
	font-size: 17px;
	font-weight: 700;
	line-height: 25px;
}

.ebm-contacts {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 16px;
	padding-bottom: 20px;
}

.ebm-contact-row {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #475467;
	font-size: 12.5px;
	line-height: 19px;
	text-decoration: none;
}

.ebm-contact-row:hover {
	color: #001844;
}

.ebm-contact-row .ebm-icon {
	flex: none;
	width: 13px;
	height: 13px;
	color: #c99638;
}

.ebm-linkedin-row {
	padding-top: 8px;
	border-top: 1px solid rgba(0, 45, 114, 0.2);
}

.ebm-linkedin {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #002d72;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 19px;
	text-decoration: none;
}

.ebm-linkedin:hover {
	text-decoration: underline;
}

.ebm-linkedin .ebm-icon {
	flex: none;
	width: 13px;
	height: 13px;
	color: #002d72;
}
