@charset "utf-8";
/* ==========================================================================
   中英双语 — 语言切换按钮 + 中文字体
   由 scripts/i18n.py 注入引用。改样式直接改本文件。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 中文字体
   站点拉丁字体是 Inter（不含中文字形），中文会掉到系统默认字体，
   不同电脑看到的效果天差地别。这里用 unicode-range 给每个 Inter 族名
   挂上中文分片：拉丁字符照旧走 Inter，中文自动走 Noto Sans SC。
   字体：Noto Sans SC，SIL Open Font License 1.1，免费商用。

   ⚠️ font-weight 必须写 400，不能写 100 900（2026-09-24 狗哥反馈
   「中文太细、加粗也没质感」后修）：NotoSansSC-sub.woff2 是常规体单字重
   文件，声明成 100–900 会骗过浏览器 —— 它以为该字体自带全部字重，于是
   CSS 要 600/700 时也照用这个常规体、**不做合成加粗**，中文就永远粗不起来。
   声明成 400 之后，凡是 CSS 要求 >400 的地方，浏览器在同族内找不到更粗的
   face，会自动合成伪粗体，中文立刻有质感。≤400 的地方不受影响。
   -------------------------------------------------------------------------- */
@font-face {
    font-family: 'Inter-Light';
    src: url('../font/NotoSansSC-sub.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2E80-2EFF, U+3000-303F, U+3040-30FF, U+31C0-31EF,
                   U+3200-32FF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF,
                   U+FE30-FE4F, U+FF00-FFEF, U+2010-203B;
}
@font-face {
    font-family: 'Inter-Regular';
    src: url('../font/NotoSansSC-sub.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2E80-2EFF, U+3000-303F, U+3040-30FF, U+31C0-31EF,
                   U+3200-32FF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF,
                   U+FE30-FE4F, U+FF00-FFEF, U+2010-203B;
}
@font-face {
    font-family: 'Inter-Medium';
    src: url('../font/NotoSansSC-sub.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2E80-2EFF, U+3000-303F, U+3040-30FF, U+31C0-31EF,
                   U+3200-32FF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF,
                   U+FE30-FE4F, U+FF00-FFEF, U+2010-203B;
}
@font-face {
    font-family: 'Inter-SemiBold';
    src: url('../font/NotoSansSC-sub.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2E80-2EFF, U+3000-303F, U+3040-30FF, U+31C0-31EF,
                   U+3200-32FF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF,
                   U+FE30-FE4F, U+FF00-FFEF, U+2010-203B;
}
@font-face {
    font-family: 'Inter-Bold';
    src: url('../font/NotoSansSC-sub.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2E80-2EFF, U+3000-303F, U+3040-30FF, U+31C0-31EF,
                   U+3200-32FF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF,
                   U+FE30-FE4F, U+FF00-FFEF, U+2010-203B;
}

/* --------------------------------------------------------------------------
   2. 语言切换按钮（页头右上角，导航与搜索图标之间）
   -------------------------------------------------------------------------- */
#pc_header .right .lang_sw {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 2.125rem;
    padding: 0 .375rem;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 2rem;
    background-color: rgba(255, 255, 255, .07);
    transition: border-color .3s ease, background-color .3s ease;
}
#pc_header .right .lang_sw:hover {
    border-color: rgba(255, 255, 255, .6);
    background-color: rgba(255, 255, 255, .14);
}
#pc_header .right .lang_sw a {
    display: block;
    padding: 0 .6875rem;
    font-family: 'Inter-Medium', Arial, sans-serif;
    font-size: .9375rem;
    line-height: 1;
    font-weight: 500;
    color: #fff;
    opacity: .5;
    white-space: nowrap;
    transition: opacity .25s ease;
}
#pc_header .right .lang_sw a:hover { opacity: 1; }
#pc_header .right .lang_sw a.on { opacity: 1; font-weight: 600; }
#pc_header .right .lang_sw i {
    display: block;
    width: 1px;
    height: .875rem;
    flex-shrink: 0;
    background-color: rgba(255, 255, 255, .32);
}

/* 页头滚动 / 浅色状态下的适配。
   ⚠️ 类名必须是 .xg —— base.js 滚动时加的是 `$('#pc_header').addClass('xg')`，
   原先这里写的是 .hd_on / .on，两个类全站根本不存在，
   于是页头一变白、语言切换按钮还是白字，整个按钮在页面上「消失」了。
   （.hd_on / .on 一并保留，以防将来有别的脚本用这两个名字。） */
#pc_header.xg .right .lang_sw,
#pc_header.hd_on .right .lang_sw,
#pc_header.on .right .lang_sw {
    border-color: rgba(19, 54, 144, .3);
    background-color: rgba(19, 54, 144, .06);
}
#pc_header.xg .right .lang_sw a,
#pc_header.hd_on .right .lang_sw a,
#pc_header.on .right .lang_sw a { color: #133690; }
#pc_header.xg .right .lang_sw i,
#pc_header.hd_on .right .lang_sw i,
#pc_header.on .right .lang_sw i { background-color: rgba(19, 54, 144, .3); }

/* --------------------------------------------------------------------------
   2b. 手机端页头入口（#m_header 是白底深字，配色要反过来）
   #pc_header 在 1100px 以下整体隐藏，所以在 #m_header 里另放一个。
   -------------------------------------------------------------------------- */
#m_header .lang_sw_m {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: auto;
    height: 1.875rem;
    padding: 0 .25rem;
    border: 1px solid rgba(19, 54, 144, .28);
    border-radius: 2rem;
    background-color: rgba(19, 54, 144, .05);
}
#m_header .lang_sw_m a {
    display: block;
    padding: 0 .5rem;
    font-family: 'Inter-Medium', Arial, sans-serif;
    font-size: .8125rem;
    line-height: 1;
    font-weight: 500;
    color: #133690;
    opacity: .5;
    white-space: nowrap;
    transition: opacity .25s ease;
}
#m_header .lang_sw_m a:hover { opacity: 1; }
#m_header .lang_sw_m a.on { opacity: 1; font-weight: 600; }
#m_header .lang_sw_m i {
    display: block;
    width: 1px;
    height: .75rem;
    flex-shrink: 0;
    background-color: rgba(19, 54, 144, .3);
}
/* 窄屏：LOGO 让位，语言按钮再收紧一档 */
#m_header .box .logo { min-width: 0; }
#m_header .box .logo img { max-width: 100%; }
@media (max-width: 480px) {
    #m_header .lang_sw_m { height: 1.75rem; padding: 0 .1875rem; }
    #m_header .lang_sw_m a { padding: 0 .375rem; font-size: .75rem; }
}

/* --------------------------------------------------------------------------
   3. 中文模式下的排版微调
   中文没有大小写、字面更宽，几处标题需要放宽行高、取消字距。
   -------------------------------------------------------------------------- */
html[data-lang="zh"] body { letter-spacing: 0; }
html[data-lang="zh"] #banner .hz .txt h2,
html[data-lang="zh"] #n_banner .box h2 {
    line-height: 1.35;
    letter-spacing: .01em;
}
html[data-lang="zh"] .s_title h2,
html[data-lang="zh"] .tc_content .h2 {
    line-height: 1.4;
    letter-spacing: .01em;
}
html[data-lang="zh"] .ar_article p,
html[data-lang="zh"] .ar_article .p {
    line-height: 2;
}
/* 中文标题不再需要 capitalize */
html[data-lang="zh"] .s_title p,
html[data-lang="zh"] #pc_header .box .right ul li > a { text-transform: none; }

/* 语言切换按钮在中等屏幕下收紧，避免挤压导航 */
@media (max-width: 1550px) {
    #pc_header .right { gap: 2.5rem; }
    #pc_header .right ul { gap: 2.5rem; }
    #pc_header .right .lang_sw { padding: 0 .25rem; }
    #pc_header .right .lang_sw a { padding: 0 .5rem; font-size: .875rem; }
}