/**
 * LB PCat: Products Grid（动态 CPT 版）
 * Figma 847:315 — Type C（contained），4 列产品卡片，分页点
 * 产品卡片：白底 + 圆角 20px + 阴影 + 产品图 + 产品名称 + Get a Quote 链接
 */

/* ── Section 容器（Type C contained） ──────────────────────── */
.lianbang-pcat-grid {
	background-color: #f9f9f9;
	padding: 80px 0;
	margin-left:  calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.lianbang-pcat-grid__inner {
	max-width: 1600px;
	margin: 0 auto;
	padding: 0 30px;
}

/* ── Section 标题 ───────────────────────────────────────────── */
.lianbang-pcat-grid__title {
	margin: 0 0 48px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 36px;
	color: #383838;
	text-align: center;
}

/* ── 卡片网格：4 列 ─────────────────────────────────────────── */
.lianbang-pcat-grid__cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ── 单个产品卡片 ───────────────────────────────────────────── */
.lianbang-pcat-grid__card {
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 4px 9px rgba(157, 157, 157, 0.25);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.lianbang-pcat-grid__card:hover {
	box-shadow: 0 8px 20px rgba(1, 63, 146, 0.15);
	transform: translateY(-2px);
}

/* ── 图片区 ─────────────────────────────────────────────────── */
.lianbang-pcat-grid__card-img-wrap {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 20px 20px 0 0;
	background-color: #eff6ff;  /* Figma: image area bg */
}

.lianbang-pcat-grid__card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.lianbang-pcat-grid__card:hover .lianbang-pcat-grid__card-img {
	transform: scale(1.03);
}

/* 无图时的占位符 */
.lianbang-pcat-grid__card-img--placeholder {
	background-color: #eff6ff;
	width: 100%;
	height: 100%;
}

/* ── 产品名称（含链接包裹层）───────────────────────────────── */
.lianbang-pcat-grid__card-name-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.lianbang-pcat-grid__card-name {
	margin: 16px 20px 8px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 16px;
	line-height: 1.4;
	color: #1a1a1a;
	transition: color 0.2s ease;
}

/* ── Get a Quote 链接 ───────────────────────────────────────── */
.lianbang-pcat-grid__card-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: auto 20px 20px;
	font-family: 'Nunito', sans-serif;
	font-weight: 700;
	font-size: 14px;
	color: #013f92;
	text-decoration: none;
	transition: gap 0.2s ease;
}

.lianbang-pcat-grid__card-link:hover {
	gap: 10px;
}

.lianbang-pcat-grid__card-arrow {
	flex-shrink: 0;
}

/* ── 分页点 ─────────────────────────────────────────────────── */
.lianbang-pcat-grid__pagination {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 40px;
}

.lianbang-pcat-grid__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #d0d8e8;
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background 0.2s ease, transform 0.2s ease;
}

.lianbang-pcat-grid__dot.is-active {
	background: #013f92;
	transform: scale(1.3);
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1200px) {
	.lianbang-pcat-grid__cards {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 960px) {
	.lianbang-pcat-grid {
		padding: 60px 0;
	}

	.lianbang-pcat-grid__cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.lianbang-pcat-grid {
		padding: 40px 0;
	}

	.lianbang-pcat-grid__inner {
		padding: 0 16px;
	}

	.lianbang-pcat-grid__title {
		font-size: 28px;
		margin-bottom: 32px;
	}

	.lianbang-pcat-grid__cards {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}

	.lianbang-pcat-grid__card-name {
		font-size: 14px;
		margin: 12px 14px 6px;
	}

	.lianbang-pcat-grid__card-link {
		margin: auto 14px 14px;
		font-size: 13px;
	}
}
