﻿/* ===== 顶部条 ===== */
.top-header {
    background: #fff;
    border-bottom: 1px solid #eee;
    padding: calc(10 * var(--u)) 0;
}

.top-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.site-logo {
    width: auto;
    height: calc(88 * var(--u));
    color: #0d4a7c;
}

.site-logo svg {
    width: 100%;
    height: 100%;
}

.site-name {
    font-size: calc(28 * var(--u));
    font-weight: bold;
    color: #0d4a7c;
    letter-spacing: calc(3 * var(--u));
}

.site-slogan {
    text-align: center;
    height: calc(95 * var(--u));
}

.slogan-main {
    font-family: "STKaiti", "KaiTi", "SimKaiti", cursive;
    font-size: calc(26 * var(--u));
    color: #0d4a7c;
    letter-spacing: calc(2 * var(--u));
    margin-bottom: calc(4 * var(--u));
}

.slogan-sub {
    font-size: calc(13 * var(--u));
    color: #888;
    letter-spacing: calc(1 * var(--u));
}

.top-header-right {
    display: flex;
    align-items: center;
    gap: calc(16 * var(--u));
}

.register-btn {
    background: #00bcd4;
    color: #fff;
    padding: calc(3 * var(--u)) calc(22 * var(--u));
    font-size: calc(20 * var(--u));
    transition: background .2s;
    border-radius: calc(32 * var(--u));
}

.register-btn:hover {
    background: #0097a7;
}

.top-search {
    position: relative;
}

.top-search input {
    width: calc(220 * var(--u));
    height: calc(36 * var(--u));
    border: 1px solid #ddd;
    background: #fafafa;
    padding: 0 calc(38 * var(--u)) 0 calc(16 * var(--u));
    color: #333;
    outline: none;
    font-size: calc(18 * var(--u));
    transition: border-color .2s, background .2s;
    border-radius: calc(17 * var(--u));
}

.top-search input::placeholder {
    color: #aaa;
}

.top-search input:focus {
    border-color: #00bcd4;
    background: #fff;
}

.top-search-btn {
    position: absolute;
    right: calc(12 * var(--u));
    top: 50%;
    transform: translateY(-50%);
    color: #aaa;
    cursor: pointer;
    font-size: calc(14 * var(--u));
    height: calc(25 * var(--u));
}

.tip-swiper {
    width: calc(664 * var(--u));
    height: calc(54 * var(--u));
}

.w-700 {
    width: calc(700 * var(--u));
    margin: calc(5 * var(--u)) 0;
}

.w-367 {
    width: calc(367 * var(--u));
}

.tip-swiper .swiper-wrapper {
    align-items: center;
}

.tip-swiper .swiper-slide {
    text-align: center;
}

.tip-swiper .swiper-slide img {
    max-width: calc(664 * var(--u));
    height: calc(54 * var(--u));
    object-fit: scale-down;
    display: block;
    margin: 0 auto;
}

.tip-swiper .swiper-slide img.img_txt_1 {
    height: calc(24 * var(--u));
    margin: 15px 0;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ===== 主导航 ===== */
.header {
    background: #19376E;
    color: #fff;
    position: relative;
    z-index: 100;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}

.header .container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(76 * var(--u));
    overflow: visible;
    position: static;
}

.nav-list {
    display: flex;
    gap: calc(44 * var(--u));
    font-size: calc(16 * var(--u));
}

.nav-item>a {
    display: block;
    font-size: calc(26 * var(--u));
    color: #FFFFFF;
    line-height: calc(31 * var(--u));
    position: relative;
    padding: calc(26 * var(--u)) 0;
    white-space: nowrap;
}

.nav-item:hover>a,
.nav-item.active>a {
    opacity: 1;
    color: #08C4DF;
}


/* 二级导航（全屏宽度居中，不浮动） */
.sub-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    justify-content: center;
    gap: calc(8 * var(--u));
    flex-wrap: wrap;
    background-color: rgba(8, 196, 223, 0.7);
    z-index: 99;
    width: 100%;
    display: none;
}

.nav-item:hover .sub-nav,
.nav-item.active:hover .sub-nav {
    display: flex !important;
}

.sub-nav a {
    display: block;
    padding: calc(8 * var(--u)) calc(22 * var(--u));
    font-size: calc(26 * var(--u));
    color: #FFFFFF;
    opacity: .95;
}

.sub-nav a:hover {
    background: rgba(255, 255, 255, .2);
}

.sub-nav a.active {
    background: rgba(255, 255, 255, .25);
    font-weight: 600;
}

/* ===== 顶部 Banner 轮播 ===== */
.banner-swiper {
    height: calc(670 * var(--u));
    position: relative;
}

.banner-swiper .swiper-slide {
    position: relative;
    height: calc(670 * var(--u));
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner-swiper .swiper-slide .slide-link-a {
    display: flex;
    width: 100%;
    height: 100%;
}

.banner-slide-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.05);
    transition: transform 6s ease;
}

.swiper-slide-active .banner-slide-bg {
    transform: scale(1);
}

.banner-slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 40, 70, .25) 0%, rgba(5, 20, 40, .65) 100%);
}

.banner-content {
    position: absolute;
    z-index: 2;
    text-align: left;
    color: #fff;
    bottom: 0;
    width: calc(1567 * var(--u));
    margin: 0 auto;
}

.banner-title {
    letter-spacing: calc(4 * var(--u));
    text-shadow: 0 2px 12px rgba(0, 0, 0, .35);
    animation: fadeUp .8s ease both;
    font-size: calc(32 * var(--u));
    color: #FFFFFF;
    line-height: calc(59 * var(--u));
}

.banner-sub {
    font-size: calc(19 * var(--u));
    opacity: .92;
    letter-spacing: calc(2 * var(--u));
    text-shadow: 0 1px 6px rgba(0, 0, 0, .3);
    animation: fadeUp 1s ease .15s both;
}

.banner-swiper .swiper-pagination {
    bottom: calc(15 * var(--u));
    padding-right: calc(178 * var(--u));
    text-align: right;
}

.banner-btm-bg {
    position: absolute;
    bottom: 0;
    height: calc(59 * var(--u));
    height: calc(59 * var(--u));
    width: 100%;
    background: #FFFFFF;
    opacity: 0.22;
    z-index: 2;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(24px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.banner-swiper .swiper-button-next,
.banner-swiper .swiper-button-prev {
    color: #fff;
    opacity: .7;
    transition: opacity .2s;
}

.banner-swiper .swiper-button-next:hover,
.banner-swiper .swiper-button-prev:hover {
    opacity: 1;
}

.banner-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: .5;
    width: calc(15 * var(--u));
    height: calc(15 * var(--u));
    margin: 0 calc(8 * var(--u));
}

.banner-swiper .swiper-pagination-bullet-active {
    opacity: 1;

    background: #08C4DF;
}

/* ===== 公告条 ===== */
.notice {
    background: #0e5aa7;
    color: #fff;
    height: calc(46 * var(--u));
    line-height: calc(46 * var(--u));
    margin-top: 0;
}

.notice .container {
    display: flex;
    align-items: center;
}

.notice-label {
    background: #fff;
    color: #0e5aa7;
    padding: 0 calc(16 * var(--u));
    height: calc(28 * var(--u));
    line-height: calc(28 * var(--u));
    font-weight: bold;
    font-size: calc(14 * var(--u));
    margin-right: calc(22 * var(--u));
    white-space: nowrap;
}

.notice-text {
    flex: 1;
    font-size: calc(14 * var(--u));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.notice-text:hover {
    text-decoration: underline;
}

.notice-more {
    font-size: calc(13 * var(--u));
    opacity: .9;
    white-space: nowrap;
}

.notice-more:hover {
    opacity: 1;
}

/* ===== 通用区块 ===== */
.section {
    padding: calc(46 * var(--u)) 0;
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    border: 1px solid #e3f2fd;
    padding: calc(12 * var(--u)) calc(20 * var(--u));
    margin-bottom: calc(40 * var(--u));
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
    border-left: 7px solid #08C4DF;
}

.section-title {
    font-size: 22px;
    font-weight: bold;
    color: #0d4a7c;
    display: flex;
    align-items: center;
    gap: calc(10 * var(--u));
    font-weight: 600;
    font-size: calc(42 * var(--u));
    color: #19376E;
}

.title-icon {
    width: calc(37 * var(--u));
    height: calc(23 * var(--u));
    position: relative;
    flex-shrink: 0;
}

.title-icon::before,
.title-icon::after {
    content: '';
    position: absolute;
    left: 0;
    height: calc(4 * var(--u));
}

.title-icon::before {
    top: calc(2 * var(--u));
    width: calc(19 * var(--u));
    background: #02BC9D;
}

.title-icon::after {
    bottom: 0px;
    width: calc(34 * var(--u));
    background: #19376E;
}



.more-link {
    background: #00bcd4;
    color: #fff;
    font-size: 13px;
    padding: calc(8 * var(--u)) calc(26 * var(--u));
    display: flex;
    align-items: center;
    gap: calc(6 * var(--u));
    transition: background .2s;
    font-weight: 400;
    font-size: calc(24 * var(--u));
    color: #FFFFFF;
    line-height: calc(33 * var(--u));
}

.more-link::after {
    content: '>';
    font-size: calc(12 * var(--u));
}

.more-link:hover {
    background: #0097a7;
    color: #fff;
}

.bg-linear {
    background: linear-gradient(to bottom, rgba(8, 196, 223, 0.14), rgba(240, 240, 240, 1));
}

/* ===== 时政要闻 ===== */
.news-grid {
    display: grid;
    grid-template-columns: calc(827 * var(--u)) auto;
    gap: calc(30 * var(--u));
}

.news-main {
    position: relative;
    background: #F0F0F0;
    padding: calc(24 * var(--u)) calc(27 * var(--u));
}

.news-main img {
    width: calc(800 * var(--u));
    height: calc(434 * var(--u));
    object-fit: scale-down;
}



/* ===== 时政要闻 大图轮播 ===== */
.news-main-swiper {
    position: relative;
    overflow: hidden;
    /* 抵消 .news-main 右侧内边距，保证 800u 宽的大图不被裁剪 */
    margin-right: calc(-27 * var(--u));
}

.news-main-swiper .swiper-slide {
    width: 100%;
}

.news-main-swiper .news-main-link {
    display: block;
}

/* 标题固定两行，避免轮播切换时高度抖动 */
.news-main-swiper .news-main-text h3 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(72 * var(--u));
}

/* 分页器：置于底部左侧（覆盖 swiper 默认绝对定位） */
.news-main-swiper .swiper-pagination {
    position: absolute;
    display: flex;
    align-items: center;
    gap: calc(10 * var(--u));
    width: auto;
    justify-content: end;
    right: calc(26 * var(--u));
    bottom: calc(114 * var(--u));
}

.news-main-swiper .swiper-pagination-bullet {
    width: calc(10 * var(--u));
    height: calc(10 * var(--u));
    margin: 0;
    background: #fff;
    opacity: 1;
    border-radius: 50%;
    transition: all .3s ease;
}

.news-main-swiper .swiper-pagination-bullet-active {
    width: calc(28 * var(--u));
    border-radius: calc(5 * var(--u));
    background: #C62828;
}

/* 左右箭头 */
.news-main-swiper .swiper-button-prev,
.news-main-swiper .swiper-button-next {
    --swiper-navigation-size: calc(28 * var(--u));
    width: calc(44 * var(--u));
    height: calc(44 * var(--u));
    margin-top: calc(-90 * var(--u));
    color: #FFFFFF;
    background: rgba(0, 0, 0, .35);
    border-radius: 50%;
    transition: background .3s ease;
}

.news-main-swiper .swiper-button-prev:hover,
.news-main-swiper .swiper-button-next:hover {
    background: rgba(0, 0, 0, .6);
}

.news-main-swiper .swiper-button-prev::after,
.news-main-swiper .swiper-button-next::after {
    font-size: calc(20 * var(--u));
    font-weight: bold;
}

.news-main-text {
    bottom: 0;
    left: 0;
    right: 0;
    font-size: calc(30 * var(--u));
    color: #000000;
    line-height: calc(36 * var(--u));
    padding-top: calc(26 * var(--u));
}

.news-main-text h3 {
    font-size: calc(30 * var(--u));
}

.news-main-text p {
    font-size: calc(13 * var(--u));
    opacity: .85;
    line-height: 1.6;
}

.news-list {
    display: flex;
    flex-direction: column;
    gap: calc(16 * var(--u));
    background: #FFFFFF;
    padding: calc(16 * var(--u)) 0 calc(16 * var(--u)) calc(27 * var(--u));
}

.news-item {
    display: flex;
    gap: calc(14 * var(--u));
    padding-bottom: calc(16 * var(--u));
    border-bottom: 1px solid #979797;
}

.news-item:last-child {
    border-bottom: none;
}

.news-date {
    background: #f0f6fc;
    color: #0e5aa7;
    padding: calc(8 * var(--u)) calc(12 * var(--u));
    text-align: center;
    min-width: calc(58 * var(--u));
    flex-shrink: 0;
}

.news-date .day {
    font-size: calc(20 * var(--u));
    font-weight: bold;
    line-height: 1;
}

.news-date .month {
    font-size: calc(12 * var(--u));
}

.news-content h4 {
    font-size: 15px;
    color: #222;
    margin-bottom: calc(6 * var(--u));
    line-height: 1.45;
    font-size: calc(24 * var(--u));
    color: #08C4DF;
    line-height: calc(29 * var(--u));
}

.news-content h4:hover {
    color: #0e5aa7;
    cursor: pointer;
}

.news-content p {
    font-size: 13px;
    color: #888;
    line-height: 1.5;
    font-size: calc(30 * var(--u));
    color: #000000;
    line-height: calc(42 * var(--u));
}

/* ===== 研究园地 ===== */

.study-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(28 * var(--u));
}

.study-card {
    overflow: hidden;
    background: #F0F0F0;
    padding: calc(14 * var(--u));
}


.study-card-img {
    height: calc(230 * var(--u));
    overflow: hidden;
}

.study-card-img img,
.study-card-img svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.study-card-body {
    padding: calc(16 * var(--u)) calc(13 * var(--u)) calc(8 * var(--u));
}

.study-tag {
    display: inline-block;
    color: #00bcd4;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: calc(10 * var(--u));
    font-size: calc(24 * var(--u));
    color: #08C4DF;
}

.study-card-body h4 {
    font-size: 17px;
    color: #222;
    line-height: 1.55;
    font-weight: 500;
    font-size: calc(30 * var(--u));
    color: #000000;
}

/* ===== 反邪专题（Swiper Coverflow 轮播） ===== */
.anti-terror {
    background: rgba(25, 55, 110, 1);
    color: #fff;
    padding: calc(50 * var(--u)) 0 calc(60 * var(--u));
}


.anti-swiper {
    padding: calc(30 * var(--u)) 0 calc(100 * var(--u));
    overflow: hidden;
}

.star-top {
    position: absolute;
    width: calc(81 * var(--u));
    height: calc(96 * var(--u));
    top: calc(120 * var(--u));
}

.star-left-btm {
    position: absolute;
    width: calc(81 * var(--u));
    height: calc(96 * var(--u));
    right: 0;
    bottom: 0;
}

.anti-swiper {
    width: calc(1567 * var(--u));
}

.anti-swiper .swiper-wrapper {
    align-items: center;
}

.anti-swiper .swiper-slide {
    width: calc(900 * var(--u));
    height: calc(600 * var(--u));
    overflow: hidden;
}

.anti-swiper .swiper-slide img {
    width: 100%;
    height: 100%;
}



.anti-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #fff;
}

.anti-tv-icon {
    width: calc(76 * var(--u));
    height: calc(66 * var(--u));
    margin: 0 auto calc(14 * var(--u));
    color: #4fc3f7;
}

.anti-tv-icon svg {
    width: 100%;
    height: 100%;
}

.anti-hero-year {
    font-size: calc(34 * var(--u));
    font-weight: bold;
    letter-spacing: calc(2 * var(--u));
    text-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}

.anti-hero-title {
    font-size: calc(28 * var(--u));
    font-weight: bold;
    margin: calc(2 * var(--u)) 0;
    letter-spacing: calc(5 * var(--u));
}

.anti-hero-sub {
    font-size: calc(15 * var(--u));
    letter-spacing: calc(6 * var(--u));
    opacity: .95;
}

/* 六边形装饰图片 */
.anti-hex {
    position: absolute;
    z-index: 3;
    width: calc(74 * var(--u));
    height: calc(86 * var(--u));
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .25);
    border: 2px solid rgba(255, 255, 255, .5);
}

.anti-hex img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.anti-hex-1 {
    left: 8%;
    top: 10%;
}

.anti-hex-2 {
    left: 3%;
    top: 44%;
}

.anti-hex-3 {
    left: 16%;
    top: 64%;
}

.anti-hex-4 {
    right: 8%;
    top: 10%;
}

.anti-hex-5 {
    right: 3%;
    top: 44%;
}

.anti-hex-6 {
    right: 16%;
    top: 64%;
}

/* 两侧卡片 */
.anti-side-card {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    padding: calc(20 * var(--u));
}

.anti-side-num {
    font-size: calc(52 * var(--u));
    font-weight: bold;
    opacity: .9;
    line-height: 1;
}

.anti-side-en {
    font-size: calc(22 * var(--u));
    font-weight: bold;
    letter-spacing: calc(3 * var(--u));
    opacity: .9;
    margin-bottom: calc(8 * var(--u));
}

.anti-side-icon {
    font-size: calc(40 * var(--u));
    margin-bottom: calc(8 * var(--u));
}

.anti-side-text {
    font-size: calc(19 * var(--u));
    font-weight: bold;
    line-height: 1.5;
    letter-spacing: calc(2 * var(--u));
}

/* 分页点：长条 */
.anti-swiper .swiper-pagination {
    position: absolute;
    bottom: 0;
    text-align: center;
    left: 50% !important;
    transform: translateX(-50%);
    width: auto !important;
}

.anti-swiper .swiper-pagination-bullet {
    width: 32px;
    height: 5px;
    background: #fff;
    opacity: 1;
    transition: background .2s;
    width: calc(64 * var(--u));
    height: calc(8 * var(--u));
    border-radius: 0;
    margin: 0 calc(10 * var(--u));
}

.anti-swiper .swiper-pagination-bullet-active {
    background: rgba(8, 196, 223, 1);
}

/* 资料库下方文章列表 */
.expert-articles {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 calc(80 * var(--u));
    padding: calc(10 * var(--u)) calc(50 * var(--u)) calc(20 * var(--u));
}

.article-item {
    display: flex;
    align-items: center;
    gap: calc(10 * var(--u));
    padding: calc(30 * var(--u)) 0px calc(20 * var(--u));
    border-bottom: 1px solid rgba(151, 151, 151, 1);
    font-size: 15px;
    color: #333;
    transition: color .2s;
    font-size: calc(24 * var(--u));
    color: #000000;
    line-height: calc(29 * var(--u));
    margin: 0 calc(29 * var(--u));
}


.article-item:hover {
    color: #00bcd4;
}

.article-item i {
    width: calc(7 * var(--u));
    height: calc(7 * var(--u));
    flex-shrink: 0;
    background: #00bcd4;
    transform: rotate(45deg);
}

.article-item span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== 工作动态 ===== */
.work-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(30 * var(--u));
    align-items: stretch;
}

.work-list {
    display: flex;
    flex-direction: column;
    gap: calc(36 * var(--u));
}

.work-item {
    display: flex;
    align-items: center;
    gap: calc(18 * var(--u));
    background: #fff;
    padding: calc(33 * var(--u)) calc(20 * var(--u)) calc(18 * var(--u)) 0;
    min-height: calc(88 * var(--u));
    border: 1px solid #CACACA;
}




.work-tag {
    height: calc(59 * var(--u));
    background: url(../images/1.png) -1px -1px no-repeat;
    background-size: calc(140 * var(--u)) calc(60 * var(--u));
    width: calc(139 * var(--u));
}

.tag-name {
    width: calc(96 * var(--u));
    height: calc(33 * var(--u));
    overflow-wrap: break-word;
    color: rgba(255, 255, 255, 1);
    font-size: calc(24 * var(--u));
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    line-height: calc(33 * var(--u));
    margin: calc(14 * var(--u)) 0 0 calc(21 * var(--u));
    display: inline-block;
    font-weight: 600;
    font-size: calc(24 * var(--u));
    color: #FFFFFF;
    line-height: calc(33 * var(--u));
}

.work-item:hover {
    background: #00bcd4;

}

.work-content {
    flex: 1;
    padding-left: calc(20 * var(--u));
}


.work-content h4 {
    font-size: 16px;
    color: #222;
    line-height: 1.55;
    font-weight: 500;
    font-weight: 400;
    font-size: calc(30 * var(--u));
    color: #000000;
    line-height: calc(42 * var(--u));
}

.work-item:hover .work-content h4 {
    color: #fff;
}

.work-img {
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .1);
    height: 100%;
}

.work-img img {
    width: 100%;
    height: calc(484 * var(--u));
    min-height: calc(280 * var(--u));
    object-fit: cover;
    transition: transform .4s;
}

.work-img:hover img {
    transform: scale(1.05);
}

/* ===== 全国科普月横幅 ===== */
.science-banner {

    margin: calc(60 * var(--u)) 0 calc(86 * var(--u));
}


.science-banner img {
    width: 100%;

}



/* ===== 科普博览 ===== */
.gallery-grid {
    display: grid;
    grid-template-columns: 1.5fr .8fr .8fr;
    gap: calc(16 * var(--u));
}

.gallery-item {
    overflow: hidden;
    position: relative;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .08);
}

.gallery-item img {
    width: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.gallery-item:hover img {
    transform: scale(1.08);
}

.gallery-item.large {
    grid-row: span 2;
}

.mark-box {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(25, 55, 110, .7);
}

.gallery-overlay {
    margin: calc(18 * var(--u));
    font-size: calc(34 * var(--u));
    color: #FFFFFF;
    line-height: calc(41 * var(--u));
    max-height: calc(82 * var(--u));
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;

}

.gallery-overlay.dark {
    background: rgba(25, 55, 110, 0.8);
    inset: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.gallery-overlay.dark h4 {
    font-size: 18px;
    font-size: calc(34 * var(--u));
    color: #FFFFFF;
    line-height: calc(41 * var(--u));
}

.gallery-overlay.dark h4.text-left {
    text-align: left;
}

.gallery-overlay.dark p {
    font-size: 13px;
    opacity: .85;
    margin-top: calc(10 * var(--u));
    font-size: calc(18 * var(--u));
    color: #FFFFFF;
    line-height: calc(22 * var(--u));
    text-align: left;
    padding: calc(20 * var(--u));
}

/* ===== 工作动态~资料库 整体渐变背景 ===== */
.gradient-band {
    background: linear-gradient(180deg,
            #08C4DF 0px,
            #08C4DF 200px,
            #08C4DF 200px,
            #08C4DF 400px,
            #fff 100%);
    background: linear-gradient(to bottom, rgba(8, 196, 223, 0.14), rgba(240, 240, 240, 1));
}

/* ===== 资料库（Swiper 轮播） ===== */
.experts-section {
    background: transparent;
}

.experts-swiper {
    padding: calc(10 * var(--u)) calc(50 * var(--u)) calc(20 * var(--u));
    position: relative;
}

.experts-swiper .swiper-slide {
    height: auto;
}

.expert-card {
    text-align: center;
    padding: calc(15 * var(--u)) calc(31 * var(--u));
    height: 100%;
    text-align: justify;
}

.expert-avatar {
    width: calc(238 * var(--u));
    height: calc(238 * var(--u));
    margin: 0 auto calc(40 * var(--u));
    object-fit: cover;
    border: 2px solid #e1e4e8;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
    border-radius: 50%;
}

.expert-name {
    font-size: 18px;
    font-weight: 500;
    color: #222;
    margin-bottom: calc(10 * var(--u));
    font-size: calc(30 * var(--u));
    color: #000000;
    line-height: calc(36 * var(--u));
}

.expert-desc {
    font-size: 13px;
    color: #888;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: calc(24 * var(--u));
    color: #B1B1B1;
}

.experts-swiper .swiper-button-next,
.experts-swiper .swiper-button-prev {
    color: #00bcd4;
    width: calc(44 * var(--u));
    height: calc(44 * var(--u));
    margin-top: calc(-22 * var(--u));
    background: transparent;
    transition: color .2s;
}

.experts-swiper .swiper-button-next {
    right: 0;
}

.experts-swiper .swiper-button-prev {
    left: 0;
}

.experts-swiper .swiper-button-next::after,
.experts-swiper .swiper-button-prev::after {
    font-size: calc(44 * var(--u));
    font-weight: 300;
}

.experts-swiper .swiper-button-next:hover,
.experts-swiper .swiper-button-prev:hover {
    color: #0097a7;
}


/* 注：页脚（footer.html）样式已抽离到 assets/css/footer.css */


/* ===== 响应式 ===== */
/* 992~1200px：仅放开 1200px 最小宽度与容器固定宽，避免横向滚动（布局仍走桌面） */
@media (max-width: 1200px) {
    body {
        min-width: 0;
    }

    .container {
        width: 100%;
        min-width: 0;
        padding-left: calc(24 * var(--u));
        padding-right: calc(24 * var(--u));
    }

    /* 几处写死的大宽度元素，在窄屏改为铺满，避免溢出 */
    .banner-content {
        width: 100%;
    }

    .anti-swiper {
        width: 100%;
    }

    .news-main img {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 992px) {
    .nav {
        gap: 18px;
        font-size: 15px;
    }

    .news-grid,
    .work-grid {
        grid-template-columns: 1fr;
    }

    .study-cards {
        grid-template-columns: 1fr;
    }

    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }

    .gallery-item.large {
        grid-row: auto;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .header .container {
        flex-wrap: wrap;
        height: auto;
        padding: 12px 0;
    }

    .header-right {
        width: 100%;
        justify-content: flex-end;
    }
}



.border-radius-30 {
    border-radius: 30px;
}

/* ===== 分类列表页 ===== */
.page-content {
    padding: calc(24 * var(--u)) 0 calc(60 * var(--u));
    background: #fff;
}

.breadcrumb {
    display: flex;
    align-items: center;
    gap: calc(10 * var(--u));
    padding: calc(18 * var(--u)) 0;
    font-size: calc(30 * var(--u));
    color: #333;
}

.breadcrumb-icon {
    width: auto;
    height: calc(32 * var(--u));
    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    flex-shrink: 0;
}

.breadcrumb-icon::before,
.breadcrumb-icon::after {
    content: '';
    display: block;
    height: calc(2 * var(--u));
    background: #08C4DF;
    border-radius: 1px;
}

.breadcrumb-icon::before {
    width: 100%;
    box-shadow: 0 calc(7 * var(--u)) 0 0 #08C4DF;
}

.breadcrumb-icon::after {
    width: 75%;
}

.breadcrumb a {
    color: #333;
}

.breadcrumb a:hover {
    color: #08C4DF;
}

.breadcrumb .current {
    color: #333;
}

/* 两栏布局 */
.content-layout {
    display: flex;
    gap: calc(34 * var(--u));
    align-items: flex-start;
}

.main-list {
    flex: 1;
    min-width: 0;
}

.right-sidebar {
    width: calc(560 * var(--u));
    flex-shrink: 0;
}



/* 左侧文章列表 */
.article-list {
    background: #fff;
    padding: calc(8 * var(--u)) calc(28 * var(--u));
}

/* 覆盖首页的 .article-item，列表页用此样式 */
.main-list .article-item {
    display: flex;
    gap: calc(22 * var(--u));
    padding: calc(35 * var(--u)) 0;
    border-bottom: 1px solid #979797;
    transition: background .2s;
    margin: 0;
}

.main-list .article-item:hover .article-title {
    color: #08C4DF;
}

.main-list .article-thumb {
    width: calc(264 * var(--u));
    height: calc(158 * var(--u));
    flex-shrink: 0;
    overflow: hidden;
}

.main-list .article-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.main-list .article-item:hover .article-thumb img {
    transform: scale(1.05);
}

.main-list .article-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    padding: calc(6 * var(--u)) 0 calc(4 * var(--u));
    height: calc(158 * var(--u));
}

.main-list .article-title {
    font-size: calc(24 * var(--u));
    color: #000;
    line-height: 1.55;
    font-weight: 400;
    transition: color .2s;
}

.main-list .article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: calc(22 * var(--u));
    color: #000;
}

/* 分页 */
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(10 * var(--u));
    padding: calc(105 * var(--u)) 0 calc(20 * var(--u));
    font-size: calc(16 * var(--u));
}

.page-btn {
    min-width: calc(48 * var(--u));
    height: calc(48 * var(--u));
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E8E8E8;
    color: #333;
    border-radius: calc(4 * var(--u));
    transition: background .2s, color .2s;
    padding: calc(4 * var(--u)) calc(6 * var(--u));
}

.page-btn.active {
    background: #19376E;
    color: #fff;
}

.page-btn:hover:not(.active) {
    background: #D0D0D0;
}

.page-info {
    color: #666;
    font-size: calc(18 * var(--u));
}

/* 右侧边栏 */
.side-section {
    background: #fff;
    padding: calc(24 * var(--u)) calc(22 * var(--u));
    margin-bottom: calc(24 * var(--u));
}

.side-section:last-child {
    margin-bottom: 0;
}

.side-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: calc(20 * var(--u));
    border-left: calc(5 * var(--u)) solid #08C4DF;
    padding-left: calc(14 * var(--u));
    height: calc(28 * var(--u));
}

.side-title {
    font-size: calc(34 * var(--u));
    color: #19376E;
    font-weight: 600;
    line-height: 1;
}

.side-more {
    font-size: calc(24 * var(--u));
    color: #979797;
    transition: color .2s;
}

.side-more:hover {
    color: #08C4DF;
}

/* 以案说法网格 */
.case-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(18 * var(--u)) calc(14 * var(--u));
}

.case-item {
    display: block;
    border-bottom: 1px solid #979797;
    padding: calc(24 * var(--u)) 0;
}

.case-item:hover .case-title {
    color: #08C4DF;
}

.case-img {
    width: 100%;
    height: calc(156 * var(--u));
    overflow: hidden;
    border-radius: calc(4 * var(--u));
    margin-bottom: calc(20 * var(--u));
}

.case-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.case-item:hover .case-img img {
    transform: scale(1.05);
}

.case-title {
    font-size: calc(24 * var(--u));
    color: #333;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .2s;
}

/* 时政要闻列表 */
.policy-list {
    display: flex;
    flex-direction: column;
    gap: calc(20 * var(--u));
}

.policy-item {
    display: flex;
    align-items: flex-start;
    gap: calc(14 * var(--u));
    font-size: calc(24 * var(--u));
    color: #333;
    line-height: 1.5;
    cursor: pointer;
    transition: color .2s;
    border-bottom: 1px solid #979797;
    padding: calc(30 * var(--u)) 0;
}

.policy-item:hover {
    color: #08C4DF;
}

.policy-icon {
    width: calc(20 * var(--u));
    height: calc(20 * var(--u));
    border-radius: 50%;
    background: #08C4DF;
    flex-shrink: 0;
    margin-top: calc(4 * var(--u));
    position: relative;
}

.policy-icon::after {
    content: '';
    position: absolute;
    width: calc(7 * var(--u));
    height: calc(7 * var(--u));
    background: #fff;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.policy-text {
    flex: 1;
}

@media (max-width: 1240px) {
    .content-layout {
        flex-direction: column;
    }

    .right-sidebar {
        width: 100%;
    }
}

/* ===== 文章详情页 ===== */
.article-detail {
    background: #fff;
    padding: calc(40 * var(--u)) calc(60 * var(--u)) calc(70 * var(--u));
}

.article-detail .article-title {
    text-align: center;
    font-size: calc(50 * var(--u));
    color: #19376E;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: calc(50 * var(--u));
}

.article-detail .article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(16 * var(--u));
    padding-bottom: calc(24 * var(--u));
    border-bottom: 1px solid #eeeeee;
    margin-bottom: calc(40 * var(--u));
    font-size: calc(24 * var(--u));
    color: #000;
}

.article-detail .article-meta-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(10 * var(--u)) calc(40 * var(--u));
}

.article-detail .article-meta-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(16 * var(--u));
}

.font-size-control {
    display: flex;
    align-items: center;
    gap: calc(8 * var(--u));
}

.font-size-control .fs-btn {
    cursor: pointer;
    color: #333333;
    transition: color 0.2s;
    background: #E4E4E4;
    border-radius: 50%;
    width: calc(32 * var(--u));
    height: calc(32 * var(--u));
    text-align: center;
    line-height: calc(32 * var(--u));
}

.font-size-control .fs-btn:hover,
.font-size-control .fs-btn.active {
    background: #19376E;
    color: #fff;
}

.article-detail .article-content {
    font-size: var(--article-font-size, calc(24 * var(--u)));
    color: #000000;
    line-height: 1.8;
    text-align: justify;
}

.article-detail .article-content p {
    text-indent: 2em;
    margin-bottom: calc(24 * var(--u));
}

.article-detail .article-image {
    text-align: center;
    margin-bottom: calc(48 * var(--u));
}

.article-detail .article-image img {
    width: calc(1180 * var(--u));
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.article-detail .article-editor {
    text-align: right;
    font-size: calc(22 * var(--u));
    color: #666666;
    margin: calc(48 * var(--u)) 0;
}

.article-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(40 * var(--u));
    border-top: 1px solid #979797;
    padding-top: calc(100 * var(--u));
}

.btn-article {
    border: 0;
    color: #000;
    font-size: calc(18 * var(--u));
    padding: calc(10 * var(--u)) calc(40 * var(--u));
    cursor: pointer;
    transition: all 0.2s;
    background: #F0F0F0;
}

.btn-article:hover {
    background: #08C4DF;
    color: #ffffff;
}

.social-share .icon-wechat .wechat-qrcode {
    top: 34px;
    box-shadow: 0 -2px 10px #aaa;
}

.social-share .icon-wechat .wechat-qrcode:after {
    bottom: 191px;
    border-color: transparent transparent #fff transparent;
}



.social-share .icon-wechat .wechat-qrcode {
    top: 34px;
    box-shadow: 0 -2px 10px #aaa;
}

.social-share .icon-wechat .wechat-qrcode:after {
    bottom: 191px;
    border-color: transparent transparent #fff transparent;
}

/* ===== 专家聚合页（头像墙，复用首页 expert-card 样式） ===== */
.expert-wall {
    background: #fff;
    padding: calc(40 * var(--u)) calc(30 * var(--u)) calc(60 * var(--u));
}

.expert-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: calc(30 * var(--u)) calc(24 * var(--u));
}

/* grid 中的 expert-card 去掉 swiper-slide 的默认样式 */
.expert-grid .expert-card {
    display: block !important;
    width: auto !important;
    flex-shrink: unset !important;
    border: 1px solid #eee;
    border-radius: calc(8 * var(--u));
    transition: box-shadow 0.2s, transform 0.2s;
    margin-right: 0 !important;
}

.expert-grid .expert-card:hover {
    box-shadow: 0 calc(4 * var(--u)) calc(20 * var(--u)) rgba(0, 0, 0, 0.08);
    transform: translateY(calc(-4 * var(--u)));
}

/* ===== 专家详情页（头像 + 简介 + 文章列表） ===== */
.expert-profile {
    display: flex;
    gap: calc(30 * var(--u));
    background: #fff;
    padding: calc(40 * var(--u)) calc(60 * var(--u)) calc(30 * var(--u));
    align-items: flex-start;
}

.expert-profile-avatar {
    width: calc(180 * var(--u));
    height: calc(180 * var(--u));
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.expert-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.expert-profile-info {
    flex: 1;
    min-width: 0;
}

.expert-profile-name {
    font-size: calc(44 * var(--u));
    color: #19376E;
    font-weight: 600;
    margin-bottom: calc(20 * var(--u));
}

.expert-profile-bio {
    font-size: calc(24 * var(--u));
    color: #333;
    line-height: 1.8;
    text-align: justify;
}

/* 文章摘要（专家详情页专用） */
.article-excerpt {
    font-size: calc(22 * var(--u));
    color: #666;
    line-height: 1.6;
    margin: calc(10 * var(--u)) 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 1240px) {
    .expert-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .expert-profile {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

/* ===== 表单页 ===== */
.form-page-wrap {
    border-radius: 16px;
    padding: 40px 24px 56px;
}

.form-page {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(25, 55, 110, 0.08);
    padding: 48px 56px 64px;
    max-width: 720px;
    margin: 0 auto;
}

.form-page-header {
    text-align: center;
    margin-bottom: 40px;
}

.form-page-title {
    font-size: 32px;
    color: #19376E;
    font-weight: 700;
    letter-spacing: 1px;
    position: relative;
    padding-bottom: 16px;
}

.form-page-title::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 48px;
    height: 3px;
    background: #08C4DF;
    border-radius: 2px;
}

/* 表单字段 */
.wenjuan-form .wenjuan-field {
    margin-bottom: 28px;
}

.wenjuan-form .wenjuan-field label {
    display: block;
    font-size: 15px;
    color: #333;
    font-weight: 600;
    margin-bottom: 10px;
}

.wenjuan-form .wenjuan-field label .required {
    color: #e53e3e;
    margin-left: 4px;
    font-weight: 700;
}

.wenjuan-form .wenjuan-field input[type="text"],
.wenjuan-form .wenjuan-field input[type="date"],
.wenjuan-form .wenjuan-field textarea {
    width: 100%;
    padding: 14px 16px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 16px;
    color: #1a202c;
    background: #fafbfc;
    box-sizing: border-box;
    transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
}

.wenjuan-form .wenjuan-field input:hover,
.wenjuan-form .wenjuan-field textarea:hover {
    border-color: #cbd5e0;
}

.wenjuan-form .wenjuan-field input:focus,
.wenjuan-form .wenjuan-field textarea:focus {
    border-color: #08C4DF;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(8, 196, 223, 0.12);
    outline: none;
}

.wenjuan-form .wenjuan-field textarea {
    min-height: 140px;
    resize: vertical;
    line-height: 1.7;
}

.wenjuan-form .wenjuan-field .option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: 28px;
    margin-bottom: 8px;
    font-size: 16px;
    color: #333;
    cursor: pointer;
}

.wenjuan-form .wenjuan-field .option input {
    width: auto;
    width: 18px;
    height: 18px;
    accent-color: #08C4DF;
    cursor: pointer;
}

.wenjuan-form button[type="submit"] {
    display: block;
    width: 100%;
    padding: 16px;
    background: linear-gradient(135deg, #19376E 0%, #0a2a5e 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 2px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

.wenjuan-form button[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(25, 55, 110, 0.25);
}

.wenjuan-form button[type="submit"]:active {
    transform: translateY(0);
    box-shadow: 0 4px 12px rgba(25, 55, 110, 0.2);
}



/* ============================================================
   专题页（templates/page_topic.html）
   全部尺寸按 1920 设计稿走 calc(N * var(--u))，与站点其余页面缩放一致
   ============================================================ */
.topic-page {
    background: #fff;
    /* 设计稿正文一律 Helvetica（中文由 PingFang SC 回退），仅作用于专题页 */
    font-family: Helvetica, "PingFang SC", "Helvetica Neue", Arial, sans-serif;
}

/* 说明：站点全局有 img { height: 100% }，本页所有图片的父容器都设了明确高度，
   因此保持不变即可；个别需要固定高度的图片（如主标题图）用类选择器覆盖。 */

/* ---------- Hero ---------- */
.topic-hero {
    position: relative;
    width: 100%;
    height: calc(1075 * var(--u));
    overflow: hidden;
}

.topic-hero-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.topic-hero-logo {
    position: absolute;
    left: calc(172 * var(--u));
    top: calc(97 * var(--u));
    width: calc(133 * var(--u));
    height: calc(136 * var(--u));
    z-index: 2;
    display: block;
}

.topic-hero-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.topic-hero-content {
    position: relative;
    z-index: 1;
    width: 100%;
    padding-top: calc(291 * var(--u));
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.topic-hero-label {
    font-size: calc(67 * var(--u));
    line-height: calc(78 * var(--u));
    font-weight: 400;
    color: #00FFFF;
    letter-spacing: calc(2 * var(--u));
    font-family: "FZLTCHK--GBK1-0", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.topic-hero-title-img {
    margin-top: calc(9 * var(--u));
    width: calc(1062 * var(--u));
    height: calc(417 * var(--u));
    object-fit: contain;
}

.topic-hero-subtitle {
    margin-top: calc(29 * var(--u));
    font-size: calc(32 * var(--u));
    line-height: calc(38 * var(--u));
    color: #FFFFFF;
}

/* ---------- 活动简介 ---------- */
.topic-intro {
    position: relative;
    background-color: #fff;
    background-image: linear-gradient(180deg, #B7E9EC 0%, #E9F7F8 55%, #FFFFFF 100%);
    background-repeat: no-repeat;
    background-size: 100% calc(420 * var(--u));
    background-position: top center;
    padding: calc(147 * var(--u)) 0 calc(90 * var(--u));
}

.topic-intro-inner {
    position: relative;
    width: calc(1567 * var(--u));
    margin: 0 auto;
}

.topic-quote {
    position: absolute;
    z-index: 0;
    font-family: "FZLTCHK--GBK1-0", "STKaiti", "KaiTi", serif;
    font-size: calc(159 * var(--u));
    line-height: calc(182 * var(--u));
    color: #08C4DF;
    pointer-events: none;
    user-select: none;
}

.topic-quote-l {
    left: calc(42 * var(--u));
    top: 0;
}

.topic-quote-r {
    right: calc(84 * var(--u));
    top: calc(156 * var(--u));
}

/* 「活动简介」标题 + 青色高亮条：整体页面居中 */
.topic-intro-head {
    position: relative;
    z-index: 2;
    width: calc(294 * var(--u));
    margin: 0 auto;
    text-align: center;
}

.topic-intro-title {
    font-size: calc(39 * var(--u));
    line-height: calc(46 * var(--u));
    font-weight: 400;
    color: #000;
}

.topic-intro-bar {
    display: block;
    width: calc(294 * var(--u));
    height: calc(20 * var(--u));
    margin: calc(-12 * var(--u)) auto 0;
    border-radius: calc(10 * var(--u));
    background: #08C4DF;
}

.topic-intro-card {
    position: relative;
    z-index: 1;
    width: calc(1305 * var(--u));
    margin: calc(48 * var(--u)) auto 0;
    padding: calc(67 * var(--u)) calc(119 * var(--u));
    background: #fff;
    border: 1px solid #E5E5E5;
    border-radius: calc(12 * var(--u));
    box-shadow: 0 calc(6 * var(--u)) calc(30 * var(--u)) rgba(7, 64, 152, .06);
}

.topic-intro-card p {
    font-size: calc(24 * var(--u));
    line-height: calc(48 * var(--u));
    color: #000;
    text-align: justify;
}

/* ---------- 头条（3 篇，图文交替） ---------- */
.topic-feature {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(59 * var(--u));
    padding: calc(95 * var(--u)) 0;
}

.topic-feature-rev {
    flex-direction: row-reverse;
}

/* 首篇带顶部渐变背景 */
.topic-feature-alt {
    background-color: #fff;
    background-image: linear-gradient(180deg, #C9EEF2 0%, #FFFFFF 100%);
    background-repeat: no-repeat;
    background-size: 100% calc(648 * var(--u));
    background-position: top center;
}

.topic-feature-img {
    flex: none;
    width: calc(713 * var(--u));
    height: calc(473 * var(--u));
    overflow: hidden;
}

.topic-feature-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topic-feature-body {
    flex: none;
    width: calc(720 * var(--u));
    display: flex;
    flex-direction: column;
}

.topic-feature-title {
    font-size: calc(42 * var(--u));
    line-height: calc(51 * var(--u));
    font-weight: 400;
    color: #074098;
    margin-bottom: calc(32 * var(--u));
}

.topic-feature-title a:hover {
    color: #08C4DF;
}

.topic-feature-excerpt {
    font-size: calc(24 * var(--u));
    /* 设计稿 lh 29px + 行间 11px = 有效行距 40px */
    line-height: calc(40 * var(--u));
    color: #666666;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.topic-feature-plus {
    align-self: flex-end;
    margin-top: calc(11 * var(--u));
    font-size: calc(24 * var(--u));
    line-height: calc(29 * var(--u));
    color: #666666;
}

/* 底部装饰线：左/右端带一小段斜线，斜线朝向配图一侧 */
.topic-feature-line {
    display: block;
    position: relative;
    height: calc(38 * var(--u));
    margin-top: calc(68 * var(--u));
    border-bottom: 1px solid #DDDDDD;
}

.topic-feature-line::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: calc(-1 * var(--u));
    width: calc(46 * var(--u));
    height: 1px;
    background: #DDDDDD;
    transform: rotate(-35deg);
    transform-origin: left bottom;
}

.topic-feature-rev .topic-feature-line::before {
    left: auto;
    right: 0;
    transform: rotate(35deg);
    transform-origin: right bottom;
}

/* ---------- 列表（6 篇，两列三行） ---------- */
.topic-grid-section {
    background-color: #fff;
    background-image: linear-gradient(180deg, #C9EEF2 0%, #FFFFFF 100%);
    background-repeat: no-repeat;
    background-size: 100% calc(648 * var(--u));
    background-position: top center;
    padding: calc(127 * var(--u)) 0 0;
}

.topic-grid {
    width: calc(1477 * var(--u));
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: calc(50 * var(--u)) calc(69 * var(--u));
}

.topic-grid-item {
    width: calc(704 * var(--u));
    height: calc(140 * var(--u));
    display: flex;
    align-items: stretch;
    background: #fff;
    border: 1px solid #CCCCCC;
    overflow: hidden;
    transition: border-color .2s, box-shadow .2s;
}

.topic-grid-item:hover {
    border-color: #08C4DF;
    box-shadow: 0 calc(4 * var(--u)) calc(16 * var(--u)) rgba(8, 196, 223, .18);
}

.topic-grid-thumb {
    flex: none;
    width: calc(204 * var(--u));
    height: 100%;
    overflow: hidden;
}

.topic-grid-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topic-grid-body {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    padding: 0 calc(20 * var(--u)) 0 calc(24 * var(--u));
}

.topic-grid-title {
    font-size: calc(21 * var(--u));
    /* 设计稿：21px 文字两行在 68px 高度内 space-between，两行基线间距 43px */
    line-height: calc(43 * var(--u));
    font-weight: 400;
    color: #000;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------- 更多 ---------- */
.topic-more {
    text-align: center;
    padding: calc(96 * var(--u)) 0 calc(110 * var(--u));
    background: #fff;
}

.topic-more-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: calc(12 * var(--u));
    min-width: calc(280 * var(--u));
    height: calc(56 * var(--u));
    padding: 0 calc(44 * var(--u));
    border: 1px solid #08C4DF;
    border-radius: calc(28 * var(--u));
    background: #fff;
    font-size: calc(26 * var(--u));
    letter-spacing: calc(4 * var(--u));
    text-indent: calc(4 * var(--u));
    color: #08C4DF;
    transition: background .25s, color .25s, box-shadow .25s, transform .25s;
}

/* 右向箭头 */
.topic-more-btn::after {
    content: "";
    flex: none;
    width: calc(9 * var(--u));
    height: calc(9 * var(--u));
    margin-bottom: calc(2 * var(--u));
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform .25s;
}

.topic-more-btn:hover {
    background: #08C4DF;
    color: #fff;
    box-shadow: 0 calc(8 * var(--u)) calc(24 * var(--u)) rgba(8, 196, 223, .32);
    transform: translateY(calc(-3 * var(--u)));
}

.topic-more-btn:hover::after {
    transform: rotate(45deg) translate(calc(2 * var(--u)), calc(-2 * var(--u)));
}

/* ---------- 页中 slogan 横幅（活动简介 与 头条 之间） ---------- */
.topic-slogan-banner {
    display: block;
    line-height: 0;
    background: #074098;
}

.topic-slogan-banner img {
    display: block;
    width: 100%;
    height: auto;
}


/* 注：短视频专题页（page_topic_video.html）样式已抽离到 assets/css/2026video/topic-video.css */


/* ===== 手机端适配（≤768px） ===== */
@media (max-width: 768px) {

    /* 顶部条：隐藏滚动标语（内含固定宽图片会溢出），仅保留 logo 与搜索 */
    .site-slogan {
        display: none;
    }

    /* 站点 logo 缩小为 55px */
    .site-logo {
        height: calc(55 * var(--u));
        ;
    }

    .top-header .container {
        flex-wrap: wrap;
        gap: calc(12 * var(--u));
    }

    /* 主导航：换行居中、缩小字号，避免横向溢出 */
    .header .container {
        height: auto;
        padding: calc(10 * var(--u)) 0;
    }

    .nav-list {
        flex-wrap: wrap;
        justify-content: center;
        gap: calc(16 * var(--u)) calc(26 * var(--u));
    }

    .nav-item>a {
        font-size: calc(22 * var(--u));
        padding: calc(12 * var(--u)) 0;
    }

    /* Banner：高度收敛、标题与内容宽度铺满 */
    .banner-swiper,
    .banner-swiper .swiper-slide {
        height: calc(380 * var(--u));
    }

    .banner-content {
        padding: 0 calc(24 * var(--u));
    }

    .banner-title {
        font-size: calc(28 * var(--u));
        line-height: calc(44 * var(--u));
    }

    .banner-swiper .swiper-pagination {
        padding-right: calc(24 * var(--u));
        text-align: center;
    }

    /* 时政要闻：大图与标题铺满，去掉负边距出血 */
    .news-main {
        padding: calc(16 * var(--u)) calc(16 * var(--u));
        width: calc(554 * var(--u));
    }

    .news-main-swiper {
        margin-right: 0;
    }

    .news-main-swiper .swiper-pagination {
        right: calc(16 * var(--u));
        bottom: calc(70 * var(--u));
    }

    /* 研究园地：单列铺满 */
    .study-cards {
        gap: calc(18 * var(--u));
    }

    /* 反邪专题：卡片缩小以适配窄屏（容器已在 ≤1200px 铺满） */
    .anti-swiper {
        padding: calc(20 * var(--u)) 0 calc(60 * var(--u));
    }

    .anti-swiper .swiper-slide {
        width: calc(560 * var(--u));
        height: calc(373 * var(--u));
    }

    /* 工作动态：单列铺满 */
    .work-grid {
        gap: calc(20 * var(--u));
    }

    .work-img img {
        height: calc(320 * var(--u));
    }

    /* 科普博览：单列 */
    .gallery-grid {
        grid-template-columns: 1fr;
    }

    /* 资料库：缩进边距 */
    .experts-swiper {
        padding: calc(10 * var(--u)) calc(20 * var(--u)) calc(20 * var(--u));
    }

    .expert-card {
        padding: calc(12 * var(--u)) calc(14 * var(--u));
        text-align: left;
    }

    /* 区块标题与「查看更多」换行兜底 */
    .section-header {
        flex-wrap: wrap;
        gap: calc(10 * var(--u));
    }

    /* 全国科普月横幅间距收敛 */
    .science-banner {
        margin: calc(30 * var(--u)) 0 calc(40 * var(--u));
    }
        .expert-avatar{
            width: calc(88 * var(--u));
                height: calc(88 * var(--u));
                margin: 0 auto calc(20 * var(--u));
        }
.expert-name{
    margin-bottom: calc(10 * var(--u));
        font-size: calc(22 * var(--u));
        line-height: calc(22 * var(--u));
}
.expert-desc{
    font-size: calc(20 * var(--u));
}
.expert-articles{
    grid-template-columns:1fr;
    padding: 0;
}
    /* ==========================================================================
   文章详情页移动端适配（≤768px）
   放开 1200px 最小宽度避免横向滚动；优化标题/内边距/正文/图片/操作区展示
   （打印功能已移除，原 @media print 一并删除）
   ========================================================================== */


    /* 容器随手机宽度流动，杜绝横向滚动 */
    .container {
        width: 100%;
        min-width: 0;
        padding-left: calc(24 * var(--u));
        padding-right: calc(24 * var(--u));
    }

    .breadcrumb {
        font-size: calc(22 * var(--u));
        padding: calc(14 * var(--u)) 0;
        flex-wrap: wrap;
    }

    .article-detail {
        padding: calc(24 * var(--u)) calc(24 * var(--u)) calc(40 * var(--u));
    }

    .article-detail .article-title {
        font-size: calc(38 * var(--u));
        margin-bottom: calc(30 * var(--u));
    }

    .article-detail .article-meta {
        font-size: calc(20 * var(--u));
        gap: calc(12 * var(--u));
    }

    .article-detail .article-meta-left {
        gap: calc(8 * var(--u)) calc(24 * var(--u));
    }

    .article-detail .article-content {
        font-size: var(--article-font-size, calc(22 * var(--u)));
    }

    .article-detail .article-content p {
        margin-bottom: calc(20 * var(--u));
    }

    .article-detail .article-image {
        margin-bottom: calc(30 * var(--u));
    }

    .article-detail .article-image img {
        width: 100%;
    }

    .article-editor {
        font-size: calc(18 * var(--u));
        margin: calc(30 * var(--u)) 0;
    }

    .article-actions {
        gap: calc(24 * var(--u));
        padding-top: calc(50 * var(--u));
    }

    .btn-article {
        font-size: calc(18 * var(--u));
        padding: calc(14 * var(--u)) calc(44 * var(--u));
    }

    .form-page-wrap {
        padding: 24px 12px 40px;
    }

    .form-page {
        padding: 32px 20px 48px;
    }

    .form-page-title {
        font-size: 26px;
    }

    .btn-print {
        display: none;
    }
}