@charset "utf-8";
/* ===========================================================================
   产品中心二级栏目聚合页样式   v1.0   （全新组件语言）
   文件位置：/website/cus/css/product.css        （新增文件）
   挂载方式：BNY/library/platform/cus/view/body.html 里加一行 link，
             用 {if(nonull($$catalog))} 限定只在产品聚合页加载。
   ---------------------------------------------------------------------------
   为什么另起一套，而不是扩展 agg.css：
     agg.css 是「文章列表页」的组件语言 —— 左图右文条目、灰色小标签、
     底部居中数字分页、热门文章侧栏。产品聚合页如果照搬，页面会同质化。
     本文件与 agg.css 零交叉：不改 agg.css 里任何一条选择器，也不复用它的类名。
   ---------------------------------------------------------------------------
   与文章聚合页的显性差异（同品牌系统，不同组件语言）：
     ① 栏目头   文章页：白底 + 红左边线 H1 / 产品页：满宽深色刊头 + 右侧规格卡
     ② 分面     文章页：灰底小标签          / 产品页：规格条（白底方角 chip + 计数）
     ③ 列表     文章页：左图右文横向条目    / 产品页：三列商品卡网格（图上文下）
     ④ 分页     文章页：底部居中数字分页    / 产品页：工具栏（本页 N 款 / 共 M 款 + 翻页）
     ⑤ 内容区   文章页：H2 + 段落           / 产品页：编号式章节（01/02…）+ 密集表格
     ⑥ 品牌段   文章页：白底                  / 产品页：深色块，与刊头首尾呼应
     ⑦ 侧栏     文章页：热门文章 Top6 + CTA  / 产品页：分类树 + 本页目录 + 预算速查 + CTA
   ---------------------------------------------------------------------------
   尺寸基准：沿用站点既有 rem 体系（与 style.css / article.css / agg.css 一致）
     桌面（>1023px）1rem = 视口宽 / 19.2     1920px 下 1rem = 100px
     移动（<=1023px）1rem = 视口宽 / 7.5      390px 下 1rem = 52px
   取色沿用站点既有值：
     品牌红 #d40003 · 墨黑 #1b1b1d · 正文 #1a1a1a · 次要 #888 · 弱化 #b5b5b5
     分隔线 #e6e6e6 · 浅底 #f7f8f9
   =========================================================================== */

/* ---------- 0. 两列容器（沿用站点既有 float 栅格） ---------- */
.cat-cols::after {
    display: block; content: "\20"; height: 0; clear: both;
    overflow: hidden; visibility: hidden;
}

/* ===========================================================================
   1. 满宽深色刊头
   离开 .w14rem 容器、直接铺满 1920，视觉上与文章页的白色栏目头彻底区分。
   =========================================================================== */
.cat-head {
    position: relative;
    padding: 0.38rem 0 0.34rem;
    background: #1b1b1d;
}
.cat-head::before {
    content: "";
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 0.05rem;
    background: #d40003;
}
.cat-head-in {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.cat-hd-l { flex: 1; min-width: 0; padding-right: 0.60rem; }

.cat-h1 {
    display: block;
    margin: 0;
    font-size: 0.42rem;
    line-height: 0.54rem;
    font-weight: bold;
    color: #ffffff;
}
.cat-h1 i {
    display: block;
    margin-top: 0.08rem;
    font-size: 0.17rem;
    line-height: 0.28rem;
    font-weight: normal;
    font-style: normal;
    color: #9a9a9a;
}
.cat-en {
    margin: 0.18rem 0 0;
    font-size: 0.11rem;
    line-height: 0.20rem;
    letter-spacing: 0.08em;
    color: #6d6d6d;
    text-transform: uppercase;
}
.cat-tagline {
    margin: 0.18rem 0 0;
    padding-left: 0.16rem;
    font-size: 0.16rem;
    line-height: 0.28rem;
    color: #c4c4c4;
    border-left: 0.03rem solid #d40003;
}

/* 刊头导语：说明本页收录什么、按什么口径组织 —— 生成式引擎需要的「页面自述」 */
.cat-lead {
    max-width: 6.60rem;
    margin: 0.20rem 0 0;
    font-size: 0.14rem;
    line-height: 0.26rem;
    color: #a8a8a8;
}
.cat-lead + .cat-lead { margin-top: 0.10rem; }

/* 右侧规格卡：本栏目 4 项可直接引用的数字 */
.cat-spec {
    display: flex;
    flex-wrap: wrap;
    flex: 0 0 4.00rem;
    width: 4.00rem;
    margin: 0.04rem 0 0;
    padding: 0 0 0 0.36rem;
    border-left: 1px solid #36363a;
}
.cat-spec dl {
    flex: 0 0 50%;
    width: 50%;
    margin: 0 0 0.22rem;
    padding: 0;
    box-sizing: border-box;
}
.cat-spec dl:nth-last-child(-n+2) { margin-bottom: 0; }
.cat-spec dt {
    font-size: 0.26rem;
    line-height: 0.34rem;
    font-weight: bold;
    color: #ffffff;
    font-family: Arial, "Microsoft YaHei", sans-serif;
}
.cat-spec dt em {
    margin-left: 0.05rem;
    font-size: 0.12rem;
    font-style: normal;
    font-weight: normal;
    color: #8a8a8a;
}
.cat-spec dd {
    margin: 0.03rem 0 0;
    font-size: 0.12rem;
    line-height: 0.18rem;
    color: #8a8a8a;
}

/* ===========================================================================
   2. 规格条（替代文章页的灰色小标签）
   =========================================================================== */
.cat-rail {
    margin: 0.26rem 0 0;
    padding: 0.20rem 0.24rem 0.10rem;
    background: #f7f8f9;
    border: 1px solid #ededed;
}
.cat-rail-row {
    display: flex;
    align-items: flex-start;
    margin: 0 0 0.10rem;
}
.cat-rail-k {
    flex: 0 0 1.30rem;
    font-size: 0.13rem;
    line-height: 0.30rem;
    color: #999999;
}
.cat-rail-v { flex: 1; min-width: 0; }
.cat-chip {
    display: inline-block;
    margin: 0 0.10rem 0.10rem 0;
    padding: 0.04rem 0.14rem;
    font-size: 0.14rem;
    line-height: 0.22rem;
    color: #333333;
    background: #ffffff;
    border: 1px solid #dcdcdc;
}
.cat-chip em {
    margin-left: 0.08rem;
    font-style: normal;
    font-size: 0.12rem;
    color: #d40003;
    font-family: Arial, sans-serif;
}
.cat-rail-note {
    margin: 0.02rem 0 0.06rem;
    font-size: 0.12rem;
    line-height: 0.20rem;
    color: #a8a8a8;
}

/* ===========================================================================
   3. 工具栏（本页 N 款 / 共 M 款 + 翻页）
   =========================================================================== */
.cat-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0.30rem 0 0;
    padding: 0 0 0.12rem;
    border-bottom: 2px solid #1b1b1d;
}
.cat-toolbar-b { margin-top: 0.10rem; border-bottom: 0; border-top: 2px solid #1b1b1d; padding: 0.14rem 0 0; }
.cat-count { font-size: 0.14rem; line-height: 0.24rem; color: #777777; }
.cat-count b { font-size: 0.20rem; color: #d40003; font-family: Arial, sans-serif; }

.cat-pager { display: flex; flex-wrap: wrap; align-items: center; }
.cat-pg {
    display: inline-block;
    min-width: 0.30rem;
    height: 0.30rem;
    margin-left: 0.06rem;
    padding: 0 0.10rem;
    font-size: 0.14rem;
    line-height: 0.28rem;
    color: #555555;
    text-align: center;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid #dcdcdc;
    box-sizing: border-box;
}
.cat-pg:hover { color: #ffffff; background: #d40003; border-color: #d40003; }
.cat-pg.on {
    color: #ffffff;
    background: #1b1b1d;
    border-color: #1b1b1d;
    font-weight: bold;
}
.cat-pg.off { color: #c8c8c8; background: #fafafa; border-color: #eeeeee; }
.cat-pg.gap { min-width: 0; color: #b0b0b0; background: transparent; border: 0; }
/* 跳转用的是原生 GET 表单：不依赖 JS，回车即可提交 */
.cat-jump {
    display: flex;
    align-items: center;
    margin-left: 0.10rem;
    font-size: 0.13rem;
    line-height: 0.30rem;
    color: #999999;
}
.cat-jump > span { margin: 0 0.04rem; }
.cat-jump input {
    width: 0.50rem;
    height: 0.28rem;
    margin: 0 0.05rem;
    padding: 0 0.04rem;
    font-size: 0.13rem;
    text-align: center;
    color: #333333;
    background: #ffffff;
    border: 1px solid #dcdcdc;
    box-sizing: border-box;
}
.cat-jump button {
    height: 0.28rem;
    margin-left: 0.06rem;
    padding: 0 0.12rem;
    font-size: 0.13rem;
    line-height: 0.28rem;
    color: #ffffff;
    background: #1b1b1d;
    border: 0;
    cursor: pointer;
}
.cat-jump button:hover { background: #d40003; }

/* ===========================================================================
   4. 产品卡网格（三列）
   =========================================================================== */
.cat-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0.26rem -0.125rem 0;
}
.cat-card {
    position: relative;
    width: 3.40rem;
    margin: 0 0.125rem 0.25rem;
    background: #ffffff;
    border: 1px solid #e8e8e8;
    box-sizing: border-box;
    transition: border-color .2s, box-shadow .2s, transform .2s;
}
.cat-card:hover {
    border-color: #d40003;
    box-shadow: 0 0.06rem 0.20rem rgba(0, 0, 0, .10);
    transform: translateY(-0.03rem);
}

.cat-shot {
    display: block;
    position: relative;
    height: 2.40rem;
    overflow: hidden;
    background: #f7f8f9;
}
/* 站内产品图两种来源混用：1:1 的产品照（320×300、547×546）与 1.8:1 的带字宣传图
   （438×233、436×233）。用 contain 而不是 cover，避免宣传图上的文字被裁掉。 */
.cat-shot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .35s;
}
.cat-card:hover .cat-shot img { transform: scale(1.04); }
/* 无配图：以品牌红细线块替代图片位，保持卡片视觉重量一致 */
.cat-shot.noimg { background: #fbfbfb; }
.cat-shot.noimg::after {
    content: "暂无配图";
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.13rem;
    color: #c8c8c8;
}

/* 系列徽标：压在图片左上角 */
.cat-serial {
    position: absolute;
    left: 0; top: 0;
    padding: 0.04rem 0.12rem;
    font-size: 0.12rem;
    line-height: 0.20rem;
    color: #ffffff;
    background: rgba(27, 27, 29, .84);
    letter-spacing: 0.02em;
}

.cat-cbody { padding: 0.16rem 0.18rem 0.14rem; }
.cat-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 0.58rem;
    margin: 0;
    font-size: 0.18rem;
    line-height: 0.29rem;
    font-weight: bold;
    color: #1a1a1a;
}
.cat-name a { color: inherit; text-decoration: none; }
.cat-card:hover .cat-name a { color: #d40003; }
.cat-fit {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 0.44rem;
    margin: 0.10rem 0 0;
    font-size: 0.13rem;
    line-height: 0.22rem;
    color: #8c8c8c;
}
.cat-ask {
    height: 0.20rem;
    margin: 0.06rem 0 0;
    overflow: hidden;
    font-size: 0.12rem;
    line-height: 0.20rem;
    color: #b5b5b5;
}

.cat-buy {
    display: flex;
    align-items: baseline;
    padding: 0.12rem 0.18rem 0.14rem;
    background: #fafafa;
    border-top: 1px dashed #ececec;
}
.cat-buy > span {
    margin-right: 0.06rem;
    font-size: 0.12rem;
    line-height: 0.24rem;
    color: #999999;
}
.cat-buy > b {
    font-size: 0.24rem;
    line-height: 0.30rem;
    font-weight: bold;
    color: #d40003;
    font-family: Arial, "Microsoft YaHei", sans-serif;
}
.cat-buy > em {
    margin-left: 0.05rem;
    font-style: normal;
    font-size: 0.12rem;
    line-height: 0.24rem;
    color: #aaaaaa;
}
.cat-buy.ask > b { font-size: 0.15rem; color: #888888; }

/* ===========================================================================
   5. 编号式章节（选购指南）
   =========================================================================== */
.cat-doc { margin: 0.20rem 0 0; }
.cat-ch { margin: 0.52rem 0 0; }
.cat-ch > header {
    display: flex;
    align-items: flex-start;
    padding: 0 0 0.12rem;
    border-bottom: 2px solid #1b1b1d;
}
.cat-ch > header > b {
    flex: 0 0 0.66rem;
    font-size: 0.34rem;
    line-height: 0.44rem;
    font-weight: bold;
    color: #d40003;
    font-family: Arial, sans-serif;
    letter-spacing: -0.01em;
}
.cat-ch > header > h2 {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: 0.24rem;
    line-height: 0.40rem;
    font-weight: bold;
    color: #1a1a1a;
}
.cat-ch > header > h2 > i {
    display: block;
    margin-top: 0.02rem;
    font-size: 0.11rem;
    line-height: 0.20rem;
    font-weight: normal;
    font-style: normal;
    color: #b5b5b5;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cat-chb { padding: 0.20rem 0 0; }
.cat-chb a { color: #d40003; text-decoration: none; }
.cat-chb a:hover { border-bottom: 1px solid #d40003; }

.cat-note {
    margin: 0.18rem 0 0;
    padding: 0.16rem 0.20rem;
    font-size: 0.14rem;
    line-height: 0.26rem;
    color: #666666;
    background: #f7f8f9;
    border-left: 0.04rem solid #d40003;
}
.cat-note b { color: #1a1a1a; }

/* 相关阅读条：贴在每节末尾 */
.cat-doc .cat-art {
    margin: 0.20rem 0 0;
    padding: 0.14rem 0.18rem;
    background: #fbfbfb;
    border: 1px solid #efefef;
}
.cat-doc .cat-art > span {
    display: inline-block;
    margin: 0 0.10rem 0 0;
    padding: 0.02rem 0.10rem;
    font-size: 0.12rem;
    line-height: 0.20rem;
    color: #ffffff;
    background: #1b1b1d;
    vertical-align: 0.02rem;
}
.cat-doc .cat-art > ul { display: inline; margin: 0; padding: 0; list-style: none; }
.cat-doc .cat-art > ul,
.cat-doc .cat-art > ul > li { list-style: none; }
.cat-doc .cat-art > ul > li {
    display: inline;
    margin: 0;
    padding: 0;
    font-size: 0.13rem;
    line-height: 0.26rem;
    list-style: none;
}
.cat-doc .cat-art > ul > li + li::before { content: "｜"; margin: 0 0.04rem; color: #dcdcdc; }
.cat-doc .cat-art > ul > li > a { color: #666666; text-decoration: none; }
.cat-doc .cat-art > ul > li > a:hover { color: #d40003; }

/* ===========================================================================
   6. 品牌段（深色块，与刊头首尾呼应）
   =========================================================================== */
.cat-est {
    margin: 0.60rem 0 0;
    padding: 0.34rem 0.36rem 0.30rem;
    background: #1b1b1d;
}
.cat-est h2 {
    display: block;
    margin: 0 0 0.18rem;
    padding: 0 0 0.14rem;
    font-size: 0.24rem;
    line-height: 0.36rem;
    font-weight: bold;
    color: #ffffff;
    border-bottom: 1px solid #36363a;
}
.cat-est h2 i {
    float: right;
    font-style: normal;
    font-size: 0.11rem;
    font-weight: normal;
    color: #6d6d6d;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cat-est p {
    margin: 0 0 0.14rem;
    font-size: 0.15rem;
    line-height: 0.28rem;
    color: #c2c2c2;
}
.cat-est-list { margin: 0.18rem 0 0; padding: 0; list-style: none; }
.cat-est-list > li {
    position: relative;
    margin: 0 0 0.10rem;
    padding: 0 0 0 0.20rem;
    font-size: 0.14rem;
    line-height: 0.26rem;
    color: #c2c2c2;
    list-style: none;
}
.cat-est-list > li::before {
    content: "";
    position: absolute;
    left: 0; top: 0.10rem;
    width: 0.07rem; height: 0.07rem;
    background: #d40003;
}

/* ===========================================================================
   7. 常见问题
   =========================================================================== */
.cat-faq { margin: 0.50rem 0 0; }
.cat-faq > h2 {
    display: block;
    margin: 0 0 0.22rem;
    padding: 0 0 0.12rem;
    font-size: 0.24rem;
    line-height: 0.36rem;
    font-weight: bold;
    color: #1a1a1a;
    border-bottom: 2px solid #1b1b1d;
}
.cat-faq > h2 i {
    float: right;
    font-style: normal;
    font-size: 0.11rem;
    font-weight: normal;
    color: #b5b5b5;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cat-qa {
    margin: 0 0 0.18rem;
    padding: 0 0 0.16rem;
    border-bottom: 1px dashed #ececec;
}
.cat-qa:last-child { border-bottom: 0; padding-bottom: 0; }
.cat-q {
    display: flex;
    margin: 0 0 0.10rem;
    font-size: 0.17rem;
    line-height: 0.28rem;
    font-weight: bold;
    color: #1a1a1a;
}
.cat-q > i {
    flex: 0 0 0.34rem;
    font-style: normal;
    font-weight: bold;
    color: #d40003;
    font-family: Arial, sans-serif;
}
.cat-a {
    margin: 0;
    padding-left: 0.34rem;
    font-size: 0.15rem;
    line-height: 0.27rem;
    color: #666666;
}

/* ===========================================================================
   8. 产品页专属侧栏
   =========================================================================== */
.cat-side { width: 3rem; }
.cat-side-box { margin: 0 0 0.30rem; }
.cat-side-box > h3 {
    display: block;
    margin: 0;
    padding: 0 0 0.10rem;
    font-size: 0.18rem;
    line-height: 0.30rem;
    font-weight: bold;
    color: #1a1a1a;
    border-bottom: 2px solid #1b1b1d;
}
.cat-side-box > h3 > i {
    float: right;
    font-style: normal;
    font-size: 0.11rem;
    font-weight: normal;
    color: #b5b5b5;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cat-side-box > ul { margin: 0; padding: 0.06rem 0 0; list-style: none; }
.cat-side-box > ul > li {
    margin: 0;
    padding: 0;
    font-size: 0.15rem;
    line-height: 0.34rem;
    list-style: none;
}
.cat-side-box > ul > li > a {
    display: block;
    padding: 0 0 0 0.14rem;
    color: #555555;
    text-decoration: none;
    border-left: 1px solid #e6e6e6;
}
.cat-side-box > ul > li > a:hover { color: #d40003; border-left-color: #d40003; }
.cat-side-box > ul > li.on > a {
    color: #d40003;
    font-weight: bold;
    background: #fbf5f5;
    border-left-color: #d40003;
}
/* 本页目录：编号 + 标题 */
.cat-side-box.toc > ul > li { font-size: 0.14rem; line-height: 0.26rem; }
.cat-side-box.toc > ul > li > a { padding: 0.06rem 0 0.06rem 0.14rem; }
.cat-side-box.toc > ul > li > a > b {
    margin-right: 0.08rem;
    font-family: Arial, sans-serif;
    color: #d40003;
}
/* 预算 / 配置速查 */
.cat-side-box.quick > ul > li {
    font-size: 0.14rem;
    line-height: 0.30rem;
    color: #666666;
    border-bottom: 1px dashed #f0f0f0;
}
.cat-side-box.quick > ul > li:last-child { border-bottom: 0; }
.cat-side-box.quick > ul > li > span {
    float: right;
    color: #d40003;
    font-family: Arial, "Microsoft YaHei", sans-serif;
}

.cat-cta { margin: 0 0 0.30rem; padding: 0.22rem 0.20rem; background: #d40003; }
.cat-cta p { margin: 0; font-size: 0.15rem; line-height: 0.26rem; color: #ffffff; }
.cat-cta b {
    display: block;
    margin: 0.05rem 0 0;
    font-size: 0.24rem;
    line-height: 0.34rem;
    font-weight: bold;
    color: #ffffff;
}
.cat-cta p + p { margin-top: 0.06rem; font-size: 0.13rem; line-height: 0.22rem; color: #ffd9d9; }

/* ===========================================================================
   移动端（<=1023px）：1rem = 视口宽 / 7.5
   =========================================================================== */
@media screen and (max-width: 1023px) {

    /* 两列改纵向：内容区在前，侧栏排到列表与指南之后 */
    .cat-cols { display: flex; flex-direction: column; }
    .cat-cols > .right_Xenter { order: 1; }
    .cat-cols > .cat-side { order: 2; width: 100%; padding: 0.40rem 0.24rem 0; box-sizing: border-box; }

    /* ---- 刊头 ---- */
    .cat-head { padding: 0.44rem 0.24rem 0.40rem; }
    .cat-head::before { height: 0.08rem; }
    .cat-head-in { display: block; }
    .cat-hd-l { padding-right: 0; }
    .cat-h1 { font-size: 0.52rem; line-height: 0.70rem; }
    .cat-h1 i { margin-top: 0.12rem; font-size: 0.26rem; line-height: 0.42rem; }
    .cat-en { margin-top: 0.20rem; font-size: 0.18rem; line-height: 0.28rem; }
    .cat-tagline {
        margin-top: 0.22rem;
        padding-left: 0.20rem;
        font-size: 0.26rem;
        line-height: 0.44rem;
        border-left-width: 0.06rem;
    }
    .cat-lead {
        max-width: none;
        margin-top: 0.24rem;
        font-size: 0.24rem;
        line-height: 0.42rem;
    }
    .cat-lead + .cat-lead { margin-top: 0.16rem; }
    .cat-spec {
        flex: none;
        width: 100%;
        margin: 0.36rem 0 0;
        padding: 0.30rem 0 0;
        border-left: 0;
        border-top: 1px solid #36363a;
    }
    .cat-spec dl { flex: 0 0 50%; width: 50%; margin-bottom: 0.30rem; }
    .cat-spec dt { font-size: 0.44rem; line-height: 0.56rem; }
    .cat-spec dt em { font-size: 0.20rem; margin-left: 0.08rem; }
    .cat-spec dd { margin-top: 0.04rem; font-size: 0.20rem; line-height: 0.30rem; }

    /* ---- 规格条 ---- */
    .cat-rail { margin: 0.30rem 0.24rem 0; padding: 0.24rem 0.24rem 0.14rem; }
    .cat-rail-row { display: block; margin-bottom: 0.16rem; }
    .cat-rail-k {
        display: block;
        flex: none;
        font-size: 0.22rem;
        line-height: 0.34rem;
        margin-bottom: 0.06rem;
    }
    .cat-chip {
        margin: 0 0.14rem 0.14rem 0;
        padding: 0.06rem 0.18rem;
        font-size: 0.22rem;
        line-height: 0.34rem;
    }
    .cat-chip em { font-size: 0.20rem; margin-left: 0.10rem; }
    .cat-rail-note { font-size: 0.20rem; line-height: 0.32rem; }

    /* ---- 工具栏 ---- */
    .cat-toolbar {
        display: block;
        margin: 0.34rem 0.24rem 0;
        padding-bottom: 0.16rem;
    }
    .cat-toolbar-b { margin-top: 0.20rem; padding: 0.20rem 0 0; }
    .cat-count { font-size: 0.22rem; line-height: 0.36rem; margin-bottom: 0.10rem; }
    .cat-count b { font-size: 0.32rem; }
    .cat-pg {
        min-width: 0.60rem;
        height: 0.60rem;
        margin: 0 0.10rem 0.10rem 0;
        padding: 0 0.18rem;
        font-size: 0.24rem;
        line-height: 0.56rem;
    }
    .cat-jump { display: block; width: 100%; margin: 0.06rem 0 0; font-size: 0.22rem; line-height: 0.60rem; }
    .cat-jump input { width: 1.00rem; height: 0.56rem; font-size: 0.24rem; }
    .cat-jump button { height: 0.56rem; margin-left: 0.12rem; padding: 0 0.24rem; font-size: 0.22rem; line-height: 0.56rem; }

    /* ---- 产品卡：移动端改两列 ---- */
    .cat-grid { margin: 0.28rem 0.24rem 0; }
    .cat-card { width: 3.46rem; margin: 0 0.16rem 0.24rem 0; }
    .cat-card:nth-child(2n) { margin-right: 0; }
    .cat-shot { height: 2.30rem; }
    .cat-serial { padding: 0.04rem 0.14rem; font-size: 0.20rem; line-height: 0.32rem; }
    .cat-cbody { padding: 0.16rem 0.16rem 0.12rem; }
    .cat-name { height: 0.74rem; font-size: 0.26rem; line-height: 0.37rem; }
    .cat-fit { height: 0.62rem; margin-top: 0.10rem; font-size: 0.20rem; line-height: 0.31rem; }
    .cat-ask { height: 0.32rem; margin-top: 0.06rem; font-size: 0.19rem; line-height: 0.32rem; }
    .cat-buy { padding: 0.12rem 0.16rem 0.14rem; }
    .cat-buy > span { font-size: 0.19rem; line-height: 0.34rem; }
    .cat-buy > b { font-size: 0.32rem; line-height: 0.42rem; }
    .cat-buy > em { font-size: 0.19rem; line-height: 0.34rem; }
    .cat-buy.ask > b { font-size: 0.22rem; }

    /* ---- 编号式章节 ---- */
    .cat-doc { margin: 0.30rem 0.24rem 0; }
    .cat-ch { margin-top: 0.56rem; }
    .cat-ch > header { padding-bottom: 0.16rem; }
    .cat-ch > header > b { flex: 0 0 0.86rem; font-size: 0.50rem; line-height: 0.70rem; }
    .cat-ch > header > h2 { font-size: 0.34rem; line-height: 0.50rem; }
    .cat-ch > header > h2 > i { font-size: 0.18rem; line-height: 0.30rem; }
    .cat-chb { padding-top: 0.24rem; }
    .cat-note {
        margin-top: 0.22rem;
        padding: 0.20rem 0.22rem;
        font-size: 0.24rem;
        line-height: 0.40rem;
        border-left-width: 0.08rem;
    }
    .cat-doc .cat-art { margin-top: 0.24rem; padding: 0.18rem 0.20rem; }
    .cat-doc .cat-art > span { margin-bottom: 0.08rem; font-size: 0.20rem; line-height: 0.32rem; }
    .cat-doc .cat-art > ul > li { font-size: 0.22rem; line-height: 0.42rem; }

    /* ---- 品牌段 ---- */
    .cat-est { margin: 0.60rem 0 0; padding: 0.34rem 0.24rem 0.30rem; }
    .cat-est h2 { font-size: 0.34rem; line-height: 0.50rem; }
    .cat-est h2 i { font-size: 0.18rem; }
    .cat-est p { font-size: 0.24rem; line-height: 0.42rem; margin-bottom: 0.18rem; }
    .cat-est-list { margin-top: 0.22rem; }
    .cat-est-list > li {
        margin-bottom: 0.14rem;
        padding-left: 0.28rem;
        font-size: 0.24rem;
        line-height: 0.42rem;
    }
    .cat-est-list > li::before { top: 0.15rem; width: 0.12rem; height: 0.12rem; }

    /* ---- 常见问题 ---- */
    .cat-faq { margin: 0.56rem 0.24rem 0; }
    .cat-faq > h2 { font-size: 0.34rem; line-height: 0.50rem; margin-bottom: 0.26rem; }
    .cat-faq > h2 i { font-size: 0.18rem; }
    .cat-qa { margin-bottom: 0.24rem; padding-bottom: 0.22rem; }
    .cat-q { font-size: 0.28rem; line-height: 0.44rem; margin-bottom: 0.12rem; }
    .cat-q > i { flex: 0 0 0.50rem; }
    .cat-a { padding-left: 0.50rem; font-size: 0.24rem; line-height: 0.42rem; }

    /* ---- 侧栏 ---- */
    .cat-side-box { margin-bottom: 0.44rem; }
    .cat-side-box > h3 { font-size: 0.30rem; line-height: 0.50rem; padding-bottom: 0.14rem; }
    .cat-side-box > h3 > i { font-size: 0.18rem; }
    .cat-side-box > ul { padding-top: 0.12rem; }
    .cat-side-box > ul > li { font-size: 0.26rem; line-height: 0.62rem; }
    .cat-side-box > ul > li > a { padding-left: 0.22rem; }
    .cat-side-box.toc > ul > li { font-size: 0.24rem; line-height: 0.48rem; }
    .cat-side-box.toc > ul > li > a { padding: 0.10rem 0 0.10rem 0.22rem; }
    .cat-side-box.quick > ul > li { font-size: 0.24rem; line-height: 0.52rem; }
    .cat-cta { margin-bottom: 0.20rem; padding: 0.30rem 0.24rem; }
    .cat-cta p { font-size: 0.26rem; line-height: 0.44rem; }
    .cat-cta b { font-size: 0.40rem; line-height: 0.56rem; }
    .cat-cta p + p { font-size: 0.22rem; line-height: 0.36rem; }
}

/* ===========================================================================
   9. v1.1 浅色化（2026-10-11）
   ---------------------------------------------------------------------------
   背景：深色刊头（墨黑 #1b1b1d）与整站「白底 + 品牌红点缀」的调性脱节。
   做法：完全照抄「产品详情页 GEO 改造样式 v1.1（浅色版）」的浅色语言 ——
        白底 + 1px #e6e6e6 细边框 + 品牌红细线/红数字点缀，去掉全部深色底。
   本节只覆盖颜色与描边，不改任何尺寸、间距与 DOM 结构。
   回退：删除本节即可回到 v1.0 深色版（另见 product.css.v1.0.dark）。
   =========================================================================== */
/* --- 刊头文字：白/灰 → 深灰阶 --- */
.cat-h1{color:#1a1a1a;}
.cat-h1 i{color:#777777;}
.cat-en{color:#b5b5b5;}
.cat-lead{color:#666666;}
.cat-lead strong{color:#1a1a1a;}
.cat-spec{border-left-color:#e6e6e6;}
.cat-spec dt{color:#d40003;}
.cat-spec dt em{color:#999999;}
.cat-spec dd{color:#999999;}
.cat-rail{border-color:#e6e6e6;}

/* --- 结构线：2px 墨黑 → 1px 浅灰 + 一小段品牌红（详情页 .pd-ch::after 同款） --- */
.cat-toolbar{border-bottom:1px solid #e6e6e6;position:relative;}
.cat-toolbar::after{content:"";position:absolute;left:0;bottom:-1px;width:0.72rem;height:2px;background:#d40003;}
.cat-toolbar-b{border-bottom:0;border-top:1px solid #e6e6e6;}
.cat-toolbar-b::after{top:-1px;bottom:auto;}
.cat-ch > header{border-bottom:1px solid #e6e6e6;position:relative;}
.cat-ch > header::after{content:"";position:absolute;left:0;bottom:-1px;width:0.72rem;height:2px;background:#d40003;}
.cat-faq > h2{border-bottom:1px solid #e6e6e6;position:relative;}
.cat-faq > h2::after{content:"";position:absolute;left:0;bottom:-1px;width:0.72rem;height:2px;background:#d40003;}
.cat-side-box > h3{border-bottom:1px solid #e6e6e6;position:relative;}
.cat-side-box > h3::after{content:"";position:absolute;left:0;bottom:-1px;width:0.72rem;height:2px;background:#d40003;}

/* --- 小黑色块 → 品牌红 --- */
.cat-pg.on{background:#d40003;border-color:#d40003;}
.cat-jump button{background:#d40003;}
.cat-serial{background:rgba(212,0,3,.90);}
.cat-doc .cat-art > span{background:#d40003;}

/* --- 品牌段：深色块 → 浅色块 --- */
.cat-est h2{color:#1a1a1a;border-bottom-color:#e6e6e6;}
.cat-est h2 i{color:#b5b5b5;}
.cat-est p,.cat-est-list > li{color:#666666;}
.cat-est-list > li::before{background:#d40003;}
.cat-est{background:#f7f8f9;border-left:0.03rem solid #c8c8c8;}

/* --- 移动端规格卡的上边框 --- */
@media screen and (max-width:1023px){
    .cat-spec{border-top-color:#e6e6e6;}
}

.cat-head{background:#ffffff;border-bottom:1px solid #e6e6e6;}
.cat-head::before{background:#d40003;}
.cat-tagline{padding:0.10rem 0.16rem;color:#7a4a4a;background:#fdf6f6;border-left:0.03rem solid #d40003;}