/**
 * LB Capabilities: Our Core Solutions
 * Figma 1782:1097 / 1783:1116 / 1783:1135 / 1783:1153（4 个激活状态）
 * Title (Montserrat Bold 48) → 62px → body
 * Body: list (x:75, w:451 含 38px 缩进) + image 602×449, gap ≈87px at 1280
 * Item rhythm: item→item 36px, title→desc 20px, desc indent 38px
 * Type C (contained)
 */

.lianbang-capabilities-solutions {
	background-color: #fff;
}

.lianbang-capabilities-solutions__inner {
	box-sizing: border-box;
	max-width: 1600px;
	margin: 0 auto;
	padding: var(--lb-section-pad-y, 80px) 30px;
}

/* ── Title — Montserrat Bold 48, "Our Core " #383838 + "Solutions" #013f92 ── */
/* 多一层选择器，盖过 .woocommerce-js h2 { margin-bottom:.7em } */
.lianbang-capabilities-solutions .lianbang-capabilities-solutions__title {
	margin: 0 0 62px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: var(--lb-h2-size, 48px);
	line-height: 1.2;
	color: #383838;
}

.lianbang-capabilities-solutions__title-hl {
	color: #013f92;
}

/* ── Body ───────────────────────────────────────────────────── */
.lianbang-capabilities-solutions__body {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 48px;
}

.lianbang-capabilities-solutions__list {
	flex: 0 1 451px;
	min-width: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lianbang-capabilities-solutions__item {
	margin: 0;
	padding: 0;
}

.lianbang-capabilities-solutions__item + .lianbang-capabilities-solutions__item {
	margin-top: 36px;
}

/* 标题按钮：清掉主题 button 样式 */
.lianbang-capabilities-solutions__trigger,
.lianbang-capabilities-solutions__trigger:hover,
.lianbang-capabilities-solutions__trigger:focus {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	text-align: left;
	cursor: pointer;
}

.lianbang-capabilities-solutions__trigger:focus-visible {
	outline: 2px solid #013f92;
	outline-offset: 4px;
}

/* 22×22 方块，radius 3；相对标题首行下移 4px */
.lianbang-capabilities-solutions__marker {
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	margin-top: 4px;
	border-radius: 3px;
	background-color: #ababab;
	transition: background-color 0.3s ease;
}

/* Montserrat SemiBold 24, inactive #ababab / active #000 */
.lianbang-capabilities-solutions__item-title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 24px;
	line-height: 29px;
	color: #ababab;
	transition: color 0.3s ease;
}

.lianbang-capabilities-solutions__trigger:hover .lianbang-capabilities-solutions__item-title {
	color: #6b6b6b;
}

.lianbang-capabilities-solutions__item.is-active .lianbang-capabilities-solutions__marker {
	background-color: #013f92;
}

.lianbang-capabilities-solutions__item.is-active .lianbang-capabilities-solutions__item-title {
	color: #000;
}

/* 说明展开：grid 0fr → 1fr，高度随内容过渡 */
.lianbang-capabilities-solutions__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.4s ease;
}

.lianbang-capabilities-solutions__item.is-active .lianbang-capabilities-solutions__panel {
	grid-template-rows: 1fr;
}

.lianbang-capabilities-solutions__panel-inner {
	min-height: 0;
	overflow: hidden;
	padding-left: 38px;
}

/* Nunito Sans Medium 15 / 20, #0f2b1f（卡片级小字，不走全站 __desc 18px） */
.lianbang-capabilities-solutions__item-desc {
	margin: 20px 0 0;
	font-family: var(--lb-font-body);
	font-weight: 500;
	font-size: 15px;
	line-height: 20px;
	color: #0f2b1f;
}

/* 每项自带的图只在手机手风琴里显示 */
.lianbang-capabilities-solutions__item-img {
	display: none;
}

/* ── 右侧图：602×449，切换时淡入 ───────────────────────────── */
.lianbang-capabilities-solutions__media {
	position: relative;
	flex: 0 1 52.8%;
	max-width: 760px;
	aspect-ratio: 602 / 449;
	overflow: hidden;
	background-color: #f5f5f5;
}

.lianbang-capabilities-solutions__img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.5s ease;
}

.lianbang-capabilities-solutions__img.is-active {
	opacity: 1;
}

/* ── ≥1024：整节压进一屏 ─────────────────────────────────────
   上下留白、标题间距随视口高度收缩（够高时仍是 Figma 的 80 / 62），
   右图高度不超过「视口 − 留白 − 标题 − 间距」，超出时 cover 裁切。
   展开最长一项时列表约 411px，视口 ≥590px 均可一屏放下
   （1920×1080 开 150% 缩放的笔记本，可视高度约 590–600）。 */
@media (min-width: 1024px) {
	.lianbang-capabilities-solutions {
		--lb-cs-pad: clamp(32px, 6vh, 80px);
		--lb-cs-gap: clamp(28px, 5vh, 62px);
	}

	.lianbang-capabilities-solutions__inner {
		padding-top: var(--lb-cs-pad);
		padding-bottom: var(--lb-cs-pad);
	}

	.lianbang-capabilities-solutions .lianbang-capabilities-solutions__title {
		margin-bottom: var(--lb-cs-gap);
	}

	.lianbang-capabilities-solutions__media {
		max-height: max(320px, calc(100vh - 2 * var(--lb-cs-pad) - var(--lb-cs-gap) - 1.2 * var(--lb-h2-size, 48px)));
	}
}

/* ── ≤1023：上下排列，改为手风琴，图片放进每一项 ─────────────── */
@media (max-width: 1023px) {
	.lianbang-capabilities-solutions .lianbang-capabilities-solutions__title {
		margin-bottom: 40px;
	}

	.lianbang-capabilities-solutions__body {
		display: block;
	}

	.lianbang-capabilities-solutions__media {
		display: none;
	}

	.lianbang-capabilities-solutions__item + .lianbang-capabilities-solutions__item {
		margin-top: 28px;
	}

	.lianbang-capabilities-solutions__item-img {
		display: block;
		width: 100%;
		height: auto !important;
		aspect-ratio: 602 / 449;
		margin-top: 20px;
		object-fit: cover;
	}
}

@media (max-width: 767px) {
	.lianbang-capabilities-solutions__inner {
		padding-left: 20px;
		padding-right: 20px;
	}

	.lianbang-capabilities-solutions .lianbang-capabilities-solutions__title {
		margin-bottom: 32px;
	}

	.lianbang-capabilities-solutions__trigger {
		gap: 12px;
	}

	.lianbang-capabilities-solutions__marker {
		flex-basis: 18px;
		width: 18px;
		height: 18px;
		margin-top: 3px;
	}

	.lianbang-capabilities-solutions__item-title {
		font-size: 20px;
		line-height: 24px;
	}

	.lianbang-capabilities-solutions__panel-inner {
		padding-left: 30px;
	}

	.lianbang-capabilities-solutions__item-desc {
		margin-top: 14px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lianbang-capabilities-solutions__panel,
	.lianbang-capabilities-solutions__img,
	.lianbang-capabilities-solutions__marker,
	.lianbang-capabilities-solutions__item-title {
		transition: none;
	}
}