@charset "UTF-8";

ul,li,ol{list-style:none;margin:0;padding:0;}

a,a:link {color:#333;text-decoration:none}
a:visited {color:#333}
a:hover,a:focus {color:var(--brand);text-decoration: none;outline:none;-moz-outline:none}
a:active {color:#f30}

input,textarea {outline:none;-moz-outline:none}

h1,h2,h3,h4,h5,h6 {color:#333;font-weight:500;line-height:150%}
p {margin:0;}

img {padding:0;margin:0;border:0}
img {height:auto;max-width:100%;margin-left: auto;margin-right: auto}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    padding-right: 20px;
    padding-left: 20px;
}

ul li p,ol li p {display:inline-block;margin:0}

/* 字体库：Bebas Neue（页眉电话区数字专用，字体文件位于 static/fonts/） */
@font-face {
  font-family: "Bebas Neue";
  font-display: swap;
  src: url("../fonts/BebasNeue.woff2") format("woff2"),
    url("../fonts/BebasNeue.woff") format("woff");
}

/* 字体库：OPPO Sans（全站中文与正文专用，字体文件位于 static/fonts/） */
@font-face {
  font-family: "OPPO Sans";
  font-style: normal;
  font-weight: 400 500;     /* Regular / Medium：常规与中等字重共用 Medium 字库 */
  font-display: swap;
  src: url("../fonts/OPPOSans-Medium.ttf") format("truetype");
}
@font-face {
  font-family: "OPPO Sans";
  font-style: normal;
  font-weight: 600 700;     /* SemiBold / Bold */
  font-display: swap;
  src: url("../fonts/OPPOSans-Bold.ttf") format("truetype");
}

/* ---------- 1. 设计变量 ---------- */
:root {
  --brand: #ff6a00;            /* 主色 */
  --brand-deep: #ff3d00;       /* 主色深 */
  --grad: linear-gradient(135deg, #ff8a00 0%, #ff3d00 100%);
  --ink: #111827;              /* 标题色 */
  --text: #41485a;             /* 正文色 */
  --muted: #8a93a6;            /* 次要文字 */
  --line: #eef1f6;             /* 分割线 */
  --bg-soft: #f6f8fb;          /* 浅灰底 */
  --radius: 16px;
  --shadow-sm: 0 2px 10px rgba(17, 24, 39, .06);
  --shadow-md: 0 14px 34px rgba(17, 24, 39, .10);
  --shadow-brand: 0 10px 22px rgba(255, 90, 0, .30);
  --font: "OPPO Sans", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
  /* 版心最大宽度：随分辨率放大（详情见 23 节“版心宽度”） */
  --page-max: clamp(1340px, 88vw, 1720px);
}

/* ---------- 2. 基础排版 ---------- */
html { scroll-behavior: smooth; }

body {
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.8;
  color: var(--text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/*
.container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 24px;
}

@media (max-width: 1200px) {
    .container { max-width: 100%; }
}
*/
::selection { background: rgba(255, 106, 0, .18); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #d5dae3; border-radius: 10px; border: 2px solid #fff; }
::-webkit-scrollbar-thumb:hover { background: var(--brand); }
::-webkit-scrollbar-track { background: transparent; }

h1, h2, h3, h4, h5, h6 { color: var(--ink); }
/* ---------- 7. 首页【经典案例】.indexCase 已迁至 index.css 第 2 节 ---------- */
/* ---------- 8. 首页【合作客户】.indexPartner 已迁至 index.css 第 3 节 ---------- */

/* ---------- 11. 需求横幅（页脚上方，footer.html） ---------- */

.idx-xuqiu .row { align-items: stretch; --bs-gutter-x: 24px; }
.idx-xuqiu .zbox {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  height: 360px;
  border-radius: 14px;
  padding: 0 24px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  isolation: isolate;
  box-shadow: 0 12px 32px rgba(17, 24, 39, .14);
  transition: transform .35s ease, box-shadow .35s ease;
}
.idx-xuqiu .zbox:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 40px rgba(17, 24, 39, .22);
}

/* 左：底图 xz1img.png（深色金属纹理）+ 暗色遮罩 + 品牌暖光 */
.zbox--old {
  background-color: #0d0e10;
  background-image:
    linear-gradient(180deg, rgba(10, 11, 14, .52) 0%, rgba(10, 11, 14, .88) 100%),
    linear-gradient(120deg, rgba(255, 106, 0, .22) 0%, rgba(255, 106, 0, 0) 58%),
    url("../images/xz1img.png");
  background-size: cover, cover, cover;
  background-position: center, center, center;
  background-repeat: no-repeat;
}

/* 右：底图 xz2img.png（玻璃幕墙人像）+ 品牌橙渐变叠加 */
.zbox--new {
  background-image:
    url("../images/xz2img.png");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat;
}

.zbox--new .zbox-figure {
  position: absolute;
  bottom: -12px;
  right: 4%;
  width: 190px;
  height: 250px;
  z-index: 0;
  pointer-events: none;
}

.idx-xuqiu .zbox > * { position: relative; z-index: 1; }

.idx-xuqiu .zbox h4 {
  margin: 0 0 26px;
  font-size: clamp(26px, 3.1vw, 36px);
  font-weight: 700;
  letter-spacing: 2px;
  color: #fff;
  text-shadow: 0 4px 18px rgba(0, 0, 0, .40);
}

.idx-xuqiu .zbox .more {
  display: inline-block;
  padding: 0 38px;
  line-height: 44px;
  border: 1px solid #fff;
  border-radius: 999px;
  color: #fff;
  font-size: 17px;
  letter-spacing: 2px;
  background: rgba(255, 255, 255, .08);
  transition: background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.idx-xuqiu .zbox:hover .more {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .35);
}

/* ---------- 12. 页脚（黑底扁平版：保持联系 + 联系信息 + 栏目菜单 + 二维码） ---------- */
.foot {
  position: relative;
  background: #000000;
  color: #a9b1be;
  padding: 72px 0 0;
  font-size: 14px;
}

/* ===== 顶部：保持联系 + 三栏快速联系 ===== */
.foot-touch {
  padding-bottom: 44px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.foot-touch-tt {
  position: relative;
  margin: 0 0 34px;
  padding-left: 22px;
  font-size: 44px;
  letter-spacing: 3px;
  color: #ffffff;
  line-height: 1.1;
}
.foot-touch-tt::before {              /* 扁平色块：品牌色竖条 */
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 34px;
  background: var(--brand);
}
.foot-touch-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  align-items: start;
}
/* 每栏图标：圆角图标块贴在右边缘、与文案垂直居中（纯装饰，不遮挡链接点击） */
.foot-touch-col {
  position: relative;
  padding-right: 58px;                  /* 给右侧图标预留位置，文案不与其重叠 */
}
.foot-touch-col .ft-ico {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  font-size: 20px;
  color: var(--brand);
  pointer-events: none;
  transition: color .22s ease, background .22s ease, border-color .22s ease;
}
.foot-touch-col .lab {
  margin: 0 0 12px;
  font-size: 13px;
  color: #6f7889;
  letter-spacing: 2px;
}
.foot-touch-col .val {
  display: inline-block;
  font-size: 22px;
  font-weight: 600;
  color: #ffffff;
  text-decoration: none;
  letter-spacing: .5px;
  line-height: 1.4;
  word-break: break-all;
  transition: color .22s ease, border-color .22s ease;
}
.foot-touch-col .val-mail {
  border-bottom: 1px solid rgba(255, 255, 255, .28);
  padding-bottom: 2px;
}
.foot-touch-col .val-mail:hover { color: var(--brand); border-bottom-color: var(--brand); }
.foot-touch-col .val-tel { color: #ffffff; }
.foot-touch-col .val-tel:hover { color: var(--brand); }
.foot-touch-col .val-hot { color: var(--brand); }

/* ===== 底部信息：联系 + 服务项目 + 客户案例 + 二维码 ===== */
.foot-info {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 0.9fr;
  gap: 40px;
  padding: 56px 0 48px;
  align-items: start;
}
.foot-info-col .city {
  position: relative;
  margin: 0 0 22px;
  padding-bottom: 12px;
  font-size: 17px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: .5px;
}
.foot-info-col .city::after {         /* 扁平色块：标题下品牌色短线 */
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 24px;
  height: 2px;
  background: var(--brand);
}
.foot-info-col .line {
  margin: 0 0 10px;
  font-size: 14px;
  color: #b4bcc9;
  line-height: 1.9;
}
.foot-info-col .line .lab {
  color: #7f8a9b;
  margin-right: 6px;
}
.foot-info-col .line-addr {
  color: #8b95a4;
  line-height: 1.85;
}

/* 栏目列：一级栏目标题 + 二级子栏目链接 */
.foot-info-nav .foot-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}
.foot-info-nav .foot-nav li { margin: 0 0 12px; }
.foot-info-nav .foot-nav li:last-child { margin-bottom: 0; }
.foot-info-nav .foot-nav li a {
  display: inline-block;
  color: #b4bcc9;
  font-size: 14px;
  text-decoration: none;
  transition: color .22s ease, padding-left .22s ease;
}
.foot-info-nav .foot-nav li a:hover {
  color: var(--brand);
  padding-left: 6px;
}

/* 二维码（白底保证可扫，扁平无阴影） */
.foot-info-qr .qr-box {
  display: inline-block;
  padding: 8px;
  background: #fff;
  border-radius: 4px;
}
.foot-info-qr .qr-box img {
  display: block;
  width: 120px;
  height: 120px;
  border-radius: 0;
}

/* ===== 版权条 ===== */
.foot-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 24px 0 32px;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.foot-copy-text {
  margin: 0;
  font-size: 13px;
  color: #7f8a9b;
  line-height: 1.7;
}
.foot-copy-text a { color: #7f8a9b; text-decoration: none; }
.foot-copy-text a:hover { color: var(--brand); }

/* 公安备案（图标 + 文字，与 ICP 备案同行） */
.foot-copy .foot-gaba {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 14px;
  color: #7f8a9b;
  text-decoration: none;
  vertical-align: middle;
  transition: color .25s ease;
}
.foot-copy .foot-gaba:hover { color: var(--brand); }
.foot-copy .foot-gaba img {
  display: block;
  height: 16px;
  width: auto;
}
.foot-copy .foot-gaba span { line-height: 1; }

/* ===== 响应式 ===== */
@media (max-width: 991px) {
  .foot { padding-top: 52px; }
  .foot-touch-tt { font-size: 36px; margin-bottom: 26px; letter-spacing: 2px; }
  .foot-touch-tt::before { height: 28px; }
  .foot-touch-row { gap: 24px; }
  .foot-touch-col .val { font-size: 18px; }
  .foot-info { grid-template-columns: 1fr 1fr; gap: 36px 28px; padding: 44px 0 36px; }
  .foot-info-qr { justify-self: end; }
  .foot-info-qr .qr-box img { width: 108px; height: 108px; }
}
@media (max-width: 767px) {
  .foot { padding: 44px 0 0; font-size: 13px; }
  /* ===== 保持联系：由「三栏堆叠」改为通讯录式行（标签居左、号码居右、细分隔线），
     一行一条，纵向高度从约 210px 收到约 150px，号码也不再孤零零挤在左侧 ===== */
  .foot-touch { padding-bottom: 22px; }
  .foot-touch-tt { font-size: 24px; letter-spacing: 2px; margin-bottom: 14px; padding-left: 16px; }
  .foot-touch-tt::before { width: 4px; height: 20px; }
  .foot-touch-row { grid-template-columns: 1fr; gap: 0; }
  .foot-touch-col {
    display: flex;
    align-items: center;
    justify-content: space-between;   /* 标签靠左、号码靠右，右边缘对齐成一条线 */
    gap: 14px;
    padding: 13px 42px 13px 0;        /* 右侧留出图标位；行高 ≈50px，满足手指点按的最小热区 */
    border-bottom: 1px solid rgba(255, 255, 255, .08);
  }
  .foot-touch-col:last-child { border-bottom: 0; }  /* 末行不再画线，避免与 .foot-touch 的下边框重成双线 */
  .foot-touch-col .lab { margin: 0; font-size: 13px; letter-spacing: 1px; }
  .foot-touch-col .val { font-size: 17px; letter-spacing: 0; text-align: right; }
  .foot-touch-col .val-mail { border-bottom: 0; padding-bottom: 0; }  /* 已有整行分隔线，去掉重复下划线 */
  .foot-touch-col .ft-ico { width: 32px; height: 32px; font-size: 15px; border-radius: 9px; }

  /* ===== 手机端只保留二维码：电话/邮箱已在上方「保持联系」，
     两列栏目导航的入口在悬浮客服面板与顶部导航中，窄屏下一起隐藏 ===== */
  .foot-info .foot-info-gz,
  .foot-info .foot-info-nav { display: none; }
  .foot-info { grid-template-columns: 1fr; padding: 22px 0 20px; text-align: center; }
  .foot-info-qr { justify-self: center; }
  .foot-info-qr .qr-box img { width: 100px; height: 100px; }

  /* 版权条跟随居中：上方内容已居中，这里再左对齐会显得脱节 */
  .foot-copy { align-items: center; text-align: center; padding: 20px 0 24px; gap: 10px; }
}
/* ---------- 18. 案例网格（列表页 / 详情页推荐） ---------- */
.listCase .row > div { margin-bottom: 28px; }
.listCase figure {
  margin: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform .3s ease, box-shadow .3s ease;
}
.listCase figure:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.listCase figure img { width: 100%; height: 216px; object-fit: cover; transition: transform .5s ease; }
.listCase figure:hover img { transform: scale(1.06); }
.listCase figure figcaption { padding: 16px 20px 18px; }
.listCase figure figcaption h3 { margin: 0; font-size: 16px; font-weight: 600; color: var(--ink); line-height: 1.6; }
.listCase figure figcaption h3 span { display: block; margin-top: 4px; font-size: 12px; color: var(--muted); font-weight: 400; }

@media (min-width: 1400px) {
  .idx-xuqiu { padding: 44px 20px 10px; }
  .idx-xuqiu ul li .zbox { height: 220px; }
  .idx-xuqiu ul li .zbox h4 { font-size: 18px; letter-spacing: 2px; }
  .idx-xuqiu ul li .zbox .more a { width: 110px; height: 38px; line-height: 36px; font-size: 13px; }
  .listCase figure img { height: 190px; }
  .navbar-default .navbar-nav li a.nav-cta {
    width: 140px;
    height: auto;
    line-height: 38px;
    margin: 10px 0 18px !important;
    text-align: center;
    background: #fff;
    color: var(--brand) !important;
  }
  .navbar-default .navbar-nav li a.nav-cta:hover { color: var(--brand) !important; }
}
/* 案例"更多 View"按钮箭头伪元素已并入公用组件 .sec-ttl .more a::after（24.1） */
/* —— 31.0 头部基础：纯白底 + 橙色主题变量（与 .indexService 一致）+ 全屏通栏 —— */
.navbar-default {
  --brand: #ff6a00;
  --brand-deep: #ff3d00;
  --grad: linear-gradient(135deg, #ff8a00 0%, #ff3d00 100%);
  --shadow-brand: 0 6px 18px rgba(255, 106, 0, .30);
  /* —— 页眉流体尺寸令牌：随视口宽度平滑缩放（≈1920 取满值，≈992 取最小值） —— */
  --nav-h: clamp(78px, calc(34.7px + 4.44vw), 120px);    /* 页眉 / 一级菜单项高度 */
  --nav-fs: clamp(17px, calc(5.4px + .97vw), 24px);      /* 一级导航字号 */
  --nav-pad: clamp(9px, calc(1.11vw - 3.3px), 18px);     /* 一级导航左右内边距 */
  --nav-ls: clamp(1px, calc(.28vw - 2.3px), 3px);        /* 一级导航字间距 */
  background: #fff;
  border: 0;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
  min-height: var(--nav-h);
}
.navbar-default::after { display: none; }

/* 取消 Bootstrap 容器限宽：页眉铺满整屏 */
.navbar-default > .container-fluid {
  max-width: 100%;
}
@media (min-width: 992px) {
  /* 左侧留白、右侧归零：靠右导航与橙色电话块贴近视口右边 */
  .navbar-default > .container-fluid {
    padding-left: 32px;
    padding-right: 0;
  }
}

/* —— 31.1 吸顶（≥768） —— */
@media (min-width: 768px) {
  .navbar { position: sticky; top: 0; z-index: 1030; box-shadow: 0 2px 18px rgba(17, 24, 39, .07); }
}

/* —— 31.2 Logo：等比限高（无悬停效果） —— */
.logo { display: flex; align-items: center; }
.logo .navbar-brand { display: block; margin: 0 32px 0 0; padding: 0; line-height: 0; }
/* logo 同步随分辨率缩放（≥1440 → 74px，≤768 → 54px，与移动端页眉高度衔接） */
.logo .navbar-brand img { display: block; height: clamp(54px, calc(16px + 4vw), 74px); width: auto; }

/* —— 31.3 折叠按钮（<992 显示） —— */
.navbar-header { display: flex; align-items: center; }
.navbar-default .navbar-toggle {
  display: inline-block;
  margin: 0 0 0 auto;
  padding: 9px 10px;
  background: #fff;
  border-radius: 8px;
  border-color: #e3e6ec;
}
.navbar-default .navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  margin: 4px 0 0;
  border-radius: 2px;
  background: var(--brand);
}
.navbar-default .navbar-toggle .icon-bar:first-child { margin-top: 0; }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background: #fff3e8; border-color: var(--brand); }

/* —— 31.4 桌面导航（≥992）：靠右 + 放大 + 橙色下划线 + hover/active —— */
@media (min-width: 992px) {
  .navbar-default { padding-top: 0; padding-bottom: 0; }
  .navbar-default .navbar-toggle { display: none; }

  /* 导航整体靠右，与右侧电话块连成一组 */
  .navbar-default .navbar-nav { margin: 0 0 0 auto; }
  .navbar-default .navbar-nav > li { position: relative; margin: 0 2px; }

  /* 一级菜单项：占满页眉高度 */
  .navbar-default .navbar-nav > li > a {
    display: flex;
    align-items: center;
    min-height: var(--nav-h);
    margin: 0;
    padding: 0 var(--nav-pad);
    font-size: var(--nav-fs);
    font-weight: 500;
    letter-spacing: var(--nav-ls);
    white-space: nowrap;      /* 文字不换行，靠字号缩放来适配宽度 */
    color: #333;
    background: transparent;
    transition: color .25s ease;
  }
  /* 橙色下划线：hover / 当前项时显示（左右缩进跟随菜单项内边距一起缩放） */
  .navbar-default .navbar-nav > li > a::after {
    content: "";
    position: absolute;
    left: var(--nav-pad);
    right: var(--nav-pad);
    bottom: 0;
    height: 3px;
    border-radius: 0;
    background: var(--brand);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .25s ease;
  }
  .navbar-default .navbar-nav > li > a:hover,
  .navbar-default .navbar-nav > li.hover > a,
  .navbar-default .navbar-nav > li.cur > a,
  .navbar-default .navbar-nav > li.active > a { color: var(--brand); }
  .navbar-default .navbar-nav > li > a:hover::after,
  .navbar-default .navbar-nav > li.hover > a::after,
  .navbar-default .navbar-nav > li.cur > a::after,
  .navbar-default .navbar-nav > li.active > a::after { transform: scaleX(1); }

  /* 去掉含二级栏目一级项的下拉箭头 icon */
  .navbar-default .navbar-nav li.has-sub > a::before { display: none; }

  /* 二级下拉：默认隐藏，悬停展开 + 橙色顶部描边 */
  .navbar-default .navbar-nav > li > ul {
    position: absolute;
    top: 100%;
    left: 50%;
    min-width: 200px;
    margin: 0;
    padding: 8px;
    transform: translate(-50%, 8px);
    background: #fff;
    border: 1px solid var(--line);
    border-top: 3px solid var(--brand);
    border-radius: 12px;
    box-shadow: 0 22px 46px rgba(17, 24, 39, .15);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease;
  }
  .navbar-default .navbar-nav > li > ul::before { display: none; }
  .navbar-default .navbar-nav > li:hover > ul,
  .navbar-default .navbar-nav > li.hover > ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
  }
  .navbar-default .navbar-nav > li > ul > li a {
    display: block;
    margin: 0;
    padding: 0 16px;
    line-height: 54px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    color: #3f4757 !important;
    text-align: left;
    border: 0;
  }
  .navbar-default .navbar-nav > li > ul > li a:hover,
  .navbar-default .navbar-nav > li > ul > li.active > a {
    color: var(--brand) !important;
    background: #fff3e8;
  }
}

/* —— 31.5 平板竖屏（768-991）：强制折叠菜单 —— */
@media (min-width: 768px) and (max-width: 991.98px) {
  .navbar-expand-md .navbar-collapse { display: none !important; }
  .navbar-expand-md .navbar-collapse.show { display: block !important; }
  .navbar-expand-md .navbar-nav { flex-direction: column !important; }
}

/* —— 31.6 折叠菜单（<992）：竖排面板 —— */
@media (max-width: 991.98px) {
  #site-nav.navbar-collapse {
    background: #fff;
    padding: 6px 10px 16px;
    border-top: 1px solid var(--line);
    box-shadow: 0 24px 44px rgba(17, 24, 39, .12);
  }
  #site-nav.navbar-collapse .navbar-nav li a {
    display: block;
    margin: 0;
    padding: 9px 18px;
    font-size: 16px;
    border-radius: 8px;
  }
  #site-nav.navbar-collapse .navbar-nav li a:hover,
  #site-nav.navbar-collapse .navbar-nav li a:focus {
    background: #fff3e8;
    color: var(--brand);
  }
  #site-nav.navbar-collapse .navbar-nav > li > ul {
    position: static;
    border: 0;
    box-shadow: none;
    padding: 0 0 6px 26px;
  }
}

/* —— 31.7 右侧电话块（≥1200）：纯橙底白字（无悬停效果） —— */
@media (min-width: 1200px) {
  .header-tel {
    display: flex;
    flex: 0 0 auto;
    align-self: stretch;
    align-items: center;
    justify-content: center;
    /* 间距与内边距随分辨率收缩：电话块整体跟着变小 */
    margin-left: clamp(18px, calc(3.05vw - 18.6px), 40px);
    padding: 0 clamp(22px, calc(3.6vw - 21px), 48px);
    min-height: var(--nav-h);
    background: var(--brand);
  }
  .ht-inner { display: flex; align-items: center; gap: clamp(8px, 1vw, 14px); }
  .ht-inner > .bi { display: none; }   /* 隐藏原有耳机图标 */
  .ht-txt {
    display: flex;
    flex-direction: column;
    align-items: flex-end;   /* 标签与电话号右端对齐 */
    gap: clamp(4px, .7vw, 10px);
    line-height: 1.15;
  }
  .ht-lbl {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(5px, .7vw, 10px);
    font-size: clamp(12.5px, calc(6.7px + .49vw), 16px);
    color: rgba(255, 255, 255, .92);
    letter-spacing: 1px;
    white-space: nowrap;
  }
  .ht-lbl::before {          /* "24h" 徽章：尺寸用 em，跟随 .ht-lbl 字号一起缩放 */
    content: "24h";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3em;              /* ≈42px（.ht-lbl 16px 时） */
    height: 1.72em;          /* ≈24px */
    font-size: .875em;       /* 14px（.ht-lbl 16px 时） */
    font-weight: 700;
    color: #fff;
    background: rgba(255, 255, 255, .2);
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 999px;
    letter-spacing: 0;
    flex: 0 0 auto;
  }
  .ht-num {
    font-size: clamp(19px, calc(.7px + 1.53vw), 30px);
    font-weight: bold;
    line-height: 1;
    color: #fff;
    letter-spacing: clamp(1px, calc(.14vw - .7px), 2px);
    white-space: nowrap;
  }
}
/* 平板/窄屏：电话块收起 */
@media (max-width: 1199.98px) {
  .header-tel { display: none !important; }
}

/* —— 31.8 右侧 CTA 入口（快速建站按钮，header.html 中默认注释） —— */
.navbar-default .navbar-nav li a.nav-cta {
  display: inline-block;
  margin: 25px 0 0 26px;
  padding: 0 26px;
  line-height: 42px;
  height: 42px;
  border-radius: 21px;
  background: var(--grad);
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 2px;
  box-shadow: var(--shadow-brand);
}
.navbar-default .navbar-nav li a.nav-cta::after { display: none; }
.navbar-default .navbar-nav li a.nav-cta i { margin-right: 7px; }

/* —— 31.9 移动端页眉（<992）：紧凑布局 + 浮层下拉 + 美化折叠按钮 —— */
@media (max-width: 991.98px) {
  /* 取消桌面端 120px 最小高度，让页眉自然撑开（上下留白加大以提升页眉高度） */
  .navbar-default {
    min-height: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    position: relative;          /* 作为浮层定位的包含块 */
  }

  /* 容器保持块级；让 .navbar-header 撑满并用 space-between 两端对齐 logo / toggle */
  .navbar-default > .container-fluid {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding-left: 0;            /* 去掉 BS5 .container-fluid 的 12px 左右内边距 */
    padding-right: 0;
  }
  .navbar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;                /* 撑满容器，才能让内部两端对齐生效 */
    padding: 0 12px;            /* 视觉上与屏幕边缘保留 12px 呼吸距离，可按需改为 0 */
  }

  /* logo：margin-right 归零，高度放大以匹配加高的页眉 */
  .logo .navbar-brand { margin-right: 0; }
  .logo .navbar-brand img { height: 56px; }

  /* —— 折叠菜单：浮在页眉下方（绝对定位），不再撑开 navbar —— */
  .navbar-expand-md .navbar-collapse {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1030;
    display: block;                              /* 覆盖 BS5 .collapse 的 display:none */
    height: auto !important;                     /* 覆盖 BS5 collapse 高度过渡 */
    overflow: visible;
    background: #fff;
    border-top: 1px solid #eef2f7;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 16px 28px rgba(17, 24, 39, .12);
    padding: 6px 10px 16px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
    pointer-events: none;
  }
  .navbar-expand-md .navbar-collapse.show,
  .navbar-expand-md .navbar-collapse.collapsing {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  /* —— 浮层内导航：整体排版 —— */
  #site-nav.navbar-collapse .navbar-nav {
    margin: 0;
    padding: 0;
  }
  /* 一级项之间用浅色分隔线分开 */
  #site-nav.navbar-collapse .navbar-nav > li {
    border-bottom: 1px solid #f0f4f9;
  }
  #site-nav.navbar-collapse .navbar-nav > li:last-child { border-bottom: 0; }

  #site-nav.navbar-collapse .navbar-nav li a {
    display: block;
    position: relative;
    margin: 0;
    padding: 13px 18px;
    font-size: 16px;
    border-radius: 8px;
    color: #333;
    transition: background .2s ease, color .2s ease;
  }
  #site-nav.navbar-collapse .navbar-nav li a:hover,
  #site-nav.navbar-collapse .navbar-nav li a:focus {
    background: #fff3e8;
    color: var(--brand);
  }
  /* 当前所在栏目高亮 */
  #site-nav.navbar-collapse .navbar-nav > li.active > a {
    color: var(--brand);
    font-weight: 600;
  }

  /* —— 一级项含子菜单：右侧 chevron 指示 + 手风琴开合 —— */
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > a {
    padding-right: 44px;
    font-weight: 500;
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 20px;
    width: 8px;
    height: 8px;
    margin-top: -5px;
    border-right: 2px solid #9aa4b2;
    border-bottom: 2px solid #9aa4b2;
    transform: rotate(45deg);            /* 收起：箭头向下 */
    transition: transform .25s ease, border-color .25s ease, margin-top .25s ease;
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub.open > a {
    color: var(--brand);
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub.open > a::after {
    margin-top: -2px;
    border-color: var(--brand);
    transform: rotate(-135deg);          /* 展开：箭头向上 */
  }

  /* —— 手风琴折叠区：子菜单默认收起，由 JS slideDown / slideUp 控制 —— */
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul {
    display: none;                       /* 默认折叠 */
    position: static;
    margin: 0 10px 10px;
    padding: 6px;
    list-style: none;
    border: 0;
    border-radius: 10px;
    box-shadow: none;
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul > li { border: 0; }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul > li a {
    margin: 0;
    padding: 10px 14px 10px 28px;
    font-size: 14px;
    color: #5b6472;
    border-radius: 6px;
  }
  /* 子项前的小圆点 */
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul > li a::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 50%;
    width: 5px;
    height: 5px;
    margin-top: -2.5px;
    border-radius: 50%;
    background: #c3ccd8;
    transition: background .2s ease;
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul > li a:hover {
    background: #fff3e8;
    color: var(--brand);
  }
  #site-nav.navbar-collapse .navbar-nav > li.has-sub > ul > li a:hover::before {
    background: var(--brand);
  }

  /* —— 美化折叠按钮：圆角橙底白线，展开时三条线变成 X —— */
  .navbar-default .navbar-toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0 0 0 auto;
    background: var(--grad);
    border: 0;
    border-radius: 10px;
    box-shadow: var(--shadow-brand);
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .navbar-default .navbar-toggle:hover,
  .navbar-default .navbar-toggle:focus {
    background: var(--grad);
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(255, 106, 0, .38);
  }
  .navbar-default .navbar-toggle .icon-bar {
    display: block;
    width: 20px;
    height: 2px;
    margin: 3px 0;
    border-radius: 2px;
    background: #fff;
    transition: transform .25s ease, opacity .2s ease;
  }
  .navbar-default .navbar-toggle .icon-bar:first-child { margin-top: 0; }

  /* 展开态：按钮变 X（由 JS 在 .show 时给 button 加 .active） */
  .navbar-default .navbar-toggle.active .icon-bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .navbar-default .navbar-toggle.active .icon-bar:nth-child(2) { opacity: 0; }
  .navbar-default .navbar-toggle.active .icon-bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }
}
/* ---------- 41.7 区块 F：我们的案例（沿用详情页 25 节 .pl-gallery 案例卡片） ---------- */
.page-svc .sg-cases .pl-gallery { margin: 0; }


/* —— 弹出面板内通用元素 —— */
#main_kefu .kf-pop--qr { text-align: center; }
#main_kefu .kf-pop--qr img {
  display: block;
  width: 150px;
  height: 150px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 6px 16px rgba(17, 24, 39, .14);
}
#main_kefu .kf-pop--qr > span {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: var(--muted);
  letter-spacing: 1px;
}
#main_kefu .kf-pop--links::before { content: "服务项目"; }
#main_kefu .kf-pop--tel::before { content: "联系我们"; }
#main_kefu .kf-pop--links::before,
#main_kefu .kf-pop--tel::before {
  display: block;
  margin: 0 2px 6px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--line);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--ink);
}
#main_kefu .kf-pop--links a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 1px 0;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 14px;
  color: var(--text);
  transition: all .2s ease;
}
#main_kefu .kf-pop--links a:hover { background: #fff3e9; color: var(--brand); padding-left: 12px; }
#main_kefu .kf-pop--links a i { font-size: 11px; color: #c3c9d4; }
#main_kefu .kf-pop--tel p {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--ink);
}
#main_kefu .kf-pop--tel p i { color: var(--brand); font-size: 16px; }

/* —— 桌面端（≥992）：右侧中部圆形图标竖排 —— */
@media (min-width: 992px) {
  #main_kefu.kf {
    position: fixed;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: auto;
    height: auto;
    margin: 0;
    background: transparent;
    border: 0;
  }
  #main_kefu .kf-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    color: var(--brand);
    background: #fff;
    border: 1px solid #ffdcc0;
    border-radius: 50%;
    box-shadow: 0 8px 22px rgba(17, 24, 39, .12);
    cursor: pointer;
    transition: color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease;
  }
  #main_kefu .kf-item i { font-size: 23px; }
  #main_kefu .kf-item:hover {
    color: #fff;
    background: var(--grad);
    border-color: transparent;
    transform: translateY(-3px);
    box-shadow: var(--shadow-brand);
  }
  /* 图标与面板间的隐形热区桥：光标从图标滑入面板时不中断悬停 */
  #main_kefu .kf-item::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    width: 32px;
    height: 84px;
    z-index: 0;
  }
  /* 文本标签：仅 QQ / 返回顶部（无弹层项）悬停时左侧显示 */
  #main_kefu .kf-item .kf-label {
    position: absolute;
    top: 50%;
    right: calc(100% + 18px);
    transform: translateY(-50%);
    padding: 7px 14px;
    font-size: 13px;
    letter-spacing: 1px;
    white-space: nowrap;
    color: #fff;
    background: rgba(20, 25, 34, .85);
    border-radius: 999px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
  }
  #main_kefu .kf-qq:hover .kf-label,
  #main_kefu .kf-top:hover .kf-label { opacity: 1; visibility: visible; }
  /* 弹出面板：二维码 / 服务项目 / 联系方式 */
  #main_kefu .kf-pop {
    position: absolute;
    top: 50%;
    right: calc(100% + 18px);
    transform: translateY(-50%) translateX(6px);
    min-width: 200px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #eef0f5;
    border-radius: 14px;
    box-shadow: 0 20px 46px rgba(17, 24, 39, .16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
  }
  #main_kefu .kf-item:hover .kf-pop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%) translateX(0);
  }
  #main_kefu .kf-pop:hover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(-50%) translateX(0) !important;
  }
}

/* —— 平板 & 手机（≤991）：底部通栏悬浮条 —— */
@media (max-width: 991.98px) {
  #main_kefu.kf {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    transform: none;
    z-index: 1050;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: auto;
    height: auto;
    margin: 0;
    background: rgba(255, 255, 255, .97);
    border: 0;
    border-top: 1px solid #e7eaf0;
    border-radius: 0;
    box-shadow: 0 -8px 26px rgba(17, 24, 39, .09);
    backdrop-filter: blur(10px);
    padding-bottom: env(safe-area-inset-bottom);
  }
  #main_kefu .kf-item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: auto;
    min-height: 56px;
    height: auto;
    padding: 7px 2px 6px;
    color: var(--text);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
  }
  #main_kefu .kf-item + .kf-item { border-left: 1px solid #f0f2f6; }
  #main_kefu .kf-item i { font-size: 21px; color: var(--brand); }
  #main_kefu .kf-item .kf-label {
    position: static;
    transform: none;
    padding: 0;
    font-size: 11px;
    line-height: 1.2;
    letter-spacing: 0;
    color: var(--muted);
    background: transparent;
    opacity: 1;
    visibility: visible;
  }
  #main_kefu .kf-item.is-open { background: #fff3e9; }
  #main_kefu .kf-item.is-open .kf-label { color: var(--brand); font-weight: 600; }
  /* 返回顶部按钮：未滚动时淡化 */
  #main_kefu .kf-top { opacity: .45; }
  #main_kefu .kf-top.is-visible { opacity: 1; }
  /* 点击展开的弹层：从底部栏向上弹出 */
  #main_kefu .kf-pop {
    position: absolute;
    top: auto;
    right: auto;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(6px);
    min-width: 200px;
    max-width: calc(100vw - 24px);
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #eef0f5;
    border-radius: 14px;
    box-shadow: 0 12px 34px rgba(17, 24, 39, .16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease;
  }
  #main_kefu .kf-item.is-open .kf-pop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }
  /* 给页面底部让位，避免悬浮条遮住版权区内容 */
  body { padding-bottom: 68px; }
}

.idx-cta {
  padding: 96px 0 92px;
  text-align: center;
  background: transparent;
}
.idx-cta > .container { position: relative; z-index: 1; }
.idx-cta-title {
  margin: 0;
  font-size: 42px;
  font-weight: 800;
  letter-spacing: 6px;
  color: var(--ink);
}
.idx-cta-desc {
  margin: 20px auto 0;
  max-width: 760px;
  font-size: 17px;
  line-height: 2;
  color: var(--muted);
}
.idx-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 36px;
}
.idx-cta-line {
  display: block;
  width: 72px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 122, 0, .95));
}
.idx-cta-btn .idx-cta-line:last-child { transform: scaleX(-1); }
.idx-cta-btn a {
  display: inline-block;
  padding: 0 50px;
  line-height: 60px;
  font-size: 18px;
  letter-spacing: 4px;
  color: #fff;
  background: var(--grad);
  border-radius: 999px;
  box-shadow: 0 14px 32px rgba(255, 90, 0, .38);
  transition: all .3s ease;
}
.idx-cta-btn a:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 44px rgba(255, 90, 0, .50);
  color: #fff;
}

/* ---------- CTA / 需求横幅 响应式收口 ---------- */
@media (max-width: 991px) {
  .idx-cta { padding: 74px 16px 70px; }
  .idx-cta-title { font-size: 34px; letter-spacing: 5px; }
}
@media (max-width: 767px) {
  .idx-xuqiu { padding: 0 14px 0; }
  .idx-xuqiu .zbox { height: 206px; padding: 0 16px; border-radius: 12px; }
  .idx-xuqiu .zbox h4 { margin-bottom: 22px; font-size: 22px; letter-spacing: 2px; }
  .idx-xuqiu .zbox .more { padding: 0 26px; line-height: 38px; font-size: 15px; }
  .idx-cta { padding: 54px 16px 58px; }
  .idx-cta-title { font-size: 26px; letter-spacing: 3px; }
  .idx-cta-desc { font-size: 15px; }
  .idx-cta-btn { gap: 12px; margin-top: 28px; }
  .idx-cta-line { width: 30px; }
  .idx-cta-btn a { padding: 0 30px; line-height: 52px; font-size: 16px; letter-spacing: 2px; }
}