/* H-Lead Proven Approach.
 * Figma: 'proven-approach' frame, 1920x896, bg off-white, pad 80/180,
 * 3 bordered cards 507x560 radius 16, 04. H-lead_about_desktop_v1 /
 * mobile (single-card carousel via hl-card-carousel). */

.hl-proven-approach {
	display: flex;
	flex-direction: column;
	gap: var(--hl-space-56);
	background: var(--hl-color-off-white);
	padding: var(--hl-space-80) 0;
}

.hl-proven-approach__title-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--hl-space-16);
	max-width: 770px;
	margin: 0 auto;
	text-align: center;
}

.hl-proven-approach__description {
	margin: 0;
	color: var(--hl-color-grey-600);
	font-size: 20px;
	line-height: 30px;
}

.hl-proven-approach__title {
	margin: 0;
	color: var(--hl-color-brand-700);
	font-size: 36px;
	line-height: 44px;
	font-weight: 700;
}

.hl-proven-approach .hl-card-carousel__slide {
	height: 100%;
}

.hl-proven-approach__card {
	display: flex;
	flex-direction: column;
	gap: var(--hl-space-32);
	height: 100%;
	padding: var(--hl-space-32) var(--hl-space-24);
	border-radius: var(--hl-radius-16);
	background: var(--hl-color-white);
	border: 1px solid var(--hl-color-grey-200);
}

.hl-proven-approach__items {
	display: flex;
	flex-direction: column;
	gap: var(--hl-space-24);
}

.hl-proven-approach__item {
	display: flex;
	flex-direction: column;
	gap: var(--hl-space-8);
}

.hl-proven-approach__subheading {
	margin: 0;
	color: var(--hl-color-brand-700);
	font-size: 20px;
	line-height: 30px;
	font-weight: 700;
}

.hl-proven-approach__body {
	margin: 0;
	color: var(--hl-color-grey-600);
	font-size: 20px;
	line-height: 30px;
}

.hl-proven-approach__card-title {
	margin: 0;
	color: var(--hl-color-brand-700);
	font-size: 24px;
	line-height: 32px;
	font-weight: 700;
}

@media (max-width: 991px) {
	.hl-proven-approach {
		padding: var(--hl-space-48) var(--hl-space-20);
	}

	.hl-proven-approach__title {
		font-size: 24px;
		line-height: 32px;
	}

	.hl-proven-approach__description {
		font-size: 18px;
		line-height: 28px;
	}
}