/* ============================================================
   联云科技官网 · 科技感视觉层  tech.css
   仅由前台页面引入，后台管理不受影响。
   设计基调：科技蓝 + 科技网格 + 克制光效，面向政企客户的稳重科技感。
   ============================================================ */

:root {
  --tech-ink: #050b18;
  --tech-ink-2: #0a1730;
  --tech-ink-3: #0f2444;
  --tech-cyan: #22d3ee;
  --tech-blue: #3b82f6;
  --tech-line: rgba(120, 170, 255, 0.08);
  --tech-line-strong: rgba(120, 170, 255, 0.16);
  --tech-glow: rgba(0, 102, 255, 0.28);
  --nav-h: 64px;
  /* 全站 Hero 统一底图：科技蓝基调 + 斜纹 + 三处光晕。
     首页与内页共用同一套，改这里即全站同步。 */
  --hero-bg:
    repeating-linear-gradient(118deg, rgba(140, 192, 255, 0.055) 0 1px, transparent 1px 94px),
    radial-gradient(ellipse 62% 56% at 14% 6%, rgba(70, 145, 255, 0.55) 0%, transparent 60%),
    radial-gradient(ellipse 50% 52% at 88% 0%, rgba(85, 220, 255, 0.36) 0%, transparent 56%),
    radial-gradient(ellipse 92% 58% at 50% 106%, rgba(32, 100, 214, 0.45) 0%, transparent 72%),
    linear-gradient(160deg, #0d3070 0%, #1552a8 46%, #0b2c66 100%);
  --hero-line: rgba(150, 202, 255, 0.15);
  /* 全站 Hero 上下留白：首页与所有内页共用同一组值，改这两处即全站同步收窄/放宽。
     左右（横向）不加约束，始终顶满整屏宽度。
     ⚠️ 顶部值需 ≥ 导航高（--nav-h = 64px）+ 约 30px 呼吸感，否则标题会贴住导航。 */
  --hero-pt: 96px;
  --hero-pb: 56px;
  --shadow-tech: 0 4px 24px rgba(10, 23, 48, 0.07);
  --shadow-tech-lg: 0 18px 48px rgba(10, 23, 48, 0.14);
}

/* ---------- 全局细节 ---------- */
::selection { background: rgba(0, 102, 255, 0.16); }
body { -webkit-font-smoothing: antialiased; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #94a3b8, #64748b);
  border-radius: 6px;
  border: 2px solid #f1f5f9;
}
::-webkit-scrollbar-thumb:hover { background: var(--primary); }

:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 4px; }

.container { position: relative; }

/* ---------- 导航栏 ---------- */
.navbar {
  height: var(--nav-h);
  background: rgba(255, 255, 255, 0.82);
  border-bottom: 1px solid rgba(10, 23, 48, 0.06);
  transition: height 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}
.navbar.scrolled {
  height: 56px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 6px 28px rgba(10, 23, 48, 0.09);
}
.navbar .logo { gap: 10px; }
.navbar .logo .logo-img {
  height: 34px; width: auto; max-width: 46px;
  object-fit: contain;
  transition: transform 0.3s ease;
}
.navbar .logo:hover .logo-img { transform: scale(1.06); }
.navbar .logo span {
  font-size: 20px; font-weight: 700; letter-spacing: 0.5px;
  background: linear-gradient(120deg, #0066ff 0%, #22d3ee 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #0066ff;
}
.navbar nav { gap: 30px; }
.navbar nav a {
  font-size: 15px;
  padding: 6px 0;
  transition: color 0.2s ease;
}
.navbar nav a.active::after {
  height: 3px;
  bottom: -2px;
  border-radius: 3px;
  background: linear-gradient(90deg, #0066ff, #22d3ee);
  animation: navUnderline 0.35s ease;
}
@keyframes navUnderline { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  overflow: hidden;
  /* 上下留白收窄，左右仍为 0（顶满） */
  padding: var(--hero-pt) 0 var(--hero-pb);
  text-align: center;
  background: var(--hero-bg);
  color: #fff;
}
.hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(var(--hero-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--hero-line) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 32%, #000 20%, transparent 80%);
  mask-image: radial-gradient(ellipse 75% 70% at 50% 32%, #000 20%, transparent 80%);
  pointer-events: none;
}
.hero::after {
  content: '';
  position: absolute;
  width: 760px; height: 660px;
  left: 50%; top: -300px;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(96, 165, 250, 0.34) 0%, transparent 68%);
  pointer-events: none;
  filter: blur(12px);
}
.hero .container { z-index: 2; }
.hero h1 {
  font-size: 46px;
  font-weight: 700;
  letter-spacing: 1.5px;
  line-height: 1.28;
  margin-bottom: 20px;
  color: #fff;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .hero h1 {
    background: linear-gradient(180deg, #ffffff 28%, #a9c9ff 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
.hero p {
  font-size: 17px;
  color: rgba(214, 230, 255, 0.82);
  letter-spacing: 0.4px;
  margin-bottom: 36px;
}
.hero-buttons { gap: 18px; }
.hero-buttons .btn { box-shadow: 0 8px 26px rgba(0, 102, 255, 0.24); }

/* Hero 底部渐隐过渡 */
.hero + .section { position: relative; }

/* ---------- 按钮 ---------- */
.btn {
  border-radius: 10px;
  letter-spacing: 0.3px;
  position: relative;
  overflow: hidden;
  transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.btn-primary {
  background: linear-gradient(120deg, #0066ff 0%, #2b8cff 100%);
  box-shadow: 0 6px 20px rgba(0, 102, 255, 0.26);
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(0, 102, 255, 0.36);
}
.btn-outline {
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(4px);
}
.btn-outline:hover {
  background: #fff;
  color: var(--primary);
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(255, 255, 255, 0.2);
}
.btn-outline-blue { border-width: 1.5px; }
.btn-outline-blue:hover { box-shadow: 0 10px 26px rgba(0, 102, 255, 0.22); transform: translateY(-2px); }

/* ---------- 通用区块标题 ---------- */
.section-title h2 {
  font-size: 34px;
  letter-spacing: 0.6px;
  position: relative;
  display: inline-block;
  padding-bottom: 14px;
}
.section-title h2::after {
  content: '';
  position: absolute; left: 50%; bottom: 0;
  transform: translateX(-50%);
  width: 56px; height: 3px; border-radius: 3px;
  background: linear-gradient(90deg, #0066ff, #22d3ee);
}
.section-title p { color: #64748b; }

/* ---------- 数据统计 ---------- */
.stats { padding: 42px 0; }
.stat-item {
  position: relative;
  padding: 8px 0;
}
.stat-item + .stat-item::before {
  content: '';
  position: absolute; left: -12px; top: 50%;
  transform: translateY(-50%);
  width: 1px; height: 46px;
  background: linear-gradient(180deg, transparent, rgba(10, 23, 48, 0.12), transparent);
}
.stat-item .number {
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.5px;
  background: linear-gradient(135deg, #0066ff 0%, #22d3ee 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #0066ff;
  line-height: 1.1;
}
.stat-item .label { color: #64748b; font-size: 14px; letter-spacing: 0.5px; margin-top: 8px; }

/* ---------- 产品卡片 ---------- */
.product-grid { gap: 26px; }
.product-card {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(10, 23, 48, 0.08);
  box-shadow: var(--shadow-tech);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.product-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #0066ff, #22d3ee);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.35s ease;
}
.product-card::after {
  content: '';
  position: absolute;
  width: 240px; height: 240px; right: -90px; top: -90px;
  background: radial-gradient(circle, rgba(0, 102, 255, 0.13) 0%, transparent 70%);
  opacity: 0; transition: opacity 0.35s ease;
  pointer-events: none;
}
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-tech-lg);
  border-color: rgba(0, 102, 255, 0.28);
}
.product-card:hover::before { transform: scaleX(1); }
.product-card:hover::after { opacity: 1; }
.product-card .icon {
  font-size: 26px;
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(0, 102, 255, 0.1), rgba(34, 211, 238, 0.1));
  border: 1px solid rgba(0, 102, 255, 0.14);
  margin-bottom: 18px;
}
.product-card h3 { font-size: 20px; letter-spacing: 0.3px; }
.product-card .cat-desc { line-height: 1.7; }
.product-card .product-list li { padding: 10px 0; }
.product-card .tag {
  background: rgba(0, 102, 255, 0.07);
  border: 1px solid rgba(0, 102, 255, 0.12);
  border-radius: 6px;
  transition: background 0.2s ease, color 0.2s ease;
}
.product-card .tag:hover { background: var(--primary); color: #fff; }

/* ---------- 案例卡片 ---------- */
.case-grid { gap: 26px; }
.case-card {
  border-radius: 18px;
  border: 1px solid rgba(10, 23, 48, 0.08);
  box-shadow: var(--shadow-tech);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.case-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-tech-lg); }
.case-card .case-header {
  background: linear-gradient(135deg, rgba(0, 102, 255, 0.07), rgba(34, 211, 238, 0.07));
  border-bottom: 1px solid rgba(10, 23, 48, 0.05);
}
.case-card .case-category { border-radius: 6px; letter-spacing: 0.4px; }

/* ---------- 新闻列表 ---------- */
.news-hero {
  position: relative;
  overflow: hidden;
  padding: var(--hero-pt) 0 var(--hero-pb);
  color: #fff;
  background: var(--hero-bg);
}
.news-hero h1 { color: #fff; font-size: 36px; margin-bottom: 14px; }
.news-hero p { color: rgba(214, 230, 255, 0.82); font-size: 16px; }

/* 内页 Hero 统一：底图 / 网格 / 光晕 / 居中，一处声明全站生效。
   原先 product/qualifications（.page-hero）、news（.news-hero）、about、contact 各写各的底图，
   且 about/contact 还有独立背景定义在文件后段 —— 那些已在各自位置清掉，避免再次相互覆盖。
   ⚠️ 以后给内页 hero 加背景，改这里即可，别在别处再写 background。 */
.contact-hero, .about-hero, .page-hero { background: var(--hero-bg); }
.news-hero::before,
.contact-hero::before,
.about-hero::before,
.page-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(var(--hero-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--hero-line) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 50% 30%, #000 20%, transparent 82%);
  mask-image: radial-gradient(ellipse 70% 80% at 50% 30%, #000 20%, transparent 82%);
  pointer-events: none;
}
/* 顶部中央光晕，与首页同一手法 */
.news-hero::after,
.contact-hero::after,
.about-hero::after,
.page-hero::after {
  content: '';
  position: absolute;
  width: 700px; height: 560px;
  left: 50%; top: -260px;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(96, 165, 250, 0.3) 0%, transparent 68%);
  filter: blur(12px);
  pointer-events: none;
}
.news-hero .container, .contact-hero .container, .about-hero .container, .page-hero .container { position: relative; z-index: 2; }
/* 内页 Hero 统一居中：集中声明，避免再出现某个页头单独漏掉导致左对齐 */
.news-hero, .contact-hero, .about-hero, .page-hero { position: relative; overflow: hidden; text-align: center; }
.news-hero h1, .contact-hero h1, .about-hero h1, .page-hero h1 { letter-spacing: 1px; }
/* 标题渐变文字：与首页一致。字号一律不动，只统一文字渲染效果 */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .news-hero h1, .contact-hero h1, .about-hero h1, .page-hero h1 {
    background: linear-gradient(180deg, #ffffff 30%, #b9d6ff 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}

/* 新闻分类选项卡：与资质页 .qual-tabs 保持同一套视觉，改一处记得同步另一处 */
.news-tabs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 36px;
  padding: 6px;
  border-radius: 999px;
  background: rgba(10, 23, 48, 0.04);
  border: 1px solid rgba(10, 23, 48, 0.07);
}
.news-tab {
  appearance: none;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.3px;
  color: #64748b;
  background: transparent;
  border: 0;
  border-radius: 999px;
  padding: 11px 30px;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex; align-items: center; gap: 8px;
  transition: color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
}
.news-tab:hover { color: var(--dark); }
.news-tab.active {
  color: #fff;
  background: linear-gradient(120deg, #0066ff, #2b8cff);
  box-shadow: 0 8px 20px rgba(0, 102, 255, 0.26);
}
.news-tab .news-tab-n {
  font-size: 12px;
  font-weight: 500;
  padding: 1px 7px;
  border-radius: 20px;
  background: rgba(10, 23, 48, 0.07);
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
}
.news-tab.active .news-tab-n { background: rgba(255, 255, 255, 0.22); opacity: 1; }

.news-panel { display: none; }
/* 切面板的入场动效只放在面板这一层，且不带 fill-mode：即便动画没被重放，
   元素也只是「直接显示」，不会停在 opacity:0。卡片层再叠动画的话，
   第二次显示同一面板时会出现卡片不显示，所以不做。 */
.news-panel.active { display: block; animation: newsPanelIn 0.32s cubic-bezier(0.22, 0.61, 0.36, 1); }
@keyframes newsPanelIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.news-panel-desc {
  color: #64748b;
  font-size: 14.5px;
  line-height: 1.85;
  max-width: 760px;
  margin: 0 auto 30px;
  text-align: center;
}

.news-grid { gap: 26px; }
.news-card {
  border-radius: 18px;
  border: 1px solid rgba(10, 23, 48, 0.08);
  box-shadow: var(--shadow-tech);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
  display: flex; flex-direction: column;
}
.news-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-tech-lg);
  border-color: rgba(0, 102, 255, 0.26);
}
.news-card .news-cover {
  width: 100%; height: 172px;
  overflow: hidden; border-radius: 12px;
  margin-bottom: 16px;
  background: #f1f5f9;
  cursor: zoom-in;
}
.news-card .news-cover img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.news-card:hover .news-cover img { transform: scale(1.05); }
.news-card h3 { line-height: 1.5; }
.news-card .news-summary {
  color: #64748b;
  font-size: 14px;
  line-height: 1.75;
}
.news-card .news-meta { margin-top: auto; }
.news-card .news-tags { gap: 8px; }
.news-card .news-tag { border-radius: 6px; }
.news-card .news-views {
  display: inline-flex; align-items: center; gap: 4px;
  color: #94a3b8; font-size: 12px;
  white-space: nowrap;
}

/* ---------- 新闻详情 ---------- */
#news-detail .detail-header h2 { letter-spacing: 0.4px; line-height: 1.45; }
#news-detail .detail-cover {
  width: 100%;
  border-radius: 14px;
  margin-bottom: 26px;
  overflow: hidden;
  background: #f1f5f9;
  cursor: zoom-in;
}
#news-detail .detail-cover img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}
#news-detail .detail-content { color: #334155; }
#news-detail .detail-content img {
  max-width: 100%; height: auto;
  border-radius: 10px;
  margin: 16px 0;
  cursor: zoom-in;
  display: block;
}
#news-detail .detail-content p { margin: 14px 0; }
#news-detail .detail-content h2 { letter-spacing: 0.3px; }

/* ---------- 摘要折叠与展开 ---------- */
.summary-wrap { position: relative; }
.summary-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: none;
}
.summary-clamp.is-open {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}
.summary-toggle {
  display: inline-flex; align-items: center; gap: 4px;
  margin-top: 8px;
  font-size: 13px; font-weight: 500;
  color: var(--primary);
  cursor: pointer;
  user-select: none;
  background: none; border: none; padding: 0;
  font-family: inherit;
}
.summary-toggle:hover { color: var(--primary-dark); text-decoration: underline; }
.summary-toggle .arrow { transition: transform 0.25s ease; display: inline-block; }
.summary-toggle.is-open .arrow { transform: rotate(180deg); }

/* ---------- 图片灯箱 ---------- */
.lightbox {
  position: fixed; inset: 0;
  z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 40px;
  background: rgba(4, 9, 20, 0.93);
  backdrop-filter: blur(8px);
  opacity: 0; visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.lightbox.open { opacity: 1; visibility: visible; }
.lightbox img {
  max-width: 94vw;
  max-height: 88vh;
  width: auto; height: auto;
  object-fit: contain;
  border-radius: 10px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6);
  transform: scale(0.96);
  transition: transform 0.28s ease;
  cursor: zoom-out;
}
.lightbox.open img { transform: scale(1); }
.lightbox .lb-close {
  position: absolute; top: 22px; right: 26px;
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.08);
  color: #fff; font-size: 22px; line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s ease, transform 0.2s ease;
}
.lightbox .lb-close:hover { background: rgba(255, 255, 255, 0.2); transform: rotate(90deg); }
.lightbox .lb-caption {
  position: absolute; bottom: 26px; left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  white-space: pre-line;
  max-width: 80vw; text-align: center;
}
/* 无图时的说明卡（资质等只有文字资料的条目） */
.lightbox .lb-empty {
  display: none;
  width: 100%;
  max-width: 500px;
  padding: 46px 40px 40px;
  border-radius: 20px;
  background: #fff;
  text-align: center;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.5);
  transform: scale(0.97);
  transition: transform 0.28s ease;
}
.lightbox.open .lb-empty { transform: scale(1); }
.lightbox .lb-empty .lb-seal {
  display: block;
  width: 70px; height: 70px;
  margin: 0 auto 20px;
  border-radius: 50%;
  border: 1.5px dashed rgba(0, 102, 255, 0.36);
  background: rgba(0, 102, 255, 0.04);
  position: relative;
}
.lightbox .lb-empty .lb-seal::after {
  content: '证';
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: rgba(0, 102, 255, 0.55);
  font-size: 26px;
}
.lightbox .lb-empty h3 {
  font-size: 19px;
  line-height: 1.5;
  letter-spacing: 0.3px;
  margin-bottom: 10px;
  color: var(--dark);
}
.lightbox .lb-empty .lb-issuer { font-size: 13px; color: #64748b; margin-bottom: 14px; }
.lightbox .lb-empty .lb-desc {
  font-size: 13.5px;
  line-height: 1.8;
  color: #64748b;
  text-align: left;
}
.lightbox .lb-empty .lb-msg {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px dashed rgba(10, 23, 48, 0.12);
  font-size: 12.5px;
  line-height: 1.75;
  color: #94a3b8;
}

/* ---------- 资质页 ---------- */

/* 仅供读屏/SEO 的隐藏标题 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* 分类切换：两个标题居中 */
.qual-tabs {
  display: flex;
  justify-content: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 40px;
  padding: 6px;
  border-radius: 999px;
  background: rgba(10, 23, 48, 0.04);
  border: 1px solid rgba(10, 23, 48, 0.07);
}
.qual-tab {
  appearance: none;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.3px;
  color: #64748b;
  background: transparent;
  border: 0;
  border-radius: 999px;
  padding: 11px 30px;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex; align-items: center; gap: 8px;
  transition: color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
}
.qual-tab:hover { color: var(--dark); }
.qual-tab.active {
  color: #fff;
  background: linear-gradient(120deg, #0066ff, #2b8cff);
  box-shadow: 0 8px 20px rgba(0, 102, 255, 0.26);
}
.qual-tab .qual-tab-n {
  font-size: 12px;
  font-weight: 500;
  padding: 1px 7px;
  border-radius: 20px;
  background: rgba(10, 23, 48, 0.07);
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
}
.qual-tab.active .qual-tab-n { background: rgba(255, 255, 255, 0.22); opacity: 1; }

.qual-panel { display: none; }
.qual-panel.active { display: block; }
.qual-panel-desc {
  color: #64748b;
  font-size: 14.5px;
  line-height: 1.85;
  max-width: 760px;
  margin: 0 auto 34px;
  text-align: center;
}

/* 小框网格：桌面 4 列 / 平板 3 列 / 手机 2 列
   ⚠️ 改列数必须同步 public/js/main.js 里的 qualColumnCount（折叠上限 = 列数 × 2） */
.qual-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.qual-card {
  appearance: none;
  font: inherit;
  width: 100%;
  padding: 0;
  text-align: center;
  background: #fff;
  border: 1px solid rgba(10, 23, 48, 0.08);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow-tech);
  cursor: pointer;
  display: flex; flex-direction: column;
  transition: transform 0.26s ease, box-shadow 0.26s ease, border-color 0.26s ease;
}
.qual-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-tech-lg);
  border-color: rgba(0, 102, 255, 0.28);
}
.qual-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.qual-card.is-folded { display: none; }
.qual-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  background:
    linear-gradient(var(--tech-line) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(90deg, var(--tech-line) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(150deg, #f1f6ff, #eaf2ff);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  border-bottom: 1px solid rgba(10, 23, 48, 0.06);
}
.qual-thumb img {
  width: 100%; height: 100%;
  object-fit: contain;
  padding: 8px;
  transition: transform 0.4s ease;
}
.qual-card:hover .qual-thumb img { transform: scale(1.04); }
.qual-thumb .qual-empty {
  color: #9cb4d8;
  font-size: 12px;
  text-align: center;
  line-height: 1.6;
  padding: 0 10px;
}
.qual-thumb .qual-empty .seal {
  display: block;
  width: 42px; height: 42px;
  margin: 0 auto 9px;
  border-radius: 50%;
  border: 1.5px dashed rgba(0, 102, 255, 0.3);
  position: relative;
}
.qual-thumb .qual-empty .seal::after {
  content: '证';
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: rgba(0, 102, 255, 0.45);
  font-size: 16px;
}
.qual-name {
  display: block;
  padding: 12px 12px 14px;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--dark);
}

/* 展开更多 / 收起 */
.qual-fold { display: flex; justify-content: center; margin-top: 28px; }
.qual-fold[hidden] { display: none; }
.qual-more {
  appearance: none;
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--primary);
  background: rgba(0, 102, 255, 0.06);
  border: 1px solid rgba(0, 102, 255, 0.2);
  border-radius: 999px;
  padding: 11px 30px;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.qual-more:hover {
  background: rgba(0, 102, 255, 0.1);
  border-color: rgba(0, 102, 255, 0.36);
  transform: translateY(-1px);
}
.qual-more .qual-more-n { color: #7c8ba1; font-weight: 500; font-size: 13.5px; }
.qual-more .caret { font-size: 11px; transition: transform 0.25s ease; }
.qual-more.open .caret { transform: rotate(180deg); }

/* ---------- 关于页 ---------- */
/* 背景统一由上方「内页 Hero 统一」声明提供（var(--hero-bg)），这里只留尺寸 */
.about-hero {
  position: relative;
  overflow: hidden;
  padding: var(--hero-pt) 0 var(--hero-pb);
}
.about-text ul li::before { color: var(--primary); }
.about-content { gap: 56px; }

/* ---------- 联系页 ---------- */
/* 背景同上，统一由 var(--hero-bg) 提供 */
.contact-hero {
  position: relative;
  overflow: hidden;
  padding: var(--hero-pt) 0 var(--hero-pb);
}
.contact-info .info-item {
  border-bottom: 1px solid rgba(10, 23, 48, 0.08);
  transition: background 0.2s ease;
  border-radius: 8px;
  padding: 16px 14px;
}
.contact-info .info-item:hover { background: rgba(0, 102, 255, 0.03); }
.contact-info .info-item .icon {
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0, 102, 255, 0.1), rgba(34, 211, 238, 0.1));
  font-size: 19px;
  flex-shrink: 0;
}
.contact-info .info-item .value a { color: var(--dark); }
.contact-info .info-item .value a:hover { color: var(--primary); }
.contact-phone-line { display: flex; flex-direction: column; gap: 4px; }
.contact-phone-line .sub {
  font-size: 13px; font-weight: 400; color: #64748b;
  display: flex; align-items: center; gap: 6px;
}
.form-card {
  border-radius: 18px;
  border: 1px solid rgba(10, 23, 48, 0.08);
  box-shadow: var(--shadow-tech);
}
.form-group input, .form-group textarea {
  border-radius: 10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-group input:focus, .form-group textarea:focus {
  box-shadow: 0 0 0 4px rgba(0, 102, 255, 0.1);
}

/* ---------- 页脚 ---------- */
.footer {
  position: relative;
  /* 跟随首屏的科技蓝基调，比首屏沉一档（页脚要压住信息，不跟着一起变亮） */
  background: linear-gradient(180deg, #0a2350 0%, #0e2f6b 100%);
  padding-top: 72px;
}
.footer::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0, 102, 255, 0.7), rgba(34, 211, 238, 0.7), transparent);
}
.footer-grid a { transition: color 0.2s ease, padding-left 0.2s ease; }
.footer-grid a:hover { padding-left: 4px; }
.footer-contact-line { display: flex; gap: 8px; align-items: baseline; }
.footer-contact-line .k { color: rgba(255, 255, 255, 0.45); flex-shrink: 0; }
.footer-contact-line a { display: inline; padding: 0; color: rgba(255, 255, 255, 0.78); }
.footer-contact-line a:hover { color: #fff; padding-left: 0; }

/* ---------- 滚动渐入 ---------- */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.65s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.65s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: opacity, transform;
}
.reveal.in { opacity: 1; transform: none; }

/* ---------- 返回顶部 ---------- */
.back-to-top {
  position: fixed;
  right: 26px; bottom: 30px;
  width: 46px; height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(10, 23, 48, 0.08);
  background: #fff;
  color: var(--primary);
  font-size: 18px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 30px rgba(10, 23, 48, 0.14);
  opacity: 0; visibility: hidden;
  transform: translateY(12px);
  transition: all 0.3s ease;
  z-index: 900;
}
.back-to-top.show { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover {
  background: linear-gradient(120deg, #0066ff, #2b8cff);
  color: #fff;
  transform: translateY(-3px);
}

/* ---------- 浮动咨询条 ---------- */
.consult-float {
  position: fixed;
  right: 26px; bottom: 90px;
  display: flex; flex-direction: column; gap: 10px;
  z-index: 900;
}
.consult-float a {
  width: 46px; height: 46px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(10, 23, 48, 0.08);
  box-shadow: 0 10px 30px rgba(10, 23, 48, 0.14);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  color: var(--primary);
  transition: all 0.25s ease;
}
.consult-float a:hover {
  background: linear-gradient(120deg, #0066ff, #2b8cff);
  color: #fff;
  transform: translateY(-3px);
}

/* ---------- 空状态 ---------- */
.empty-state {
  text-align: center;
  padding: 56px 24px;
  color: #94a3b8;
  border-radius: 18px;
  border: 1px dashed rgba(10, 23, 48, 0.12);
  background: rgba(248, 250, 252, 0.6);
}
.empty-state .es-icon {
  font-size: 30px;
  display: block;
  margin-bottom: 12px;
  opacity: 0.5;
}
.empty-state p { font-size: 14px; }

/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
  .qual-grid { grid-template-columns: repeat(3, 1fr); }
  .navbar nav { gap: 22px; }
  .navbar nav a { font-size: 14px; }
}

@media (max-width: 768px) {
  /* 手机端 Hero 上下留白：与桌面同步收窄（导航高仍是 64px，故顶部不低于 80px） */
  :root { --hero-pt: 80px; --hero-pb: 44px; }
  .hero h1 { font-size: 27px; letter-spacing: 0.6px; }
  .hero p { font-size: 14.5px; padding: 0 8px; }
  .section { padding: 56px 0; }
  .section-title h2 { font-size: 24px; }
  .stats { grid-template-columns: repeat(2, 1fr); padding: 44px 0; gap: 28px 16px; }
  .stat-item .number { font-size: 32px; }
  .stat-item + .stat-item::before { display: none; }
  /* 内页 Hero 的上下留白已由 :root 的 --hero-pt / --hero-pb 统一接管，此处不再单独覆盖 */
  .news-hero h1, .contact-hero h1, .about-hero h1, .page-hero h1 { font-size: 27px; }
  .qual-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .qual-tabs { margin-bottom: 30px; padding: 5px; }
  .qual-tab { font-size: 14.5px; padding: 9px 20px; }
  .qual-panel-desc { font-size: 13.5px; margin-bottom: 26px; }
  .news-tabs { margin-bottom: 28px; padding: 5px; gap: 4px; }
  .news-tab { font-size: 14.5px; padding: 9px 18px; }
  .news-panel-desc { font-size: 13.5px; margin-bottom: 24px; }
  .qual-name { padding: 10px 10px 12px; font-size: 12.5px; }
  .qual-thumb .qual-empty { font-size: 11px; }
  .qual-thumb .qual-empty .seal { width: 34px; height: 34px; margin-bottom: 7px; }
  .qual-thumb .qual-empty .seal::after { font-size: 14px; }
  .qual-fold { margin-top: 22px; }
  .qual-more { font-size: 13.5px; padding: 10px 24px; }
  .navbar nav.open {
    top: 56px;
    box-shadow: 0 14px 30px rgba(10, 23, 48, 0.1);
    animation: navDrop 0.25s ease;
  }
  @keyframes navDrop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
  .navbar nav a { padding: 10px 0; border-bottom: 1px solid rgba(10, 23, 48, 0.05); }
  .navbar nav a.active::after { display: none; }
  .navbar nav a.active { color: var(--primary); }
  .back-to-top, .consult-float { right: 16px; }
  .lightbox { padding: 16px; }
  .lightbox .lb-close { top: 14px; right: 14px; width: 38px; height: 38px; }
}

/* ---------- 内页 Hero（产品 / 案例 / 资质等） ---------- */
.page-hero {
  position: relative;
  overflow: hidden;
  padding: var(--hero-pt) 0 var(--hero-pb);
  text-align: center;
  color: #fff;
  /* 背景统一由上方「内页 Hero 统一」声明提供 */
}
.page-hero h1 { font-size: 36px; letter-spacing: 1px; margin-bottom: 14px; color: #fff; }
.page-hero p { font-size: 16px; color: rgba(214, 230, 255, 0.82); }

/* ---------- 新闻列表补充 ---------- */
.news-card {
  background: #fff;
  padding: 26px;
  cursor: pointer;
  position: relative;
}
.news-card .news-category {
  display: inline-block;
  font-size: 12px;
  padding: 3px 12px;
  border-radius: 20px;
  margin-bottom: 12px;
}
.news-card .news-category.company { background: rgba(0, 102, 255, 0.08); color: var(--primary); }
.news-card .news-category.product { background: #fef3c7; color: #92400e; }
.news-card .news-category.solution { background: #d1fae5; color: #065f46; }
.news-card h3 { font-size: 18px; margin-bottom: 10px; color: var(--dark); }
.news-card .news-summary { margin-bottom: 4px; }
.news-card .news-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(10, 23, 48, 0.07);
}
.news-card .news-tag {
  background: var(--light-gray);
  color: #64748b;
  font-size: 12px;
  padding: 3px 9px;
  border-radius: 6px;
  display: inline-block;
}
.news-card .news-date { color: #94a3b8; font-size: 12px; white-space: nowrap; }

/* ---------- 首页资讯预览补充 ---------- */
.news-preview-card .news-cover {
  width: 100%; height: 152px;
  overflow: hidden; border-radius: 12px;
  margin-bottom: 16px;
  background: #f1f5f9;
  cursor: zoom-in;
}
.news-preview-card .news-cover img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.news-preview-card:hover .news-cover img { transform: scale(1.05); }
.news-preview-card .np-summary {
  color: var(--gray);
  font-size: 13px;
  line-height: 1.72;
  -webkit-line-clamp: 3;
  margin-bottom: 2px;
}
.news-preview-card .np-date {
  color: #94a3b8;
  font-size: 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.news-preview-card .summary-toggle { font-size: 12.5px; }

/* ---------- 新闻详情补充 ---------- */
#news-detail .back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--primary);
  margin-bottom: 26px;
  font-size: 15px;
}
#news-detail .back-link:hover { color: var(--primary-dark); }
#news-detail .detail-header {
  margin-bottom: 26px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(10, 23, 48, 0.08);
}
#news-detail .detail-header h2 { font-size: 28px; margin-bottom: 14px; }
#news-detail .detail-header .detail-meta {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  color: #64748b;
  font-size: 14px;
}
#news-detail .detail-views, #news-detail .news-views { color: #94a3b8; font-size: 13px; }
#news-detail .detail-cover img { max-height: 560px; background: #f8fafc; }
#news-detail .detail-content { font-size: 15.5px; line-height: 1.95; color: #334155; }
#news-detail .detail-content h2 { font-size: 21px; margin: 30px 0 12px; }
#news-detail .detail-content h3 { font-size: 17px; margin: 22px 0 10px; }
#news-detail .detail-content strong { color: var(--dark); }
#news-detail .detail-footer {
  margin-top: 42px;
  padding-top: 20px;
  border-top: 1px solid rgba(10, 23, 48, 0.08);
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
#news-detail .detail-footer .news-tag {
  background: var(--light-gray);
  color: #64748b;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 6px;
}

/* ---------- 行业覆盖 ---------- */
.industry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.industry-item {
  background: #fff;
  border: 1px solid rgba(10, 23, 48, 0.08);
  border-radius: 16px;
  padding: 28px 24px;
  box-shadow: var(--shadow-tech);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.industry-item:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-tech-lg);
  border-color: rgba(0, 102, 255, 0.24);
}
.industry-item .ind-icon {
  width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(0, 102, 255, 0.1), rgba(34, 211, 238, 0.1));
  border: 1px solid rgba(0, 102, 255, 0.13);
  font-size: 22px;
  margin-bottom: 16px;
}
.industry-item h3 { font-size: 17px; margin-bottom: 8px; }
.industry-item p { color: #64748b; font-size: 13.5px; line-height: 1.75; }

/* ---------- 资质页补充 ---------- */
.qual-intro {
  color: #475569;
  font-size: 15px;
  line-height: 1.9;
  max-width: 900px;
  margin: 0 auto 38px;
  text-align: center;
}
.map-link {
  display: inline-block;
  margin-top: 6px;
  font-size: 13px;
  color: var(--primary);
}
.map-link:hover { text-decoration: underline; }

@media (max-width: 1024px) {
  .industry-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  /* .page-hero 的上下留白已由 :root 变量接管，无需再写 */
  .page-hero h1 { font-size: 27px; }
  .industry-grid { grid-template-columns: 1fr; }
  #news-detail .detail-header h2 { font-size: 22px; }
  .news-card { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .product-card, .case-card, .news-card, .qual-card { transition: none; }
  .btn, .back-to-top, .consult-float a { transition: none; }
  .news-panel.active { animation: none; }
}

/* ============ Hero 信任背书行 ============ */
.hero-note {
  margin: 26px 0 0;
  font-size: 13.5px;
  letter-spacing: 0.3px;
  color: rgba(226, 238, 255, 0.72);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;   /* 这行原先缺了，flex 默认靠左 → 首屏内容没全居中 */
  gap: 0 10px;
}
/* 文字左右各一条 22px 渐变细线。左侧原先只有 ::before，
   线宽 22px + gap 10px 会把文字整体挤偏 16px，这里补上镜像的 ::after 让文字真正居中。 */
.hero-note::before,
.hero-note::after {
  content: "";
  display: inline-block;
  width: 22px;
  height: 1px;
  flex: 0 0 auto;
}
.hero-note::before { background: linear-gradient(90deg, rgba(0, 170, 255, 0), #2fa8ff); }
.hero-note::after { background: linear-gradient(90deg, #2fa8ff, rgba(0, 170, 255, 0)); }

/* ============ 底部转化区双按钮 ============ */
.cta-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}
.cta-buttons .btn-primary {
  background: #ffffff;
  border-color: #ffffff;
  color: #0a1730;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22);
}
.cta-buttons .btn-primary:hover {
  background: #eaf3ff;
  border-color: #eaf3ff;
  color: #0a1730;
  transform: translateY(-2px);
}
.cta-buttons .btn-outline {
  border-color: rgba(255, 255, 255, 0.55);
  color: #ffffff;
}
.cta-buttons .btn-outline:hover {
  background: rgba(255, 255, 255, 0.14);
  border-color: #ffffff;
  color: #ffffff;
}

@media (max-width: 768px) {
  .hero-note { font-size: 12.5px; margin-top: 20px; }
  /* 窄屏换行时两侧细线容易落单，直接隐藏，保持文字居中干净 */
  .hero-note::before, .hero-note::after { display: none; }
  .cta-buttons { flex-direction: column; align-items: stretch; }
  .cta-buttons .btn { width: 100%; text-align: center; }
}