/* =====================================================================
   湖南速网信息科技官网 主题样式
   品牌色取自LOGO：藏青 #132c54 / 红 #d7362e / 橙 #f0952b
   ===================================================================== */
:root {
    --navy: #132c54;
    --navy-2: #1d3f77;
    --blue: #1f5fd6;
    --blue-dark: #17448f;
    --blue-tint: #e8f0fd;
    --red: #d7362e;
    --red-dark: #b22a23;
    --orange: #f0952b;
    --ink: #1e2635;
    --muted: #64718a;
    --bg-light: #f4f7fb;
    --line: #e4eaf3;
    --shadow: 0 10px 30px rgba(19, 44, 84, .10);
    --radius: 12px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    color: var(--ink);
    font-size: 15px;
    line-height: 1.7;
    background: #fff;
    overflow-x: hidden;
}

a { color: inherit; text-decoration: none; transition: color .2s, background .2s, transform .2s, box-shadow .2s; }
img { max-width: 100%; display: block; }
ul, ol { list-style: none; }

.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* 移动端专属元素（默认隐藏，760px 内启用） */
.m-only { display: none !important; }
/* 首页三联图卡条：桌面隐藏，移动端在 760 块内以 grid 显示（勿用 m-only 类——其 display:block!important 会压掉 grid 导致卡片竖向堆叠） */
.hero-strip { display: none; }

/* ---------- 按钮 ---------- */
.btn {
    display: inline-block; padding: 12px 28px; border-radius: 8px;
    font-size: 15px; font-weight: 600; border: 1px solid transparent; cursor: pointer;
}
.btn-primary { background: var(--blue); color: #fff; box-shadow: 0 8px 20px rgba(31, 95, 214, .3); }
.btn-primary:hover { background: var(--blue-dark); color: #fff; transform: translateY(-2px); }
.btn-ghost { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.55); }
.btn-ghost:hover { background: rgba(255,255,255,.16); color: #fff; }
.btn-red { background: var(--red); color: #fff; box-shadow: 0 8px 20px rgba(215, 54, 46, .3); }
.btn-red:hover { background: var(--red-dark); color: #fff; transform: translateY(-2px); }
.btn-lg { padding: 14px 38px; font-size: 16px; }
.btn-block { display: block; width: 100%; text-align: center; }

/* ---------- 顶部导航 ---------- */
.site-header {
    position: sticky; top: 0; z-index: 100; background: #fff;
    box-shadow: 0 1px 0 var(--line); transition: box-shadow .25s;
}
.site-header.scrolled { box-shadow: 0 6px 24px rgba(19, 44, 84, .10); }
.header-inner { display: flex; align-items: center; height: 78px; gap: 28px; }
.logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.logo-img { width: 48px; height: 48px; object-fit: contain; }
.logo-text { display: flex; flex-direction: column; line-height: 1.25; }
.logo-text b { font-size: 19px; color: var(--navy); letter-spacing: .5px; }
.logo-text i { font-style: normal; font-size: 9.5px; color: #93a1b8; letter-spacing: .4px; transform-origin: left; }

.main-nav { margin-left: auto; }
.main-nav ul { display: flex; gap: 4px; }
.main-nav a {
    display: block; padding: 10px 12px; font-size: 15px; color: #3c4a63; font-weight: 500;
    border-radius: 6px; position: relative; white-space: nowrap;
}
.main-nav a:hover { color: var(--blue); }
.main-nav li.active a { color: var(--blue); font-weight: 600; }
.main-nav li.active a::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 3px;
    border-radius: 2px; background: var(--blue);
}

.header-phone { display: flex; align-items: center; gap: 10px; flex-shrink: 0; padding-left: 20px; border-left: 1px solid var(--line); }
.hp-icon {
    width: 40px; height: 40px; border-radius: 50%; background: var(--blue-tint); color: var(--blue);
    display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0;
}
.hp-body { display: flex; flex-direction: column; line-height: 1.3; white-space: nowrap; }
.hp-body b { font-size: 17px; color: var(--navy); }
.hp-body i { font-style: normal; font-size: 11.5px; color: var(--muted); }

.nav-toggle { display: none; }

.nav-mask { display: none; }

/* ---------- 首屏轮播 ---------- */
.hero { position: relative; height: 56vw; max-height: 82vh; min-height: 480px; overflow: hidden; background: var(--navy); }
.hero-slide {
    position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    background-image: var(--dgi, none); background-size: cover; background-position: center 25%;
    opacity: 0; visibility: hidden; transition: opacity 1s ease, visibility 1s;
}
.hero-slide.active { opacity: 1; visibility: visible; }
.hero-slide::before {
    content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    background: linear-gradient(90deg, rgba(9, 20, 42, .66) 0%, rgba(9, 20, 42, .36) 38%, rgba(9, 20, 42, 0) 62%), linear-gradient(180deg, rgba(10, 22, 45, .08) 0%, rgba(10, 22, 45, .28) 100%);
}
/* 2026-10-19 hero2 起：底图为左空右图，左侧文案为 HTML 层（见文末 .ht 增量块） */
.hero-cta {
    position: absolute; left: 0; right: 0; bottom: 66px; z-index: 5;
    display: flex; gap: 14px;
}
.hero-cta .btn-ghost { background: rgba(13, 30, 60, .45); border-color: rgba(255,255,255,.6); }
.hero-cta .btn-ghost:hover { background: rgba(13, 30, 60, .65); }
.hero-dots { position: absolute; left: 0; right: 0; bottom: 26px; display: flex; justify-content: center; gap: 10px; z-index: 5; }
.hero-dots button {
    width: 32px; height: 5px; border-radius: 3px; border: 0; background: rgba(255,255,255,.35); cursor: pointer; transition: background .2s;
}
.hero-dots button.on { background: #fff; }

/* ---------- 数据条 ---------- */
.stats-wrap { position: relative; z-index: 6; padding: 0 24px; }
.stats {
    max-width: 1140px; margin: -58px auto 0; background: #fff; border-radius: 14px;
    box-shadow: var(--shadow); display: grid; grid-template-columns: repeat(4, 1fr);
    padding: 26px 12px; position: relative;
}
.stat { text-align: center; border-right: 1px solid var(--line); }
.stat:last-child { border-right: 0; }
.stat b { display: block; font-size: 34px; font-weight: 700; color: var(--blue); line-height: 1.2; }
.stat span { font-size: 13.5px; color: var(--muted); }

/* ---------- 区块通用 ---------- */
.sec { padding: 84px 0; }
.sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 40px; }
.sec-head-center { flex-direction: column; align-items: center; text-align: center; margin-bottom: 44px; }
.sec-head h2 { font-size: 30px; color: var(--navy); line-height: 1.3; }
.sec-desc { color: var(--muted); font-size: 15px; margin-top: 8px; }
.sec-title { font-size: 26px; color: var(--navy); margin: 6px 0 18px; }
.eyebrow {
    color: var(--red); font-size: 13px; font-weight: 700; letter-spacing: 2.5px; margin-bottom: 6px;
}
.eyebrow-light { color: var(--orange); }
.more-link { color: var(--blue); font-size: 14.5px; font-weight: 600; white-space: nowrap; }
.more-link:hover { color: var(--blue-dark); }

/* ---------- 业务领域 ---------- */
.sec-business { background: #fff; }
.biz-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.biz-card {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
    display: flex; flex-direction: column;
}
.biz-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
.biz-img { position: relative; overflow: hidden; background: var(--bg-light); }
.biz-img::before { content: ""; display: block; padding-top: 62.5%; }
.biz-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.biz-card:hover .biz-img img { transform: scale(1.05); }
.biz-body { padding: 20px 22px 22px; }
.biz-title { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.biz-icon {
    width: 34px; height: 34px; border-radius: 9px; background: var(--blue-tint); color: var(--blue);
    display: inline-flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0;
}
.biz-title h3 { font-size: 18px; color: var(--navy); }
.biz-body p { color: var(--muted); font-size: 14px; min-height: 44px; }
.biz-more { color: var(--blue); font-size: 14px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; margin-top: 10px; }

/* ---------- 优势 / 定位 ---------- */
.sec-why { background: linear-gradient(135deg, var(--navy) 0%, #0e2244 100%); }
.why-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 60px; align-items: center; }
.why-intro h2 { color: #fff; font-size: 30px; line-height: 1.4; margin-bottom: 18px; }
.why-intro p { color: rgba(255,255,255,.78); margin-bottom: 26px; }
.why-items { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.why-item {
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
    border-radius: var(--radius); padding: 26px 22px; transition: background .25s;
}
.why-item:hover { background: rgba(255,255,255,.11); }
.why-item i { font-size: 26px; color: var(--orange); }
.why-item h3 { color: #fff; font-size: 17px; margin: 10px 0 6px; }
.why-item p { color: rgba(255,255,255,.65); font-size: 13.5px; }

/* ---------- 工程案例 ---------- */
.sec-cases { background: var(--bg-light); }
.case-grid { display: grid; gap: 24px; }
.case-grid-4 { grid-template-columns: repeat(4, 1fr); }
.case-grid-3 { grid-template-columns: repeat(3, 1fr); }
.case-card {
    background: #fff; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line);
    display: flex; flex-direction: column;
}
.case-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.case-img { position: relative; overflow: hidden; background: var(--navy-2); }
.case-img::before { content: ""; display: block; padding-top: 62.5%; }
.case-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.case-card:hover .case-img img { transform: scale(1.06); }
.case-ph {
    position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #16305e, #1d4787); color: rgba(255,255,255,.8); font-size: 44px;
}
.case-tags { position: absolute; left: 12px; top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.case-tags span {
    background: rgba(13, 35, 70, .72); color: #fff; font-size: 12px; padding: 3px 10px; border-radius: 20px;
    backdrop-filter: blur(4px);
}
.case-body { padding: 16px 18px 18px; }
.case-body h3 {
    font-size: 15.5px; color: var(--ink); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden; min-height: 46px;
}
.case-body p { color: var(--muted); font-size: 13px; margin-top: 8px; }

/* ---------- 服务流程 ---------- */
.proc-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.proc-step { text-align: center; padding: 30px 14px; border-radius: var(--radius); background: var(--bg-light); position: relative; }
.proc-num {
    display: inline-flex; width: 52px; height: 52px; border-radius: 50%; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--blue), var(--navy-2)); color: #fff; font-size: 18px; font-weight: 700;
    margin-bottom: 14px;
}
.proc-step h3 { font-size: 16.5px; color: var(--navy); margin-bottom: 4px; }
.proc-step p { font-size: 13px; color: var(--muted); }

/* ---------- 维保托管 CTA ---------- */
.maint-band { background: linear-gradient(100deg, #112a52 0%, #17418c 78%, #1f5fd6 100%); padding: 64px 0; }
.maint-inner { display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.maint-inner h2 { color: #fff; font-size: 26px; margin-bottom: 10px; }
.maint-inner p { color: rgba(255,255,255,.8); max-width: 640px; }
.maint-btns { display: flex; gap: 14px; flex-shrink: 0; }

/* ---------- 新闻 ---------- */
.sec-news { background: #fff; }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.news-grid-2 { grid-template-columns: repeat(2, 1fr); }
.news-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.news-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.news-img { overflow: hidden; background: var(--navy-2); position: relative; }
.news-img::before { content: ""; display: block; padding-top: 56.25%; }
.news-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.news-card:hover .news-img img { transform: scale(1.05); }
.news-body { padding: 18px 20px 20px; }
.news-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.news-meta time { color: #97a3b8; font-size: 12.5px; }
.chip { display: inline-block; font-size: 12px; padding: 2px 10px; border-radius: 20px; }
.chip-blue { background: var(--blue-tint); color: var(--blue); }
.news-body h3 {
    font-size: 16.5px; color: var(--ink); line-height: 1.5; margin-bottom: 8px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.news-body p {
    color: var(--muted); font-size: 13.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- 品牌 ---------- */
.brand-band { background: var(--bg-light); padding: 44px 0; border-top: 1px solid var(--line); }
.brand-label { text-align: center; color: var(--muted); font-size: 14px; letter-spacing: 2px; margin-bottom: 18px; }
.brand-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.brand-chip {
    background: #fff; border: 1px solid var(--line); color: #55627a; font-size: 14px; font-weight: 600;
    padding: 9px 22px; border-radius: 30px;
}

/* ---------- 内页头图 ---------- */
.page-hero {
    position: relative; padding: 92px 0 56px; background-size: cover; background-position: center;
    background-color: var(--navy);
}
.page-hero::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(10,25,52,.86), rgba(10,25,52,.68)); }
.page-hero .container { position: relative; }
.page-hero-sm { padding: 72px 0 44px; }
.crumbs { color: rgba(255,255,255,.72); font-size: 13px; margin-bottom: 12px; }
.crumbs a:hover { color: #fff; }
.crumbs i { margin: 0 8px; font-style: normal; opacity: .6; }
.crumbs-dark { color: #93a1b8; }
.crumbs-dark a { color: var(--blue); }
.page-hero h1 { color: #fff; font-size: 32px; font-weight: 700; }
.page-hero p { color: rgba(255,255,255,.82); margin-top: 8px; }
.ph-tags { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.ph-tags span {
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); color: #fff;
    font-size: 12.5px; padding: 3px 12px; border-radius: 20px;
}

/* ---------- 关于我们 ---------- */
.about-grid { display: grid; grid-template-columns: 1fr 320px; gap: 44px; align-items: start; }
.pos-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 30px; }
.pos-card {
    background: linear-gradient(160deg, #f7faff, #eef4fd); border: 1px solid var(--line);
    border-radius: var(--radius); padding: 24px 18px; text-align: center;
}
.pos-card i { font-size: 24px; color: var(--blue); }
.pos-card h3 { font-size: 15px; color: var(--muted); font-weight: 500; margin: 10px 0 4px; }
.pos-card p { font-size: 16px; color: var(--navy); font-weight: 700; }

.about-side { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; }
.side-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; box-shadow: 0 4px 16px rgba(19,44,84,.05); }
.side-card h4 { font-size: 16.5px; color: var(--navy); margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.promise-list li { display: flex; gap: 8px; font-size: 14px; color: #3c4a63; padding: 6px 0; }
.promise-list i { color: #2fa55a; margin-top: 4px; }
.side-contact p { display: flex; gap: 10px; font-size: 14px; color: #3c4a63; padding: 6px 0; line-height: 1.6; }
.side-contact p i { color: var(--blue); margin-top: 4px; }
.side-phone { font-size: 18px !important; font-weight: 700; color: var(--navy) !important; }
.side-card .btn { margin-top: 14px; }

/* ---------- 维保服务 ---------- */
.rich-lead { font-size: 16px; color: #33405a; max-width: 900px; margin: 0 auto 44px; text-align: left; }
.promise-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 64px; }
.promise-card {
    background: linear-gradient(160deg, #f7faff, #eef4fd); border: 1px solid var(--line);
    border-radius: var(--radius); padding: 28px 20px; text-align: center;
}
.promise-card i { font-size: 26px; color: var(--red); }
.promise-card b { display: block; font-size: 17px; color: var(--navy); margin: 10px 0 4px; }
.promise-card span { font-size: 13px; color: var(--muted); }
.flow-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 64px; }
.flow-step { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 22px; }
.flow-step span {
    display: inline-block; font-size: 15px; font-weight: 800; color: var(--red);
    border-bottom: 3px solid var(--red); padding-bottom: 4px; margin-bottom: 12px;
}
.flow-step h3 { font-size: 16.5px; color: var(--navy); margin-bottom: 6px; }
.flow-step p { font-size: 13.5px; color: var(--muted); }
.maint-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 64px; }
.md-item { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; }
.md-item h3 { font-size: 17px; color: var(--navy); margin-bottom: 14px; }
.md-item h3 i { color: var(--blue); margin-right: 6px; }
.md-item li { position: relative; padding: 6px 0 6px 20px; font-size: 14.5px; color: #3c4a63; }
.md-item li::before { content: ""; position: absolute; left: 0; top: 15px; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }

/* ---------- CTA 条 ---------- */
.cta-band {
    margin-top: 56px; background: linear-gradient(100deg, #112a52, #17418c);
    border-radius: 16px; padding: 44px 48px; text-align: center;
}
.cta-band h2 { color: #fff; font-size: 24px; margin-bottom: 8px; }
.cta-band p { color: rgba(255,255,255,.8); margin-bottom: 20px; }

/* ---------- 业务列表 / 详情 ---------- */
.bizlist-grid { display: grid; grid-template-columns: 1fr; gap: 30px; max-width: 960px; margin: 0 auto; }
.bizlist-card {
    display: grid; grid-template-columns: 380px 1fr; background: #fff; border: 1px solid var(--line);
    border-radius: 16px; overflow: hidden;
}
.bizlist-card:nth-child(even) { grid-template-columns: 1fr 380px; }
.bizlist-card:nth-child(even) .bizlist-img { order: 2; }
.bizlist-img { position: relative; min-height: 240px; background: var(--bg-light); }
.bizlist-img img { width: 100%; height: 100%; object-fit: cover; }
.bizlist-body { padding: 30px 34px; }
.bizlist-desc { color: var(--muted); margin: 6px 0 14px; }
.feat-list li { position: relative; padding: 5px 0 5px 24px; font-size: 14.5px; color: #3c4a63; }
.feat-list li i { position: absolute; left: 0; top: 9px; color: #2fa55a; font-size: 13px; }
.feat-list-2 { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; }
.bizlist-body .biz-more, .detail-main .biz-more { margin-top: 12px; display: inline-flex; }

.detail-grid { display: grid; grid-template-columns: 1fr 300px; gap: 44px; align-items: start; }
.detail-main .rich { margin-top: 26px; }
.feat-panel { background: var(--bg-light); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 28px; }
.feat-panel h2 { font-size: 19px; color: var(--navy); margin-bottom: 14px; }
.rel-cases { margin-top: 56px; }
.rel-cases h2 { font-size: 20px; color: var(--navy); margin-bottom: 20px; }

.meta-strip {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; background: var(--bg-light);
    border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 24px; margin-bottom: 8px;
}
.meta-item span { display: block; font-size: 12.5px; color: var(--muted); }
.meta-item b { font-size: 15.5px; color: var(--navy); }

.gallery { margin-top: 44px; }
.gallery h2 { font-size: 20px; color: var(--navy); margin-bottom: 18px; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.g-item { display: block; border-radius: 10px; overflow: hidden; background: var(--bg-light); position: relative; }
.g-item::before { content: ""; display: block; padding-top: 75%; }
.g-item img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.g-item:hover img { transform: scale(1.04); }

.pn-nav { display: flex; gap: 16px; margin-top: 44px; }
.pn-item {
    flex: 1; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px 18px;
    display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.pn-item:hover { border-color: var(--blue); }
.pn-item span { font-size: 12.5px; color: var(--muted); }
.pn-item b { font-size: 14px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-next { text-align: right; }
.pn-empty { visibility: hidden; }

/* ---------- 新闻文章页 ---------- */
.article-wrap { max-width: 860px; }
.article-title { font-size: 26px; color: var(--ink); line-height: 1.45; margin: 10px 0 14px; }
.article-meta { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 13.5px; margin-bottom: 24px; }
.article-cover { border-radius: 12px; overflow: hidden; margin-bottom: 26px; }

/* ---------- 富文本 ---------- */
.rich { font-size: 15.5px; color: #33405a; line-height: 1.9; }
.rich p { margin: 12px 0; }
.rich h3 { font-size: 19px; color: var(--navy); margin: 30px 0 12px; padding-left: 12px; border-left: 4px solid var(--blue); line-height: 1.4; }
.rich ul li, .rich ol li { position: relative; padding: 5px 0 5px 22px; }
.rich ul li::before { content: ""; position: absolute; left: 2px; top: 16px; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.rich ol { counter-reset: richli; }
.rich ol li { counter-increment: richli; }
.rich ol li::before { content: counter(richli) "."; position: absolute; left: 0; color: var(--blue); font-weight: 700; }
.rich strong { color: var(--navy); }

/* ---------- 筛选 ---------- */
.tag-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 32px; }
.tf-chip {
    background: #fff; border: 1px solid var(--line); color: #55627a; font-size: 13.5px;
    padding: 7px 18px; border-radius: 30px;
}
.tf-chip:hover { color: var(--blue); border-color: var(--blue); }
.tf-chip.on { background: var(--blue); border-color: var(--blue); color: #fff; }

/* ---------- 分页 ---------- */
.pager { margin-top: 44px; text-align: center; }
.pager ul { display: inline-flex; gap: 8px; list-style: none; }
.pager li a, .pager li span {
    display: inline-block; min-width: 38px; padding: 8px 12px; border-radius: 8px; background: #fff;
    border: 1px solid var(--line); color: #55627a; font-size: 14px;
}
.pager li.active span { background: var(--blue); border-color: var(--blue); color: #fff; }
.pager li a:hover { border-color: var(--blue); color: var(--blue); }

/* ---------- 联系我们 ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 44px; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 16px; }
.ci-card {
    display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid var(--line);
    border-radius: var(--radius); padding: 20px 22px;
}
.ci-card i {
    width: 44px; height: 44px; border-radius: 10px; background: var(--blue-tint); color: var(--blue);
    display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0;
}
.ci-card span { display: block; font-size: 12.5px; color: var(--muted); }
.ci-card b { font-size: 15.5px; color: var(--ink); font-weight: 600; line-height: 1.55; }
.ci-note { background: linear-gradient(160deg, #f7faff, #eef4fd); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; }
.ci-note h4 { font-size: 15px; color: var(--navy); margin-bottom: 8px; }
.ci-note p { font-size: 13.5px; color: #3c4a63; padding: 3px 0; }
.ci-note i { color: #2fa55a; margin-right: 6px; }

.contact-form-wrap { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 34px 36px; box-shadow: var(--shadow); }
.contact-form-wrap h2 { font-size: 22px; color: var(--navy); }
.cf-sub { color: var(--muted); font-size: 14px; margin: 6px 0 22px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-field { margin-bottom: 16px; }
.form-field label { display: block; font-size: 13.5px; color: #3c4a63; margin-bottom: 6px; }
.form-field label em { color: var(--red); font-style: normal; }
.form-field input, .form-field select, .form-field textarea {
    width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 11px 14px;
    font-size: 14.5px; color: var(--ink); font-family: inherit; background: #fbfcfe; outline: none;
    transition: border .2s, box-shadow .2s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
    border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,95,214,.12); background: #fff;
}
.hp-field { position: absolute; left: -9999px; opacity: 0; height: 0; }
.form-msg { margin-top: 14px; font-size: 14px; color: var(--blue); min-height: 20px; }
.form-msg.err { color: var(--red); }

/* ---------- 页脚 ---------- */
.site-footer { background: #0f1f3d; color: #9fb0cc; }
.footer-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1.35fr; gap: 40px; padding: 60px 24px 44px; }
.f-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.f-logo img { width: 46px; height: 46px; object-fit: contain; background: #fff; border-radius: 50%; padding: 3px; }
.f-logo b { color: #fff; font-size: 17px; }
.f-brand p { font-size: 13.5px; line-height: 1.8; }
.f-phone { display: flex; align-items: center; gap: 10px; margin-top: 18px; }
.f-phone i { width: 38px; height: 38px; border-radius: 50%; background: var(--red); color: #fff; display: flex; align-items: center; justify-content: center; }
.f-phone a { color: #fff; font-size: 19px; font-weight: 700; }
.f-col h4 { color: #fff; font-size: 15.5px; margin-bottom: 16px; }
.f-col ul li { padding: 4px 0; }
.f-col ul a { font-size: 13.5px; }
.f-col ul a:hover { color: #fff; }
.f-contact li { display: flex; gap: 9px; font-size: 13.5px; padding: 5px 0; line-height: 1.7; }
.f-contact i { margin-top: 5px; color: var(--orange); }
.footer-bar { border-top: 1px solid rgba(255,255,255,.1); padding: 18px 0; }
.footer-bar-inner { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; }
.footer-bar a:hover { color: #fff; }

/* ---------- 悬浮侧栏 ---------- */
.float-rail {
    position: fixed; right: 22px; bottom: 15%; z-index: 90;
    display: flex; flex-direction: column; gap: 10px;
}
.fr-btn {
    width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-size: 19px; color: #fff; box-shadow: 0 6px 18px rgba(19,44,84,.25);
}
.fr-phone { background: var(--red); }
.fr-msg { background: var(--blue); }
.fr-top { background: #67748c; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.fr-top.show { opacity: 1; visibility: visible; }
.fr-btn:hover { transform: translateY(-3px); }

/* ---------- 入场动画 ---------- */
[data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 1200px) {
    .header-phone { display: none; }
    .main-nav { margin-left: auto; }
}
@media (max-width: 960px) {
    .biz-grid { grid-template-columns: repeat(2, 1fr); }
    .case-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .case-grid-3 { grid-template-columns: repeat(2, 1fr); }
    .why-grid { grid-template-columns: 1fr; gap: 36px; }
    .proc-steps { grid-template-columns: repeat(3, 1fr); }
    .news-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .about-grid { grid-template-columns: 1fr; }
    .detail-grid { grid-template-columns: 1fr; }
    .about-side { position: static; }
    .maint-inner { flex-direction: column; text-align: center; }
    .maint-btns { justify-content: center; }
    .bizlist-card, .bizlist-card:nth-child(even) { grid-template-columns: 1fr; }
    .bizlist-card:nth-child(even) .bizlist-img { order: 0; }
    .bizlist-img { height: 220px; }
    .promise-grid { grid-template-columns: repeat(2, 1fr); }
    .flow-grid { grid-template-columns: repeat(2, 1fr); }
    .maint-detail { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1240px) {
    /* 窄口/手机保留单一置顶按钮（缩小半透明防遮挡），电话/留言按钮仍隐藏 */
    .float-rail { right: 12px; bottom: 15%; gap: 8px; }
    .fr-phone, .fr-msg { display: none; }
    .fr-btn { width: 40px; height: 40px; font-size: 17px; box-shadow: 0 4px 12px rgba(19,44,84,.22); }
    .fr-top { background: rgba(103,116,140,.9); }
}
@media (max-width: 760px) {
    .nav-toggle {
        display: flex; flex-direction: column; justify-content: center; gap: 5px;
        width: 42px; height: 42px; border: 0; background: transparent; cursor: pointer; margin-left: auto;
        position: relative; z-index: 220;
    }
    .nav-toggle span { width: 24px; height: 2.5px; background: var(--navy); border-radius: 2px; transition: transform .25s, opacity .25s; }
    .nav-toggle.open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
    .nav-toggle.open span:nth-child(2) { opacity: 0; }
    .nav-toggle.open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
    .header-inner { height: 66px; gap: 14px; }
    .logo-img { width: 40px; height: 40px; }
    .logo-text b { font-size: 15.5px; }
    .logo-text i { font-size: 8px; }
    .main-nav {
        position: fixed; top: 0; right: -290px; width: 280px; height: 100vh; background: #fff;
        transition: right .3s ease; z-index: 210; box-shadow: -8px 0 30px rgba(19,44,84,.15); margin-left: 0;
        padding: 90px 18px 30px; overflow-y: auto;
    }
    .main-nav.open { right: 0; }
    .main-nav ul { flex-direction: column; gap: 2px; }
    .main-nav a { padding: 13px 12px; font-size: 16px; border-bottom: 1px solid var(--bg-light); }
    .main-nav li.active a::after { display: none; }
    .nav-mask { display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(15,25,45,.5); z-index: 95; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
    .nav-mask.show { opacity: 1; visibility: visible; }

    .stats { grid-template-columns: repeat(2, 1fr); gap: 18px 0; margin-top: -44px; }
    .stat { border-right: 0; }
    .stat b { font-size: 26px; }
    .sec { padding: 56px 0; }
    .sec-head { flex-direction: column; align-items: flex-start; margin-bottom: 28px; }
    .sec-head h2 { font-size: 24px; }
    .biz-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .case-grid-4, .case-grid-3 { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .news-grid, .news-grid-2 { grid-template-columns: 1fr; }
    .proc-steps { grid-template-columns: repeat(2, 1fr); }
    .why-items { grid-template-columns: 1fr 1fr; gap: 12px; }
    .why-intro h2 { font-size: 24px; }
    .page-hero { padding: 66px 0 40px; }
    .page-hero h1 { font-size: 24px; }
    .pos-cards { grid-template-columns: 1fr; }
    .promise-grid, .flow-grid { grid-template-columns: 1fr 1fr; }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    .contact-form-wrap { padding: 24px 20px; }
    .cta-band { padding: 32px 22px; }
    .meta-strip { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; gap: 30px; padding: 44px 24px 34px; }
    .footer-bar-inner { flex-direction: column; align-items: center; text-align: center; }
    .case-body h3 { min-height: 0; }
    .feat-list-2 { grid-template-columns: 1fr; }
    .pn-nav { flex-direction: column; }
}
/* 手机端筛选单行横向滑动，不占多行版面 */
@media (max-width: 760px) {
    .tag-filter {
        flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px;
        -webkit-overflow-scrolling: touch; scrollbar-width: none;
        border-bottom: 1px solid var(--line); margin-bottom: 24px;
    }
    .tag-filter::-webkit-scrollbar { display: none; }
    .tf-chip { flex: 0 0 auto; }
}
/* ===== 移动端首页（按客户设计图重构，2026-10-18） ===== */
@media (max-width: 760px) {
    .m-only { display: block !important; }
    .d-only { display: none !important; }

    /* --- hero：hero2 系列逐张轮播底图（2026-10-19 起，与桌面同源；hero-m.jpg 仅作无图兜底）+ 文案层 + 三联图卡条（全文档流排布，杜绝绝对定位互相遮挡；设计稿案例区仅一行） --- */
    .hero { height: auto; min-height: 0; max-height: none; background: #0a1830; padding: 132px 0 0; }
    .hero-slides { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
    .hero-slide {
        background-image: var(--dgi, url('../img/hero-m.jpg'));
        background-size: cover; background-position: 68% center; background-repeat: no-repeat;
    }
    .hero-slide::before { background: linear-gradient(180deg, rgba(9, 20, 42, .74) 0%, rgba(9, 20, 42, .9) 100%); }
    .hero-m { position: relative; z-index: 6; padding: 0 22px; margin-bottom: 26px; }
    .hm-eyebrow { color: #7fb0ff; font-size: 11px; letter-spacing: 2px; font-weight: 600; display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
    .hm-eyebrow i { width: 26px; height: 1px; background: #7fb0ff; }
    .hm-title { color: #fff; font-size: 33px; line-height: 1.22; font-weight: 700; }
    .hm-title span { color: #4da3ff; }
    .hm-desc { color: rgba(255,255,255,.82); font-size: 13.5px; line-height: 1.75; margin: 14px 0 22px; }
    .hm-btns { display: flex; gap: 10px; }
    .hm-btns .btn { padding: 11px 18px; font-size: 14px; }
    .hero-strip {
        position: relative; z-index: 6;
        display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
        padding: 0 14px 16px;
        background: linear-gradient(180deg, rgba(8,18,38,0), rgba(8,18,38,.55));
    }
    .hs-item { position: relative; min-width: 0; border-radius: 8px; overflow: hidden; }
    .hs-item img { width: 100%; height: 62px; object-fit: cover; display: block; }
    .hs-item span { position: absolute; left: 7px; bottom: 5px; right: 7px; color: #fff; font-size: 11px; font-weight: 600; text-shadow: 0 1px 6px rgba(0,0,0,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    /* --- 通用排版 --- */
    .eyebrow2 { color: var(--blue); font-size: 12.5px; font-weight: 600; letter-spacing: .5px; margin-bottom: 10px; }
    .eyebrow2 b { font-weight: 700; letter-spacing: 2px; }
    .m-title { font-size: 25px; line-height: 1.35; color: var(--ink); font-weight: 700; }
    .m-title span { color: var(--blue); }
    .m-desc { color: var(--muted); font-size: 14px; margin: 12px 0 0; }
    .m-link { display: inline-block; margin-top: 16px; color: var(--blue); font-weight: 600; font-size: 14.5px; }
    .m-note { color: #93a1b8; font-size: 12px; line-height: 1.7; margin-top: 14px; }

    /* --- 关于速网 --- */
    .sec-about-m { background: #fff; padding: 56px 0 58px; }
    .about-m-body { margin-top: 16px; border-left: 3px solid var(--blue); padding-left: 14px; }
    .about-m-body p { color: #46536b; font-size: 14.5px; line-height: 1.85; margin-bottom: 12px; }

    /* --- 服务理念 --- */
    .sec-approach-m { background: #fff; padding: 56px 0 60px; }
    .approach-row { display: flex; margin-top: 22px; border-top: 1px solid var(--line); padding-top: 18px; }
    .ap-item { flex: 1; }
    .ap-item b { display: block; color: var(--blue); font-size: 13px; font-weight: 700; margin-bottom: 4px; }
    .ap-item span { font-size: 14px; color: var(--ink); font-weight: 600; }

    /* --- 业务卡编号 --- */
    .biz-grid-m { counter-reset: biz; }
    .biz-grid-m .biz-body { position: relative; padding-top: 28px; }
    .biz-grid-m .biz-body::before {
        counter-increment: biz;
        content: "0" counter(biz);
        position: absolute; top: 10px; left: 0;
        color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: 1px;
    }
    .biz-grid-m .biz-title h3 { font-size: 16.5px; }
    .biz-grid-m .biz-body p { min-height: 0; font-size: 12.5px; }

    /* --- 精选工程：首卡大图，其余行卡 --- */
    .case-grid-m { display: block; }
    .case-tags-m { position: static; display: flex !important; margin-bottom: 8px; }
    .case-tags-m span { background: var(--blue-tint); color: var(--blue); font-size: 11.5px; padding: 2px 9px; border-radius: 4px; }
    .case-grid-m .case-card { margin-bottom: 14px; }
    .case-grid-m .case-card:not(:first-child) { display: flex; flex-direction: row; align-items: center; gap: 12px; }
    .case-grid-m .case-card:not(:first-child) .case-img { flex: 0 0 108px; height: 76px; border-radius: 8px; }
    .case-grid-m .case-card:not(:first-child) .case-img::before { display: none; }
    .case-grid-m .case-card:not(:first-child) .case-body { padding: 0; flex: 1; min-width: 0; }
    .case-grid-m .case-card:not(:first-child) .case-body h3 { min-height: 0; font-size: 14.5px; }
    .case-grid-m .case-card:not(:first-child) .case-body p { font-size: 12px; margin-top: 4px; }

    /* --- 项目现场 --- */
    .sec-photo-m { background: #fff; padding: 56px 0; }
    .pm-item { display: block; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-bottom: 16px; background: #fff; }
    .pm-item img { width: 100%; height: 190px; object-fit: cover; display: block; }
    .pm-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 12px 14px; }
    .pm-row b { font-size: 15px; color: var(--ink); flex-shrink: 0; }
    .pm-row span { color: var(--muted); font-size: 12px; text-align: right; }

    /* --- 服务流程：两列编号网格 --- */
    .proc-steps-m { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
    .proc-steps-m .proc-step { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; background: #fff; text-align: left; padding: 18px 16px; }
    .proc-steps-m .proc-num { display: block; width: auto; height: auto; background: none; color: #c9dbf8; font-size: 34px; font-weight: 800; margin: 0 0 8px; line-height: 1; border-radius: 0; }
    .proc-steps-m .proc-step h3 { font-size: 15.5px; }
    .proc-steps-m .proc-step p { font-size: 12.5px; }
}

@media (max-width: 480px) {
    .biz-grid { grid-template-columns: 1fr; }
    .case-grid-4, .case-grid-3 { grid-template-columns: 1fr; }
    .why-items { grid-template-columns: 1fr; }
    .proc-steps { grid-template-columns: 1fr; }
    .promise-grid, .flow-grid { grid-template-columns: 1fr; }
    .stats { grid-template-columns: repeat(2, 1fr); }
}
/* =====================================================================
   2026-10 改版增量：下拉菜单 / 数据条 / 4大核心业务 / 服务Tab /
   三大保障 / 常见担忧 / 8步流程 / 品牌墙 / 行业方案
   ===================================================================== */

/* ---------- 顶部导航：加宽容器 + 下拉 ---------- */
.site-header .container { max-width: 1400px; }
.header-inner { gap: 20px; }
.main-nav a { padding: 10px 9px; font-size: 14.5px; }
.main-nav li.has-sub { position: relative; }
.main-nav .nav-caret { font-size: 12px; margin-left: 3px; color: #93a1b8; }
.subnav {
    position: absolute; top: 100%; left: 50%; min-width: 178px;
    background: #fff; border: 1px solid var(--line); border-radius: 10px;
    box-shadow: 0 12px 32px rgba(19, 44, 84, .16); padding: 8px 0;
    opacity: 0; visibility: hidden; transform: translate(-50%, 10px);
    transition: opacity .2s, visibility .2s, transform .2s; z-index: 210;
}
.main-nav li.has-sub:hover .subnav,
.main-nav li.has-sub:focus-within .subnav { opacity: 1; visibility: visible; transform: translate(-50%, 4px); }
.subnav li a { display: block; padding: 9px 18px; font-size: 13.5px; color: #3c4a63; white-space: nowrap; border-radius: 0; }
.subnav li a:hover { color: var(--blue); background: var(--blue-tint); }
.subnav li.subnav-extra { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 6px; }
.subnav li.subnav-extra a { color: var(--red); font-weight: 600; }

/* ---------- 4大核心业务（桌面球体节点） ---------- */
.core-wrap { position: relative; height: 470px; margin-top: 6px; }
.core-globe { position: absolute; top: 50%; left: 50%; width: 400px; height: 400px; margin: -200px 0 0 -200px; }
.core-node { position: absolute; width: 260px; }
.core-node .cn-icon {
    display: inline-flex; width: 56px; height: 56px; border-radius: 50%;
    align-items: center; justify-content: center; background: var(--navy-2); color: #fff;
    font-size: 22px; box-shadow: 0 8px 20px rgba(29, 63, 119, .28);
}
.cn-red { background: var(--red) !important; box-shadow: 0 8px 20px rgba(215, 54, 46, .28) !important; }
.core-node b { display: block; font-size: 19px; color: var(--navy); margin: 12px 0 6px; }
.core-node p { font-size: 13.5px; color: var(--muted); line-height: 1.7; }
.core-n1 { top: 6px; left: 9%; text-align: right; }
.core-n3 { top: 6px; right: 9%; }
.core-n2 { bottom: 26px; left: 9%; text-align: right; }
.core-n4 { bottom: 26px; right: 9%; }
/* 移动端 2×2 卡片 */
.core-grid { display: none; }
.cg-item { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 18px 14px; }
.cg-item .cn-icon { display: inline-flex; width: 44px; height: 44px; border-radius: 50%; align-items: center; justify-content: center; background: var(--navy-2); color: #fff; font-size: 18px; }
.cg-item b { display: block; font-size: 16px; color: var(--navy); margin: 10px 0 4px; }
.cg-item p { font-size: 12.5px; color: var(--muted); line-height: 1.6; }

/* ---------- 系统工程服务项目 Tab ---------- */
.svc-tabs { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 28px; }
.svc-tab {
    padding: 10px 26px; border-radius: 30px; border: 1px solid var(--line);
    background: #fff; color: #55627a; font-size: 14.5px; font-weight: 600;
    cursor: pointer; font-family: inherit; transition: all .2s;
}
.svc-tab:hover { color: var(--blue); border-color: var(--blue); }
.svc-tab.on { background: var(--blue); border-color: var(--blue); color: #fff; box-shadow: 0 8px 18px rgba(31, 95, 214, .25); }
.svc-panel { display: none; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.svc-panel.on { display: grid; }
.svc-item { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 18px; }
.svc-item:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.svc-item > i { font-size: 22px; color: var(--blue); }
.svc-item b { display: block; font-size: 15px; color: var(--navy); margin: 10px 0 4px; }
.svc-item span { font-size: 12.5px; color: var(--muted); }

/* ---------- 三大服务保障 ---------- */
.sec-guarantee { background: var(--bg-light); }
.gua-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.gua-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 34px 30px; text-align: center; }
.gua-card > i { font-size: 30px; color: var(--red); }
.gua-card b { display: block; font-size: 18px; color: var(--navy); margin: 12px 0 8px; }
.gua-card p { font-size: 14px; color: var(--muted); }

/* ---------- 常见担忧 ---------- */
.pain-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 34px; }
.pain-card { background: #fff; border: 1px dashed #cdd9ec; border-radius: var(--radius); padding: 24px 22px; }
.pain-card b {
    display: inline-block; font-size: 14px; color: #fff; background: var(--navy-2);
    border-radius: 6px; padding: 3px 14px; margin-bottom: 12px; letter-spacing: 2px;
}
.pain-card p { color: #46536b; font-size: 14.5px; }
.pain-promise {
    background: linear-gradient(100deg, #112a52, #17418c); border-radius: 16px;
    padding: 28px 32px; display: flex; align-items: center; justify-content: space-between;
    gap: 20px; flex-wrap: wrap;
}
.pp-list { display: flex; gap: 22px; flex-wrap: wrap; }
.pp-list span { color: #fff; font-size: 15px; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }
.pp-list i { color: #6fe3a1; }
.pp-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.pp-btns .btn-ghost { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .55); color: #fff; }
.pp-btns .btn-ghost:hover { background: rgba(255, 255, 255, .18); color: #fff; }

/* ---------- 8 步流程（覆盖原 5 列） ---------- */
.sec-process .proc-steps { grid-template-columns: repeat(4, 1fr); }

/* ---------- 战略品牌墙 ---------- */
.sec-brands { background: var(--bg-light); border-top: 1px solid var(--line); }
.brand-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.brand-card {
    background: #fff; border: 1px solid var(--line); border-radius: 10px; min-height: 86px;
    display: flex; align-items: center; justify-content: center; padding: 12px 10px;
    transition: transform .2s, box-shadow .2s;
}
.brand-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.brand-card b { font-size: 19px; color: var(--navy); letter-spacing: .5px; font-weight: 700; text-align: center; }
.brand-card:nth-child(4n+2) b { color: var(--blue); }
.brand-card:nth-child(4n+3) b { color: var(--red); }
.brand-card:nth-child(4n) b { color: #173e86; }

/* ---------- 行业方案 ---------- */
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-bottom: 20px; }
.plan-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 24px; display: flex; flex-direction: column; }
.plan-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.plan-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.plan-icon {
    width: 46px; height: 46px; border-radius: 12px; background: var(--blue-tint); color: var(--blue);
    display: inline-flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0;
}
.plan-icon.plan-red { background: #fdecec; color: var(--red); }
.plan-head h2 { font-size: 17px; color: var(--navy); line-height: 1.4; }
.plan-card .feat-list { flex: 1; margin-bottom: 8px; }

/* ---------- 响应式（增量） ---------- */
@media (max-width: 1440px) {
    .header-phone { display: none; }
}
@media (max-width: 960px) {
    .svc-panel { grid-template-columns: repeat(3, 1fr); }
    .gua-grid { grid-template-columns: repeat(3, 1fr); }
    .brand-grid { grid-template-columns: repeat(4, 1fr); }
    .plan-grid { grid-template-columns: repeat(2, 1fr); }
    .sec-process .proc-steps { grid-template-columns: repeat(4, 1fr); }
    .core-wrap { height: auto; }
    .core-globe, .core-node { display: none; }
}
@media (max-width: 760px) {
    /* 抽屉内下拉：静态缩进常显（父链接保持可点，不依赖 JS） */
    .main-nav .nav-caret { display: none; }
    .main-nav .subnav {
        position: static; transform: none; opacity: 1; visibility: visible;
        box-shadow: none; border: 0; border-left: 2px solid var(--blue-tint);
        border-radius: 0; padding: 2px 0 6px 10px; margin: 0 0 4px 14px; min-width: 0;
        display: block;
    }
    .subnav li a { padding: 9px 10px; font-size: 14px; color: #55627a; }
    .subnav li.subnav-extra { border-top: 0; margin-top: 0; padding-top: 0; }

    .core-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
    .stats { margin-top: 12px; }
    .stats-wrap { padding: 0 14px; }
    .cg-item { padding: 14px 12px; }
    .cg-item b { font-size: 15px; }
    .cg-item p { font-size: 12px; }

    .svc-tabs { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; padding-bottom: 6px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .svc-tabs::-webkit-scrollbar { display: none; }
    .svc-tab { flex: 0 0 auto; padding: 8px 18px; font-size: 13.5px; }
    .svc-panel { grid-template-columns: 1fr 1fr; gap: 10px; }
    .svc-item { padding: 16px 14px; }
    .svc-item b { font-size: 14px; }
    .svc-item span { font-size: 11.5px; }

    .gua-grid { grid-template-columns: 1fr; gap: 12px; }
    .gua-card { padding: 24px 20px; text-align: left; }
    .gua-card b { margin: 8px 0 6px; }

    .pain-grid { grid-template-columns: 1fr; gap: 12px; margin-bottom: 24px; }
    .pain-card { padding: 18px 16px; }
    .pain-card b { margin-bottom: 8px; }
    .pain-promise { flex-direction: column; align-items: flex-start; padding: 22px 20px; }
    .pp-list { gap: 12px; }
    .pp-list span { font-size: 13.5px; }

    .sec-process .proc-steps { grid-template-columns: 1fr 1fr; }
    .brand-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
    .brand-card { min-height: 66px; }
    .brand-card b { font-size: 15px; }
    .plan-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .brand-grid { grid-template-columns: repeat(2, 1fr); }
    .svc-panel { grid-template-columns: 1fr; }
}

/* ---------- 4大核心服务（按客户设计图代码化实现，球体 Canvas 旋转特效，2026-10-19） ---------- */
.sec-core { padding: 44px 0 26px; }
.core-head { display: flex; align-items: center; justify-content: center; gap: 16px; }
.core-head .ch-line { width: 200px; height: 1px; }
.core-head .ch-line:first-child { background: linear-gradient(90deg, rgba(31,95,214,0), #9db9e8); }
.core-head .ch-line:last-child { background: linear-gradient(90deg, #9db9e8, rgba(31,95,214,0)); }
.core-head .ch-dash { width: 14px; height: 4px; background: var(--red); border-radius: 2px; flex-shrink: 0; }
.core-head h2 { font-size: 34px; color: #16418f; letter-spacing: 2px; white-space: nowrap; }
.core-head h2 em { font-style: normal; color: var(--red); padding: 0 2px; }
.core-sub { text-align: center; color: #7a8699; font-size: 15px; margin-top: 10px; }
.core-stage {
    position: relative; height: 620px; margin-top: 4px;
    background: radial-gradient(58% 46% at 50% 47%, #edf4ff 0%, rgba(255,255,255,0) 72%);
}
.core-orbits { position: absolute; top: 50%; left: 50%; width: 760px; height: 470px; transform: translate(-50%, -50%); }
.core-rings-svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; }
.core-rings-svg .ring-red { fill: none; stroke: rgba(215,54,46,.6); stroke-width: 2.4; }
.core-rings-svg .ring-blue { fill: none; stroke: rgba(31,95,214,.5); stroke-width: 2.4; }
.od-g .od-halo { fill: rgba(255,90,78,.30); }
.od-g .od-core { fill: #ff5a4e; }
.od-g.od-blue .od-halo { fill: rgba(77,141,255,.30); }
.od-g.od-blue .od-core { fill: #4d8dff; }
.core-globe-canvas { position: absolute; top: 50%; left: 50%; width: 440px; height: 440px; transform: translate(-50%, -50%); }
.core-podium { position: absolute; top: 50%; left: 50%; transform: translate(-50%, 172px); width: 360px; height: 58px; }
.core-podium i { position: absolute; top: 0; left: 50%; border: 1px solid rgba(31,95,214,.32); border-radius: 50%; transform: translateX(-50%); }
.core-podium i:first-child { width: 360px; height: 58px; }
.core-podium i + i { width: 240px; height: 38px; top: 10px; border-color: rgba(31,95,214,.2); }
.core-item { position: absolute; display: flex; align-items: center; width: 316px; }
.ci-icon {
    width: 62px; height: 62px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    font-size: 25px; color: #fff; flex-shrink: 0; border: 4px solid #fff; box-shadow: 0 10px 24px rgba(20,60,140,.28);
}
.ci-blue { background: linear-gradient(150deg, #3b82ec, #123c8a); }
.ci-red { background: linear-gradient(150deg, #ef5143, #b02a22); }
.ci-txt { flex: 1; min-width: 0; }
.ci-txt h3 { display: inline-block; font-size: 20px; letter-spacing: 1px; padding-bottom: 6px; margin-bottom: 8px; border-bottom: 3px solid; }
.ci-tl .ci-txt h3, .ci-br .ci-txt h3 { color: #16418f; border-color: #16418f; }
.ci-tr .ci-txt h3, .ci-bl .ci-txt h3 { color: var(--red); border-color: var(--red); }
.ci-txt p { font-size: 13.5px; color: #55627a; line-height: 1.75; }
.ci-link { width: 26px; height: 2px; flex-shrink: 0; }
.ci-tl .ci-link, .ci-bl .ci-link { background: linear-gradient(90deg, rgba(31,95,214,0), #3b82ec); }
.ci-tr .ci-link, .ci-br .ci-link { background: linear-gradient(90deg, #ef5143, rgba(215,54,46,0)); }
.ci-tl { left: 1.5%; top: 16%; }
.ci-tr { right: 1.5%; top: 18%; }
.ci-bl { left: 2.5%; bottom: 16%; }
.ci-br { right: 2.5%; bottom: 14%; }
.core-foot { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 2px; color: #16418f; font-size: 15.5px; letter-spacing: 2px; }
.core-foot i { width: 64px; height: 1px; background: #b9cdea; }
@media (max-width: 1240px) {
    .core-head .ch-line { width: 110px; }
    .core-head h2 { font-size: 30px; }
    .core-item { width: 272px; }
    .ci-icon { width: 56px; height: 56px; font-size: 22px; }
    .ci-txt h3 { font-size: 18px; }
    .ci-txt p { font-size: 12.5px; }
}
@media (max-width: 1020px) {
    .core-stage { height: 540px; }
    .core-orbits { width: 620px; height: 384px; }
    .core-globe-canvas { width: 380px; height: 380px; }
    .core-podium { transform: translate(-50%, 148px); width: 300px; height: 48px; }
    .core-podium i:first-child { width: 300px; height: 48px; }
    .core-podium i + i { width: 200px; height: 32px; }
    .core-item { width: 240px; }
    .ci-txt p { font-size: 12px; }
}
@media (max-width: 860px) {
    /* 窄屏切移动卡片版式 */
    .core-head, .core-sub, .core-stage, .core-foot { display: none; }
    .core-m { display: block !important; }
}
.core-m .core-grid { margin-top: 18px; }

/* =====================================================================
   2026-10-19 增量（m14）：快速预约 band 全局视觉升级
   quickform.html（首页/维保/业务详情/案例详情共用）此前无任何样式，
   本块补齐 qf-* 全套：深蓝渐变 band + 白色表单卡 + 图标输入框。
   兼容口径同全站：无 inset 简写、无 aspect-ratio，装饰层走 longhand 定位
   ===================================================================== */
.qf-band {
    position: relative; overflow: hidden;
    background: linear-gradient(115deg, #0e2246 0%, #143468 55%, #1a4aa4 100%);
    padding: 64px 0;
}
.qf-band::before {
    content: ""; position: absolute; top: -170px; right: -130px;
    width: 430px; height: 430px; border-radius: 50%;
    border: 44px solid rgba(255, 255, 255, .05);
}
.qf-band::after {
    content: ""; position: absolute; bottom: -240px; left: -150px;
    width: 480px; height: 480px; border-radius: 50%;
    background: radial-gradient(circle, rgba(31, 95, 214, .4) 0%, rgba(31, 95, 214, 0) 70%);
}
.qf-inner { position: relative; z-index: 1; display: flex; align-items: center; gap: 60px; }
.qf-info { flex: 1; min-width: 0; color: #fff; }
.qf-info h2 { color: #fff; font-size: 28px; line-height: 1.35; }
.qf-sub { color: rgba(255, 255, 255, .78); font-size: 15px; margin-top: 12px; max-width: 560px; }
.qf-phone { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.qf-phone i {
    width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
    background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .28);
    display: inline-flex; align-items: center; justify-content: center; font-size: 16px;
}
.qf-phone a { color: #fff; font-size: 25px; font-weight: 700; letter-spacing: .5px; }
.qf-phone a:hover { color: #ffce9e; }
.qf-phone span { color: rgba(255, 255, 255, .6); font-size: 13px; }
.qf-form {
    width: 440px; flex-shrink: 0; position: relative; z-index: 1;
    background: #fff; border-radius: 16px; padding: 26px 26px 20px;
    box-shadow: 0 24px 60px rgba(5, 18, 42, .45);
}
.qf-field { position: relative; margin-bottom: 12px; }
.qf-field input {
    width: 100%; height: 48px; border: 1px solid #dbe4f1; border-radius: 10px;
    background: #f8fafd; padding: 0 14px 0 44px;
    font-size: 15px; color: var(--ink); font-family: inherit; outline: none;
    transition: border .2s, box-shadow .2s, background .2s;
}
.qf-field input::placeholder { color: #a5b1c6; }
.qf-field input:focus { border-color: var(--blue); background: #fff; box-shadow: 0 0 0 3px rgba(31, 95, 214, .13); }
.qf-field input:focus + i { color: var(--blue); }
.qf-field > i {
    position: absolute; left: 0; top: 0; width: 44px; height: 48px; line-height: 48px;
    text-align: center; color: #9aa8c2; font-size: 15px; pointer-events: none;
}
.qf-form .qf-btn {
    display: block; width: 100%; padding: 13px 0; margin-top: 4px;
    border: 0; border-radius: 10px; cursor: pointer; font-family: inherit;
    background: linear-gradient(135deg, #e64a3f 0%, var(--red) 55%, var(--red-dark) 100%);
    color: #fff; font-size: 16px; font-weight: 700;
    box-shadow: 0 10px 22px rgba(215, 54, 46, .32);
    transition: transform .2s, box-shadow .2s, opacity .2s;
}
.qf-form .qf-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(215, 54, 46, .4); }
.qf-form .qf-btn:disabled { opacity: .65; cursor: default; transform: none; box-shadow: none; }
.qf-msg { display: none; margin-top: 10px; text-align: center; font-size: 13.5px; color: var(--red); }
.qf-msg.show { display: block; }
.qf-safe { margin-top: 12px; text-align: center; color: #93a1b8; font-size: 12.5px; }
.qf-safe i { color: #2fa55a; margin-right: 5px; }

@media (max-width: 960px) {
    .qf-inner { flex-direction: column; align-items: stretch; gap: 26px; }
    .qf-form { width: 100%; max-width: 560px; margin: 0 auto; }
}
@media (max-width: 760px) {
    .qf-band { padding: 44px 0 48px; }
    .qf-info { text-align: center; }
    .qf-info h2 { font-size: 22px; }
    .qf-sub { font-size: 13.5px; }
    .qf-phone { justify-content: center; margin-top: 16px; }
    .qf-phone a { font-size: 21px; }
    .qf-form { padding: 20px 16px 16px; border-radius: 14px; }
    .qf-field { margin-bottom: 10px; }
    .qf-field input { font-size: 16px; } /* ≥16px 防 iOS 聚焦自动放大 */
}

/* =====================================================================
   服务项目三层下拉（2026-10-19 业务三层化：核心竞争/主营工程/智能化配套）
   桌面 hover 下拉改三列分组；≤760 抽屉内单列、分组标题做小节标签
   ===================================================================== */
.subnav-cols { display: flex; align-items: flex-start; padding: 6px 0; }
.subnav-col { min-width: 172px; padding: 2px 0; }
.subnav-col + .subnav-col { border-left: 1px solid var(--line); }
.subnav li.subnav-cap {
    padding: 8px 18px 4px; font-size: 12px; color: #93a1b8;
    letter-spacing: 1px; white-space: nowrap;
}
.subnav li.subnav-cap:first-child { padding-top: 2px; }

@media (max-width: 760px) {
    .main-nav .subnav-cols { display: block; padding: 0; }
    .subnav-col { min-width: 0; }
    .subnav-col + .subnav-col { border-left: 0; }
    .subnav li.subnav-cap { padding: 10px 10px 2px; margin-top: 6px; }
    .subnav li.subnav-cap:first-child { padding-top: 0; margin-top: 0; }
}

/* =====================================================================
   下拉菜单修正（2026-10-19）：顶部导航 `.main-nav ul{display:flex}` 的横排
   规则会命中下拉内的 UL，把菜单项横向排开导致面板 2000px+ 超出屏幕。
   此处恢复下拉内 UL 竖排（含"关于我们"单列下拉），三列分组保持横排。
   注意：下拉面板绝不可加 flex-wrap —— 绝对定位 shrink-to-fit 会把它
   压成一列宽、全部竖摞超出视口底部（2026-10-19 踩过）。
   ===================================================================== */
.main-nav ul.subnav { display: block; }
.subnav .subnav-col { display: block; }
.subnav-cols { align-items: stretch; }

/* ≤1280 视口时面板改右缘锚定（向左展开），避免中心锚定超出右边界 */
@media (max-width: 1280px) {
    .main-nav li.has-sub .subnav { left: auto; right: -20px; transform: none; }
    .main-nav li.has-sub:hover .subnav,
    .main-nav li.has-sub:focus-within .subnav { transform: translate(0, 4px); }
}

/* ---------- 悬浮栏微信二维码（2026-10-19）：PC hover 弹卡，点击开弹层 ---------- */
.fr-qr { background: #21a45d; }
.fr-qr-wrap { position: relative; }
.qr-pop {
    position: absolute; top: 50%; right: 58px;
    width: 170px; padding: 12px 14px 11px; box-sizing: border-box;
    background: #fff; border-radius: 10px;
    box-shadow: 0 10px 30px rgba(19,44,84,.28);
    text-align: center;
    opacity: 0; visibility: hidden;
    transform: translateY(-50%) translateX(8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
    pointer-events: none;
}
.qr-pop img { display: block; width: 140px; height: 140px; margin: 0 auto 8px; border-radius: 6px; }
.qr-pop b { display: block; font-size: 14px; color: #132c54; }
.qr-pop span { display: block; margin-top: 3px; font-size: 12px; color: #8593a9; }
.fr-qr-wrap:hover .qr-pop, .fr-qr:focus .qr-pop { opacity: 1; visibility: visible; transform: translateY(-50%) translateX(0); }
.qr-mask {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 300;
    background: rgba(10,20,40,.62);
    display: none; align-items: center; justify-content: center;
    padding: 20px;
}
.qr-mask.show { display: flex; }
.qr-dialog {
    position: relative; width: 264px; max-width: 84vw;
    background: #fff; border-radius: 14px; padding: 28px 20px 20px;
    text-align: center;
}
.qr-dialog img { display: block; width: 190px; height: 190px; margin: 0 auto 12px; border-radius: 8px; }
.qr-dialog b { display: block; font-size: 16px; color: #132c54; }
.qr-dialog span { display: block; margin-top: 5px; font-size: 13px; color: #8593a9; }
.qr-close {
    position: absolute; top: 8px; right: 8px; width: 30px; height: 30px;
    border: 0; border-radius: 50%; background: #eef2f8; color: #67748c;
    font-size: 18px; line-height: 30px; padding: 0; cursor: pointer;
}
@media (max-width: 1240px) {
    /* 移动端保留微信按钮（在置顶上方），hover 弹卡关闭、点击走弹层 */
    .fr-qr { width: 40px; height: 40px; font-size: 17px; }
    .qr-pop { display: none; }
}

/* ---------- 首屏文案层（2026-10-19 hero2：底图左空右图，标题/副标题/标签为 HTML，本增量 = m17 + .ht） ---------- */
.ht {
    position: absolute; top: 50%; left: 0; right: 0; z-index: 4;
    width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; box-sizing: border-box;
    transform: translateY(-50%);
}
.ht-cap { color: #8fb8ff; font-size: 13px; font-weight: 600; letter-spacing: 3px; margin-bottom: 16px; }
.ht-title { color: #fff; font-size: 46px; line-height: 1.24; font-weight: 700; margin: 0 0 14px; max-width: 620px; text-shadow: 0 2px 18px rgba(4, 14, 34, .55); }
.ht-sub { color: rgba(255, 255, 255, .88); font-size: 18px; letter-spacing: 1px; margin: 0 0 26px; max-width: 620px; }
.ht-chips { display: flex; flex-wrap: wrap; gap: 10px; max-width: 620px; }
.ht-chips span {
    display: inline-block; padding: 7px 15px; border-radius: 999px;
    border: 1px solid rgba(143, 184, 255, .45); background: rgba(13, 30, 60, .38);
    color: rgba(255, 255, 255, .92); font-size: 13.5px;
}
.ht-cap, .ht-title, .ht-sub, .ht-chips { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.hero-slide.active .ht-cap, .hero-slide.active .ht-title, .hero-slide.active .ht-sub, .hero-slide.active .ht-chips { opacity: 1; transform: translateY(0); }
.hero-slide.active .ht-title { transition-delay: .1s; }
.hero-slide.active .ht-sub { transition-delay: .2s; }
.hero-slide.active .ht-chips { transition-delay: .3s; }
@media (max-width: 1280px) {
    .ht-title { font-size: 38px; }
    .ht-sub { font-size: 16px; }
}
@media (max-width: 992px) {
    .ht-title { font-size: 30px; margin-bottom: 10px; }
    .ht-cap { font-size: 11px; letter-spacing: 2px; margin-bottom: 10px; }
    .ht-sub { font-size: 14px; margin-bottom: 0; }
    .ht-chips { display: none; }
}

/* ---------- 手机端悬浮栏口径（2026-10-19 终版）：电话/留言/微信/置顶四钮齐显，微信点按走弹层 ---------- */
@media (max-width: 760px) {
    .float-rail { right: 10px; gap: 8px; }
    .fr-phone, .fr-msg { display: flex; }
}