/* css/news_cover.css */

/* 通用：主内容区上间距 */
.main-content {
    background-color: #fff;
    padding-bottom: 4rem;
}

/* =========================================
   1. 顶部焦点区 (Hero)
   ========================================= */
.news-hero-section {
    padding: 3rem 0;
    background-color: #f9f9f9; /* 浅灰底区分 */
}

.hero-layout {
    display: flex;
    gap: 2rem;
    height: 400px; /* 固定高度 */
}

/* 左侧轮播 */
.hero-slider {
    flex: 0 0 60%; /* 占60%宽度 */
    position: relative;
    border-radius: 4px;
    overflow: hidden;
}

.slider-item {
    width: 100%;
    height: 100%;
}
.slider-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.slider-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    padding: 2rem 1.5rem 1rem;
    color: #fff;
}
.slider-caption h3 {
    font-size: 1.4rem;
    font-weight: normal;
}
.slider-dots {
    position: absolute;
    bottom: 1rem;
    right: 1.5rem;
    display: flex;
    gap: 8px;
}
.slider-dots span {
    width: 10px; height: 10px;
    background: rgba(255,255,255,0.5);
    border-radius: 50%;
    cursor: pointer;
}
.slider-dots span.active { background: #fff; }

/* 右侧头条列表 */
.hero-headlines {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.headlines-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 2px solid #005bac;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}
.headlines-header h2 { color: #005bac; font-size: 1.4rem; margin: 0; }
.date-today { color: #999; font-family: Arial; }

.headline-list { margin-top: 0.5rem; }

/* 头条样式 */
.headline-list .top-news {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed #ddd;
}
.headline-list .top-news h4 {
    font-size: 1.1rem;
    color: #333;
    margin-bottom: 0.5rem;
    line-height: 1.4;
    font-weight: bold;
}
.headline-list .top-news p {
    font-size: 0.9rem;
    color: #666;
    line-height: 1.5;
    /* 显示2行省略 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.headline-list .top-news:hover h4 { color: #005bac; }

/* 普通列表样式 */
.headline-list li:not(.top-news) {
    margin-bottom: 0.8rem;
}
.headline-list li a {
    display: flex;
    justify-content: space-between;
    font-size: 0.95rem;
    color: #444;
}
.headline-list li a:hover { color: #005bac; }
.headline-list .news-txt {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}
.headline-list .news-time {
    color: #999;
    font-family: Arial;
}


/* =========================================
   2. 分类新闻板块 (三栏)
   ========================================= */
.news-category-section {
    padding: 3rem 0;
}

.category-grid {
    display: flex;
    gap: 2rem;
}

.news-col {
    flex: 1; /* 三栏等宽 */
    background: #fff;
}

.sec-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-left: 4px solid #005bac; /* 左侧蓝条装饰 */
    padding-left: 1rem;
    margin-bottom: 1.5rem;
    background-color: #f7faff;
    padding: 0.8rem 1rem; /* 带背景的标题栏 */
}
.sec-title { font-size: 1.1rem; font-weight: bold; color: #333; }
.more-link { font-size: 0.8rem; color: #999; }
.more-link:hover { color: #005bac; }

/* 图文卡片 */
.img-text-card { margin-bottom: 1.5rem; }
.card-img { width: 100%; height: 160px; overflow: hidden; margin-bottom: 0.8rem; border-radius: 4px; }
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.img-text-card:hover .card-img img { transform: scale(1.05); }

.t-link { display: block; font-size: 1.05rem; font-weight: bold; color: #333; margin-bottom: 0.5rem; }
.t-link:hover { color: #005bac; }
.t-desc { font-size: 0.9rem; color: #777; line-height: 1.5; }

/* 简单列表 */
.simple-news-list li {
    padding: 0.6rem 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    padding-left: 1rem;
}
.simple-news-list li::before {
    content: '•';
    color: #ccc;
    position: absolute;
    left: 0; top: 0.6rem;
}
.simple-news-list li a { color: #555; font-size: 0.95rem; }
.simple-news-list li a:hover { color: #005bac; }

/* 媒体聚焦列表 */
.media-list li { margin-bottom: 1rem; }
.media-list li a { display: flex; align-items: flex-start; gap: 1rem; }
.media-icon {
    background-color: #f2f2f2;
    color: #666;
    padding: 0.2rem 0.5rem;
    font-size: 0.8rem;
    border-radius: 2px;
    white-space: nowrap;
}
.media-info { flex: 1; border-bottom: 1px solid #f9f9f9; padding-bottom: 0.5rem; }
.m-title { font-size: 0.95rem; color: #333; margin-bottom: 0.3rem; }
.m-date { font-size: 0.8rem; color: #bbb; }
.media-list li a:hover .m-title { color: #005bac; }

/* 通知公告 (带底色区分) */
.notice-col-bg {
    /* 这一栏如果不想要背景，可以去掉这个类里面的background */
}
.notice-list-vertical li { margin-bottom: 1rem; }
.notice-list-vertical li a { display: flex; align-items: center; gap: 1rem; }
.date-box {
    background-color: #f0f6fc;
    color: #005bac;
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    flex-shrink: 0;
}
.d-day { font-size: 1.2rem; font-weight: bold; line-height: 1; }
.d-month { font-size: 0.7rem; }
.n-title { font-size: 0.95rem; color: #444; line-height: 1.4; }
.notice-list-vertical li a:hover .date-box { background-color: #005bac; color: #fff; }
.notice-list-vertical li a:hover .n-title { color: #005bac; }


/* =========================================
   3. 视频/图片新闻
   ========================================= */
.news-visual-section {
    padding: 3rem 0;
    background-color: #333; /* 深色背景强调视觉 */
    color: #fff;
}
.sec-header-center { text-align: center; margin-bottom: 2rem; }
.sec-header-center h2 { font-size: 1.8rem; margin-bottom: 0.2rem; letter-spacing: 2px; }
.sec-header-center p { opacity: 0.5; text-transform: uppercase; letter-spacing: 1px; }

.visual-grid {
    display: flex;
    gap: 1.5rem;
}
.visual-card {
    flex: 1;
    display: block;
    color: #fff;
}
.v-thumb {
    position: relative;
    height: 180px;
    overflow: hidden;
    margin-bottom: 0.8rem;
    border-radius: 4px;
}
.v-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.play-icon {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 40px; height: 40px;
    background: rgba(0,0,0,0.6);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
    opacity: 0.8;
    transition: all 0.3s;
}
.v-title {
    font-size: 0.95rem;
    opacity: 0.9;
    /* 限制2行 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.visual-card:hover .v-thumb img { transform: scale(1.1); }
.visual-card:hover .play-icon { background: #005bac; border-color: #005bac; opacity: 1; }
.visual-card:hover .v-title { color: #3f8fe6; }

/* 响应式 */
@media screen and (max-width: 1024px) {
    .hero-layout { flex-direction: column; height: auto; }
    .hero-slider { height: 300px; }
    .category-grid { flex-wrap: wrap; }
    .news-col { min-width: 45%; }
}
@media screen and (max-width: 768px) {
    .news-col { min-width: 100%; }
    .visual-grid { flex-wrap: wrap; }
    .visual-card { min-width: 45%; }
}