.banner-image::before {
	position:absolute;
	content:"";
	width:100%;
	height:300px;
	left:0;
	top:0;
	background:-webkit-gradient(linear,left top,left bottom,color-stop(80%,transparent),to(rgba(0,0,0,.5)));
	background:-webkit-linear-gradient(top,transparent 80%,rgba(0,0,0,.8) 100%);
	background:-o-linear-gradient(top,transparent 80%,rgba(0,0,0,.8) 100%);
	background:linear-gradient(to bottom,transparent 20%,rgba(0,0,0,.8) 100%);
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-ms-transition:all 0.4s ease;
}
.banner-image img {
	width:100%;
	display:block;
	object-fit:cover;
}
.mb-12 {
    margin-bottom: 3rem;
}
.text-center {
    text-align: center;
}
 /* 文章卡片样式 */
.main-content{
    
   max-width: 1600px;
    margin: 2rem auto;
    padding: 0 16px;
}
.articles-grid {
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
	gap:2rem;
}
.article-card {
	background-color:var(--bg-white);
	border-radius:0.5rem;
	box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);
	overflow:hidden;
	transition:all 0.3s ease;
	display:flex;
	flex-direction:column;
	height:100%;
}
.article-card:hover {
	transform:translateY(-5px);
	box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);
}
.article-image-container {
	overflow:hidden;
}
.article-card img {
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform 0.5s ease;
}
.article-card:hover img {
	transform:scale(1.05);
}
.article-content {
	padding:1.5rem;
	flex-grow:1;
	display:flex;
	flex-direction:column;
}
.article-meta {
	display:flex;
	gap:1rem;
	color:var(--text-lighter);
	font-size:0.875rem;
	margin-bottom:1rem;
}
.article-title {
	font-size:1.25rem;
	font-weight:600;
	margin-bottom:0.75rem;
}
.article-excerpt {
	margin-bottom:1rem;
	flex-grow:1;
}
.article-read-more {
	color:var(--primary-color);
	text-decoration:none;
	font-weight:500;
	display:inline-flex;
	align-items:center;
}
.article-read-more:hover {
	text-decoration:underline;
}
/* æ¡ˆä¾‹å±•ç¤ºæ ·å¼ */
        .cases-container {
	margin-bottom:6rem;
}
.cases-grid {
	display:grid;
	grid-template-columns:1fr;
	gap:1.5rem;
}
@media (min-width:768px) {
	.cases-grid {
	grid-template-columns:repeat(4,1fr);
}
}