.page-header {
background: #015293;
padding: 60px 0;
position: relative;
}
.page-header::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #015293 0%, #1a6cb5 50%, #015293 100%);
}
.page-header h1 {
color: #fff;
font-size: 36px;
font-weight: 600;
margin: 0;
}
.breadcrumb-nav {
margin-top: 15px;
}
.breadcrumb-nav a,
.breadcrumb-nav span {
color: rgba(255,255,255,0.8);
font-size: 14px;
}
.breadcrumb-nav a:hover {
color: #fff;
}
.breadcrumb-nav .separator {
margin: 0 10px;
color: rgba(255,255,255,0.5);
}

/* 内容区域 */
.content-section {
/*
padding: 50px 0;
background: #f5f5f5;
*/
}

/* 左侧列表 */
.news-list-wrapper {
background: #fff;
padding: 0;
padding-top: 10px;
}
.list-header {
padding: 25px 30px;
border-bottom: 2px solid #015293;
display: flex;
justify-content: space-between;
align-items: center;
}
.list-header h2 {
font-size: 20px;
color: #015293;
margin: 0;
font-weight: 600;
}
.list-header .total {
font-size: 14px;
color: #666;
}
.list-header .total span {
color: #015293;
font-weight: 600;
}

/* 新闻列表 */
.news-list {
list-style: none;
padding: 0;
margin: 0;
box-shadow: 0 2px 20px rgba(0,0,0,0.1);
}
.news-item {
display: flex;
padding: 25px 30px;
border-bottom: 1px solid #eee;
transition: all 0.3s;
cursor: pointer;
}
.news-item:hover {
background: #f8f9fa;
}
.news-item:last-child {
border-bottom: none;
}

/* 日期标签 */
.news-date {
width: 70px;
height: 70px;
background: #f5f5f5;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-right: 25px;
flex-shrink: 0;
transition: all 0.3s;
}
.news-item:hover .news-date {
background: #015293;
}
.news-date .day {
font-size: 28px;
font-weight: 700;
color: #015293;
line-height: 1;
transition: all 0.3s;
}
.news-item:hover .news-date .day {
color: #fff;
}
.news-date .month {
font-size: 12px;
color: #999;
margin-top: 3px;
transition: all 0.3s;
}
.news-item:hover .news-date .month {
color: rgba(255,255,255,0.8);
}

/* 新闻内容 */
.news-content {
flex: 1;
min-width: 0;
}
.news-content h3 {
font-size: 17px;
color: #333;
margin: 0 0 10px;
font-weight: 600;
line-height: 1.5;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
transition: all 0.3s;
}
.news-item:hover .news-content h3 {
color: #015293;
}
.news-content .summary {
font-size: 14px;
color: #666;
line-height: 1.8;
margin: 0;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}

/* 分页 */
.pagination-wrapper {
padding: 30px;
display: flex;
justify-content: center;
border-top: 1px solid #eee;
}
.pagination {
display: flex;
gap: 8px;
list-style: none;
padding: 0;
margin: 0;
}
.pagination li a {
display: flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 0 15px;
background: #fff;
border: 1px solid #ddd;
color: #666;
font-size: 14px;
transition: all 0.3s;
}
.pagination li a:hover,
.pagination li.active a {
background: #015293;
border-color: #015293;
color: #fff;
}
.pagination li.prev a,
.pagination li.next a {
padding: 0 20px;
}

/* 侧边栏 */
.sidebar-widget {
background: #fff;
margin-bottom: 25px;
}
.widget-header {
padding: 20px 25px;
background: #015293;
}
.widget-header h3 {
font-size: 16px;
color: #fff;
margin: 0;
font-weight: 600;
}
.widget-body {
padding: 20px 25px;
}

/* 搜索框 */
.search-form {
display: flex;
}
.search-form input {
flex: 1;
height: 45px;
border: 1px solid #ddd;
border-right: none;
padding: 0 15px;
font-size: 14px;
}
.search-form input:focus {
outline: none;
border-color: #015293;
}
.search-form button {
width: 50px;
height: 45px;
background: #015293;
border: none;
color: #fff;
font-size: 16px;
cursor: pointer;
transition: all 0.3s;
}
.search-form button:hover {
background: #1a6cb5;
}

/* 分类导航 */
.category-list {
list-style: none;
padding: 0;
margin: 0;
}
.category-list li {
border-bottom: 1px solid #eee;
}
.category-list li:last-child {
border-bottom: none;
}
.category-list li a {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 0;
color: #333;
font-size: 14px;
transition: all 0.3s;
}
.category-list li a:hover {
color: #015293;
padding-left: 10px;
}
.category-list li a .count {
background: #f5f5f5;
color: #666;
font-size: 12px;
padding: 2px 10px;
border-radius: 10px;
}

/* 热门文章 */
.hot-list {
list-style: none;
padding: 0;
margin: 0;
}
.hot-item {
display: flex;
align-items: flex-start;
padding: 15px 0;
border-bottom: 1px solid #eee;
}
.hot-item:last-child {
border-bottom: none;
}
.hot-rank {
width: 24px;
height: 24px;
background: #f5f5f5;
color: #666;
font-size: 12px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
margin-right: 15px;
flex-shrink: 0;
}
.hot-item:nth-child(1) .hot-rank {
background: #015293;
color: #fff;
}
.hot-item:nth-child(2) .hot-rank {
background: #1a6cb5;
color: #fff;
}
.hot-item:nth-child(3) .hot-rank {
background: #4a90c2;
color: #fff;
}
.hot-content {
flex: 1;
min-width: 0;
}
.hot-content a {
font-size: 14px;
color: #333;
line-height: 1.6;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
transition: all 0.3s;
}
.hot-content a:hover {
color: #015293;
}
.hot-content .date {
font-size: 12px;
color: #999;
margin-top: 5px;
}

/* 响应式 */
@media (max-width: 991px) {
.page-header {
padding: 40px 0;
}
.page-header h1 {
font-size: 28px;
}
.sidebar-widget {
margin-top: 30px;
}
}
@media (max-width: 767px) {
.page-header {
padding: 30px 0;
}
.page-header h1 {
font-size: 24px;
}
.list-header {
padding: 20px;
}
.news-item {
padding: 20px;
}
.news-date {
width: 55px;
height: 55px;
margin-right: 15px;
}
.news-date .day {
font-size: 22px;
}
.news-content h3 {
font-size: 15px;
}
.news-content .summary {
font-size: 13px;
-webkit-line-clamp: 1;
}
.pagination-wrapper {
padding: 20px;
}
.pagination li a {
min-width: 35px;
height: 35px;
padding: 0 10px;
font-size: 13px;
}
}