/**
 * הצוות שלנו — מקטע הצוות בעמוד "עלינו".
 *
 * הערכים כאן משכפלים אחד לאחד את המקטע הידני שהיה בעמוד לפני המעבר לווידג׳ט:
 * רשת 3 עמודות במרווח 2rem, תמונה עגולה 120px, שם אדום 24px/600,
 * תגית תפקיד עם מסגרת 1px ורדיוס 14px, ותיאור אפור ממורכז ברוחב 70%.
 */

.jc-team .jc-team__grid {
	--jc-team-cols: 3;
	display: grid;
	grid-template-columns: repeat(var(--jc-team-cols), minmax(0, 1fr));
	gap: 2rem;
	width: 100%;
}

.jc-team .jc-team__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	text-align: center;
}

.jc-team .jc-team__avatar {
	display: block;
	width: 120px;
	height: 120px;
	object-fit: cover;
	border-radius: 999px;
	margin: 0;
	flex: 0 0 auto;
}

/*
 * Scoped with the block class as well (.jc-team .jc-team__name) on purpose: the
 * name is an <h3>, and the Elementor kit styles bare headings via a rule of the
 * form `.elementor-kit-7 h3` (specificity 0,1,1). A single class (0,1,0) loses
 * to it, which silently rendered the name at the kit's h3 size instead of the
 * design's. Two classes (0,2,0) win without needing !important.
 */
.jc-team .jc-team__name {
	margin: 0;
	font-family: var(--e-global-typography-primary-font-family, "Noto Sans Hebrew", Arial, sans-serif);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.25em;
	letter-spacing: -1px;
	color: var(--e-global-color-primary, #C4161F);
}

/*
 * The role reads as a pill. The original hand-built element carried a lopsided
 * 15px top / 5px bottom padding, a leftover from Elementor's own spacing on that
 * widget. Here the padding is symmetric and the line-height is relaxed to 1.2 so
 * the Hebrew glyphs sit centred in the box rather than riding high in it. Total
 * pill height stays ~34px, matching the original.
 */
.jc-team .jc-team__role {
	margin: 0 0 0.5rem;
	padding: 9px 20px;
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	color: var(--e-global-color-primary, #C4161F);
	border: 1px solid #CC3433;
	border-radius: 14px;
	background-color: transparent;
}

.jc-team .jc-team__desc {
	max-width: 70%;
	margin: 0;
	color: var(--e-global-color-text, #4F4F4F);
	text-wrap: balance;
}

.jc-team__desc p {
	margin: 0;
}

.jc-team__desc p + p {
	margin-top: 0.6em;
}

.jc-team--empty {
	padding: 1.5rem;
	border: 1px dashed var(--e-global-color-1fd232b, #eeeeee);
	border-radius: 14px;
	text-align: center;
	color: var(--e-global-color-text, #4F4F4F);
}

@media (max-width: 767px) {
	.jc-team__desc {
		max-width: 100%;
	}
}