/* ============================================================
   汇智综合资讯网 - 全站共享样式
   设计基调：正式、规范、可信（政企/合规风格）
   ============================================================ */

:root {
--c-primary: #1a4f8b; /* 主色：稳重藏蓝 */
--c-primary-dark: #123a67;
--c-primary-light: #eaf1f9;
--c-accent: #b8860b; /* 点缀金：庄重 */
--c-text: #2b2f36;
--c-text-sub: #5c6470;
--c-border: #dde3ea;
--c-bg: #f6f8fa;
--c-white: #ffffff;
--c-danger: #c0392b;
--radius: 8px;
--shadow: 0 2px 12px rgba(18, 58, 103, 0.08);
--shadow-lg: 0 8px 28px rgba(18, 58, 103, 0.14);
--max-w: 1160px;
}

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

html {
scroll-behavior: smooth;
}

body {
font-family:
'Microsoft YaHei', 'PingFang SC', 'Hiragino Sans GB', 'Source Han Sans SC',
sans-serif;
color: var(--c-text);
background: var(--c-bg);
line-height: 1.75;
font-size: 16px;
}

img {
max-width: 100%;
display: block;
}
a {
color: var(--c-primary);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
ul,
ol {
list-style-position: inside;
}

.container {
width: 100%;
max-width: var(--max-w);
margin: 0 auto;
padding: 0 20px;
}

/* ---------- 顶部通栏（合规信息条） ---------- */
.topbar {
background: var(--c-primary-dark);
color: #cdd9e8;
font-size: 13px;
}
.topbar .container {
display: flex;
justify-content: space-between;
align-items: center;
min-height: 34px;
flex-wrap: wrap;
gap: 4px;
}
.topbar a {
color: #cdd9e8;
}

/* ---------- 头部导航 ---------- */
.site-header {
background: var(--c-white);
border-bottom: 3px solid var(--c-primary);
position: sticky;
top: 0;
z-index: 100;
box-shadow: var(--shadow);
}
.site-header .container {
display: flex;
align-items: center;
justify-content: space-between;
height: 76px;
gap: 20px;
}
.brand {
display: flex;
align-items: center;
gap: 12px;
min-width: 0;
}
.brand-logo {
border-radius: 10px;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 700;
flex-shrink: 0;
letter-spacing: 1px;
}
.brand-logo img {
width: 60px;
height: 48px;
object-fit: contain;
}
.brand-name {
font-size: 21px;
font-weight: 700;
color: var(--c-primary-dark);
letter-spacing: 2px;
white-space: nowrap;
}
.brand-sub {
display: block;
font-size: 11px;
color: var(--c-text-sub);
letter-spacing: 3px;
font-weight: 400;
}
.main-nav {
display: flex;
gap: 4px;
}
.main-nav a {
display: block;
padding: 8px 11px;
color: var(--c-text);
font-size: 15px;
border-radius: 6px;
white-space: nowrap;
}
.main-nav a:hover {
color: var(--c-primary);
background: var(--c-primary-light);
text-decoration: none;
}
.main-nav a.active {
color: #fff;
background: var(--c-primary);
font-weight: 600;
}
.nav-toggle {
display: none;
}

/* ---------- 页头横幅（内页） ---------- */
.page-banner {
background: linear-gradient(
120deg,
var(--c-primary-dark) 0%,
#24589a 60%,
#3574bd 100%
);
color: #fff;
padding: 52px 0 46px;
position: relative;
overflow: hidden;
}
.page-banner::after {
content: '';
position: absolute;
right: -60px;
top: -60px;
width: 260px;
height: 260px;
border: 2px solid rgba(255, 255, 255, 0.12);
border-radius: 50%;
}
.page-banner h1 {
font-size: 32px;
letter-spacing: 4px;
margin-bottom: 8px;
}
.page-banner p {
color: #c9d8ea;
font-size: 15px;
}
.breadcrumb {
margin-top: 14px;
font-size: 13px;
color: #b7c9de;
}
.breadcrumb a {
color: #dce7f3;
}

/* ---------- 首页 Hero ---------- */
.hero {
background: linear-gradient(120deg, #123a67 0%, #1a4f8b 55%, #2e6cb5 100%);
color: #fff;
padding: 88px 0 96px;
position: relative;
overflow: hidden;
}
.hero::before,
.hero::after {
content: '';
position: absolute;
border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.1);
}
.hero::before {
width: 340px;
height: 340px;
right: -80px;
top: -100px;
}
.hero::after {
width: 200px;
height: 200px;
right: 140px;
bottom: -90px;
}
.hero .container {
position: relative;
z-index: 1;
}
.hero-kicker {
display: inline-block;
border: 1px solid rgba(255, 255, 255, 0.4);
padding: 4px 16px;
border-radius: 999px;
font-size: 13px;
letter-spacing: 3px;
margin-bottom: 22px;
color: #dbe7f4;
}
.hero h1 {
font-size: 42px;
letter-spacing: 4px;
line-height: 1.35;
margin-bottom: 18px;
}
.hero p.lead {
font-size: 17px;
color: #d5e2f0;
max-width: 640px;
margin-bottom: 34px;
}
.hero-actions {
display: flex;
gap: 14px;
flex-wrap: wrap;
}
.btn {
display: inline-block;
padding: 12px 32px;
border-radius: 6px;
font-size: 16px;
cursor: pointer;
border: 1px solid transparent;
transition: all 0.2s;
}
.btn:hover {
text-decoration: none;
transform: translateY(-1px);
}
.btn-primary {
background: #fff;
color: var(--c-primary-dark);
font-weight: 600;
}
.btn-primary:hover {
background: #f0f5fb;
}
.btn-outline {
border-color: rgba(255, 255, 255, 0.6);
color: #fff;
}
.btn-outline:hover {
background: rgba(255, 255, 255, 0.12);
}
.btn-solid {
background: var(--c-primary);
color: #fff;
font-weight: 600;
}
.btn-solid:hover {
background: var(--c-primary-dark);
}

/* ---------- 通用区块 ---------- */
.section {
padding: 68px 0;
}
.section.alt {
background: var(--c-white);
}
.section-head {
text-align: center;
margin-bottom: 46px;
}
.section-head .en {
font-size: 12px;
letter-spacing: 4px;
color: var(--c-accent);
text-transform: uppercase;
margin-bottom: 6px;
}
.section-head h2 {
font-size: 30px;
color: var(--c-primary-dark);
letter-spacing: 3px;
}
.section-head .line {
width: 56px;
height: 3px;
background: var(--c-primary);
margin: 16px auto 0;
border-radius: 2px;
}
.section-head p.sub {
color: var(--c-text-sub);
margin-top: 14px;
font-size: 15px;
}

/* ---------- 卡片 ---------- */
.grid {
display: grid;
gap: 24px;
}
.grid-2 {
grid-template-columns: repeat(2, 1fr);
}
.grid-3 {
grid-template-columns: repeat(3, 1fr);
}
.grid-4 {
grid-template-columns: repeat(4, 1fr);
}

.card {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 30px 26px;
transition: all 0.25s;
}
.card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-3px);
border-color: #c4d4e8;
}
.card .icon {
width: 54px;
height: 54px;
border-radius: 12px;
background: var(--c-primary-light);
color: var(--c-primary);
display: flex;
align-items: center;
justify-content: center;
font-size: 26px;
margin-bottom: 18px;
}
.card h3 {
font-size: 19px;
color: var(--c-primary-dark);
margin-bottom: 10px;
}
.card p {
color: var(--c-text-sub);
font-size: 14.5px;
}
.card .more {
display: inline-block;
margin-top: 14px;
font-size: 14px;
font-weight: 600;
}

/* ---------- 数据亮点 ---------- */
.stats {
background: linear-gradient(120deg, var(--c-primary-dark), #24589a);
color: #fff;
padding: 52px 0;
}
.stats .grid-4 {
text-align: center;
}
.stats .num {
font-size: 38px;
font-weight: 700;
letter-spacing: 1px;
}
.stats .num span {
font-size: 16px;
font-weight: 400;
margin-left: 4px;
}
.stats .label {
color: #c3d3e5;
margin-top: 6px;
font-size: 14px;
letter-spacing: 2px;
}

/* ---------- 列表（资讯/问答） ---------- */
.list-item {
display: flex;
gap: 20px;
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 22px 26px;
margin-bottom: 16px;
transition: all 0.2s;
}
.list-item:hover {
box-shadow: var(--shadow-lg);
border-color: #c4d4e8;
}
.list-item .date {
flex-shrink: 0;
width: 76px;
text-align: center;
border-right: 1px dashed var(--c-border);
padding-right: 18px;
align-self: center;
}
.list-item .date .d {
font-size: 26px;
font-weight: 700;
color: var(--c-primary);
line-height: 1.2;
}
.list-item .date .y {
font-size: 12px;
color: var(--c-text-sub);
}
.list-item h3 {
font-size: 17px;
margin-bottom: 6px;
}
.list-item h3 a {
color: var(--c-text);
}
.list-item h3 a:hover {
color: var(--c-primary);
}
.list-item p {
font-size: 14px;
color: var(--c-text-sub);
}
.tag {
display: inline-block;
font-size: 12px;
padding: 1px 10px;
border-radius: 999px;
background: var(--c-primary-light);
color: var(--c-primary);
margin-right: 8px;
}
.tag.gold {
background: #f7efdc;
color: var(--c-accent);
}

/* ---------- FAQ 折叠 ---------- */
.faq-group-title {
font-size: 20px;
color: var(--c-primary-dark);
margin: 36px 0 18px;
padding-left: 12px;
border-left: 4px solid var(--c-primary);
}
details.faq {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
margin-bottom: 12px;
overflow: hidden;
}
details.faq[open] {
border-color: var(--c-primary);
box-shadow: var(--shadow);
}
details.faq summary {
cursor: pointer;
padding: 18px 24px;
font-weight: 600;
font-size: 16px;
color: var(--c-text);
list-style: none;
position: relative;
padding-right: 48px;
}
details.faq summary::-webkit-details-marker {
display: none;
}
details.faq summary::after {
content: '+';
position: absolute;
right: 22px;
top: 50%;
transform: translateY(-50%);
font-size: 22px;
color: var(--c-primary);
transition: transform 0.2s;
}
details.faq[open] summary::after {
content: '−';
}
details.faq .faq-body {
padding: 0 24px 20px;
color: var(--c-text-sub);
font-size: 15px;
border-top: 1px dashed var(--c-border);
padding-top: 14px;
}

/* ---------- 表单 ---------- */
.form-card {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 34px;
box-shadow: var(--shadow);
}
.form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px;
}
.form-group {
margin-bottom: 18px;
}
.form-group label {
display: block;
font-size: 14px;
font-weight: 600;
margin-bottom: 7px;
color: var(--c-primary-dark);
}
.form-group label .req {
color: var(--c-danger);
margin-left: 3px;
}
.form-group input,
.form-group select,
.form-group textarea {
width: 100%;
padding: 11px 14px;
border: 1px solid var(--c-border);
border-radius: 6px;
font-size: 15px;
font-family: inherit;
color: var(--c-text);
background: #fbfcfe;
transition: border-color 0.2s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
outline: none;
border-color: var(--c-primary);
background: #fff;
box-shadow: 0 0 0 3px rgba(26, 79, 139, 0.1);
}
.form-group textarea {
min-height: 120px;
resize: vertical;
}
.form-note {
font-size: 13px;
color: var(--c-text-sub);
margin-top: 12px;
}
.checkbox-line {
display: flex;
align-items: flex-start;
gap: 8px;
font-size: 13.5px;
color: var(--c-text-sub);
}
.checkbox-line input {
width: auto;
margin-top: 4px;
}

/* ---------- 联系信息 ---------- */
.contact-block {
display: flex;
gap: 18px;
margin-bottom: 26px;
}
.contact-block .icon {
width: 52px;
height: 52px;
flex-shrink: 0;
border-radius: 12px;
background: var(--c-primary-light);
color: var(--c-primary);
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
}
.contact-block h3 {
font-size: 16px;
color: var(--c-primary-dark);
margin-bottom: 4px;
}
.contact-block p {
color: var(--c-text-sub);
font-size: 15px;
}

/* ---------- 关于我们：时间线 ---------- */
.timeline {
position: relative;
padding-left: 28px;
}
.timeline::before {
content: '';
position: absolute;
left: 8px;
top: 6px;
bottom: 6px;
width: 2px;
background: var(--c-border);
}
.timeline-item {
position: relative;
padding-bottom: 30px;
}
.timeline-item::before {
content: '';
position: absolute;
left: -26px;
top: 8px;
width: 12px;
height: 12px;
border-radius: 50%;
background: var(--c-primary);
border: 3px solid var(--c-primary-light);
}
.timeline-item .year {
font-size: 18px;
font-weight: 700;
color: var(--c-primary);
}
.timeline-item h4 {
font-size: 16px;
margin: 4px 0;
}
.timeline-item p {
font-size: 14.5px;
color: var(--c-text-sub);
}

/* ---------- 正文排版 ---------- */
.prose {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 40px 46px;
}
.prose h2 {
font-size: 22px;
color: var(--c-primary-dark);
margin: 30px 0 12px;
letter-spacing: 1px;
}
.prose h2:first-child {
margin-top: 0;
}
.prose h3 {
font-size: 17px;
margin: 20px 0 8px;
}
.prose p,
.prose li {
color: #3a4149;
font-size: 15.5px;
margin-bottom: 10px;
}
.prose ul {
margin: 0 0 14px 4px;
}
.prose li {
margin-bottom: 6px;
list-style: disc;
margin-left: 20px;
}

/* ---------- 提示条 ---------- */
.notice {
background: #fdf6e8;
border: 1px solid #ecd9a8;
border-radius: var(--radius);
padding: 14px 20px;
font-size: 14px;
color: #7a5c13;
margin-bottom: 28px;
}
.notice strong {
color: #5e4708;
}

/* ---------- 页脚 ---------- */
.site-footer {
background: #14283f;
color: #9fb2c8;
margin-top: 0;
font-size: 14px;
}
.footer-main {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1.4fr;
gap: 36px;
padding: 52px 0 40px;
}
.site-footer h4 {
color: #e7eef6;
font-size: 16px;
margin-bottom: 16px;
letter-spacing: 2px;
}
.site-footer ul {
list-style: none;
}
.site-footer li {
margin-bottom: 9px;
}
.site-footer a {
color: #9fb2c8;
}
.site-footer a:hover {
color: #fff;
}
.footer-desc {
line-height: 1.9;
}
.footer-contact li {
display: flex;
gap: 8px;
}
.footer-contact .ico {
flex-shrink: 0;
}
.footer-bottom {
border-top: 1px solid #24405e;
padding: 20px 0;
text-align: center;
font-size: 13px;
color: #7e93ab;
line-height: 2;
}
.footer-bottom a {
color: #9fb2c8;
margin: 0 6px;
}
.beian {
display: inline-flex;
align-items: center;
gap: 4px;
}

/* ---------- 返回顶部 ---------- */
.back-top {
position: fixed;
right: 26px;
bottom: 32px;
width: 44px;
height: 44px;
border-radius: 50%;
background: var(--c-primary);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
box-shadow: var(--shadow-lg);
opacity: 0;
pointer-events: none;
transition: opacity 0.3s;
z-index: 90;
}
.back-top.show {
opacity: 1;
pointer-events: auto;
}
.back-top:hover {
background: var(--c-primary-dark);
text-decoration: none;
}

/* ---------- 响应式 ---------- */
@media (max-width: 960px) {
.grid-3,
.grid-4 {
grid-template-columns: repeat(2, 1fr);
}
.footer-main {
grid-template-columns: 1fr 1fr;
}
.hero h1 {
font-size: 32px;
}
.main-nav {
display: none;
position: absolute;
top: 76px;
left: 0;
right: 0;
background: var(--c-white);
flex-direction: column;
padding: 10px 20px 16px;
border-bottom: 3px solid var(--c-primary);
box-shadow: var(--shadow-lg);
}
.main-nav.open {
display: flex;
}
.main-nav a {
padding: 12px 16px;
border-bottom: 1px solid var(--c-bg);
}
.nav-toggle {
display: block;
background: none;
border: 1px solid var(--c-border);
border-radius: 6px;
font-size: 22px;
color: var(--c-primary-dark);
width: 44px;
height: 40px;
cursor: pointer;
}
}
@media (max-width: 640px) {
.grid-2,
.grid-3,
.grid-4 {
grid-template-columns: 1fr;
}
.footer-main {
grid-template-columns: 1fr;
gap: 26px;
}
.form-row {
grid-template-columns: 1fr;
}
.hero {
padding: 60px 0 66px;
}
.hero h1 {
font-size: 26px;
letter-spacing: 2px;
}
.section {
padding: 48px 0;
}
.prose {
padding: 26px 22px;
}
.page-banner h1 {
font-size: 25px;
}
.brand-name {
font-size: 18px;
letter-spacing: 1px;
}
.stats .num {
font-size: 30px;
}
}

/* ---------- 资讯门户版式 ---------- */
.headline-area {
display: grid;
grid-template-columns: 1.7fr 1fr;
gap: 26px;
align-items: start;
}

/* 头条 */
.hl-main {
background: var(--c-white);
border: 1px solid var(--c-border);
border-top: 3px solid var(--c-primary);
border-radius: var(--radius);
padding: 28px 30px;
box-shadow: var(--shadow);
}
.hl-main .hl-tag {
display: inline-block;
font-size: 12px;
letter-spacing: 2px;
color: var(--c-accent);
border: 1px solid #ecd9a8;
background: #fdf6e8;
border-radius: 999px;
padding: 2px 12px;
margin-bottom: 14px;
}
.hl-main h2 {
font-size: 24px;
line-height: 1.5;
margin-bottom: 10px;
}
.hl-main h2 a {
color: var(--c-primary-dark);
}

/* 资讯行 */
.news-row {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 18px 24px;
margin-bottom: 14px;
transition: all 0.2s;
}
.news-row:hover {
box-shadow: var(--shadow-lg);
border-color: #c4d4e8;
}
.news-row h3 {
font-size: 17px;
line-height: 1.6;
margin-bottom: 6px;
}
.news-row h3 a {
color: var(--c-text);
}
.news-row h3 a:hover {
color: var(--c-primary);
}
.news-row h3 .tag {
vertical-align: 2px;
}
.news-sum {
font-size: 14px;
color: var(--c-text-sub);
margin-bottom: 8px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.news-meta {
font-size: 12.5px;
color: #98a2ae;
}
.news-meta i {
font-style: normal;
margin: 0 8px;
color: #c8d0d9;
}

/* 侧栏热点榜 */
.side-card {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 22px 22px 16px;
}
.side-card > h3 {
font-size: 17px;
color: var(--c-primary-dark);
padding-bottom: 12px;
margin-bottom: 4px;
border-bottom: 2px solid var(--c-primary);
}
.hot-item {
display: flex;
gap: 12px;
align-items: baseline;
padding: 11px 2px;
border-bottom: 1px dashed var(--c-border);
}
.hot-item:last-of-type {
border-bottom: none;
}
.hot-item .rank {
flex-shrink: 0;
width: 21px;
height: 21px;
border-radius: 4px;
background: #eef2f7;
color: var(--c-text-sub);
font-size: 12px;
font-weight: 700;
display: inline-flex;
align-items: center;
justify-content: center;
align-self: center;
}
.hot-item .rank.top {
background: var(--c-primary);
color: #fff;
}
.hot-item .hot-t {
font-size: 14px;
color: var(--c-text);
line-height: 1.6;
}
.hot-item:hover .hot-t {
color: var(--c-primary);
}
.hot-item:hover {
text-decoration: none;
}

/* 栏目速览卡 */
.cat-card h3 {
font-size: 17px;
}
.cat-card h3 a {
color: var(--c-primary-dark);
}
.cat-card .cat-item {
font-size: 13.5px;
color: var(--c-text-sub);
margin: 6px 0 4px;
min-height: 66px;
}
.cat-card .cat-item a {
color: var(--c-text-sub);
}
.cat-card .cat-item a:hover {
color: var(--c-primary);
}

/* ---------- 资讯配图 ---------- */
.news-row {
display: flex;
gap: 16px;
align-items: flex-start;
}
.news-thumb {
flex-shrink: 0;
width: 138px;
aspect-ratio: 16 / 9;
border-radius: 6px;
overflow: hidden;
background: var(--c-primary-light);
}
.news-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.3s;
}
.news-row:hover .news-thumb img {
transform: scale(1.05);
}
.news-main {
flex: 1;
min-width: 0;
}

.hl-img {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
border-radius: 8px;
margin-bottom: 14px;
display: block;
background: var(--c-primary-light);
}

/* 图片新闻卡 */
.photo-card {
display: block;
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
overflow: hidden;
transition: all 0.2s;
}
.photo-card:hover {
box-shadow: var(--shadow-lg);
text-decoration: none;
transform: translateY(-2px);
}
.photo-img {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
display: block;
background: var(--c-primary-light);
}
.photo-t {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
padding: 10px 12px 12px;
font-size: 14px;
line-height: 1.55;
color: var(--c-text);
}
.photo-card:hover .photo-t {
color: var(--c-primary);
}

/* 栏目导航块（紧凑） */
.cat-block {
background: var(--c-white);
border: 1px solid var(--c-border);
border-radius: var(--radius);
padding: 14px 18px 10px;
}
.cat-block-head {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 2px solid var(--c-primary);
padding-bottom: 8px;
margin-bottom: 8px;
}
.cat-block-head .cb-name {
font-size: 16px;
font-weight: 700;
color: var(--c-primary-dark);
letter-spacing: 2px;
}
.cat-block-head .cb-more {
font-size: 12.5px;
color: var(--c-text-sub);
}
.cat-block-head .cb-more:hover {
color: var(--c-primary);
}
.cat-block ul {
list-style: none;
}
.cat-block li {
padding: 6px 0;
border-bottom: 1px dashed var(--c-bg);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.cat-block li:last-child {
border-bottom: none;
}
.cat-block li::before {
content: '·';
color: var(--c-primary);
font-weight: 700;
margin-right: 7px;
}
.cat-block li a {
color: var(--c-text);
font-size: 14px;
}
.cat-block li a:hover {
color: var(--c-primary);
}

/* ---------- 微博相关 ---------- */
.wb-ico {
display: inline-flex;
align-items: center;
justify-content: center;
width: 18px;
height: 18px;
border-radius: 4px;
background: #e6162d;
color: #fff;
font-size: 12px;
font-weight: 700;
vertical-align: -3px;
margin-right: 4px;
}
.wb-ico-lg {
width: 22px;
height: 22px;
font-size: 14px;
border-radius: 5px;
}
.wb-top-link {
color: #ffd9a0 !important;
}
.wb-top-link:hover {
color: #fff !important;
}

.share-wb {
float: right;
font-size: 12px;
color: #e6162d;
border: 1px solid #f3b7be;
border-radius: 999px;
padding: 1px 10px;
margin-left: 10px;
}
.share-wb:hover {
background: #e6162d;
color: #fff;
text-decoration: none;
border-color: #e6162d;
}

.side-col {
display: flex;
flex-direction: column;
gap: 20px;
}
.wb-card > h3 {
display: flex;
align-items: center;
gap: 6px;
}
.wb-card .wb-src {
font-size: 11px;
font-weight: 400;
color: var(--c-text-sub);
margin-left: auto;
letter-spacing: 0;
}
.wb-hot-tag {
flex-shrink: 0;
font-size: 11px;
color: #e6162d;
border: 1px solid #f3b7be;
border-radius: 3px;
padding: 0 4px;
align-self: center;
}
.wb-more {
display: block;
text-align: center;
font-size: 13px;
padding-top: 10px;
border-top: 1px dashed var(--c-border);
margin-top: 6px;
}

.wb-follow {
text-align: center;
}
.wb-follow-inner {
display: flex;
align-items: center;
gap: 12px;
text-align: left;
margin-bottom: 14px;
}
.wb-follow-inner b {
font-size: 15px;
color: var(--c-primary-dark);
display: block;
}
.wb-follow-inner p {
font-size: 12.5px;
color: var(--c-text-sub);
margin: 2px 0 0;
}
.wb-follow-btn {
display: block;
background: #e6162d;
color: #fff !important;
border-radius: 6px;
padding: 9px 0;
font-size: 14px;
font-weight: 600;
}
.wb-follow-btn:hover {
background: #c1121f;
text-decoration: none;
}

.friend-links {
font-size: 12.5px;
color: #7e93ab;
padding-bottom: 12px;
margin-bottom: 12px;
border-bottom: 1px solid #24405e;
}
.friend-links a {
color: #9fb2c8;
margin: 0 2px;
}
.friend-links a:hover {
color: #fff;
}
.friend-links b {
color: #9fb2c8;
font-weight: 600;
}

/* ---------- 文章详情页 ---------- */
.article-title {
font-size: 25px;
line-height: 1.55;
color: var(--c-primary-dark);
margin-bottom: 14px;
letter-spacing: 0.5px;
}
.article-meta {
font-size: 13.5px;
color: #98a2ae;
padding-bottom: 16px;
margin-bottom: 18px;
border-bottom: 1px solid var(--c-border);
}
.article-meta i {
font-style: normal;
margin: 0 8px;
color: #c8d0d9;
}
.article-meta .share-wb {
float: none;
margin-left: 14px;
}
.article-img {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
border-radius: 8px;
margin-bottom: 22px;
display: block;
background: var(--c-primary-light);
}
.article-text p {
font-size: 16px;
line-height: 2;
color: #333a42;
text-indent: 2em;
margin-bottom: 18px;
}
.article-text p:first-child {
font-size: 16.5px;
color: var(--c-primary-dark);
font-weight: 600;
text-indent: 0;
}
.article-declare {
margin-top: 26px;
padding-top: 14px;
border-top: 1px dashed var(--c-border);
font-size: 13px;
color: #98a2ae;
}
#related-list li {
padding: 9px 0;
border-bottom: 1px dashed var(--c-bg);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#related-list li::before {
content: '·';
color: var(--c-primary);
font-weight: 700;
margin-right: 7px;
}
#related-list li:last-child {
border-bottom: none;
}
#related-list li a {
color: var(--c-text);
font-size: 14px;
}
#related-list li a:hover {
color: var(--c-primary);
}

/* ---------- 移动端文章适配 ---------- */
@media (max-width: 640px) {
.article-title {
font-size: 20px;
}
.article-text p {
font-size: 15px;
line-height: 1.9;
margin-bottom: 14px;
}
.article-meta {
font-size: 12.5px;
}
.article-meta .share-wb {
float: none;
display: inline-block;
margin-left: 6px;
}
}

/* ---------- 移动端配图适配 ---------- */
@media (max-width: 960px) {
#photo-strip {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 640px) {
.news-row {
gap: 10px;
}
.news-thumb {
width: 104px;
}
.hl-main h2 {
margin-top: 4px;
}
.photo-t {
font-size: 13px;
padding: 8px 10px 10px;
}
.cat-block li a {
font-size: 13.5px;
}
}
@media (max-width: 380px) {
.news-thumb {
width: 88px;
}
}

/* ============================================================
   移动端适配（置于文件末尾，确保覆盖前面所有规则）
   ============================================================ */

/* 平板及以下（≤960px）：双栏布局压平 + 汉堡菜单 */
@media (max-width: 960px) {
/* 头部：压缩高度，下拉菜单贴住头部位移 */
.site-header .container {
height: 62px;
}
.brand-logo {
width: 40px;
height: 40px;
font-size: 19px;
}
.main-nav {
top: 100%;
max-height: 70vh;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}

/* 门户双栏压平：资讯在上，热点榜在下 */
.headline-area {
grid-template-columns: 1fr;
}

/* 栏目速览：三列改两列 */
.grid-4 {
grid-template-columns: repeat(2, 1fr);
}
}

/* 手机（≤640px） */
@media (max-width: 640px) {
/* 顶栏：单列居中、缩小字号 */
.topbar {
font-size: 12px;
}
.topbar .container {
flex-direction: column;
justify-content: center;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
}

/* 头部：进一步压缩 */
.site-header .container {
height: 56px;
gap: 10px;
}
.brand {
gap: 8px;
}
.brand-logo {
width: 36px;
height: 36px;
font-size: 17px;
border-radius: 8px;
}
.brand-name {
font-size: 16px;
letter-spacing: 1px;
}
.brand-sub {
display: none;
}
.nav-toggle {
width: 40px;
height: 36px;
font-size: 19px;
}
.main-nav {
padding: 6px 14px 12px;
}
.main-nav a {
padding: 11px 14px;
font-size: 15px;
}

/* 横幅与区块 */
.page-banner {
padding: 34px 0 30px;
}
.page-banner h1 {
font-size: 22px;
letter-spacing: 2px;
}
.section {
padding: 36px 0;
}
.section-head {
margin-bottom: 28px;
}
.section-head h2 {
font-size: 22px;
letter-spacing: 2px;
}
.section-head p.sub {
font-size: 14px;
}

/* 头条区 */
.hl-main {
padding: 18px 16px;
}
.hl-main h2 {
font-size: 19px;
}
.faq-group-title {
font-size: 17px;
}

/* 资讯行 */
.news-row {
padding: 13px 14px;
margin-bottom: 10px;
}
.news-row h3 {
font-size: 15.5px;
}
.news-sum {
font-size: 13px;
margin-bottom: 6px;
}
.news-meta {
font-size: 12px;
}
.news-meta i {
margin: 0 5px;
}

/* 热点榜 */
.side-card {
padding: 16px 14px 10px;
}
.side-card > h3 {
font-size: 15.5px;
padding-bottom: 9px;
}
.hot-item {
padding: 9px 1px;
gap: 9px;
}
.hot-item .hot-t {
font-size: 13.5px;
}

/* 栏目速览卡 */
.cat-card {
padding: 20px 18px;
}
.cat-card .cat-item {
min-height: 0;
}

/* 时间线（关于我们） */
.timeline {
padding-left: 22px;
}

/* 表单 */
.form-card {
padding: 20px 16px;
}
.form-group input,
.form-group select,
.form-group textarea {
font-size: 16px;
} /* 16px 防止 iOS 聚焦自动放大 */

/* 页脚 */
.footer-main {
gap: 22px;
padding: 34px 0 26px;
}
.footer-bottom {
font-size: 12px;
padding: 14px 0;
}
.footer-bottom a {
margin: 0 3px;
}

/* 按钮 */
.btn {
padding: 11px 22px;
font-size: 15px;
}

/* 正文页 */
.prose {
padding: 20px 16px;
}
.prose h2 {
font-size: 19px;
}
.prose p,
.prose li {
font-size: 14.5px;
}
}

/* 小屏手机（≤380px） */
@media (max-width: 380px) {
.brand-name {
font-size: 14px;
}
.container {
padding: 0 14px;
}
.hl-main h2 {
font-size: 17px;
}
.page-banner h1 {
font-size: 19px;
}
.stats .num {
font-size: 24px;
}
.grid {
gap: 16px;
}
}