/**
 * article.htm — 富文本正文默认排版 + 相关产品
 * 运营无需使用 class，用编辑器工具栏 / 内联 style 即可；内联样式优先于本文件默认值。
 * 五档：Phone≤767 | Small 768–1024 | Mid 1025–1439 | Large 1440–1679 | XLarge≥1680（定稿）
 */

/* 法务页等只引 article.css 时也要有档位比例（有 style.css 时与全站一致） */
:root {
    --kyd-text-scale: 1;
    --kyd-text-sm-min: 14px;
}
@media screen and (max-width: 767px) {
    :root { --kyd-text-scale: 0.7; }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    :root {
        --kyd-text-scale: clamp(
            0.7,
            calc(0.7 + (100vw - 768px) * 0.05 / 256px),
            0.75
        );
    }
}
@media screen and (min-width: 1025px) and (max-width: 1439px) {
    :root { --kyd-text-scale: 0.85; }
}
@media screen and (min-width: 1440px) and (max-width: 1679px) {
    :root { --kyd-text-scale: 0.9; }
}

.article-page {
    background-color: #ffffff;
}

/* 隐私 / 免责 / 使用条款：返回导航 */
.legal-page-nav {
    max-width: 800px;
    margin: 24px auto 0;
    padding: 0 20px;
    box-sizing: border-box;
    font-size: 14px;
}
.legal-page-nav a {
    color: #00233d;
    text-decoration: none;
}
.legal-page-nav a:hover {
    text-decoration: underline;
}
.article-page.legal-page .article-shell {
    padding-top: 24px;
}

/* CMS 富文本常带 text-wrap-mode:nowrap / 大号内联字号，窄屏会横向溢出看起来像裁切 */
.article-page.legal-page .article-body,
.article-page.legal-page .article-body * {
    text-wrap-mode: wrap !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
}

.article-shell {
    max-width: 800px;
    margin: 0 auto;
    padding: calc(var(--theme-header-height, 75px) + 10px) 20px 48px;
    box-sizing: border-box;
    color: #333333;
}

/* 仅默认排版；颜色/对齐等以富文本内联样式为准 */
.article-body {
    text-align: left;
    font-size: 15px;
    line-height: 1.8;
    color: #333333;
}

.article-body h1,
.article-body h2,
.article-body h3,
.article-body h4 {
    font-weight: 600;
    line-height: 1.35;
    margin: 36px 0 14px 0;
}

.article-body h1 {
    font-size: 24px;
}

.article-body h2 {
    font-size: 20px;
}

.article-body h3 {
    font-size: 16px;
}

.article-body h4 {
    font-size: 15px;
}

.article-body p {
    margin: 0 0 16px 0;
}

.article-body img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 28px auto;
}

.article-body ul,
.article-body ol {
    margin: 0 0 16px 0;
    padding-left: 1.35em;
}

.article-body li {
    margin-bottom: 8px;
}

.article-body a {
    text-decoration: underline;
}

.article-body strong,
.article-body b {
    font-weight: 600;
}

.article-body blockquote {
    margin: 20px 0;
    padding: 12px 16px;
    border-left: 3px solid #00d4ff;
    background: #f7f9fb;
}

/* 相关产品 */
.article-products {
    padding: 56px 0 24px;
    background-color: #ffffff;
}

.article-products .pc-section-title {
    margin-bottom: 44px;
}

.article-loading,
.article-empty {
    text-align: center;
    font-size: 15px;
    color: #666666;
    padding: 0 16px 24px;
}

/*
 * ========== 文章页五档 ==========
 * 正文壳本身 max-width:800，结构几乎不用动；主要接文案缩放 + 边距略收
 * 公式：max(14px, 定稿 × --kyd-text-scale)；≥1680 用定稿
 */

/* —— 文案缩放：≤1679 —— */
@media screen and (max-width: 1679px) {
    .article-body {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(15px * var(--kyd-text-scale, 1)));
    }
    .legal-page-nav {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(14px * var(--kyd-text-scale, 1)));
    }
    /* 覆盖正文内联 50px 等大标题，随档缩放 */
    .article-page.legal-page .article-body span[style*="font-size: 50px"],
    .article-page.legal-page .article-body span[style*="font-size:50px"] {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(50px * var(--kyd-text-scale, 1))) !important;
    }
    .article-page.legal-page .article-body span[style*="font-size: 24px"],
    .article-page.legal-page .article-body span[style*="font-size:24px"] {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(24px * var(--kyd-text-scale, 1))) !important;
    }
    .article-body h1 {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(24px * var(--kyd-text-scale, 1)));
    }
    .article-body h2 {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(20px * var(--kyd-text-scale, 1)));
    }
    .article-body h3 {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(16px * var(--kyd-text-scale, 1)));
    }
    .article-body h4 {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(15px * var(--kyd-text-scale, 1)));
    }
    .article-loading,
    .article-empty {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(15px * var(--kyd-text-scale, 1)));
    }
    .article-products .pc-section-title {
        font-size: max(var(--kyd-text-sm-min, 14px), calc(42px * var(--kyd-text-scale, 1)));
    }
}

/* —— Large 1440～1679 —— */
@media screen and (min-width: 1440px) and (max-width: 1679px) {
    .article-shell {
        padding-left: 28px;
        padding-right: 28px;
    }
    .article-products {
        padding: 48px 0 24px;
    }
}

/* —— Mid 1025～1439 —— */
@media screen and (min-width: 1025px) and (max-width: 1439px) {
    .article-shell {
        padding-left: 24px;
        padding-right: 24px;
        padding-bottom: 40px;
    }
    .article-products {
        padding: 44px 0 20px;
    }
    .article-products .pc-section-title {
        margin-bottom: 36px;
    }
}

/* —— Small 768～1024 —— */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .article-shell {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 36px;
    }
    .article-products {
        padding: 40px 0 20px;
    }
    .article-products .pc-section-title {
        margin-bottom: 32px;
    }
}

/* —— Phone ≤767（原 640 并入） —— */
@media screen and (max-width: 767px) {
    .article-shell {
        padding-top: calc(var(--theme-header-height, 75px) + 10px);
        padding-left: 16px;
        padding-right: 16px;
        padding-bottom: 32px;
    }
    .article-page.legal-page .article-shell {
        padding-top: 20px;
    }
    .legal-page-nav {
        margin-top: 16px;
        padding-left: 16px;
        padding-right: 16px;
    }
    .article-body h1,
    .article-body h2,
    .article-body h3,
    .article-body h4 {
        margin: 28px 0 12px 0;
    }
    .article-products {
        padding: 36px 0 16px;
    }
    .article-products .pc-section-title {
        margin-bottom: 28px;
    }
    /* 相关产品：单列居中（覆盖公共 pc-grid 的 start） */
    .article-products .pc-grid {
        grid-template-columns: minmax(0, 330px);
        justify-content: center;
        justify-items: center;
    }
}
