@charset "utf-8";
/* ============================================================
   about.css 企业简介｜整站安全版 v9  2026-09-05
   配色：深空蓝 #0A2647 + 钛橙 #E67E22 + 钛银灰 #f4f7fa
   编码：UTF-8 无 BOM
   ------------------------------------------------------------
   ============================================================ */



/* ============================================================
   一、about 区块自保基础（只作用于自身，不碰整站）
   ============================================================ */

/* 锚定 about 的三大容器：
   :has() 精准命中「内部含 about 结构」的 .container，
   整站其它 .container 不受影响。 */
/* ---- 安全层：不使用 :has，所有浏览器均生效 ---- */
section.container,
.about-section,
.data-block,
.advantage-block,
.brief-contact,
.about-banner {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;               /* 老浏览器回退 */
    overflow-x: clip;                 /* 现代浏览器：只裁自己，且不创建 BFC */
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ---- 增强层：若结构变化（container 非 section）用 :has 兜底 ---- */
@supports selector(:has(*)) {
    .container:has(> .about-wrap),
    .container:has(> .factory-wrap),
    .container:has(> .honor-list) {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        overflow-x: clip;
        overflow-wrap: break-word;
        word-break: break-word;
    }
}

/* 自身后代统一盒模型（避免 padding 撑破栅格） */
section.container *,
.about-section *,
.data-block *,
.advantage-block *,
.brief-contact *,
.about-banner * {
    box-sizing: border-box;
}

@supports selector(:has(*)) {
    .container:has(> .about-wrap) *,
    .container:has(> .factory-wrap) *,
    .container:has(> .honor-list) * {
        box-sizing: border-box;
    }
}

/* 图片自保：只在 about 作用域内生效，不污染整站图标/二维码 */
.about-img img,
.factory-img-group img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
}
/* 证书类图片保持原始比例，不变形 */
.honor-item img {
    display: block;
    width: auto;
    height: 180px;
    max-width: 100%;
    margin: 0 auto;
    object-fit: contain;
}

/* 栅格子项防撑破（grid 默认 min-width:auto，长内容会顶宽） */
.about-text,
.about-img,
.factory-img-group,
.factory-text,
.data-item,
.advantage-item,
.honor-item {
    min-width: 0;
}


/* ============================================================
   二、各板块样式（PC 优先，全 px）
   ============================================================ */

/* ========== Banner 首屏（仅 29.html 使用；30.html 用整站 banner） ========== */
.about-banner {
    height: 320px;
    background: #0A2647;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.about-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("images/banner-about.jpg") center center / cover;
    opacity: 0.2;
}
.banner-text {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #fff;
    padding: 0 20px;
    width: 100%;
}
.banner-text h1 {
    font-size: 38px;
    margin-bottom: 14px;
    font-weight: 500;
    letter-spacing: 3px;
    line-height: 1.3;
}
.banner-text p {
    font-size: 17px;
    opacity: 0.85;
    letter-spacing: 1px;
    line-height: 1.7;
}

/* ========== 通用容器与标题 ========== */
section.container,
.about-section {
    max-width: 1400px;
    margin: 0 auto;
    padding: 70px 20px;
}

@supports selector(:has(*)) {
    .container:has(> .about-wrap),
    .container:has(> .factory-wrap),
    .container:has(> .honor-list) {
        max-width: 1400px;
        margin: 0 auto;
        padding: 70px 20px;
    }
}

.container > .section-title,
.data-block > .section-title,
.advantage-block > .section-title,
.about-section > .section-title,
.brief-contact > .section-title {
    text-align: center;
    margin-bottom: 50px;
    width: 100%;
}
.section-title > h2 {
    font-size: 30px;
    color: #0A2647;
    margin-bottom: 12px;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 1.35;
}
.section-title > .line {
    width: 60px;
    height: 3px;
    background: #E67E22;
    margin: 0 auto;
    border-radius: 2px;
}

/* ========== 企业简介（图文左文右图） ========== */
.about-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    width: 100%;
}
.about-text h3 {
    font-size: 23px;
    color: #0A2647;
    margin-bottom: 20px;
    font-weight: 500;
    letter-spacing: 1px;
    padding-left: 14px;
    border-left: 3px solid #E67E22;
    line-height: 1.4;
}
.about-text p {
    font-size: 15px;
    color: #444;
    margin-bottom: 16px;
    line-height: 1.9;
}
.about-img {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(10, 38, 71, 0.1);
    height: 420px;
    width: 100%;
}

/* ========== 企业核心实力（数据） ========== */
.data-block {
    background: #f4f7fa;
    padding: 70px 20px;
}
.data-list {
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    width: 100%;
}
.data-item {
    text-align: center;
    padding: 35px 18px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(10, 38, 71, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.data-num {
    font-size: 46px;
    font-weight: 600;
    color: #E67E22;
    margin-bottom: 10px;
    line-height: 1.2;
    letter-spacing: -0.5px;
}
.data-desc {
    font-size: 15px;
    color: #0A2647;
    font-weight: 500;
    letter-spacing: 1px;
}
/* ========== 研发与生产装备 ========== */
.factory-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    width: 100%;
}
.factory-img-group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    width: 100%;
}
.factory-img-group > div {
    border-radius: 8px;
    overflow: hidden;
    height: 240px;
    width: 100%;
}
.factory-text h3 {
    font-size: 23px;
    color: #0A2647;
    margin-bottom: 20px;
    font-weight: 500;
    letter-spacing: 1px;
    padding-left: 14px;
    border-left: 3px solid #E67E22;
    line-height: 1.4;
}
.factory-text p {
    font-size: 15px;
    color: #444;
    margin-bottom: 16px;
    line-height: 1.9;
}
.factory-text ul li {
    padding-left: 26px;
    position: relative;
    margin-bottom: 12px;
    font-size: 15px;
    color: #444;
    line-height: 1.7;
}
.factory-text ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 11px;
    width: 9px;
    height: 9px;
    background: #E67E22;
    border-radius: 50%;
}

/* ========== 我们的核心优势（浅色钛银灰背景，减缓整页蓝色过重） ==========
   修改说明：原深空蓝#0A2647深色背景改为浅色#f8fafc，
   卡片改为白色+浅灰边框，标题深空蓝，点缀钛橙，
   与页头、版权的深空蓝形成对比，减缓整页蓝色过重。 */
.advantage-block {
    background: #f8fafc;
    color: #333;
    padding: 70px 20px;
}
.advantage-block > .section-title > h2 { color: #0A2647; }
.advantage-list {
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    width: 100%;
}
.advantage-item {
    background: #fff;
    padding: 35px 26px;
    border-radius: 8px;
    border: 1px solid #e4e8ee;
    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.advantage-item h4 {
    font-size: 19px;
    margin-bottom: 14px;
    color: #E67E22;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.4;
}
.advantage-item p {
    font-size: 14px;
    color: #5A6472;
    line-height: 1.8;
}

/* ========== 资质与荣誉（仅 29.html 使用） ========== */
.honor-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    width: 100%;
}
.honor-item {
    text-align: center;
    padding: 30px 18px;
    border: 1px solid #e4e8ee;
    border-radius: 8px;
    background: #fff;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.honor-item h4 {
    margin-top: 16px;
    font-size: 16px;
    color: #0A2647;
    font-weight: 500;
    letter-spacing: 1px;
}

/* ========== 底部联系 ========== */
.brief-contact {
    background: #f4f7fa;
    padding: 50px 20px;
    text-align: center;
}
.brief-contact h3 {
    color: #0A2647;
    font-size: 23px;
    margin-bottom: 16px;
    font-weight: 500;
    letter-spacing: 2px;
}
.brief-contact p {
    font-size: 15px;
    color: #444;
    line-height: 1.9;
}


/* ============================================================
   三、悬停效果（仅在支持真实悬停的设备生效）
   避免移动端点击后 hover 态粘滞不消失
   ============================================================ */
@media (hover: hover) and (pointer: fine) {
    .data-item:hover {
        transform: translateY(-5px);
        box-shadow: 0 6px 22px rgba(10, 38, 71, 0.1);
    }
    .advantage-item:hover {
        background: #fff;
        transform: translateY(-3px);
        box-shadow: 0 5px 20px rgba(10, 38, 71, 0.08);
    }
    .honor-item:hover {
        box-shadow: 0 5px 20px rgba(10, 38, 71, 0.08);
        transform: translateY(-3px);
    }
}


/* ============================================================
   四、响应式
   断点一律 px；断点内不出现 html / body / rem / !important
   ============================================================ */

/* ========== 兜底：窄于设计稿时容器转流式（含 769~1240px 窗口） ========== */
@media screen and (max-width: 1240px) {
    section.container,
    .about-section { max-width: 100%; }

    @supports selector(:has(*)) {
        .container:has(> .about-wrap),
        .container:has(> .factory-wrap),
        .container:has(> .honor-list) { max-width: 100%; }
    }
}

/* ========== 平板 / 手机横屏：≤992px ========== */
@media screen and (max-width: 992px) {
    .about-wrap,
    .factory-wrap {
        grid-template-columns: 1fr;
        gap: 35px;
    }
    .data-list      { grid-template-columns: repeat(2, 1fr); }
    .advantage-list { grid-template-columns: repeat(2, 1fr); }

    section.container,
    .about-section { padding: 55px 20px; }

    @supports selector(:has(*)) {
        .container:has(> .about-wrap),
        .container:has(> .factory-wrap),
        .container:has(> .honor-list) { padding: 55px 20px; }
    }
    .data-block      { padding: 55px 20px; }
    .advantage-block { padding: 55px 20px; }

    .about-banner   { height: 260px; }
    .banner-text h1 { font-size: 32px; }
    .banner-text p  { font-size: 15px; }

    .container > .section-title,
    .data-block > .section-title,
    .advantage-block > .section-title,
    .about-section > .section-title { margin-bottom: 40px; }
    .section-title > h2 { font-size: 27px; }

    .about-text h3,
    .factory-text h3 { font-size: 21px; }
    .about-img              { height: 340px; }
    .factory-img-group > div { height: 200px; }
}

/* ========== 手机：≤768px ==========
   企业简介：文字在上，图片在下
   研发生产：图片在上，文字在下
   ==================================== */
@media screen and (max-width: 768px) {
    section.container,
    .about-section { padding: 44px 16px; }

    @supports selector(:has(*)) {
        .container:has(> .about-wrap),
        .container:has(> .factory-wrap),
        .container:has(> .honor-list) { padding: 44px 16px; }
    }

    .container > .section-title,
    .data-block > .section-title,
    .advantage-block > .section-title,
    .about-section > .section-title { margin-bottom: 32px; }
    .section-title > h2   { font-size: 22px; margin-bottom: 10px; letter-spacing: 1px; }
    .section-title > .line { width: 50px; height: 3px; }

    /* 企业简介：文字上、图片下 */
    .about-wrap {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .about-text { order: 1; }
    .about-img  { order: 2; height: 200px; }
    .about-text h3 {
        font-size: 18px;
        margin-bottom: 14px;
        padding-left: 12px;
    }
    .about-text p {
        font-size: 14px;
        margin-bottom: 12px;
        line-height: 1.85;
    }

    /* 研发生产：图片上、文字下 */
    .factory-wrap {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .factory-img-group {
        order: 1;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .factory-img-group > div { height: 112px; }
    .factory-text { order: 2; }
    .factory-text h3 {
        font-size: 18px;
        margin-bottom: 14px;
        padding-left: 12px;
    }
    .factory-text p {
        font-size: 14px;
        margin-bottom: 12px;
        line-height: 1.85;
    }
    .factory-text ul li {
        font-size: 14px;
        margin-bottom: 10px;
        padding-left: 20px;
        line-height: 1.7;
    }
    .factory-text ul li::before {
        top: 9px;
        width: 8px;
        height: 8px;
    }

    /* 核心数据：2×2 */
    .data-block { padding: 40px 16px; }
    .data-list  { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .data-item  { padding: 22px 10px; }
    .data-num   { font-size: 30px; margin-bottom: 6px; }
    .data-desc  { font-size: 13px; letter-spacing: 0; }

    /* 核心优势：2 列（不再强行 3 列，保证可读） */
    .advantage-block   { padding: 40px 16px; }
    .advantage-list    { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .advantage-item    { padding: 18px 14px; }
    .advantage-item h4 { font-size: 15px; margin-bottom: 8px; letter-spacing: 0; }
    .advantage-item p  { font-size: 13px; line-height: 1.7; }

    /* 资质荣誉：2 列（仅 29.html） */
    .honor-list     { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .honor-item     { padding: 18px 10px; }
    .honor-item img { height: 120px; }
    .honor-item h4  { font-size: 14px; margin-top: 10px; letter-spacing: 0; }

    /* 底部联系 */
    .brief-contact    { padding: 32px 16px; }
    .brief-contact h3 { font-size: 18px; margin-bottom: 10px; letter-spacing: 1px; }
    .brief-contact p  { font-size: 14px; line-height: 1.8; }

    /* Banner（29.html） */
    .about-banner   { height: 200px; }
    .banner-text h1 { font-size: 26px; margin-bottom: 10px; letter-spacing: 2px; }
    .banner-text p  { font-size: 14px; letter-spacing: 1px; }
}
/* ========== 小屏手机：≤425px ========== */
@media screen and (max-width: 425px) {
    section.container,
    .about-section { padding: 36px 12px; }

    @supports selector(:has(*)) {
        .container:has(> .about-wrap),
        .container:has(> .factory-wrap),
        .container:has(> .honor-list) { padding: 36px 12px; }
    }
    .data-block      { padding: 36px 12px; }
    .advantage-block { padding: 36px 12px; }
    .brief-contact   { padding: 28px 12px; }

    .section-title > h2 { font-size: 20px; }
    .about-img              { height: 180px; }
    .factory-img-group > div { height: 96px; }
    .data-num               { font-size: 26px; }
    .honor-item img         { height: 100px; }
    .about-banner           { height: 180px; }
    .banner-text h1         { font-size: 24px; letter-spacing: 1px; }
    .banner-text p          { font-size: 13px; }
}

/* ========== 超小屏：≤360px（iPhone SE / 320px 老机型） ========== */
@media screen and (max-width: 360px) {
    .data-list,
    .advantage-list,
    .honor-list { gap: 10px; }

    .data-item  { padding: 18px 8px; }
    .data-num   { font-size: 24px; }
    .data-desc  { font-size: 12px; }

    .advantage-item    { padding: 14px 10px; }
    .advantage-item h4 { font-size: 14px; }
    .advantage-item p  { font-size: 12px; }

    .factory-img-group > div { height: 84px; }
    .about-img               { height: 160px; }
}

/* ============================================================
   about.css 企业简介样式（整站安全版 v8）— 结束
   ============================================================ */

/* ============================================================
   五、v9 追加补丁（图文排列 / 性能 / 打印 / 无障碍）
   原则：只新增，不修改上方任何视觉数值
   ============================================================ */

/* 图片防抖（CLS）：加载完成前占位底色，避免跳版 */
.about-img img,
.factory-img-group img,
.honor-item img {
    background: #eef2f7;
    border-radius: 6px;
}
.sxzh_ban_list img {
    display: block;
    width: 100%;
    height: auto;
}

/* 图文排列：长单词/长数字不撑破容器 */
.about-text p,
.factory-text p,
.factory-text ul li,
.advantage-item p,
.brief-contact p {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 表格（若正文后续加入）：兼容 bgcolor 黑底老写法 */
.about-text table,
.factory-text table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
}
.about-text table[bgcolor="#000000"],
.factory-text table[bgcolor="#000000"],
.about-text table[bgcolor="#000000"] td,
.factory-text table[bgcolor="#000000"] td { background: #fff !important; }
.about-text th,
.factory-text th {
    background: #f0f4f8;
    font-weight: 700;
    color: #0A2647;
    text-align: center;
}
.about-text th, .about-text td,
.factory-text th, .factory-text td {
    border: 1px solid #e4e8ee;
    padding: 9px 11px;
    font-size: 14px;
    line-height: 1.7;
}

@media screen and (max-width: 768px) {
    .about-text table,
    .factory-text table {
        display: table !important;
        width: 100% !important;
        min-width: 0 !important;
        white-space: normal !important;
    }
    .about-text th, .about-text td,
    .factory-text th, .factory-text td {
        white-space: normal !important;
        word-break: break-word !important;
        font-size: 12.5px !important;
        padding: 7px 8px !important;
    }
}

/* 打印：只保留正文与关键数据 */
@media print {
    header, #sxzh_ban_layout, .sxzh_ban_list,
    .brief-contact { display: none !important; }
    .data-block, .advantage-block { background: #fff !important; padding: 0 !important; }
    .data-item, .advantage-item { border: 1px solid #999 !important; page-break-inside: avoid; }
    .data-num { color: #000 !important; }
    .about-img, .factory-img-group > div { height: auto !important; }
}

/* 无障碍：系统开启「减弱动效」时关闭过渡 */
@media (prefers-reduced-motion: reduce) {
    .data-item,
    .advantage-item,
    .honor-item {
        transition: none !important;
        transform: none !important;
    }
}


@charset "utf-8";
/* ============================================================
   gaikuang.css 追加补丁 —— 关于我们页「布局重构版 v2」配套
   用法：整段复制粘贴到 gaikuang.css 文件末尾即可（无需改动上方原有样式）
   原则：不碰 html / body / rem / !important；PC 优先，断点全 px
   说明：只定义新结构类名（about-panel / prod-grid / grade-tags / app-table），
        上方原有 .about-wrap / .about-text / .data-list 等样式保持不动
   ============================================================ */


/* ============================================================
   一、通用：视觉隐藏（供页面 h1 使用，不占位、不影响布局）
   ============================================================ */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* ============================================================
   二、企业简介：通栏分区容器（长内容脱离两栏，根治错位）
   ============================================================ */
section.container.about-page,
.container.about-page {
    padding-top: 70px;
}

/* 分区块：上分隔线 + 上间距，视觉上把长文切成五段 */
.about-panel {
    width: 100%;
    max-width: 100%;
    margin-top: 46px;
    padding-top: 42px;
    border-top: 1px solid #e8edf3;
    box-sizing: border-box;
    min-width: 0;
}
.about-panel * { box-sizing: border-box; }

/* 分区小标题 h3（与 .about-text h3 同级视觉，但独立作用域） */
.about-subtitle {
    font-size: 21px;
    color: #0A2647;
    margin: 0 0 20px;
    padding-left: 14px;
    border-left: 3px solid #E67E22;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.4;
    min-width: 0;
}

/* 分区导语 / 说明文字：提高选择器优先级，避免被 .about-text p 覆盖 */
.about-page .about-text p.about-lead {
    font-size: 16px;
    color: #22262c;
    line-height: 1.95;
    margin-bottom: 14px;
}
.about-panel p.about-note {
    font-size: 15px;
    color: #444;
    line-height: 1.9;
    margin-bottom: 24px;
}
.about-panel > p {
    font-size: 15px;
    color: #444;
    line-height: 1.9;
    margin-bottom: 16px;
    overflow-wrap: break-word;
    word-break: break-word;
}
.about-panel > p:last-child { margin-bottom: 0; }


/* ============================================================
   三、主营产品：2×2 卡片网格
   ============================================================ */
.prod-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    width: 100%;
    max-width: 100%;
}
.prod-card {
    min-width: 0;
    background: #fff;
    border: 1px solid #e4e8ee;
    border-radius: 8px;
    padding: 24px 22px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.prod-card h4 {
    display: flex;
    align-items: center;
    font-size: 16px;
    color: #0A2647;
    margin: 0 0 10px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.4;
}
.prod-card h4::before {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    background: #E67E22;
    border-radius: 50%;
    margin-right: 9px;
}
.prod-card p {
    font-size: 14px;
    color: #5A6472;
    line-height: 1.85;
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}


/* ============================================================
   四、牌号体系：分组 + 标签云
   ============================================================ */
.grade-group {
    width: 100%;
    min-width: 0;
    margin-bottom: 22px;
}
.grade-group:last-child { margin-bottom: 0; }
.grade-group h4 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: #0A2647;
    margin: 0 0 12px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 1.5;
}
.grade-group h4::before {
    content: "";
    flex: 0 0 auto;
    width: 4px;
    height: 14px;
    background: #E67E22;
    border-radius: 2px;
}

/* 标签云：flex 自动换行，牌号不被拆断 */
.grade-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    min-width: 0;
}
.grade-tags li {
    font-size: 13px;
    color: #0A2647;
    background: #f4f7fa;
    border: 1px solid #e4e8ee;
    border-radius: 4px;
    padding: 5px 12px;
    line-height: 1.5;
    white-space: nowrap;
    letter-spacing: 0.3px;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
/* 若后续牌号落地页上线，把 li 换成 a 并加 href，此样式同样生效 */
.grade-tags a {
    display: block;
    color: #0A2647;
    text-decoration: none;
}
.grade-tags a:hover { color: #E67E22; }


/* ============================================================
   五、应用领域：两列表格（行业 — 牌号）
   ============================================================ */
.app-table-wrap {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.app-table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    margin: 0;
    font-size: 14px;
    background: #fff;
}
.app-table th,
.app-table td {
    border: 1px solid #e4e8ee;
    padding: 11px 14px;
    line-height: 1.75;
    text-align: left;
    vertical-align: top;
    word-break: break-word;
}
.app-table thead th {
    background: #0A2647;
    color: #fff;
    font-weight: 500;
    letter-spacing: 1px;
    text-align: center;
    white-space: nowrap;
}
.app-table tbody th {
    background: #f4f7fa;
    color: #0A2647;
    font-weight: 500;
    white-space: nowrap;
    width: 190px;
}
.app-table tbody td { color: #444; }
.app-table tbody tr:nth-child(even) td { background: #fcfdfe; }


/* ============================================================
   六、悬停效果（仅真实悬停设备，避免移动端粘滞）
   ============================================================ */
@media (hover: hover) and (pointer: fine) {
    .prod-card:hover {
        transform: translateY(-3px);
        border-color: #cfd8e3;
        box-shadow: 0 6px 20px rgba(10, 38, 71, 0.08);
    }
    .grade-tags li:hover {
        background: #fff;
        border-color: #E67E22;
        color: #E67E22;
    }
}


/* ============================================================
   七、响应式
   ============================================================ */

/* ========== 平板 / 手机横屏：≤992px ========== */
@media screen and (max-width: 992px) {
    section.container.about-page, .container.about-page { padding-top: 55px; }
    .about-panel { margin-top: 38px; padding-top: 34px; }
    .about-subtitle { font-size: 19px; margin-bottom: 18px; }
    .prod-grid { gap: 16px; }
    .prod-card { padding: 20px 18px; }
    .app-table tbody th { width: 150px; }
}

/* ========== 手机：≤768px ==========
   主营产品转单列；牌号标签收紧；表格两列保持，字号下调 */
@media screen and (max-width: 768px) {
    section.container.about-page, .container.about-page { padding-top: 44px; }
    .about-panel { margin-top: 30px; padding-top: 26px; }
    .about-subtitle {
        font-size: 18px;
        padding-left: 12px;
        margin-bottom: 16px;
        letter-spacing: 0.5px;
    }
    .about-panel p.about-note {
        font-size: 14px;
        line-height: 1.85;
        margin-bottom: 20px;
    }
    .about-panel > p {
        font-size: 14px;
        line-height: 1.85;
        margin-bottom: 12px;
    }
    .about-page .about-text p.about-lead {
        font-size: 15px;
        line-height: 1.9;
    }

    .prod-grid { grid-template-columns: 1fr; gap: 12px; }
    .prod-card { padding: 18px 16px; }
    .prod-card h4 { font-size: 15px; margin-bottom: 8px; letter-spacing: 0.5px; }
    .prod-card p  { font-size: 13px; line-height: 1.8; }

    .grade-group { margin-bottom: 18px; }
    .grade-group h4 { font-size: 14px; margin-bottom: 10px; }
    .grade-tags { gap: 6px; }
    .grade-tags li { font-size: 12px; padding: 4px 9px; letter-spacing: 0; }

    .app-table { font-size: 13px; }
    .app-table thead th { white-space: normal; }
    .app-table th,
    .app-table td { padding: 9px 10px; line-height: 1.7; }
    .app-table tbody th { width: 104px; white-space: normal; }
}

/* ========== 小屏手机：≤425px ========== */
@media screen and (max-width: 425px) {
    section.container.about-page, .container.about-page { padding-top: 36px; }
    .about-panel { margin-top: 26px; padding-top: 22px; }
    .about-subtitle { font-size: 17px; }
    .prod-card { padding: 15px 14px; }
    .app-table { font-size: 12.5px; }
    .app-table th,
    .app-table td { padding: 8px 9px; }
    .app-table tbody th { width: 88px; }
    .grade-tags li { font-size: 11.5px; padding: 3px 8px; }
}

/* ========== 超小屏：≤360px ========== */
@media screen and (max-width: 360px) {
    .prod-card { padding: 13px 12px; }
    .app-table tbody th { width: 80px; }
    .app-table { font-size: 12px; }
}


/* ============================================================
   八、打印与无障碍
   ============================================================ */
@media print {
    .about-panel { border-top: 1px solid #ccc; margin-top: 20px; padding-top: 16px; }
    .prod-card, .grade-group { page-break-inside: avoid; }
    .app-table thead th { background: #eee; color: #000; }
    .visually-hidden { position: static; width: auto; height: auto; clip: auto; }
}
@media (prefers-reduced-motion: reduce) {
    .prod-card,
    .grade-tags li { transition: none; transform: none; }
}

/* ============================================================
   gaikuang.css 布局重构补丁 —— 结束
   ============================================================ */


@charset "utf-8";
/* ============================================================
   gaikuang.css 追加补丁 · section-sub 定位副题 + H1 视觉同步
   用法：整段复制粘贴到 gaikuang.css 文件末尾（不要改动上方原有样式）
   背景：企业简介页把「企业简介」标题由 h2 改为 h1 后，
         上方原有 .section-title > h2 的配色/字号/字重规则不再命中，
         h1 会退回浏览器默认样式（2em 加粗），与整站视觉脱节，
         本补丁第一段即用于修复该问题。
   原则：不出现 html / body / rem / !important；PC 优先，断点全 px
   配色：深空蓝 #0A2647 ｜ 钛橙 #E67E22 ｜ 正文灰 #5A6472
   ============================================================ */


/* ============================================================
   一、H1 视觉同步（★ 必须：修复 h2→h1 后样式丢失）
   数值与原有 .section-title > h2 完全一致，保证版面不跳变
   ============================================================ */
.section-title > h1 {
    font-size: 30px;
    color: #0A2647;
    margin: 0 0 12px;      /* ★ 已消除 h1 浏览器默认上边距，顶部更紧凑；
                              若想完全还原原先 h2 的默认上边距，改为 margin: 25px 0 12px */
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 1.35;
}
/* 副题存在时，标题与钛橙短线的间距略收，整体更聚拢 */
.section-title > h1 + .line { margin-top: 0; }


/* ============================================================
   二、.section-sub 定位副题（核心新增）
   定位：H1 之下、钛橙短线之下的「实体声明句」
   作用：把品牌全称 + 产业带 + 品类定位做成可见文本，
        搜索引擎与 AI 可直接读取，避免只靠 meta 声明
   ============================================================ */
.section-title > .section-sub {
    box-sizing: border-box;
    width: 100%;
    max-width: 760px;                /* 限宽：避免长句拉满导致两端对齐失衡 */
    margin: 14px auto 0;             /* 与上方 .line 拉开呼吸 */
    padding: 0 20px;
    font-size: 16px;
    font-weight: 400;                /* 明显弱于 H1，保持层级 */
    color: #5A6472;
    letter-spacing: 1px;
    line-height: 1.75;
    text-align: center;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 可选增强：若把公司全称包成 <strong>，自动强化实体名（AI 权重更高） */
.section-title > .section-sub strong {
    color: #0A2647;
    font-weight: 600;
}

/* ============================================================
   三、响应式（断点与 gaikuang.css 原有断点保持一致）
   ============================================================ */

/* ========== 平板 / 手机横屏：≤992px ========== */
@media screen and (max-width: 992px) {
    .section-title > h1 { font-size: 27px; }
    .section-title > .section-sub {
        margin-top: 12px;
        font-size: 15px;
        letter-spacing: 0.5px;
        max-width: 640px;
    }
}

/* ========== 手机：≤768px ========== */
@media screen and (max-width: 768px) {
    .section-title > h1 {
        font-size: 22px;
        margin-bottom: 10px;
        letter-spacing: 1px;
    }
    .section-title > .section-sub {
        margin-top: 10px;
        padding: 0 10px;
        font-size: 14px;
        letter-spacing: 0;
        line-height: 1.7;
    }
}

/* ========== 小屏手机：≤425px ========== */
@media screen and (max-width: 425px) {
    .section-title > h1 { font-size: 20px; }
    .section-title > .section-sub {
        margin-top: 8px;
        font-size: 13px;
        line-height: 1.65;
    }
}

/* ========== 超小屏：≤360px ========== */
@media screen and (max-width: 360px) {
    .section-title > h1 { font-size: 19px; }
    .section-title > .section-sub {
        font-size: 12.5px;
        padding: 0 6px;
    }
}


/* ============================================================
   四、打印与无障碍
   ============================================================ */
@media print {
    .section-title > h1 {
        font-size: 22px;
        color: #000;
        margin-bottom: 6px;
    }
    .section-title > .section-sub {
        margin-top: 6px;
        font-size: 12px;
        color: #333;
        max-width: none;
    }
}