@charset "UTF-8";
/* ==========================================================================
   seo.css —— 前台 SEO 与展现增强（独立文件，不修改原 style.css / response.css）
   作用：① 语义化标签复位 ② 栏目页标题栏 ③ 面包屑增强
        ④ 详情页正文可读性 ⑤ 内链模块 ⑥ 移动端补强
        ⑦ 内容区块组件（卖点条 / 数据统计 / 服务卡片 / 核心优势 / 服务流程 /
           覆盖区域 / FAQ / CTA / 详情页保障卡 / 正文目录）
   可整文件删除回滚，不影响原站样式。
   ========================================================================== */

/* ---------- 1. 语义隐藏 / 复位 ---------- */
.sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* h1 语义化后保持与原 div 完全一致的外观（消除浏览器默认 margin） */
.sy-pro-left .cn,
.newsDe .title,
.productDe .info .title,
.about .info .title { margin: 0; }

/* 联系我们页：原为 .contact h2，语义化为 h1 后补齐同样式 */
.contact h1 {
    text-align: center;
    font-size: 32px;
    line-height: 40px;
    color: #1258a6;
    font-weight: normal;
    margin: 0;
}

/* 导航 <li> 包进 <ul> 后复位列表默认样式，保持原布局不变 */
.head-menu .link ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

/* ---------- 2. 栏目页 / 列表页标题栏 ---------- */
.seo-pagehead {
    background: #fff;
    border-bottom: 1px solid #e6e6e5;
    padding: 22px 0 18px;
}
.seo-pagehead h1 {
    display: inline-block;
    font-size: 26px;
    line-height: 34px;
    color: #222;
    font-weight: bold;
    position: relative;
    padding-left: 14px;
}
.seo-pagehead h1:before {
    content: "";
    position: absolute;
    left: 0; top: 5px; bottom: 5px;
    width: 4px;
    background: #1258a6;
    border-radius: 2px;
}
.seo-pagehead p {
    margin: 10px 0 0 14px;
    font-size: 14px;
    line-height: 25px;
    color: #777;
}
.seo-pagehead p a { color: #1258a6; }
.seo-pagehead p a:hover { text-decoration: underline; }

/* ---------- 3. 面包屑增强 ---------- */
.Nylocation .now-wz em {
    font-style: normal;
    color: #1258a6;
    font-weight: bold;
}

/* ---------- 4. 详情页正文可读性 ---------- */
.newsDe .cont,
.pro-td,
.productDe .info .sub {
    word-wrap: break-word;
    word-break: break-word;
}
.newsDe .cont img,
.pro-td img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 14px auto;
}
.newsDe .cont p,
.pro-td p {
    margin: 0 0 14px;
    line-height: 30px;
}
.newsDe .cont h2,
.pro-td h2 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    line-height: 30px;
    margin: 22px 0 12px;
}
.newsDe .cont h3,
.pro-td h3 {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    line-height: 28px;
    margin: 18px 0 10px;
}
.newsDe .cont ul,
.newsDe .cont ol,
.pro-td ul,
.pro-td ol {
    margin: 0 0 14px 22px;
    line-height: 28px;
}
.newsDe .cont li,
.pro-td li { list-style: disc; margin-bottom: 6px; }
.pro-td ol li { list-style: decimal; }
.newsDe .cont table,
.pro-td table {
    max-width: 100%;
    border-collapse: collapse;
    margin: 14px 0;
}
.newsDe .cont table td,
.newsDe .cont table th,
.pro-td table td,
.pro-td table th {
    border: 1px solid #ddd;
    padding: 8px 10px;
    line-height: 24px;
    font-size: 14px;
}

/* ---------- 5. 相关推荐 / 内链模块 ---------- */
.seo-related {
    border-top: 1px solid #e6e6e5;
    margin-top: 30px;
    padding-top: 22px;
}
.seo-related h3 {
    font-size: 18px;
    font-weight: bold;
    color: #222;
    line-height: 30px;
    margin-bottom: 14px;
    position: relative;
    padding-left: 12px;
}
.seo-related h3:before {
    content: "";
    position: absolute;
    left: 0; top: 6px; bottom: 6px;
    width: 3px;
    background: #1258a6;
}
.seo-related ul { overflow: hidden; }
.seo-related li {
    float: left;
    width: 48%;
    margin: 0 2% 10px 0;
    font-size: 14px;
    line-height: 26px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.seo-related li:before {
    content: "·";
    color: #1258a6;
    font-weight: bold;
    margin-right: 6px;
}
.seo-related li a { color: #555; }
.seo-related li a:hover { color: #1258a6; }

/* ---------- 6. 移动端补强 ---------- */
@media (max-width: 767px) {
    .seo-pagehead { padding: 16px 0 14px; }
    .seo-pagehead h1 { font-size: 20px; line-height: 28px; }
    .seo-pagehead p { font-size: 13px; line-height: 23px; margin-top: 8px; }
    .newsDe .cont p,
    .pro-td p { line-height: 28px; }
    .seo-related li { float: none; width: 100%; }
    .newsDe .cont table,
    .pro-td table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ==========================================================================
   7. 内容区块组件
   ========================================================================== */

/* --- 7.0 公共：区块标题 / 列表复位 --- */
.seo-usp ul, .seo-stats ul, .seo-svc-grid, .seo-stg-grid,
.seo-flow-list, .seo-guarantee ul, .seo-toc ol, .seo-areas-box { margin: 0; padding: 0; list-style: none; }
.seo-usp, .seo-stats, .seo-svc, .seo-stg, .seo-flow, .seo-areas, .seo-faq, .seo-cta { box-sizing: border-box; }
.seo-usp *, .seo-stats *, .seo-svc *, .seo-stg *, .seo-flow *,
.seo-areas *, .seo-faq *, .seo-cta *, .seo-guarantee *, .seo-toc * { box-sizing: border-box; }

.seo-block-head { text-align: center; padding-top: 4px; }
.seo-block-en {
    display: block;
    font-size: 13px; letter-spacing: 3px; text-transform: uppercase;
    color: #9d9d9d; line-height: 20px;
}
.seo-block-cn {
    display: inline-block;
    position: relative;
    font-size: 32px; line-height: 44px; font-weight: bold; color: #1258a6;
    padding-bottom: 12px;
}
.seo-block-cn:after {
    content: "";
    position: absolute; left: 50%; bottom: 0;
    width: 46px; height: 3px; margin-left: -23px;
    background: #1258a6; border-radius: 2px;
}
.seo-block-sub {
    text-align: center;
    font-size: 14px; line-height: 24px; color: #888;
    margin: 14px auto 34px; max-width: 760px;
}

/* --- 7.1 卖点条 --- */
.seo-usp { background: linear-gradient(90deg, #0b3c78 0%, #1258a6 55%, #1d71d0 100%); }
.seo-usp ul { display: flex; flex-wrap: wrap; }
.seo-usp li {
    flex: 1; min-width: 0;
    padding: 16px 8px; text-align: center; position: relative;
}
.seo-usp li + li:before {
    content: ""; position: absolute; left: 0; top: 50%; margin-top: -14px;
    width: 1px; height: 28px; background: rgba(255, 255, 255, .22);
}
.seo-usp li b { display: block; font-size: 17px; font-weight: bold; color: #fff; line-height: 26px; }
.seo-usp li span { display: block; font-size: 12px; color: rgba(255, 255, 255, .72); line-height: 20px; margin-top: 2px; }

/* --- 7.2 数据统计条 --- */
.seo-stats { background: #0b3c78; padding: 40px 0; }
.seo-stats ul { display: flex; flex-wrap: wrap; }
.seo-stats li { flex: 1; text-align: center; position: relative; }
.seo-stats li + li:before {
    content: ""; position: absolute; left: 0; top: 8px; bottom: 8px;
    width: 1px; background: rgba(255, 255, 255, .16);
}
.seo-stats .num { line-height: 1; }
.seo-stats .num em { font-family: Arial, Helvetica, sans-serif; font-style: normal; font-size: 44px; font-weight: bold; color: #fff; }
.seo-stats .num i { font-style: normal; font-size: 16px; color: #79b8fe; margin-left: 4px; }
.seo-stats p { margin: 10px 0 0; font-size: 14px; color: rgba(255, 255, 255, .72); line-height: 22px; }

/* --- 7.3 九大服务项目卡片 --- */
.seo-svc { padding: 56px 0 40px; background: #fff; }
.seo-svc-grid { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.seo-svc-grid li { width: 33.3333%; padding: 0 10px; margin-bottom: 20px; display: flex; }
.seo-svc-grid li > a {
    flex: 1; display: block; position: relative;
    background: #fff; border: 1px solid #e6e6e5; border-radius: 6px;
    padding: 24px 22px 20px; transition: all .28s ease;
}
.seo-svc-grid li > a:hover {
    border-color: #1258a6; transform: translateY(-4px);
    box-shadow: 0 12px 26px rgba(18, 88, 166, .13);
}
.seo-svc-grid .no {
    position: absolute; right: 18px; top: 14px;
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    font-size: 34px; font-weight: bold; color: #eef4fc; line-height: 1;
}
.seo-svc-grid h3 { margin: 0 0 10px; font-size: 19px; font-weight: bold; color: #222; line-height: 26px; }
.seo-svc-grid li > a:hover h3 { color: #1258a6; }
.seo-svc-grid p { margin: 0 0 14px; font-size: 13px; line-height: 22px; color: #777; min-height: 44px; }
.seo-svc-grid .go { font-size: 13px; color: #1258a6; }
.seo-svc-grid .go i { margin-left: 4px; font-size: 12px; }

/* --- 7.4 核心优势 --- */
.seo-stg { padding: 56px 0 40px; background: #f4f8fd; }
.seo-stg-grid { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.seo-stg-grid li { width: 33.3333%; padding: 0 10px; margin-bottom: 20px; display: flex; }
.seo-stg-grid .card {
    flex: 1; background: #fff; border-radius: 6px; padding: 28px 24px 24px;
    border: 1px solid #e9f0f8; transition: all .28s ease;
}
.seo-stg-grid .card:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(18, 88, 166, .1); }
.seo-stg-grid .ico {
    width: 54px; height: 54px; line-height: 54px; text-align: center;
    border-radius: 50%; background: #eaf2fb; margin-bottom: 16px;
    transition: all .28s ease;
}
.seo-stg-grid .ico i { font-size: 26px; color: #1258a6; vertical-align: middle; }
.seo-stg-grid .card:hover .ico { background: #1258a6; }
.seo-stg-grid .card:hover .ico i { color: #fff; }
.seo-stg-grid h3 { margin: 0 0 10px; font-size: 18px; font-weight: bold; color: #222; line-height: 26px; }
.seo-stg-grid p { margin: 0; font-size: 13px; line-height: 23px; color: #777; }

/* --- 7.5 服务流程 --- */
.seo-flow { padding: 56px 0 40px; background: #fff; }
.seo-flow-list { display: flex; flex-wrap: wrap; }
.seo-flow-list li { flex: 1; min-width: 0; padding: 0 14px; text-align: center; position: relative; }
.seo-flow-list li:not(:last-child):after {
    content: ""; position: absolute; right: -8px; top: 26px;
    width: 16px; height: 1px; background: #cfe0f2;
}
.seo-flow-list .no {
    display: inline-block; width: 54px; height: 54px; line-height: 52px;
    border-radius: 50%; background: #f4f8fd; border: 1px solid #cfe0f2;
    font-family: Arial, Helvetica, sans-serif; font-style: italic;
    font-size: 19px; font-weight: bold; color: #1258a6;
    text-align: center; /* 圆内数字必须自己居中：桌面靠父级 li 的 text-align:center 撑着，
                           手机端(第17节) li 改成 left 后会把数字带偏 —— 别再依赖父级 */
    transition: all .28s ease;
}
.seo-flow-list li:hover .no { background: #1258a6; color: #fff; border-color: #1258a6; }
.seo-flow-list h3 { margin: 16px 0 8px; font-size: 16px; font-weight: bold; color: #222; line-height: 24px; }
.seo-flow-list p { margin: 0; font-size: 13px; line-height: 22px; color: #888; }

/* --- 7.6 覆盖区域 --- */
.seo-areas { padding: 56px 0 40px; background: #f8f8f8; }
.seo-areas-box { background: #fff; border: 1px solid #e6e6e5; border-radius: 6px; padding: 10px 26px; }
.seo-area-row { display: flex; align-items: flex-start; padding: 16px 0; border-bottom: 1px dashed #e6e6e5; }
.seo-area-row:last-child { border-bottom: 0; }
.seo-area-row .lb { flex: 0 0 108px; font-size: 15px; font-weight: bold; color: #1258a6; line-height: 30px; }
.seo-area-row .tags { flex: 1; min-width: 0; }
.seo-area-row .tags a {
    display: inline-block; margin: 0 8px 8px 0; padding: 3px 14px;
    border: 1px solid #dbe6f3; border-radius: 16px;
    font-size: 13px; line-height: 22px; color: #555; transition: all .25s ease;
}
.seo-area-row .tags a:hover { background: #1258a6; border-color: #1258a6; color: #fff; }
.seo-areas-tip { text-align: center; font-size: 14px; color: #888; line-height: 24px; margin: 20px 0 0; }
.seo-areas-tip a { color: #1258a6; font-weight: bold; }

/* --- 7.7 FAQ 手风琴 --- */
.seo-faq { padding: 56px 0 50px; background: #fff; }
.seo-faq-item { border: 1px solid #e6e6e5; border-radius: 6px; margin-bottom: 12px; overflow: hidden; }
.seo-faq-item .q {
    position: relative; margin: 0; cursor: pointer;
    padding: 16px 50px 16px 46px;
    font-size: 16px; font-weight: bold; color: #222; line-height: 24px;
    background: #fff; transition: color .25s ease;
}
.seo-faq-item .q .icon-wenda { position: absolute; left: 16px; top: 17px; font-size: 17px; color: #1258a6; }
.seo-faq-item .q .ar {
    position: absolute; right: 18px; top: 20px;
    font-size: 12px; color: #aaa; transition: transform .3s ease;
}
.seo-faq-item .a { display: none; padding: 0 24px 18px 46px; }
.seo-faq-item .a p { margin: 0; font-size: 14px; line-height: 26px; color: #666; }
.seo-faq-item.open { border-color: #cfe0f2; box-shadow: 0 8px 20px rgba(18, 88, 166, .07); }
.seo-faq-item.open .q { color: #1258a6; }
.seo-faq-item.open .q .ar { transform: rotate(180deg); color: #1258a6; }
.seo-faq-item.open .a { display: block; }

/* --- 7.8 CTA 转化条 --- */
.seo-cta { background: linear-gradient(120deg, #0b3c78 0%, #1258a6 58%, #1d71d0 100%); padding: 32px 0; }
.seo-cta .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.seo-cta .tx { padding-right: 20px; }
.seo-cta .tx h3 { margin: 0 0 6px; font-size: 23px; font-weight: bold; color: #fff; line-height: 32px; }
.seo-cta .tx p { margin: 0; font-size: 14px; line-height: 22px; color: rgba(255, 255, 255, .78); }
.seo-cta .bt { display: flex; align-items: center; }
.seo-cta .bt a {
    display: inline-block; height: 50px; line-height: 50px; padding: 0 26px;
    border-radius: 25px; font-size: 17px; font-weight: bold;
    transition: all .28s ease; white-space: nowrap;
}
.seo-cta .bt .tel { background: #cf150e; color: #fff; }
.seo-cta .bt .tel:hover { background: #e0211a; }
.seo-cta .bt .zx {
    margin-left: 12px; font-size: 16px;
    background: rgba(255, 255, 255, .14); color: #fff;
    border: 1px solid rgba(255, 255, 255, .42);
}
.seo-cta .bt .zx:hover { background: #fff; color: #1258a6; border-color: #fff; }
.seo-cta .bt a i { margin-right: 7px; }

/* --- 7.9 可视化面包屑 --- */
.seo-crumb { background: #f8f8f8; border-bottom: 1px solid #e6e6e5; }
.seo-crumb .container { padding: 13px 0; }
.seo-crumb .now-wz { font-size: 13px; line-height: 22px; color: #888; }
.seo-crumb .now-wz a { color: #666; }
.seo-crumb .now-wz a:hover { color: #1258a6; }
.seo-crumb .now-wz em { font-style: normal; font-weight: bold; color: #1258a6; }
.seo-crumb .sep { margin: 0 7px; color: #bbb; }

/* --- 7.10 详情页服务保障卡 --- */
.seo-guarantee { margin-top: 28px; background: #fafcff; border: 1px solid #e3eef9; border-radius: 6px; padding: 14px 16px; }
.seo-guarantee ul { display: flex; flex-wrap: wrap; }
.seo-guarantee li { width: 25%; padding: 8px 10px; display: flex; align-items: center; }
.seo-guarantee li i { flex: 0 0 auto; font-size: 24px; color: #1258a6; margin-right: 10px; }
.seo-guarantee li b { display: block; font-size: 14px; color: #222; font-weight: bold; line-height: 20px; }
.seo-guarantee li span { display: block; font-size: 12px; color: #8a8a8a; line-height: 18px; margin-top: 2px; }

/* --- 7.11 正文目录 TOC --- */
.seo-toc {
    background: #f7fafd; border: 1px solid #e3eef9; border-left: 3px solid #1258a6;
    border-radius: 4px; padding: 16px 20px; margin: 0 0 24px;
}
.seo-toc b { display: block; font-size: 15px; color: #1258a6; margin-bottom: 10px; font-weight: bold; }
.seo-toc b i { margin-right: 6px; }
.seo-toc ol { counter-reset: toc; }
.seo-toc li { position: relative; padding-left: 26px; font-size: 14px; line-height: 27px; counter-increment: toc; }
.seo-toc li:before { content: counter(toc) "."; position: absolute; left: 0; color: #9bb8d8; }
.seo-toc li.lvl3 { padding-left: 44px; }
.seo-toc li a { color: #555; }
.seo-toc li a:hover { color: #1258a6; }

/* --- 7.12 栏目页：分类快捷导航（横条） --- */
.seo-catnav { background: #fff; border-bottom: 1px solid #e6e6e5; padding: 14px 0; }
.seo-catnav ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; }
.seo-catnav li { margin: 0 10px 6px 0; }
.seo-catnav li a {
    display: inline-block; padding: 5px 16px; border: 1px solid #dbe6f3; border-radius: 16px;
    font-size: 13px; line-height: 22px; color: #555; transition: all .25s ease;
}
.seo-catnav li a:hover, .seo-catnav li a.on { background: #1258a6; border-color: #1258a6; color: #fff; }

/* ==========================================================================
   8. 移动端适配
   ========================================================================== */
@media (max-width: 991px) {
    .seo-svc-grid li, .seo-stg-grid li { width: 50%; }
    .seo-flow-list li { flex: 0 0 33.3333%; margin-bottom: 26px; }
    .seo-flow-list li:not(:last-child):after { display: none; }
    .seo-guarantee li { width: 50%; }
}

@media (max-width: 767px) {
    .seo-usp li { flex: 0 0 50%; padding: 12px 6px; }
    .seo-usp li + li:before { display: none; }
    .seo-usp li b { font-size: 15px; line-height: 22px; }
    .seo-stats { padding: 26px 0; }
    .seo-stats li { flex: 0 0 50%; padding: 12px 0; }
    .seo-stats li + li:before { display: none; }
    .seo-stats .num em { font-size: 32px; }
    .seo-stats p { font-size: 12px; margin-top: 6px; }
    .seo-block-cn { font-size: 22px; line-height: 32px; }
    .seo-block-en { font-size: 11px; letter-spacing: 2px; }
    .seo-block-sub { font-size: 13px; line-height: 22px; margin: 12px auto 22px; }
    .seo-svc, .seo-stg, .seo-flow, .seo-areas, .seo-faq { padding: 32px 0 22px; }
    .seo-svc-grid li, .seo-stg-grid li { width: 100%; }
    .seo-svc-grid p { min-height: 0; }
    .seo-flow-list li { flex: 0 0 100%; margin-bottom: 20px; text-align: left; padding-left: 66px; min-height: 56px; }
    .seo-flow-list .no { position: absolute; left: 0; top: 0; }
    .seo-flow-list li:not(:last-child):after {
        display: block; left: 26px; right: auto; top: 58px;
        width: 1px; height: 18px;
    }
    .seo-flow-list h3 { margin: 0 0 6px; }
    .seo-areas-box { padding: 6px 16px; }
    .seo-area-row { display: block; padding: 12px 0; }
    .seo-area-row .lb { line-height: 24px; margin-bottom: 6px; }
    .seo-faq-item .q { font-size: 15px; padding: 14px 40px 14px 40px; }
    .seo-faq-item .q .icon-wenda { left: 14px; top: 15px; font-size: 15px; }
    .seo-faq-item .q .ar { right: 14px; top: 18px; }
    .seo-faq-item .a { padding: 0 16px 16px 40px; }
    .seo-cta { padding: 24px 0; }
    .seo-cta .container { display: block; text-align: center; }
    .seo-cta .tx { padding-right: 0; }
    .seo-cta .tx h3 { font-size: 18px; line-height: 26px; }
    .seo-cta .tx p { font-size: 13px; margin-top: 6px; }
    .seo-cta .bt { display: block; margin-top: 16px; }
    .seo-cta .bt a { height: 44px; line-height: 44px; font-size: 16px; padding: 0 18px; width: 100%; }
    .seo-cta .bt .zx { margin: 10px 0 0; }
    .seo-guarantee li { width: 100%; }
    .seo-toc { padding: 14px 16px; }
    .seo-catnav ul { display: block; }
    .seo-catnav li { display: inline-block; }
}

/* ==================================================================
   9. 服务区域（城市页 /city/ 与 /city/{city}/）
   仅使用 seo- 前缀，不影响原站样式；复用 7.x 的区块视觉语言。
   ================================================================== */

/* 区块标题改用真实 h2，需清掉浏览器默认 margin（.seo-block-cn 自身不设 margin） */
.seo-block-head h2.seo-block-cn { margin: 0; }

/* --- 9.1 城市导语 --- */
.seo-city-intro { padding: 38px 0 40px; background: #f4f8fd; }
.seo-city-intro > .container > p {
    margin: 0 0 15px; font-size: 15px; line-height: 29px; color: #555;
}
.seo-city-intro > .container > p:last-of-type { margin-bottom: 0; }
.seo-city-facts { display: flex; flex-wrap: wrap; margin: 22px -8px 0; }
.seo-city-facts .fact {
    flex: 1 1 230px; min-width: 0; margin: 0 8px 12px;
    background: #fff; border: 1px solid #e3edf8; border-radius: 6px;
    padding: 12px 16px;
}
.seo-city-facts .k { display: block; font-size: 12px; line-height: 18px; color: #8a93a3; }
.seo-city-facts .v { display: block; margin-top: 3px; font-size: 14px; line-height: 22px; color: #1258a6; }

/* --- 9.2 设备租赁横条（接在服务宫格下方） --- */
.seo-city-rent {
    margin: 4px 0 0; background: #f4f8fd; border: 1px solid #e3edf8;
    border-radius: 6px; padding: 14px 18px;
}
.seo-city-rent .lb { font-size: 14px; font-weight: bold; color: #1258a6; margin-right: 8px; }
.seo-city-rent a {
    display: inline-block; margin: 4px 8px 4px 0; padding: 3px 14px;
    border: 1px solid #dbe6f3; border-radius: 16px; background: #fff;
    font-size: 13px; line-height: 22px; color: #555; transition: all .25s ease;
}
.seo-city-rent a:hover { background: #1258a6; border-color: #1258a6; color: #fff; }

/* --- 9.3 覆盖区域内的纯文本标签（镇/街道，无独立页面故不加链接） --- */
.seo-area-row .tags .tg {
    display: inline-block; margin: 0 8px 8px 0; padding: 3px 14px;
    border: 1px dashed #dbe6f3; border-radius: 16px;
    font-size: 13px; line-height: 22px; color: #666;
}

/* --- 9.4 城市相关资讯 --- */
.seo-city-news { padding: 54px 0 44px; background: #fff; }
.seo-city-news-list { display: flex; flex-wrap: wrap; margin: 0 -10px; padding: 0; list-style: none; }
.seo-city-news-list li { width: 50%; padding: 0 10px; margin-bottom: 16px; display: flex; }
.seo-city-news-list li > a {
    flex: 1; display: block; background: #fff; border: 1px solid #e6e6e5;
    border-radius: 6px; padding: 16px 18px; transition: all .28s ease;
}
.seo-city-news-list li > a:hover {
    border-color: #1258a6; transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(18, 88, 166, .1);
}
.seo-city-news-list h3 { margin: 0 0 8px; font-size: 15px; font-weight: bold; color: #222; line-height: 24px; }
.seo-city-news-list li > a:hover h3 { color: #1258a6; }
.seo-city-news-list p { margin: 0; font-size: 13px; line-height: 22px; color: #888; }

/* --- 9.5 总览页分组卡片 --- */
.seo-hub-group { padding: 44px 0 30px; background: #fff; }
.seo-hub-group:nth-of-type(even) { background: #f8f8f8; }
.seo-hub-cards { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.seo-hub-cards .hub-card {
    flex: 1 1 calc(33.3333% - 20px); max-width: calc(33.3333% - 20px);
    margin: 0 10px 20px; background: #fff; border: 1px solid #e6e6e5;
    border-radius: 6px; padding: 20px 20px 16px; transition: all .28s ease;
}
.seo-hub-cards .hub-card:hover {
    border-color: #1258a6; transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(18, 88, 166, .1);
}
.seo-hub-cards h3 { margin: 0 0 8px; font-size: 16px; font-weight: bold; color: #222; line-height: 24px; }
.seo-hub-cards .hub-card:hover h3 { color: #1258a6; }
.seo-hub-cards p { margin: 0 0 10px; font-size: 13px; line-height: 22px; color: #777; }
.seo-hub-cards .meta { display: block; font-size: 12px; line-height: 20px; color: #1258a6; }

/* --- 9.6 城市页移动端 --- */
@media (max-width: 767px) {
    .seo-city-intro { padding: 26px 0 24px; }
    .seo-city-intro > .container > p { font-size: 14px; line-height: 26px; }
    .seo-city-facts { margin: 16px -6px 0; }
    .seo-city-facts .fact { flex: 1 1 100%; margin: 0 6px 10px; padding: 10px 14px; }
    .seo-city-rent { padding: 12px 14px; }
    .seo-city-news { padding: 30px 0 20px; }
    .seo-city-news-list { margin: 0; }
    .seo-city-news-list li { width: 100%; padding: 0; }
    .seo-hub-group { padding: 30px 0 16px; }
    .seo-hub-cards { margin: 0; }
    .seo-hub-cards .hub-card {
        flex: 1 1 100%; max-width: 100%; margin: 0 0 14px; padding: 16px 16px 14px;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .seo-hub-cards .hub-card { flex: 1 1 calc(50% - 20px); max-width: calc(50% - 20px); }
}

/* ==================================================================
   10. 资讯（新闻）列表页与详情页增强
   仅使用 seo- 前缀；删除本节点即可回到原 .news / .newsDe 样式。
   ================================================================== */

/* --- 10.1 列表页骨架：主列 + 右侧栏 --- */
.seo-news { padding: 40px 0 64px; background: #fff; }
.seo-news-wrap { display: flex; align-items: flex-start; }
.seo-news-main { flex: 1 1 auto; min-width: 0; padding-right: 32px; }
.seo-news-side { flex: 0 0 320px; width: 320px; }

/* --- 10.2 列表条目 --- */
.seo-news-list { margin: 0; padding: 0; list-style: none; }
.seo-news-list > li {
    display: flex; align-items: flex-start;
    padding: 22px 0; border-bottom: 1px solid #eceae8;
}
.seo-news-list > li:first-child { padding-top: 0; }
.seo-news-list .media {
    flex: 0 0 208px; width: 208px; height: 136px;
    border-radius: 6px; overflow: hidden; background: #f2f2f2;
}
.seo-news-list .media img {
    width: 100%; height: 100%; display: block; object-fit: cover;
    transition: transform .55s ease;
}
.seo-news-list > li:hover .media img { transform: scale(1.06); }
.seo-news-list .media.ph {
    background: linear-gradient(135deg, #1258a6 0%, #2f7fd0 100%);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    color: #fff; text-align: center;
}
.seo-news-list .media.ph span {
    display: block; font-size: 18px; font-weight: bold; line-height: 26px; letter-spacing: 1px;
}
.seo-news-list .media.ph em {
    display: block; margin-top: 4px; font-style: normal;
    font-family: "barlow", Arial, sans-serif; font-size: 13px; opacity: .8;
}
.seo-news-list .body { flex: 1 1 auto; min-width: 0; padding-left: 22px; }
.seo-news-list .tit { margin: 0 0 10px; font-size: 19px; line-height: 27px; font-weight: bold; }
.seo-news-list .tit a {
    color: #222; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; transition: color .3s ease;
}
.seo-news-list > li:hover .tit a { color: #1258a6; }
.seo-news-list .sub {
    margin: 0 0 12px; font-size: 14px; line-height: 24px; color: #888;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.seo-news-list .meta { font-size: 13px; line-height: 22px; color: #9a9a9a; overflow: hidden; }
.seo-news-list .meta .tag {
    display: inline-block; margin-right: 12px; padding: 1px 12px; border-radius: 3px;
    background: #eef4fc; color: #1258a6; font-size: 12px; line-height: 20px;
    transition: all .25s ease;
}
.seo-news-list .meta .tag:hover { background: #1258a6; color: #fff; }
.seo-news-list .meta .date, .seo-news-list .meta .views { margin-right: 16px; }
.seo-news-list .meta .go { float: right; color: #1258a6; }
.seo-news-list .meta .go i { font-size: 12px; margin-left: 3px; }
.seo-news-list .meta .go:hover { text-decoration: underline; }
.seo-news-list > li:last-child { border-bottom: 0; }
.seo-news-empty { padding: 46px 0; text-align: center; color: #999; font-size: 15px; }
.seo-news-empty a { color: #1258a6; }

/* --- 10.3 分页（沿用原 .Page 皮肤，仅补间距） --- */
.seo-pager { display: block; }
.seo-pager .Page { padding-top: 34px; }

/* --- 10.4 右侧栏 --- */
.seo-side-box {
    border: 1px solid #eceae8; border-radius: 6px; margin-bottom: 20px; overflow: hidden;
}
.seo-side-box .hd {
    margin: 0; padding: 0 18px; background: #1258a6; color: #fff;
    font-size: 16px; font-weight: bold; line-height: 46px; position: relative;
}
.seo-side-box .hd:after {
    content: ""; position: absolute; right: 18px; top: 50%; width: 6px; height: 6px;
    margin-top: -3px; border-radius: 50%; background: rgba(255, 255, 255, .55);
}
.seo-side-cats { margin: 0; padding: 5px 0; list-style: none; }
.seo-side-cats li { border-bottom: 1px dashed #f1efed; }
.seo-side-cats li:last-child { border-bottom: 0; }
.seo-side-cats li a {
    display: block; padding: 0 18px 0 27px; font-size: 14px; line-height: 42px;
    color: #555; position: relative;
}
.seo-side-cats li a:before {
    content: ""; position: absolute; left: 16px; top: 50%; margin-top: -3px;
    width: 0; height: 0; border-left: 5px solid #c9d6e6;
    border-top: 3px solid transparent; border-bottom: 3px solid transparent;
}
.seo-side-cats li a em { float: right; font-style: normal; font-size: 12px; color: #bcbcbc; }
.seo-side-cats li a:hover, .seo-side-cats li a.on { color: #1258a6; background: #f7fafe; }
.seo-side-cats li a.on:before { border-left-color: #1258a6; }

.seo-side-rank { margin: 0; padding: 13px 18px; list-style: none; }
.seo-side-rank li { position: relative; padding-left: 27px; margin-bottom: 13px; }
.seo-side-rank li:last-child { margin-bottom: 0; }
.seo-side-rank .rk {
    position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 3px;
    background: #c9d6e6; color: #fff; font-style: normal; font-size: 11px;
    text-align: center; line-height: 18px;
}
.seo-side-rank li:nth-child(1) .rk { background: #d3261f; }
.seo-side-rank li:nth-child(2) .rk { background: #f0803c; }
.seo-side-rank li:nth-child(3) .rk { background: #f0b23c; }
.seo-side-rank li a {
    display: block; font-size: 14px; line-height: 22px; color: #555;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.seo-side-rank li a:hover { color: #1258a6; }
.seo-side-rank .v { display: none; }

.seo-side-news { margin: 0; padding: 13px 18px; list-style: none; }
.seo-side-news li { margin-bottom: 13px; }
.seo-side-news li:last-child { margin-bottom: 0; }
.seo-side-news li a {
    display: block; font-size: 14px; line-height: 22px; color: #555;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.seo-side-news li a:hover { color: #1258a6; }
.seo-side-news .d { display: block; font-size: 12px; line-height: 20px; color: #b2b2b2; }

.seo-side-tel {
    border-radius: 6px; background: #1258a6; color: #fff; text-align: center; padding: 20px 16px;
}
.seo-side-tel b { display: block; font-size: 15px; font-weight: normal; opacity: .85; }
.seo-side-tel a {
    display: block; margin: 5px 0 4px; color: #ffc404;
    font-family: "barlow", Arial, sans-serif; font-size: 24px; font-weight: bold;
}
.seo-side-tel a:hover { color: #fff; }
.seo-side-tel span { display: block; font-size: 12px; line-height: 20px; opacity: .72; }

/* --- 10.5 详情页：发文信息条（替代原 .newsDe .time 的纯文本行） --- */
.seo-artmeta {
    margin-top: 14px; padding-bottom: 12px; border-bottom: 1px solid #e6e6e5;
    text-align: center; font-size: 13px; line-height: 24px; color: #999;
}
.seo-artmeta .tag {
    display: inline-block; margin-right: 14px; padding: 1px 12px; border-radius: 3px;
    background: #eef4fc; color: #1258a6; font-size: 12px; line-height: 20px;
    transition: all .25s ease;
}
.seo-artmeta .tag:hover { background: #1258a6; color: #fff; }
.seo-artmeta .date, .seo-artmeta .views, .seo-artmeta .author { margin: 0 10px; }
.seo-artmeta i { margin-right: 4px; }

/* --- 10.6 详情页：相关阅读 --- */
.seo-related .seo-relnews-list { margin: 0; padding: 0; list-style: none; }
.seo-related .seo-relnews-list li {
    float: none; width: 100%; margin: 0 0 12px; white-space: normal;
}
.seo-related .seo-relnews-list li:before { display: none; }
.seo-related .seo-relnews-list li a {
    display: block; border: 1px solid #eceae8; border-radius: 6px; padding: 12px 16px;
    transition: all .28s ease;
}
.seo-related .seo-relnews-list li a:hover { border-color: #1258a6; background: #f7fafe; }
.seo-relnews-list .t {
    display: block; font-size: 15px; font-weight: bold; line-height: 23px; color: #333;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.seo-related .seo-relnews-list li a:hover .t { color: #1258a6; }
.seo-relnews-list .d { display: block; margin-top: 5px; font-size: 12px; line-height: 20px; color: #a8a8a8; }
.seo-relnews-list .d em { font-style: normal; color: #1258a6; margin-right: 8px; }
.seo-relnews-list .x {
    margin-top: 6px; font-size: 13px; line-height: 21px; color: #888;
    display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}

/* --- 10.7 移动端 --- */
@media (max-width: 991px) {
    .seo-news-wrap { display: block; }
    .seo-news-main { padding-right: 0; }
    .seo-news-side { width: 100%; flex: none; margin-top: 34px; }
}

@media (max-width: 767px) {
    .seo-news { padding: 22px 0 34px; }
    .seo-news-list > li { padding: 16px 0; }
    .seo-news-list .media { flex: 0 0 116px; width: 116px; height: 82px; border-radius: 4px; }
    .seo-news-list .media.ph span { font-size: 13px; line-height: 18px; letter-spacing: 0; }
    .seo-news-list .media.ph em { display: none; }
    .seo-news-list .body { padding-left: 12px; }
    .seo-news-list .tit { font-size: 16px; line-height: 23px; margin-bottom: 7px; }
    .seo-news-list .sub { display: none; }
    .seo-news-list .meta { font-size: 12px; }
    .seo-news-list .meta .tag { margin-right: 8px; padding: 0 8px; }
    .seo-news-list .meta .date, .seo-news-list .meta .views { margin-right: 9px; }
    .seo-news-list .meta .go { display: none; }
    .seo-side-tel { padding: 16px 14px; }
    .seo-artmeta { text-align: left; font-size: 12px; line-height: 22px; }
    .seo-artmeta .tag { margin: 0 8px 4px 0; }
    .seo-artmeta .date, .seo-artmeta .views, .seo-artmeta .author {
        display: inline-block; margin: 0 9px 2px 0;
    }
    .seo-relnews-list .x { -webkit-line-clamp: 2; }
}

/* ==========================================================================
   11. 详情页正文排版增强（裸文本结构化后的样式补齐）
   ========================================================================== */

/* --- 11.1 阅读进度条（由 newsDe.php 内联脚本注入 DOM） --- */
.seo-progress {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 3px;
    background: rgba(18, 88, 166, .12);
    z-index: 9999;
    pointer-events: none;
}
.seo-progress i {
    display: block;
    height: 100%;
    width: 0;
    background: #1258a6;
    transition: width .12s linear;
}

/* --- 11.2 导语段 --- */
.newsDe .cont p.art-lead {
    background: #f4f8fd;
    border-left: 3px solid #1258a6;
    padding: 14px 16px;
    border-radius: 0 4px 4px 0;
    color: #444;
    line-height: 30px;
    margin: 0 0 18px;
}

/* --- 11.3 标题装饰（配合第 4 节的字号规则，只补装饰不覆盖字号） --- */
.newsDe .cont h2 {
    position: relative;
    padding-bottom: 8px;
    border-bottom: 1px solid #e9eef5;
}
.newsDe .cont h3 {
    position: relative;
    padding-left: 14px;
}
.newsDe .cont h3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -8px;
    width: 4px;
    height: 16px;
    background: #1258a6;
    border-radius: 2px;
}

/* --- 11.4 图文（figure / figcaption） --- */
.newsDe .cont figure {
    margin: 18px 0;
    text-align: center;
}
.newsDe .cont figure img { margin: 0 auto; }
.newsDe .cont figcaption {
    margin-top: 8px;
    font-size: 13px;
    line-height: 22px;
    color: #8a94a3;
    text-align: center;
}

/* --- 11.5 表格（表头底色 / 斑马纹） --- */
.newsDe .cont table th {
    background: #f2f6fb;
    font-weight: bold;
    color: #1258a6;
    text-align: left;
}
.newsDe .cont table tr:nth-child(even) td { background: #fafbfd; }

/* --- 11.6 行内元素（含自动内链） --- */
.newsDe .cont strong,
.newsDe .cont b { color: #16324f; }
.newsDe .cont a {
    color: #1258a6;
    border-bottom: 1px solid rgba(18, 88, 166, .35);
}
.newsDe .cont a:hover { border-bottom-color: #1258a6; }
.newsDe .cont blockquote {
    margin: 16px 0;
    padding: 12px 16px;
    background: #f7f9fc;
    border-left: 3px solid #c8d8ea;
    color: #55606e;
    line-height: 28px;
}

/* --- 11.7 移动端 --- */
@media (max-width: 767px) {
    .newsDe .cont p.art-lead { padding: 12px 13px; font-size: 14px; line-height: 27px; }
    .newsDe .cont figure { margin: 14px 0; }
    .newsDe .cont figcaption { font-size: 12px; line-height: 20px; }
}

/* ============================================================
   12. 左栏分类卡重构（.sy-pro-left）
   —— 首页服务项目区 / 服务项目列表 / 服务详情 / 资讯详情 共用同一套皮肤
   仅用 seo.css 覆盖 style.css 的原规则，不修改原 CSS 文件（回滚=删本节）
   ============================================================ */

/* --- 12.1 卡面：深蓝渐变 + 高光 + 底部点阵 --- */
.sy-pro-left,
.indexProduct.product .sy-pro-left {
    position: relative;
    padding: 22px 0 0;
    background: linear-gradient(158deg, #0a4a92 0%, #1258a6 48%, #1d74c9 100%);
    border-radius: 16px;
    box-shadow: 0 16px 38px -18px rgba(9, 56, 112, .60), 0 2px 6px rgba(9, 56, 112, .10);
    overflow: hidden;
}
.sy-pro-left::before {
    content: ""; position: absolute; top: -78px; right: -64px; z-index: 0;
    width: 200px; height: 200px; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, 0) 70%);
}
.sy-pro-left::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 165px; z-index: 0;
    pointer-events: none; opacity: .45;
    background-image: radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1px);
    background-size: 14px 14px;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 100%);
            mask-image: linear-gradient(180deg, transparent 0%, #000 100%);
}
.sy-pro-left > * { position: relative; z-index: 1; }

/* --- 12.2 卡头：EN 疏排小字 + CN 大字 + 琥珀竖条 --- */
.sy-pro-left .en {
    padding: 0 22px; margin: 0 0 10px;
    font-family: barlow, Arial, Helvetica, sans-serif;
    font-size: 14px; line-height: 1; font-weight: 600;
    letter-spacing: .3em; text-transform: uppercase;
    color: rgba(255, 255, 255, .45);
}
.sy-pro-left .cn {
    position: relative;
    padding: 0 22px 15px 34px; margin: 0;
    font-size: 24px; line-height: 1.2; font-weight: 800; color: #fff;
}
.sy-pro-left .cn::before {
    content: ""; position: absolute; left: 22px; top: 3px;
    width: 4px; height: 22px; border-radius: 2px;
    background: linear-gradient(180deg, #ffc404 0%, #ffdf85 100%);
    box-shadow: 0 0 10px rgba(255, 196, 4, .55);
}
/* 资讯详情页有两组标题，第二组要跟上面的白面板拉开距离 */
.sy-pro-left .pro-class + .en { margin-top: 20px; }

/* --- 12.3 分类 / 文章列表：白面板 + 箭头左置 + 悬停滑动 --- */
.sy-pro-left .pro-class {
    width: auto; margin: 0 12px; padding: 6px;
    background: #fff; border-radius: 12px;
    box-shadow: inset 0 1px 0 #fff, 0 8px 20px -12px rgba(6, 44, 90, .55);
}
.sy-pro-left .pro-class .link a {
    position: relative; overflow: hidden;
    /* 注意：-webkit-line-clamp 与 padding 不能同时作用在同一元素上——
       行数上限按内容盒算、overflow 按内边距盒裁，会在第 2 行下露出半行文字。
       所以这里 a 只负责内边距与点击区，截断交给内层 span。 */
    display: block; -webkit-line-clamp: none;
    padding: 11px 14px 11px 32px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 15px; line-height: 22px; color: #33415c;
    transition: background .22s ease, color .22s ease, box-shadow .22s ease;
}
.sy-pro-left .pro-class .link a > span {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}
.sy-pro-left .pro-class .link a:last-child { border-bottom: 0; }
.sy-pro-left .pro-class .link a:hover {
    background: linear-gradient(90deg, #eaf3fd 0%, #f8fbff 100%);
    color: #1258a6;
    box-shadow: inset 3px 0 0 #1258a6;
}
/* 当前所在分类：原站无此状态，新增（蓝底 + 琥珀左条） */
.sy-pro-left .pro-class .link a.on,
.sy-pro-left .pro-class .link a.on:hover {
    background: linear-gradient(90deg, #1258a6 0%, #2b80d5 100%);
    color: #fff; font-weight: 700; border-bottom-color: transparent;
    box-shadow: inset 3px 0 0 #ffc404, 0 8px 16px -10px rgba(18, 88, 166, .9);
}
.sy-pro-left .pro-class .link a i {
    position: absolute; left: 14px; top: 50%;
    width: 14px; height: 16px; margin-top: -8px;
    font-size: 11px; line-height: 16px; text-align: center;
    color: #b7c7da; transform: translateX(0);
    transition: color .22s ease, transform .22s ease;
}
.sy-pro-left .pro-class .link a:hover i { color: #1258a6; transform: translateX(3px); }
.sy-pro-left .pro-class .link a.on i,
.sy-pro-left .pro-class .link a.on:hover i { color: #ffc404; }
.sy-pro-left .pro-class .link a:focus-visible { outline: 2px solid #ffc404; outline-offset: -2px; }

/* --- 12.4 电话区：同心光环 + 呼吸光圈 + 琥珀按钮 --- */
.sy-pro-left .tel {
    margin-top: 16px; padding: 22px 16px 24px; text-align: center;
    background: linear-gradient(180deg, rgba(255, 255, 255, .05) 0%, rgba(255, 255, 255, .13) 100%);
    border-top: 1px solid rgba(255, 255, 255, .16);
}
.sy-pro-left .tel .ico {
    position: relative; width: 78px; height: 78px; margin: 0 auto; padding: 0; border: 0;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; background: rgba(255, 255, 255, .10);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .26),
                0 0 0 9px rgba(255, 255, 255, .055),
                0 0 0 17px rgba(255, 255, 255, .028);
}
.sy-pro-left .tel .ico::after {
    content: ""; position: absolute; left: -1px; top: -1px; right: -1px; bottom: -1px;
    border-radius: 50%; border: 1px solid rgba(255, 255, 255, .55);
    animation: seoSidePulse 2.8s ease-out infinite;
}
@keyframes seoSidePulse {
    0%   { transform: scale(.94); opacity: .70; }
    70%  { transform: scale(1.32); opacity: 0; }
    100% { transform: scale(1.32); opacity: 0; }
}
.sy-pro-left .tel .ico i {
    width: 54px; height: 54px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; font-size: 26px; color: #1258a6;
    background: linear-gradient(140deg, #ffffff 0%, #e6f0fb 100%);
    box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .35);
}
.sy-pro-left .tel p {
    margin: 13px 0 0; font-size: 13px; line-height: 1.4;
    letter-spacing: .12em; color: rgba(255, 255, 255, .72);
}
.sy-pro-left .tel p span { display: block; margin-bottom: 3px; }
.sy-pro-left .tel p a {
    display: block;
    font-family: barlow, Arial, sans-serif;
    font-size: 26px; line-height: 1.3; font-weight: 700;
    letter-spacing: .01em; color: #fff;
    font-variant-numeric: tabular-nums;
}
.sy-pro-left .tel p a:hover { color: #ffc404; }
.sy-pro-left .tel .seo-tel-btn {
    display: block; margin: 14px 0 0; padding: 10px 0; border-radius: 999px;
    background: linear-gradient(135deg, #ffc404 0%, #ffd75e 100%);
    color: #14345c; font-size: 14px; font-weight: 700; letter-spacing: .04em; text-align: center;
    box-shadow: 0 8px 18px -10px rgba(255, 196, 4, .9);
    transition: transform .2s ease, box-shadow .2s ease;
}
.sy-pro-left .tel .seo-tel-btn:hover {
    transform: translateY(-1px); color: #14345c;
    box-shadow: 0 12px 22px -10px rgba(255, 196, 4, .95);
}
.sy-pro-left .tel .seo-tel-btn i { margin-right: 5px; font-size: 14px; vertical-align: -1px; }

/* --- 12.5 移动端：原站此处 display:none，改为「标题条 + 电话条」精简卡 --- */
@media (max-width: 767px) {
    .sy-pro-left,
    .indexProduct.product .sy-pro-left {
        display: block; float: none; width: 100%; margin: 0 0 14px;
        padding: 16px 0 0; border-radius: 14px;
    }
    /* 分类列表在手机端由页顶的分类导航条承担，这里不重复 */
    .sy-pro-left .pro-class { display: none; }
    .sy-pro-left .en { display: none; }
    .sy-pro-left .cn { padding: 0 18px 0 30px; font-size: 19px; }
    .sy-pro-left .cn::before { left: 18px; top: 1px; width: 3px; height: 18px; }
    .sy-pro-left .tel {
        margin-top: 14px; padding: 14px 18px 16px;
        display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px;
        text-align: left;
    }
    .sy-pro-left .tel .ico {
        width: 54px; height: 54px; margin: 0; flex: 0 0 54px;
        box-shadow: 0 0 0 1px rgba(255, 255, 255, .26), 0 0 0 7px rgba(255, 255, 255, .06);
    }
    .sy-pro-left .tel .ico i { width: 40px; height: 40px; font-size: 20px; }
    .sy-pro-left .tel p { margin: 0; flex: 1 1 auto; }
    .sy-pro-left .tel p a { font-size: 23px; }
    .sy-pro-left .tel .seo-tel-btn { flex: 1 1 100%; margin: 6px 0 0; }
}
/* --- 12.6 平板 768–999px：原站此处左栏 252px + 右栏 78.7879% 相加已超容器宽度，
       右栏被挤到左栏下方、右侧留出大片空白。收窄左栏让两栏真正并排 --- */
@media (min-width: 768px) and (max-width: 999px) {
    .sy-pro-left,
    .indexProduct.product .sy-pro-left { width: 206px; }
    .sy-pro-right { width: calc(100% - 218px); }
    .sy-pro-left .en { padding: 0 16px; font-size: 12px; letter-spacing: .22em; }
    .sy-pro-left .cn { padding: 0 16px 13px 28px; font-size: 20px; }
    .sy-pro-left .cn::before { left: 16px; top: 3px; height: 19px; }
    .sy-pro-left .pro-class { margin: 0 9px; padding: 5px; }
    .sy-pro-left .pro-class .link a { padding: 10px 10px 10px 27px; font-size: 14px; line-height: 20px; }
    .sy-pro-left .pro-class .link a i { left: 11px; }
    .sy-pro-left .tel { padding: 18px 12px 20px; }
    .sy-pro-left .tel .ico {
        width: 66px; height: 66px;
        box-shadow: 0 0 0 1px rgba(255, 255, 255, .26),
                    0 0 0 8px rgba(255, 255, 255, .055),
                    0 0 0 14px rgba(255, 255, 255, .028);
    }
    .sy-pro-left .tel .ico i { width: 46px; height: 46px; font-size: 22px; }
    .sy-pro-left .tel p a { font-size: 21px; }
    .sy-pro-left .tel .seo-tel-btn { padding: 9px 0; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
    .sy-pro-left .tel .ico::after { animation: none; }
}

/* ============================================================
   13. 相关服务与设备租赁 —— 分类图片网格（详情页底部）
   原为两列文字链接，改为「一行多列」图片卡片；
   样式以 seo- 前缀独立存在，删掉本节即回到纯文字列表。
   ============================================================ */
.seo-svgrid {
    margin-top: 34px;
    padding-top: 26px;
    border-top: 1px solid #e6e6e5;
}
.seo-svgrid-hd { margin-bottom: 20px; }
.seo-svgrid-hd h3 {
    font-size: 20px;
    line-height: 30px;
    font-weight: bold;
    color: #222;
    margin: 0 0 7px;
    position: relative;
    padding-left: 14px;
}
.seo-svgrid-hd h3::before {
    content: "";
    position: absolute;
    left: 0; top: 4px; bottom: 4px;
    width: 4px;
    border-radius: 2px;
    background: linear-gradient(180deg, #f7ae2e, #e08800);
}
.seo-svgrid-hd p {
    margin: 0;
    font-size: 13px;
    line-height: 22px;
    color: #8a94a3;
}

/* 分组（服务项目 / 设备租赁） */
.seo-svgrid-sec + .seo-svgrid-sec { margin-top: 26px; }
.seo-svgrid-t {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin-bottom: 13px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #e2eaf5;
}
.seo-svgrid-t span {
    position: relative;
    padding-left: 11px;
    font-size: 15px;
    font-weight: bold;
    color: #1258a6;
}
.seo-svgrid-t span::before {
    content: "";
    position: absolute;
    left: 0; top: 50%;
    margin-top: -7px;
    width: 3px; height: 14px;
    border-radius: 2px;
    background: #1258a6;
}
.seo-svgrid-t em {
    font-style: normal;
    font-size: 11px;
    letter-spacing: .17em;
    color: #b6bfcb;
    text-transform: uppercase;
}

/* 网格本体：默认一行 5 列 */
.seo-svgrid-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.seo-svgrid-list li { margin: 0; padding: 0; float: none; width: auto; }
.seo-svgrid-list li::before { content: none; }

.seo-svgrid-list a {
    display: block;
    height: 100%;
    padding: 9px 9px 12px;
    background: #fff;
    border: 1px solid #e6ecf5;
    border-radius: 12px;
    text-align: center;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.seo-svgrid-list a:hover {
    transform: translateY(-3px);
    border-color: #bcd6f2;
    box-shadow: 0 10px 22px rgba(18, 88, 166, .16);
}
.seo-svgrid-list .ph {
    display: block;
    border-radius: 8px;
    overflow: hidden;
    background: #eef4fb;
    line-height: 0;
}
.seo-svgrid-list .ph img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform .45s ease;
}
.seo-svgrid-list a:hover .ph img { transform: scale(1.05); }
.seo-svgrid-list b {
    display: block;
    margin-top: 9px;
    font-size: 13.5px;
    line-height: 20px;
    font-weight: bold;
    color: #1e2c40;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.seo-svgrid-list i {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 4px;
    min-height: 36px;
    font-style: normal;
    font-size: 12px;
    line-height: 18px;
    color: #8b96a5;
    text-align: left;
}

/* 13.1 中屏：右栏变窄，改 4 列 */
@media (max-width: 1199px) {
    .seo-svgrid-list { grid-template-columns: repeat(4, 1fr); }
}
/* 13.2 平板（左栏仍在，右栏约 530px）→ 3 列 */
@media (max-width: 991px) {
    .seo-svgrid-list { grid-template-columns: repeat(3, 1fr); gap: 12px; }
}
/* 13.3 手机：满宽 2 列，只留图 + 名称，避免长列表 */
@media (max-width: 559px) {
    .seo-svgrid { margin-top: 26px; padding-top: 20px; }
    .seo-svgrid-hd h3 { font-size: 17px; line-height: 26px; }
    .seo-svgrid-list { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .seo-svgrid-list a { padding: 7px 7px 10px; border-radius: 10px; }
    .seo-svgrid-list b { margin-top: 8px; font-size: 13px; line-height: 19px; }
    .seo-svgrid-list i { display: none; }
}

/* ============================================================
   14. 产品卡视觉统一
   覆盖对象：首页服务项目区 / 服务项目列表 / 设备租赁列表 /
             服务详情页右栏「设备租赁」区（.sy-pro-list 与 .pro-cpyy）
   原站问题：① 灰底标题条（#dcdcdc / #f1f1f1）与新版左栏、分类网格不搭
             ② 直角 + 1px 灰边框，观感偏老旧
             ③ `.pro-cpyy img{height:260px}` 锁死高度，宽高比与图片不符时会被拉伸
   本次只改「颜色 / 圆角 / 边框 / 比例」，不改栅格与结构，删掉本节即回滚。
   ============================================================ */
.sy-pro-list,
.pro-cpyy {
    background: #fff;
    border: 1px solid #e6ecf5;
    border-radius: 12px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.sy-pro-list:hover,
.pro-cpyy:hover {
    transform: translateY(-3px);
    border-color: #bcd6f2;
    box-shadow: 0 10px 22px rgba(18, 88, 166, .16);
}
/* 图片区：去掉老式相框（1px 灰边 + 5px padding），统一 16:11 裁切。
   用 aspect-ratio 而不是绝对定位，浏览器不支持时 height:100% 退化为 auto，
   图片仍按原比例正常显示，不会塌陷成 0 高 */
.sy-pro-list .pic,
.pro-cpyy .pic {
    aspect-ratio: 16 / 11;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: #f4f8fd;
}
.sy-pro-list .pic img,
.pro-cpyy .pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* 标题条：灰底 → 白底 + 深色字，hover 转蓝 */
.sy-pro-list .tit,
.pro-cpyy .tit {
    height: 48px;
    line-height: 48px;
    background: #fff;
    border-top: 1px solid #eef3f9;
    padding: 0 12px;
    font-size: 15px;
    font-weight: bold;
    color: #1e2c40;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .25s ease, background .25s ease;
}
.sy-pro-list:hover .tit,
.pro-cpyy:hover .tit {
    background: #fff;
    color: #1258a6;
}
/* 移动端：两列时压缩标题条，避免占高过多 */
@media (max-width: 767px) {
    .sy-pro-list .tit,
    .pro-cpyy .tit {
        height: 42px;
        line-height: 42px;
        font-size: 13.5px;
        padding: 0 8px;
    }
    .sy-pro-list,
    .pro-cpyy { border-radius: 10px; }
}

/* ==========================================================================
   15. 详情页「上一篇 / 下一篇」：清除内部浮动 + 单行省略号
   —— 修 newsShow / casesShow 详情页里「相关阅读」「相关服务」区块被浮动压住、标题被挤到右侧的错位
   —— 根因：原站 style.css 的 .dePage a 是 float:left/right，而 .dePage 容器没有清浮动
      （老站 .dePage 正好是右栏容器的最后一个元素，所以一直看不出；后面接上内容块才暴露）
   —— 附带：原站 .dePage a span{-webkit-line-clamp:1} 是死代码（模板里 <a> 从来没有 <span>），
      导致长标题换行成 2 行、左右两框高度参差；这里直接在 a 上做单行截断，恢复原设计的一行等高
   —— 删掉本节即完全回滚
   ========================================================================== */
.dePage::after { content: ""; display: block; clear: both; }
.dePage a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ==========================================================================
   16. 数据统计条（9大 / 5类 / 10+ / 24h）· 浅色卡片版
   —— 改版原因：原第 7.2 节是整块深蓝底 + 44px 数字 + 16px 浅蓝单位紧贴 + 一根硬竖线，
      观感生硬、上下只有 40px 留白显闷。改为「浅灰底 + 四张白卡」，数字用品牌深蓝、
      单位用浅蓝，整块更轻更透气。
   —— 本节只覆盖 .seo-stats 系列的选择器与配色，不动 DOM、不碰 style.css / response.css
   —— 删掉本节即回滚为第 7.2 节的深蓝底版本
   ========================================================================== */
.seo-stats { background: #f2f5f9; padding: 44px 0; }
.seo-stats ul { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.seo-stats li {
    flex: 1; position: relative; text-align: center;
    margin: 0 8px; padding: 26px 10px 22px;
    background: #fff; border-radius: 10px;
    transition: transform .28s ease, box-shadow .28s ease;
}
.seo-stats li + li:before { display: none; }
.seo-stats li:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(11, 60, 120, .1); }
.seo-stats .num { line-height: 1; }
.seo-stats .num em {
    font-family: Arial, Helvetica, sans-serif; font-style: normal;
    font-size: 40px; font-weight: bold; color: #0b3c78; letter-spacing: -.5px;
}
.seo-stats .num i { font-style: normal; font-size: 16px; font-weight: normal; color: #4a90d9; margin-left: 5px; }
.seo-stats p { margin: 10px 0 0; font-size: 14px; color: #5f7186; line-height: 22px; }

/* 中屏：卡片内边距收敛，仍保持一行四列 */
@media (max-width: 991px) {
    .seo-stats li { padding: 22px 8px 18px; }
    .seo-stats .num em { font-size: 34px; }
}
/* 手机：两列两行 */
@media (max-width: 767px) {
    .seo-stats { padding: 28px 0 20px; }
    .seo-stats ul { margin: 0 -6px; }
    .seo-stats li { flex: 0 0 calc(50% - 12px); margin: 0 6px 12px; padding: 18px 8px 14px; border-radius: 8px; }
    .seo-stats .num em { font-size: 30px; }
    .seo-stats .num i { font-size: 14px; margin-left: 4px; }
    .seo-stats p { font-size: 12px; margin-top: 7px; line-height: 19px; }
}

/* ==========================================================================
   17. 服务流程：手机端重排（序号不贴边 + 与标题垂直居中 + 连接线贯通）
   —— 问题（375px 实测）：第 7.5 节的手机端规则把序号圆绝对定位到 li 的 left:0，
      而 `.container` 在手机上左右各只有 7.5px → 圆距屏幕边仅 7.5px，视觉「跑偏」；
      且圆(54px) 与标题(24px) 顶部对齐，圆心 cy=183 vs 标题 cy=168，错位 15px。
   —— 本节改 grid 两列（序号 46px + 文字 1fr）：序号左内缩 8px、与文字间距 20px，
      序号与首行标题垂直居中，连接线从圆底贯通到下一项上方 8px 处。
   —— 只覆盖 767px 以下，桌面/平板样式不变；删除本节即回滚
   —— 补修（2026-10-08 二轮，卫哥截图）：圆内数字贴左。本节把 li 改成 text-align:left，
      而基础规则 `.seo-flow-list .no` 自身没有 text-align（桌面靠 li 的 center 撑着）
      → 数字被继承成 left。实测 dx=-13.1px（左间距 1.0 / 右间距 27.2）。
      修法：基础规则 `.no` 显式 `text-align:center` + 本节再补一条（双保险），实测 dx≈0。
   ========================================================================== */
@media (max-width: 767px) {
    .seo-flow-list li {
        flex: 0 0 100%;
        display: grid;
        grid-template-columns: 46px minmax(0, 1fr);
        grid-template-rows: 46px auto;
        column-gap: 20px;
        padding: 0 8px;
        margin-bottom: 22px;
        min-height: 0;
        text-align: left;
        position: relative;
    }
    .seo-flow-list .no {
        position: static;
        grid-column: 1; grid-row: 1;
        align-self: center;
        width: 46px; height: 46px; line-height: 44px;
        font-size: 16px;
        text-align: center; /* 本节的 li 是 text-align:left，必须在此显式拉回居中 */
    }
    .seo-flow-list h3 {
        grid-column: 2; grid-row: 1;
        align-self: center;
        margin: 0;
        font-size: 16px; line-height: 24px;
    }
    .seo-flow-list p {
        grid-column: 2; grid-row: 2;
        margin: 6px 0 0;
        font-size: 13px; line-height: 21px;
    }
    .seo-flow-list li:not(:last-child):after {
        display: block;
        left: 30.5px; right: auto;
        top: 50px; bottom: -14px;
        width: 1px; height: auto;
        background: #cfe0f2;
    }
}