/* ============================================
   网站文章排版标准CSS — 深色主题适配版 v2.0
   适配主站深色背景(#08090a)，保证内容可读性
   兼容所有历史文章HTML结构：
   - .article-wrap (news-012格式)
   - .article-content / .article-container (news-001~007格式)
   - .news-content / .news-detail (news-008格式)
   - .article-body (news-red-blue格式)
   - bare <article> (news-009~011格式)
   ============================================ */

/* ---- 内容容器基础样式 ---- */
.article-wrap,
.article-content,
.news-content,
.article-body {
    max-width: 820px;
    margin: 0 auto;
    padding: 20px 24px 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

article {
    max-width: 820px;
    margin: 0 auto;
    padding: 20px 24px 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ---- 元信息条 ---- */
.article-wrap .article-meta-top,
.article-meta,
.news-meta,
.article-header .article-meta {
    color: #8b8f98;
    font-size: 14px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #23252b;
}

/* ---- 标题层级 — 深色主题适配 ---- */

/* h1 */
.article-wrap h1,
.article-content h1,
.news-content h1,
.article-body h1,
article > h1,
.article-title,
.news-header h1 {
    font-size: 28px;
    color: #ffffff;
    line-height: 1.4;
    margin: 30px 0 16px;
    font-weight: 700;
}

/* h2 */
.article-wrap h2,
.article-content h2,
.news-content h2,
.article-body h2,
article h2 {
    font-size: 22px;
    color: #a8b4ff;
    margin: 36px 0 14px;
    padding-left: 12px;
    border-left: 4px solid #5e6ad2;
    font-weight: 600;
}

/* h3 */
.article-wrap h3,
.article-content h3,
.news-content h3,
.article-body h3,
article h3 {
    font-size: 18px;
    color: #c8ccf5;
    margin: 28px 0 10px;
    font-weight: 600;
}

/* ---- 正文 — 浅色文字保证可读性 ---- */
.article-wrap p,
.article-content p,
.news-content p,
.article-body p,
article p {
    font-size: 16px;
    line-height: 1.8;
    color: #c5c7cd;
    margin: 12px 0;
    text-align: justify;
}

/* 列表 */
.article-wrap ul, .article-wrap ol,
.article-content ul, .article-content ol,
.news-content ul, .news-content ol,
.article-body ul, .article-body ol,
article ul, article ol {
    padding-left: 24px;
    margin: 12px 0;
}

.article-wrap li,
.article-content li,
.news-content li,
.article-body li,
article li {
    font-size: 16px;
    line-height: 1.8;
    color: #c5c7cd;
    margin: 8px 0;
}

/* 加粗 */
.article-wrap strong,
.article-content strong,
.news-content strong,
.article-body strong,
article strong {
    color: #8ea1ff;
    font-weight: 600;
}

/* ---- 引用块 — 深色玻璃质感 ---- */
.article-wrap blockquote,
.article-content blockquote,
.news-content blockquote,
.article-body blockquote,
article blockquote {
    background: rgba(94, 106, 210, 0.12);
    border-left: 4px solid #5e6ad2;
    padding: 16px 20px;
    margin: 20px 0;
    border-radius: 0 8px 8px 0;
    font-size: 15px;
    color: #b0bce8;
    line-height: 1.7;
}

/* ---- 表格 — 深色主题 ---- */
.article-wrap table,
.article-content table,
.news-content table,
.article-body table,
article table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 15px;
}

.article-wrap th,
.article-content th,
.news-content th,
.article-body th,
article th {
    background: #5e6ad2;
    color: #ffffff;
    padding: 10px 14px;
    text-align: left;
}

.article-wrap td,
.article-content td,
.news-content td,
.article-body td,
article td {
    padding: 10px 14px;
    border-bottom: 1px solid #23252b;
    color: #c5c7cd;
}

.article-wrap tr:nth-child(odd) td,
.article-content tr:nth-child(odd) td,
.news-content tr:nth-child(odd) td,
.article-body tr:nth-child(odd) td,
article tr:nth-child(odd) td {
    background: rgba(255, 255, 255, 0.03);
}

/* ---- 代码 — 深色主题 ---- */
.article-wrap code,
.article-content code,
.news-content code,
.article-body code,
article code {
    background: rgba(255, 255, 255, 0.08);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
    color: #f0a070;
}

/* ---- 配图 ---- */
.article-img {
    width: 100%;
    border-radius: 12px;
    margin: 28px 0 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

.article-img-caption {
    text-align: center;
    color: #6b6f78;
    font-size: 13px;
    margin-bottom: 28px;
}

/* 图片通用 */
article img,
.article-content img,
.news-content img,
.article-body img {
    max-width: 100%;
    border-radius: 8px;
    margin: 20px 0;
}

/* ---- FAQ 卡片 — 深色卡片 ---- */
.faq-card {
    background: #16181c;
    border: 1px solid #23252b;
    border-radius: 10px;
    padding: 18px 24px;
    margin: 16px 0;
}

.faq-card h3 {
    margin-top: 0;
    color: #a8b4ff;
}

.faq-card p {
    color: #b0b3bc;
}

/* ---- CTA 联系卡片 — 深色渐变 ---- */
.cta-card {
    background: linear-gradient(135deg, #5e6ad2, #8b5cf6);
    border-radius: 12px;
    padding: 28px;
    margin: 36px 0 20px;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 8px 32px rgba(94, 106, 210, 0.3);
}

.cta-card h3 {
    color: #ffffff;
    margin-top: 0;
}

.cta-card p {
    color: rgba(255, 255, 255, 0.9);
}

.cta-card .phone {
    font-size: 24px;
    font-weight: 700;
    color: #ffd54f;
    margin: 8px 0;
}

.cta-card a {
    color: #ffd54f;
    text-decoration: none;
}

/* ---- 面包屑 — 深色主题 ---- */
.breadcrumb { color: #6b6f78; padding: 12px 24px; max-width: 820px; margin: 0 auto; font-size: 14px; }
.breadcrumb a { color: #8b8f98; text-decoration: none; }
.breadcrumb a:hover { color: #5e6ad2; }

/* ---- 导航栏适配 ---- */
.navbar { background: rgba(8,9,10,0.95); backdrop-filter: blur(12px); }

/* ---- 页脚适配 ---- */
.footer { background: #0c0d0f; color: #8b8f98; }
.footer a, .footer-nav a { color: #8b8f98; }
.footer a:hover, .footer-nav a:hover { color: #5e6ad2; }
.copyright { color: #6b6f78; }

/* ---- 相关文章列表 ---- */
.related-articles { max-width: 820px; margin: 0 auto; padding: 0 24px 40px; }
.related-articles a, .related-article {
    color: #a8b4ff;
    text-decoration: none;
    display: block;
    padding: 8px 0;
    border-bottom: 1px solid #23252b;
}
.related-articles a:hover, .related-article:hover {
    color: #5e6ad2;
}

/* ---- 标签 ---- */
.tag {
    display: inline-block;
    background: rgba(94, 106, 210, 0.15);
    color: #a8b4ff;
    padding: 2px 10px;
    border-radius: 4px;
    font-size: 13px;
    margin: 2px;
}

/* ---- 补丁：news-008格式兼容 ---- */
.page-header h1 {
    font-size: 28px;
    color: #ffffff;
    line-height: 1.4;
    margin: 30px 0 16px;
    font-weight: 700;
}

.page-header .subtitle,
.news-header .subtitle {
    color: #8b8f98;
    font-size: 16px;
    margin-bottom: 16px;
}

/* 全局标题兜底 */
article h1, .article-wrap h1, .article-content h1, .news-content h1, .page-header h1 {
    color: #ffffff !important;
}

article h2, .article-wrap h2, .article-content h2, .news-content h2, .article-body h2 {
    color: #a8b4ff !important;
    border-left: 4px solid #5e6ad2;
    padding-left: 12px;
}

article h3, .article-wrap h3, .article-content h3, .news-content h3, .article-body h3 {
    color: #c8ccf5 !important;
}
