/* ==========================================================================
   希微智源 XIWEI Quantech — 官网样式
   主色：#1164EA（源自品牌 LOGO）
   ========================================================================== */

:root {
  --blue: #1164EA;
  --blue-deep: #0C4FC4;
  --blue-soft: #4A8DF5;
  --blue-200: #C6DAFB;
  --blue-100: #E4EEFE;
  --blue-50: #F3F7FE;
  --ink: #0A1830;
  --ink-2: #16264A;
  --gray: #5B6B85;
  --gray-light: #8A97AC;
  --line: #E4EAF4;
  --navy: #061431;
  --navy-2: #0A2150;
  --white: #FFFFFF;
  --radius: 16px;
  --radius-lg: 24px;
  --shadow-sm: 0 1px 2px rgba(10, 24, 48, .04), 0 6px 20px rgba(10, 24, 48, .05);
  --shadow-md: 0 18px 48px rgba(10, 24, 48, .10);
  --shadow-blue: 0 16px 40px rgba(17, 100, 234, .22);
  --max: 1200px;
  --header-h: 82px;
  --font: "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei", "Hiragino Sans GB", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

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

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

body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  line-height: 1.75;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

.container { max-width: var(--max); margin: 0 auto; padding: 0 24px; }

::selection { background: var(--blue); color: #fff; }

/* --------------------------------------------------------------------------
   通用组件
   -------------------------------------------------------------------------- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 30px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .02em;
  transition: all .3s cubic-bezier(.4, 0, .2, 1);
  white-space: nowrap;
}

.btn-primary {
  background: var(--blue);
  color: #fff;
  box-shadow: var(--shadow-blue);
}
.btn-primary:hover { background: var(--blue-deep); transform: translateY(-2px); }

.btn-ghost {
  border: 1px solid var(--line);
  color: var(--ink-2);
  background: rgba(255, 255, 255, .7);
}
.btn-ghost:hover { border-color: var(--blue); color: var(--blue); transform: translateY(-2px); }

.btn-white { background: #fff; color: var(--blue); }
.btn-white:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0, 0, 0, .18); }

.btn-outline-white { border: 1px solid rgba(255, 255, 255, .45); color: #fff; }
.btn-outline-white:hover { border-color: #fff; background: rgba(255, 255, 255, .1); transform: translateY(-2px); }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .22em;
  color: var(--blue);
  text-transform: uppercase;
  margin-bottom: 18px;
}
.eyebrow::before {
  content: "";
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: var(--blue);
}

.section-head { max-width: 720px; margin-bottom: 56px; }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head.center .eyebrow { justify-content: center; }

h1, h2, h3, h4 { line-height: 1.3; letter-spacing: .02em; font-weight: 700; }

.section-title {
  font-size: clamp(26px, 3.4vw, 40px);
  margin-bottom: 16px;
}
.section-desc { color: var(--gray); font-size: 16.5px; }

section { padding: 100px 0; }
.section-alt { background: var(--blue-50); }

/* --------------------------------------------------------------------------
   顶部导航
   -------------------------------------------------------------------------- */

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--header-h);
  z-index: 100;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid transparent;
  transition: all .35s ease;
}
.site-header.scrolled {
  border-bottom-color: var(--line);
  box-shadow: 0 6px 24px rgba(10, 24, 48, .05);
}

.header-inner {
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand { display: flex; align-items: center; }
.brand img { height: 88px; width: auto; }

.main-nav { display: flex; align-items: center; gap: 6px; }

.nav-link {
  position: relative;
  padding: 9px 15px;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-2);
  border-radius: 8px;
  transition: color .25s;
}
.nav-link::after {
  content: "";
  position: absolute;
  left: 15px;
  right: 15px;
  bottom: 3px;
  height: 2px;
  border-radius: 2px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .3s;
}
.nav-link:hover { color: var(--blue); }
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }
.nav-link.active { color: var(--blue); font-weight: 600; }

/* 2026-11-02 导航增至 7 项后：861~1000 区间容器偏窄，收紧链接间距与字号防折行
   （.nav-cta 保持原样不动） */
@media (min-width: 861px) and (max-width: 1000px) {
  .main-nav { gap: 2px; }
  .nav-link { padding: 9px 11px; font-size: 14px; white-space: nowrap; }
  .nav-link::after { left: 11px; right: 11px; }
}

.nav-cta {
  margin-left: 12px;
  padding: 10px 24px !important;
  border-radius: 999px !important;
  background: var(--blue);
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: 0 8px 20px rgba(17, 100, 234, .25);
  transition: all .3s;
}
.nav-cta::after { display: none; }
.nav-cta:hover { background: var(--blue-deep); transform: translateY(-1px); }

.nav-toggle { display: none; flex-direction: column; gap: 5px; padding: 10px; }
.nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: var(--ink);
  transition: all .3s;
}
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --------------------------------------------------------------------------
   顶部导航：悬停展开的二级下拉菜单
   菜单位置对齐到页头下沿（随 --header-h 自适应）
   -------------------------------------------------------------------------- */
.nav-item { position: relative; display: flex; align-items: center; }
.nav-caret {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 0 4px 6px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  /* 基准态：下箭头（箭头视觉中心落在原位置，翻转时不会跳动） */
  transform: translateY(0) rotate(45deg);
  opacity: .45;
  transition: transform .25s, opacity .25s;
}
.nav-item.has-menu:hover > .nav-link,
.nav-item.has-menu:focus-within > .nav-link { color: var(--blue); }
.nav-item.has-menu:hover > .nav-link::after,
.nav-item.has-menu:focus-within > .nav-link::after { transform: scaleX(1); }
/* 悬停/聚焦：箭头原地翻转 180° 变成上箭头（4.24px = 翻转后回到同一视觉位置） */
.nav-item.has-menu:hover .nav-caret,
.nav-item.has-menu:focus-within .nav-caret { opacity: 1; transform: translateY(4.24px) rotate(225deg); }

.nav-menu {
  position: absolute;
  top: calc(100% + (var(--header-h) - 100%) / 2 + 4px);
  left: 50%;
  min-width: 198px;
  display: flex;
  flex-direction: column;
  gap: 6px;                /* 子项之间的行距 */
  padding: 10px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 20px 46px rgba(10, 24, 48, .13), 0 2px 8px rgba(10, 24, 48, .04);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 10px);
  transition: opacity .24s ease, transform .24s ease;
  z-index: 130;
}
/* 鼠标从导航项移向菜单途中经过的空隙也算作菜单范围，避免菜单闪退。
   高度需覆盖 top 偏移（约 (header-h - 行高)/2 + 4px），故取 40px。 */
.nav-menu::before { content: ""; position: absolute; left: -26px; right: -26px; top: -40px; height: 40px; }
.nav-item.has-menu:hover .nav-menu,
.nav-item.has-menu:focus-within .nav-menu,
.nav-item.has-menu.is-open .nav-menu { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
/* is-open 由 JS 维持（含 260ms 关闭延迟），保证移动途中不闪退 */
.nav-item.has-menu.is-open > .nav-link { color: var(--blue); }
.nav-item.has-menu.is-open > .nav-link::after { transform: scaleX(1); }
.nav-item.has-menu.is-open .nav-caret { opacity: 1; transform: translateY(4.24px) rotate(225deg); }
.nav-menu a {
  display: block;
  padding: 10px 15px;
  border-radius: 9px;
  font-size: 14.5px;
  line-height: 1.45;
  text-align: center;      /* 各项文字在方块内左右居中 */
  color: var(--ink-2);
  white-space: nowrap;
  transition: background .2s, color .2s;
}
.nav-menu a:hover,
.nav-menu a:focus-visible { background: var(--blue-50); color: var(--blue); }

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.hero {
  position: relative;
  display: flex;
  align-items: center;      /* 内容在画面内垂直居中 */
  /* 2026-11-10：首屏铺满一整屏——高度取视口高，导航 fixed 悬浮其上，
     内容在「导航下沿 → 视口底部」这段空间里垂直居中，首屏只看到标题，不露出下一板块。
     100svh 规避移动端地址栏收放导致的跳动，旧浏览器回退 100vh。 */
  min-height: 100vh;
  min-height: 100svh;
  padding: var(--header-h) 0 40px;
  overflow: hidden;
  /* 背景（2026-11-10 用户要求恢复最初版本）：白底 + 两处蓝色光晕 + 细网格叠加（.hero-grid-bg），
     不再使用机房/机柜实拍照片，也不再需要白幕渐变 */
  background:
    radial-gradient(900px 520px at 82% 8%, rgba(17, 100, 234, .10), transparent 62%),
    radial-gradient(700px 460px at 4% 92%, rgba(17, 100, 234, .07), transparent 60%),
    #fff;
}


.hero > .container { width: 100%; } /* flex 布局下保持容器满宽居中 */

/* 宽版特点与标题 accent 同色（2026-11-02 用户要求统一为品牌蓝 --blue，不再加深） */
@media (min-width: 861px) {
  .hero .hero-badge,
  .hero .hero-features { color: var(--blue); }
}

.hero-grid-bg {
  --grid-o: .55;
  position: absolute;
  inset: 0;
  /* 原始首页背景：细网格，中心清晰、四周向边缘柔和淡出
     （2026-11-10 恢复：宽窄版一致显示；遮罩中心随居中的标题移到正中） */
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 72px 72px;
  opacity: .55;
  -webkit-mask-image: radial-gradient(75% 70% at 50% 46%, #000 30%, transparent 100%);
  mask-image: radial-gradient(75% 70% at 50% 46%, #000 30%, transparent 100%);
  pointer-events: none;
}

/* 2026-11-10：宽窄版统一使用同一套（白底 + 蓝晕 + 细网格）背景，原先窄版专用的覆盖块已删 */

.hero-inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;   /* 已移除右侧机柜示意图，标题区独占整行 */
  align-items: center;
}

/* 2026-11-10：撤掉机柜背景后标题模块整体居中（标题 + 六项特点同一中线） */
.hero-copy { text-align: center; }

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 17px;
  border-radius: 999px;
  background: rgba(17, 100, 234, .07);
  border: 1px solid rgba(17, 100, 234, .18);
  color: var(--blue);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .06em;
  margin-bottom: 26px;
}
.hero-badge .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 0 4px rgba(17, 100, 234, .16);
  animation: pulse 2.2s infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(17, 100, 234, .18); }
  50% { box-shadow: 0 0 0 7px rgba(17, 100, 234, .06); }
}

.hero h1 {
  font-size: clamp(38px, 5.4vw, 70px);
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1.28;
  margin-bottom: 0; /* 标题下方按钮已移除，不留空档 */
}
/* 宽版（>860）标题固定字号
   （h1 带内联 font-size，需 !important；窄版仍用下方 --hero-title-size 自适应） */
@media (min-width: 861px) {
  .hero h1 { font-size: 54px !important; }
}
.hero h1 .accent { color: var(--blue); }

/* 标题下的六大特点：品牌蓝小字，中间圆点分隔。
   字重在且只在这里定义（2026-11-09 统一：原先 6 个 li 各自带内联 font-weight:700，
   与本规则的 600 冲突，且可视化编辑器/预览回写容易只改到某一项，造成粗细不均）。
   勿再在 li 上写内联 font-weight。 */
.hero-features {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;   /* 与居中标题同一中线 */
  list-style: none;
  margin-top: 24px;
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--blue);
}
.hero-features li { display: inline-flex; align-items: center; white-space: nowrap; } /* 折行以整项为单位，避免词内被切断 */
.hero-features li + li::before {
  content: "";
  flex: none;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .42;
  margin: 0 11px;
}

/* 2026-11-10：原「六项标签」替换为三行品牌说明（蓝色、加粗），每句独占一行、与标题同一中线。
   字号按「标题字号 × ≈0.39」反推随视口缩放（宽版 18/54=0.33，窄版 100vw/36 与标题 100vw/14 恒成 14:36），
   320 时兜底 10px；加粗比常规略宽，已留足余量，320~1920 均为三行不折。
   旧的 .hero-features 规则保留未删，便于回滚。 */
.hero-lines {
  margin-top: 16px;
  font-size: clamp(10px, calc(100vw / 36), 18px);
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.95;
  color: var(--blue);
}
.hero-lines p { margin: 0; }

/* 宽版（>860）：徽标与六项特点字号
   （.hero-badge 带内联 font-size:14px，必须 !important 覆盖） */
@media (min-width: 861px) {
  .hero-badge { gap: 10px; padding: 8px 17px; font-size: 14px !important; margin-bottom: 22px; }
  .hero-features { margin-top: 24px; font-size: 15px; letter-spacing: .05em; }
  .hero-features li + li::before { width: 4px; height: 4px; margin: 0 10px; }
}
/* 窄屏：标题字号自适应，让「以光重构计算边界 / 以量子开启算力未来」各自占满一行
   （标题带内联 font-size，需 !important 覆盖；最长行 9 字，上限与宽版同为 54px，避免 760/761 断点跳变）
   上方徽标按同一比例（≈0.42×标题）跟着缩，并收紧内边距与字距，保持与标题协调且不折行 */
@media (max-width: 760px) {
  .hero { --hero-title-size: min(54px, calc(100vw / 14)); }
  .hero h1 { font-size: var(--hero-title-size) !important; }
  /* 2026-11-10：窄版三行/按钮与标题的比例对齐宽版（三行 18/54=1/3、按钮 61/54≈1.13 高），
     全部从 --hero-title-size 推导；三行系数放宽到 ×0.38、下限 11px（用户要求窄版三行放大一点），
     上限仍 18px 不越过宽版；max() 兜底保证极窄屏（320~360）可读 */
  .hero-lines { font-size: min(18px, max(10.5px, calc(var(--hero-title-size) * .38))); }
  /* ≤330 极窄屏：24 字长句在 10.5px 下超容器约 8px，回退 10px 保证三句单行 */
  @media (max-width: 330px) {
    .hero-lines { font-size: 10px; }
  }
  .hero-actions { margin-top: max(18px, calc(var(--hero-title-size) * 28 / 54)); }
  .hero-actions .btn.btn-primary {
    padding: max(10px, calc(var(--hero-title-size) * 16 / 54)) max(16px, calc(var(--hero-title-size) * 38 / 54));
    font-size: max(12px, calc(var(--hero-title-size) * 16.5 / 54));
  }
  .hero-badge {
    font-size: clamp(10.4px, calc(var(--hero-title-size) * .42), 14px) !important;
    padding: 7px 14px;
    letter-spacing: .04em;
    margin-bottom: 28px;
  }
}
/* 窄版：六项特点拆成两行、每行三项，两行各自左对齐（不再按列与第一行对齐）；
   行内仍以圆点分隔。靠 ul 内的 .hero-features-break 占位项（flex-basis:100%）强制换行。
   断点取 720：一行 6 项需约 591px 宽，容器须 ≥ 639px，留到 720 才用单行以避开临界折行 */
.hero-features li.hero-features-break { display: none; } /* 宽版一行排列时占位项不参与（需高于基础 li 规则的特异性） */
.hero-features li.hero-features-break::before { content: none; } /* 双保险：占位项在任何情况下都不画出圆点 */
@media (max-width: 720px) {
  .hero-features {
    display: flex;
    flex-wrap: wrap;
    column-gap: 12px;
    row-gap: 5px; /* 占位行高度为 0，上下各 5px ≈ 原来 10px 的行距 */
    margin-top: 26px;
    font-size: clamp(11.8px, 3.6vw, 15px);
  }
  .hero-features li.hero-features-break { display: block; flex-basis: 100%; height: 0; margin: 0; }
  .hero-features li + li::before { display: none; }
  /* 每行第 2、3 项前保留圆点；换行占位项占了第 4 个子元素位，故选择器为 2/3/6/7 */
  .hero-features li:nth-child(2)::before,
  .hero-features li:nth-child(3)::before,
  .hero-features li:nth-child(6)::before,
  .hero-features li:nth-child(7)::before {
    display: inline-block;
    width: 3px;
    height: 3px;
    margin: 0 9px 0 0;
  }
}

/* 2026-11-10：hero 现为居中版式（标题 + 三行说明 + 关于我们按钮），按钮组整体居中 */
.hero-actions { display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; margin-top: 28px; }
/* Hero 按钮：相较站内通用按钮放大一档 */
.hero-actions .btn { padding: 16px 38px; font-size: 16.5px; }

/* --------------------------------------------------------------------------
   首屏浮现动效：打开首页时 徽标 → 标题 → 特点 依次淡入上浮
   纯 CSS 关键帧（不依赖 JS）；static 模式与「减少动态效果」偏好下自动关闭
   -------------------------------------------------------------------------- */
@keyframes heroRise {
  from { opacity: 0; transform: translateY(26px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes heroEmerge {
  from { opacity: 0; transform: translateY(34px) scale(.94); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes heroGridIn {
  from { opacity: 0; }
  to   { opacity: var(--grid-o, .55); }
}
.hero-grid-bg { animation: heroGridIn 1.05s ease-out .04s both; }
.hero-badge { animation: heroRise .68s cubic-bezier(.2, .7, .2, 1) .06s both; }
.hero h1 { animation: heroRise .9s cubic-bezier(.2, .7, .2, 1) .18s both; }
.hero-features { animation: heroRise .68s cubic-bezier(.2, .7, .2, 1) .30s both; }
.hero-lines { animation: heroRise .68s cubic-bezier(.2, .7, .2, 1) .30s both; }
.hero-actions { animation: heroRise .68s cubic-bezier(.2, .7, .2, 1) .36s both; }
.hero-visual { animation: heroEmerge 1.05s cubic-bezier(.2, .7, .2, 1) .28s both; }

/* --------------------------------------------------------------------------
   子页面首屏浮现：标题 → 标题下方注释 → 下方方块预览 依次淡入上浮
   与首页共用关键帧，纯 CSS（不依赖 JS）；
   static 模式、打印、减少动态效果偏好下自动关闭
   -------------------------------------------------------------------------- */
.page-hero .eyebrow,
.article-hero .back-link,
.article-hero .news-meta { animation: heroRise .6s cubic-bezier(.2, .7, .2, 1) .04s both; }
.page-hero h1,
.article-hero h1 { animation: heroRise .86s cubic-bezier(.2, .7, .2, 1) .14s both; }
.page-hero .lead,
.article-hero .lead { animation: heroRise .76s cubic-bezier(.2, .7, .2, 1) .26s both; }
/* 紧接标题区的第一块内容：方块预览（技术卡 / 产品卡 / 场景卡 / 联系卡 / 新闻列表 / 正文） */
.page-hero + section > .container > *,
.article-hero + section > .container > * { animation: heroRise .95s cubic-bezier(.2, .7, .2, 1) .38s both; }

/* 右侧整机示意：抠出的机柜+倒影居中，整卡可点击进入产品中心 */
.hero-visual {
  position: relative;
  align-self: center;
  width: fit-content;
  margin: 0 auto;
}
.rack-link {
  position: relative;
  display: block;
  outline: none;
  text-decoration: none;
}
.rack-card {
  margin: 0;
  text-align: center;
  filter: drop-shadow(0 22px 30px rgba(10, 24, 48, .16));
  transition: filter .35s ease, transform .35s ease;
}
.rack-card img {
  height: 400px;           /* 放大机柜，填补右侧列留白（图 + 名牌共约 475px） */
  width: auto;
  display: block;
  margin: 0 auto;
  transition: transform .35s ease;
}
.rack-name { margin-top: 12px; display: grid; gap: 8px; justify-items: center; }
.rack-tag {
  display: inline-grid;
  place-items: center;
  font-size: 16.5px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--blue);
  background: var(--blue-50);
  border: 1px solid var(--blue-200);
  border-radius: 999px;
  padding: 7px 22px;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
/* 胶囊内两段文字叠放在同一格：默认显示产品名，悬停切换为"进入产品中心"（宽度取较宽者，不跳动） */
.rack-tag > span {
  grid-area: 1 / 1;
  white-space: nowrap;
  transition: opacity .26s ease;
}
.rack-tag .tag-go {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  opacity: 0;
}
.rack-tag .tag-go svg { transition: transform .3s ease; }
.rack-sub { font-size: 14.5px; font-weight: 600; color: var(--ink-2); letter-spacing: .1em; }

.rack-link:hover .rack-card,
.rack-link:focus-visible .rack-card { filter: drop-shadow(0 30px 40px rgba(10, 24, 48, .24)); }
.rack-link:hover .rack-card img,
.rack-link:focus-visible .rack-card img { transform: translateY(-6px); }
.rack-link:hover .rack-tag,
.rack-link:focus-visible .rack-tag { background: var(--blue); border-color: var(--blue); color: #fff; }
.rack-link:hover .rack-tag .tag-name,
.rack-link:focus-visible .rack-tag .tag-name { opacity: 0; }
.rack-link:hover .rack-tag .tag-go,
.rack-link:focus-visible .rack-tag .tag-go { opacity: 1; }
.rack-link:hover .rack-tag .tag-go svg { transform: translateX(3px); }
.rack-link:focus-visible .rack-tag { box-shadow: 0 0 0 3px rgba(17, 100, 234, .3); }

/* --------------------------------------------------------------------------
   关于我们：左侧标题 / 右侧文字描述
   -------------------------------------------------------------------------- */

.about-grid {
  display: grid;
  grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr);
  gap: 76px;
  align-items: center;
}

.about-title .section-head { max-width: none; margin-bottom: 0; }
.about-title .section-title { margin-bottom: 0; }

.about-body { display: grid; gap: 18px; justify-items: start; }
.about-body p {
  color: var(--gray);
  font-size: 16.5px;
  line-height: 1.95;
  margin: 0;
}
.about-body .btn { margin-top: 10px; }

/* 公司简介：紧接页面标题，压缩 hero 与正文之间的留白 */
.about-profile { padding-top: 28px; }

.about-points { margin: 26px 0 34px; display: grid; gap: 14px; }
.about-points li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 15.5px;
  color: var(--ink-2);
}
.about-points .check {
  flex: none;
  width: 22px; height: 22px;
  margin-top: 3px;
  border-radius: 50%;
  background: var(--blue-50);
  border: 1px solid var(--blue-200);
  color: var(--blue);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
}

/* --------------------------------------------------------------------------
   核心技术
   -------------------------------------------------------------------------- */

.tech-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.tech-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 34px 28px;
  transition: all .35s cubic-bezier(.4, 0, .2, 1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.tech-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--blue), var(--blue-soft));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s;
}
.tech-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--blue-200); }
.tech-card:hover::before { transform: scaleX(1); }

.tech-icon {
  width: 54px; height: 54px;
  border-radius: 14px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  display: grid;
  place-items: center;
  color: var(--blue);
  margin-bottom: 22px;
}
.tech-icon svg { width: 26px; height: 26px; }

.tech-card h3 { font-size: 18.5px; margin-bottom: 10px; }
.tech-card p { font-size: 14.5px; color: var(--gray); }
.tech-more {
  display: inline-block;
  align-self: flex-start;
  margin-top: auto;
  padding-top: 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--blue);
  letter-spacing: .02em;
}
.tech-more:hover { text-decoration: underline; }

/* 内容详情区块（技术与产品页通用） */
.tech-detail {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 60px;
  align-items: center;
}
.tech-detail.flip .tech-copy { order: 2; }
.tech-detail.flip .spec-card { order: 1; }
.tech-detail .eyebrow { margin-bottom: 18px; }
.tech-detail h2 { font-size: clamp(26px, 3.2vw, 38px); line-height: 1.3; margin-bottom: 18px; }
.tech-detail .detail-p { color: var(--gray); font-size: 16px; line-height: 1.9; margin-bottom: 14px; }
.tech-detail .about-points { margin-top: 22px; }

/* --------------------------------------------------------------------------
   核心技术页：技术名称与文字详情左右分栏，依次左右交替
   -------------------------------------------------------------------------- */

.tech-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 72px;
  align-items: center;
}
/* 技术名称栏：左侧渐变竖条 + 大字标题 */
.tech-row .tech-name {
  position: relative;
  min-width: 0;
  padding-left: 20px;
}
.tech-row .tech-name::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--blue), rgba(17, 100, 234, .16));
}
.tech-row .tech-name .eyebrow { margin-bottom: 16px; }
.tech-row .tech-name .section-title { font-size: clamp(24px, 2.6vw, 34px); margin-bottom: 0; }
/* 交替：偶数项名称在右、详情在左 */
.tech-row.flip { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.tech-row.flip .tech-name { order: 2; }
.tech-row .detail-p { color: var(--gray); font-size: 16px; line-height: 1.9; margin-bottom: 14px; }

/* 01 压缩态光场制备：示意图为超宽横幅 —— 1100px 以下单列堆叠（标题→图→正文） */
.tech-row.tech-stack { display: block; }
.tech-row.tech-stack .tech-name { margin-bottom: 16px; }
.tech-row.tech-stack .tech-name .eyebrow { font-size: 11px; letter-spacing: .12em; margin-bottom: 12px; }
.tech-row.tech-stack .tech-name .section-title { font-size: clamp(21px, 2.1vw, 27px); }
.tech-row.tech-stack .tech-figure { margin: 0 0 20px; }
.tech-row.tech-stack .tech-figure img { width: 100%; height: auto; }
/* 宽屏：上行「左标题 · 右示意图」，下行通栏说明文字（单栏不分列） */
@media (min-width: 1201px) {
  .tech-row.tech-stack {
    display: grid;
    grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
    grid-template-areas:
      "name figure"
      "copy copy";
    gap: 32px 48px;
    align-items: center;
  }
  .tech-row.tech-stack .tech-name { grid-area: name; margin-bottom: 0; }
  .tech-row.tech-stack .tech-figure { grid-area: figure; margin: 0; }
  .tech-row.tech-stack .tech-copy { grid-area: copy; }
}

/* --------------------------------------------------------------------------
   产品中心：两级标题拉开层级
   ① 板块章节头（整机 / 硬件 / 集成 / 算法云平台）：居中、超大字号、渐变装饰条
   ② 详情小标题：左竖条 + 小字号，明显从属于板块
   -------------------------------------------------------------------------- */

.section-head.pillar-head { max-width: 900px; margin: 0 auto 62px; text-align: center; }
.pillar-head .eyebrow {
  justify-content: center;
  font-size: 12px;
  letter-spacing: .26em;
  margin-bottom: 20px;
}
/* 居中章节头的 eyebrow 两侧对称短线 */
.pillar-head .eyebrow::after {
  content: "";
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: var(--blue);
}
.pillar-head .section-title {
  position: relative;
  font-size: clamp(34px, 4.4vw, 54px);
  font-weight: 800;
  letter-spacing: .08em;
  margin-bottom: 0;
  padding-bottom: 24px;
}
/* 标题下方的品牌色渐变短条 */
.pillar-head .section-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 76px;
  height: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, #0B4FC4, #1164EA 45%, #5BA8FF);
}
.pillar-head .pillar-sub {
  margin: 20px 0 18px;
  font-size: 16px;
  font-weight: 700;
  color: var(--blue);
  letter-spacing: .14em;
}
.pillar-head .section-desc { max-width: 760px; margin: 0 auto; }

/* 详情小标题：左侧渐变竖条 */
.section-head.detail-head {
  position: relative;
  padding-left: 18px;
  margin-bottom: 22px;
}
.detail-head::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(180deg, var(--blue), rgba(17, 100, 234, .16));
}
.detail-head .eyebrow {
  margin-bottom: 10px;
  font-size: 11.5px;
  letter-spacing: .18em;
}
.detail-head .eyebrow::before { display: none; }
.detail-head .section-title { font-size: clamp(21px, 2.4vw, 28px); margin-bottom: 0; }

/* 整机产品图（products.html 首个产品：灵枢 XW-QC100 系列） */
.product-figure { margin: 0 0 22px; }
.product-figure img {
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto;
  filter: drop-shadow(0 18px 26px rgba(10, 24, 48, .14));
}
.spec-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 32px 34px;
}
.spec-card h3 { font-size: 15px; letter-spacing: .12em; color: var(--blue); margin-bottom: 14px; }
.spec-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 24px;
  padding: 13px 0;
  border-bottom: 1px dashed var(--line);
  font-size: 14.5px;
}
.spec-row:last-child { border-bottom: none; padding-bottom: 2px; }
.spec-row dt { color: var(--gray); white-space: nowrap; }
.spec-row dd { color: var(--ink); font-weight: 600; text-align: right; }

@media (max-width: 860px) {
  .tech-detail { grid-template-columns: 1fr; gap: 36px; }
  .tech-detail.flip .tech-copy { order: 1; }
  .tech-detail.flip .spec-card { order: 2; }
  .spec-card { padding: 26px 24px; }
}

.tech-index {
  position: absolute;
  right: 22px;
  top: 22px;
  font-size: 13px;
  font-weight: 700;
  color: var(--blue-200);
  letter-spacing: .08em;
}

/* 支柱索引条（products.html） */
.pillar-strip { padding: 0 0 100px; }
.pillar-strip .tech-card p { line-height: 1.75; }

/* 同一支柱板块内的多个技术小节 */
.tech-detail + .tech-detail { margin-top: 92px; }
.tech-detail[id], section[id] { scroll-margin-top: calc(var(--header-h) + 24px); }
/* 内容锚点（挂在 section 内部的 .container 上）：滚动时让内容标题直接贴紧固定导航，
   section 自带的 100px 上内边距被滚过，不再表现为顶部留白 */
.container[id] { scroll-margin-top: calc(var(--header-h) + 20px); }
/* 在线留言锚点（#message 挂在 .contact-layout 上）：滚到「在线留言」卡片顶部，
   不让固定导航遮住 Message · 在线留言 标题 */
.contact-layout[id] { scroll-margin-top: calc(var(--header-h) + 20px); }
.message-band[id] { scroll-margin-top: calc(var(--header-h) + 20px); }
/* 兜底：页面内任何被 # 指向的元素都不会被固定导航压住（如 #contactForm 这类深层锚点） */
:where(form, article, aside, figure)[id] { scroll-margin-top: calc(var(--header-h) + 20px); }

/* --------------------------------------------------------------------------
   产品（深色区）
   -------------------------------------------------------------------------- */

.section-dark {
  position: relative;
  background:
    radial-gradient(760px 420px at 88% 0%, rgba(74, 141, 245, .22), transparent 60%),
    radial-gradient(620px 420px at 6% 100%, rgba(17, 100, 234, .20), transparent 60%),
    var(--navy);
  color: #fff;
  overflow: hidden;
}
.section-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: radial-gradient(80% 70% at 50% 30%, #000 20%, transparent 100%);
  mask-image: radial-gradient(80% 70% at 50% 30%, #000 20%, transparent 100%);
  pointer-events: none;
}
.section-dark .section-title { color: #fff; }
.section-dark .section-desc { color: rgba(255, 255, 255, .68); }
.section-dark .eyebrow { color: var(--blue-soft); }
.section-dark .eyebrow::before { background: var(--blue-soft); }

.product-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.product-card {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--radius);
  padding: 30px;
  backdrop-filter: blur(6px);
  transition: all .35s;
  display: flex;
  flex-direction: column;
}
.product-card:hover {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(74, 141, 245, .55);
  transform: translateY(-6px);
}

.product-tag {
  align-self: flex-start;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .14em;
  color: var(--blue-soft);
  border: 1px solid rgba(74, 141, 245, .4);
  border-radius: 999px;
  padding: 4px 12px;
  margin-bottom: 20px;
}

.product-card h3 { font-size: 20px; color: #fff; margin-bottom: 10px; }
.product-card > p { font-size: 14.5px; color: rgba(255, 255, 255, .66); margin-bottom: 20px; }

.product-specs { display: grid; gap: 10px; margin-bottom: 26px; }
.product-specs li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, .78);
  border-bottom: 1px dashed rgba(255, 255, 255, .14);
  padding-bottom: 9px;
}
.product-specs li span:last-child { color: #fff; font-weight: 600; }
.product-specs li span:first-child { flex-shrink: 0; } /* 指标标签不因长值折行 */

.product-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--blue-soft);
  font-size: 14.5px;
  font-weight: 600;
  transition: gap .3s;
}
.product-link:hover { gap: 13px; }

/* 宽版（四列）产品卡：标签 / 标题 / 描述 / 指标 / 链接共享行网格，逐行平行对齐 */
@media (min-width: 1081px) {
  .product-grid {
    grid-template-rows: auto auto auto auto auto;
    row-gap: 0;
  }
  .product-card {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 5;
    align-content: start;
  }
  .product-card h3 { min-height: 2.6em; }              /* 标题至少两行高，避免轨道被单行卡压缩 */
  .product-card > p { min-height: 5.25em; }            /* 描述至少三行高 */
  .product-specs li { min-height: calc(3.5em + 9px); } /* 指标行统一两行高，逐行对齐 */
  .product-tag { align-self: start; }
  .product-link { align-self: end; }
}
/* 不支持 subgrid 的浏览器：退化为等高段落，排版仍整齐 */
@supports not (grid-template-rows: subgrid) {
  @media (min-width: 1081px) {
    .product-card { display: flex; flex-direction: column; }
    .product-link { margin-top: auto; }
  }
}

/* --------------------------------------------------------------------------
   应用场景
   -------------------------------------------------------------------------- */

.scene-layout {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 40px;
  align-items: start;
}

.scene-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.scene-tab {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  padding: 16px 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #fff;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-2);
  transition: all .3s;
  white-space: nowrap;
  min-width: 0;
}
.scene-tab .tab-ico {
  width: 33px; height: 33px;
  border-radius: 9px;
  background: var(--blue-50);
  color: var(--blue);
  display: grid;
  place-items: center;
  flex: none;
}
.scene-tab .tab-ico svg { width: 17px; height: 17px; }
.scene-tab:hover { border-color: var(--blue-200); transform: translateY(-2px); }
.scene-tab.active {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  box-shadow: var(--shadow-blue);
}
.scene-tab.active .tab-ico { background: rgba(255, 255, 255, .16); color: #fff; }

.scene-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 44px;
  box-shadow: var(--shadow-sm);
  /* 高度下限只作兜底：实际高度由 main.js 的 equalizePanelHeight() 按最高的那档文案统一，
     切换场景时面板高度不变。取值贴近各档文案的自然高度，避免面板比内容高出太多。 */
  min-height: 340px;
  /* 内容整体垂直居中：内容比面板矮时，上下留白相等（此前上贴顶、下留一大块） */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.scene-panel h3 { font-size: 22px; line-height: 1.5; margin-bottom: 16px; }
/* 说明文字：与下方小分栏之间留出呼吸感 */
.scene-panel-item p {
  color: var(--gray);
  font-size: 15px;
  line-height: 1.85;
  margin-bottom: 30px;
}

.scene-cases { display: grid; gap: 12px; }
.scene-cases li {
  display: flex;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 12px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  font-size: 14.5px;
  color: var(--ink-2);
}
.scene-cases li b {
  color: var(--blue);
  flex: none;
  /* 标签列统一宽度（取最长标签 6 字）：各场景行内说明文字首字对齐，
     与产品中心「规格指标」行的对齐方式一致 */
  min-width: 6em;
}

.scene-num {
  font-size: 13px;
  font-weight: 700;
  color: var(--blue-200);
  letter-spacing: .1em;
  margin-bottom: 12px;
}

/* 场景面板：推荐方案（与解决方案页「推荐方案」参数对齐） */
.scene-reco {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /* 与 .scene-cases li 相同的列宽体系：18px 内边距 + 14px 间距 */
  gap: 14px;
  margin-top: 20px;
  padding: 12px 18px;
  border-radius: 12px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  font-size: 14.5px;
  color: var(--ink-2);
}
/* 标签列固定宽度（87px = 6em @14.5px，与 .scene-cases li b 同宽）：
   「推荐方案」后的方案名与上方各行说明文字首字对齐 */
.scene-reco span { font-size: 13px; color: var(--gray); letter-spacing: .04em; flex: none; min-width: 87px; }
.scene-reco b { font-weight: 600; color: var(--blue-deep); }

/* 场景面板底部「进入详情 →」 */
.scene-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--blue);
  letter-spacing: .02em;
}
.scene-more .arw { transition: transform .3s ease; }
.scene-more:hover { color: var(--blue-deep); }
.scene-more:hover .arw { transform: translateX(5px); }

/* 场景窄版手风琴标题行（≤860 显示；宽版仅左侧书签呈现场景名与图例） */
.scene-head { display: none; }


/* ≤860：解决方案改为手风琴 —— 书签条隐藏，各场景叠成独立卡片，
   点标题（图标+场景名）展开该场景内容（展开态由 main.js 加 .is-open） */
@media (max-width: 860px) {
  .scene-tabs { display: none; }
  .scene-layout { grid-template-columns: 1fr; gap: 14px; }
  .scene-panel {
    min-height: 0 !important;  /* 清掉回写的内联高度；窄版不需要等高 */
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: grid;
    gap: 12px;
  }
  .scene-panel-item,
  .scene-panel-item[style] {
    display: block !important;  /* 宽版 JS 的 display 切换在窄版不适用 */
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
  }
  .scene-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .scene-head .tab-ico { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; }
  .scene-head .tab-ico svg { width: 18px; height: 18px; display: block; }
  .scene-head-txt { font-size: 15.5px; font-weight: 600; color: var(--ink-2); }
  .scene-head::after {
    content: "";
    margin-left: auto;
    margin-right: 5px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--gray);
    border-bottom: 2px solid var(--gray);
    transform: rotate(45deg);
    transition: transform .22s ease;
  }
  .scene-panel-item.is-open .scene-head { border-bottom: 1px solid var(--line); }
  .scene-panel-item.is-open .scene-head::after { transform: rotate(-135deg); }
  .scene-panel-item.is-open .scene-head .tab-ico { background: var(--blue); color: #fff; }
  /* 收起时只留标题行，展开后显示完整内容 */
  .scene-col-a, .scene-col-b { display: none; }
  .scene-panel-item.is-open .scene-col-a,
  .scene-panel-item.is-open .scene-col-b { display: block; }
  .scene-panel-item .scene-col-a { padding: 20px 18px 0; }
  .scene-panel-item .scene-col-b { padding: 0 18px 20px; }
  .scene-panel h3 { font-size: 17.5px; margin-bottom: 10px; }
  .scene-num { margin-bottom: 6px; }
  .scene-panel-item p { margin-bottom: 14px; font-size: 14.5px; line-height: 1.8; }
  .scene-cases { gap: 8px; }
  .scene-cases li { padding: 10px 14px; font-size: 14px; }
  .scene-cases li b { min-width: 5.5em; }
}

/* --------------------------------------------------------------------------
   新闻
   -------------------------------------------------------------------------- */

.news-grid {
  display: grid;
  /* auto-fit：卡片数量变化时自动占满整行（现为 2 条，即以两栏铺满；超出则继续分栏） */
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 22px;
}

.news-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px;
  transition: all .35s;
}
.news-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--blue-200); }

.news-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: var(--gray-light);
  margin-bottom: 16px;
}
.news-tag {
  font-size: 12px;
  font-weight: 600;
  color: var(--blue);
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  padding: 3px 11px;
  border-radius: 999px;
}
.news-card h3 { font-size: 17.5px; line-height: 1.55; margin-bottom: 14px; }
.news-card p { font-size: 14px; color: var(--gray); margin-bottom: 22px; }
.news-more {
  margin-top: auto;
  font-size: 14px;
  font-weight: 600;
  color: var(--blue);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: gap .3s;
}
.news-more:hover { gap: 12px; }

/* --------------------------------------------------------------------------
   新闻中心：三大栏目（左栏目名 / 右新闻列表）
   -------------------------------------------------------------------------- */

.news-cat { padding: 88px 0; }

.cat-row {
  display: grid;
  grid-template-columns: 296px minmax(0, 1fr);
  gap: 76px;
  align-items: start;
}

.cat-kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.cat-index {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .08em;
  color: #fff;
  background: var(--blue);
  border-radius: 6px;
  padding: 2px 9px;
}
.cat-kicker .eyebrow { margin-bottom: 0; font-size: 11.5px; letter-spacing: .2em; }

.cat-title {
  font-size: clamp(26px, 2.7vw, 36px);
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.25;
  margin-bottom: 18px;
}
.cat-desc {
  font-size: 14.5px;
  color: var(--gray);
  line-height: 1.9;
  margin: 20px 0 26px;
}
.cat-more { gap: 8px; }
.cat-more svg { transition: transform .3s; }
.cat-more:hover svg { transform: translateX(3px); }

/* 右侧新闻列表：纵向排列，细线分隔；每条整体可点击进入详情页 */
.cat-list { display: grid; }
.news-item {
  display: block;
  padding: 26px 0;
  border-top: 1px solid var(--line);
  transition: transform .3s ease;
}
.news-item:first-child { border-top: 0; padding-top: 0; }
.news-item:last-child { padding-bottom: 0; }
.news-item h3 { transition: color .3s ease; }
.news-item:hover { transform: translateX(8px); }
.news-item:hover h3 { color: var(--blue); }
.news-item:hover .news-date { color: var(--blue); }
.news-date {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--gray-light);
  margin-bottom: 9px;
  transition: color .3s ease;
}
.news-item h3 { font-size: 19px; line-height: 1.55; margin-bottom: 10px; }
.news-item p { font-size: 14.5px; color: var(--gray); line-height: 1.85; margin: 0; }

/* 栏目归档页（news-company.html / news-product.html / news-honor.html） */
.cat-archive { padding: 52px 0 96px; }
.cat-list-full { max-width: 900px; }
.news-note {
  max-width: 900px;
  margin-top: 34px;
  padding: 14px 18px;
  border-radius: 12px;
  background: var(--blue-50);
  border: 1px dashed var(--blue-100);
  font-size: 13px;
  color: var(--gray);
}

.page-hero .back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--gray);
  margin-bottom: 22px;
  transition: color .25s;
}
.page-hero .back-link:hover { color: var(--blue); }

@media (max-width: 860px) {
  .news-cat { padding: 62px 0; }
  .cat-row { grid-template-columns: 1fr; gap: 34px; }
  .cat-desc { margin: 16px 0 22px; }
  .news-item h3 { font-size: 17.5px; }
  .cat-archive { padding: 38px 0 76px; }
  .cat-list-full, .news-note { max-width: none; }
}

/* 右侧垂直居中浮动返回按钮：栏目页与新闻详情页 */
.side-back {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 60;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 15px 20px 15px 17px;
  border-radius: 999px 0 0 999px;
  border: 1px solid var(--line);
  border-right: 0;
  background: rgba(255, 255, 255, .95);
  box-shadow: -12px 12px 34px rgba(10, 24, 48, .10);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--ink-2);
  white-space: nowrap;
  transition: color .28s, background .28s, box-shadow .28s, transform .28s;
}
.side-back svg { width: 15px; height: 15px; flex: none; transition: transform .28s; }
.side-back:hover {
  color: var(--blue);
  background: #fff;
  box-shadow: -14px 14px 40px rgba(17, 100, 234, .2);
  transform: translate(-5px, -50%);
}
.side-back:hover svg { transform: translateX(-4px); }

@media (max-width: 860px) {
  .side-back { padding: 12px 15px 12px 13px; gap: 7px; font-size: 12.5px; }
  .side-back svg { width: 14px; height: 14px; }
}

@media (max-width: 520px) {
  .side-back { padding: 11px 12px; font-size: 11.5px; letter-spacing: 0; }
}
/* --------------------------------------------------------------------------
   内容详情页 / 内页模板（news-*.html、page-template.html）
   -------------------------------------------------------------------------- */

.article-hero {
  position: relative;
  padding: calc(var(--header-h) + 64px) 0 48px;
  background:
    radial-gradient(760px 380px at 80% 0%, rgba(17, 100, 234, .10), transparent 62%),
    linear-gradient(180deg, var(--blue-50), #fff);
  overflow: hidden;
}
.article-hero .back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--gray);
  margin-bottom: 22px;
  transition: color .25s;
}
.article-hero .back-link:hover { color: var(--blue); }
.article-hero h1 {
  font-size: clamp(25px, 3.3vw, 38px);
  line-height: 1.4;
  max-width: 900px;
  margin: 14px 0 16px;
}
.article-hero p.lead { color: var(--gray); font-size: 17px; max-width: 760px; }
.article-hero .news-meta { margin-bottom: 0; }

.article-section { padding: 60px 0 96px; }
.article-body { max-width: 820px; }
.article-body h2 { font-size: clamp(20px, 2.2vw, 25px); margin: 42px 0 16px; }
.article-body h3 { font-size: 18px; margin: 30px 0 12px; }
.article-body p { color: var(--gray); font-size: 16.5px; line-height: 2; margin-bottom: 18px; }
.article-body ul { display: grid; gap: 12px; margin: 0 0 22px; }
.article-body ul li {
  position: relative;
  padding-left: 22px;
  font-size: 16px;
  line-height: 1.85;
  color: var(--gray);
}
.article-body ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--blue-200);
}
.article-body ol { margin: 0 0 22px 22px; display: grid; gap: 10px; }
.article-body ol li { font-size: 16px; line-height: 1.85; color: var(--gray); }
/* 正文列表内的岗位名等关键词高亮 */
.article-body ul li b, .article-body ol li b { color: var(--ink); font-weight: 600; }
.article-body blockquote {
  margin: 0 0 22px;
  padding: 18px 24px;
  border-left: 3px solid var(--blue-200);
  background: var(--blue-50);
  border-radius: 0 var(--radius) var(--radius) 0;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.9;
}
.article-body figure { margin: 0 0 24px; }
.article-body figure img { border-radius: var(--radius); border: 1px solid var(--line); }
.article-body figcaption { margin-top: 10px; font-size: 13.5px; color: var(--gray-light); text-align: center; }
.article-body table { width: 100%; border-collapse: collapse; margin: 0 0 24px; font-size: 15px; }
.article-body th, .article-body td { text-align: left; padding: 12px 14px; border-bottom: 1px dashed var(--line); }
.article-body th { color: var(--ink); font-weight: 600; background: var(--blue-50); }
.article-body td { color: var(--gray); }

/* 新闻详情页 ·「开放岗位」要素对齐表：岗位 / 研究方向 / 工作地点 / 投递要求 */
.article-body .jobs-table { table-layout: fixed; margin: 0 0 26px; }
.article-body .jobs-table col.jobs-c1 { width: 30%; }
.article-body .jobs-table col.jobs-c2 { width: 34%; }
.article-body .jobs-table col.jobs-c3 { width: 18%; }
.article-body .jobs-table col.jobs-c4 { width: 18%; }
.article-body .jobs-table thead th {
  padding: 13px 14px;
  font-size: 13.5px;
  letter-spacing: .4px;
  color: var(--ink);
  background: var(--blue-50);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.article-body .jobs-table tbody td {
  padding: 13px 14px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray);
  vertical-align: top;
}
.article-body .jobs-table tbody tr:last-child td { border-bottom: 0; }
.article-body .jobs-table .col-job { color: var(--ink); font-weight: 600; }
.article-body .jobs-table .col-place { color: var(--gray-light); white-space: nowrap; }
.article-body .jobs-table .col-req { color: var(--blue); font-weight: 600; white-space: nowrap; }

/* 新闻详情页 ·「投递方式」下方 jump 到「加入我们」详情页的主按钮 */
.article-cta { margin: 26px 0 4px; }
.article-cta .btn {
  padding: 14px 34px;
  font-size: 15.5px;
  font-weight: 600;
  color: #fff;
}
.article-cta .btn:hover { text-decoration: none; }
.article-body a { color: var(--blue); font-weight: 500; }
.article-body a:hover { text-decoration: underline; }
.article-body pre {
  margin: 0 0 22px;
  padding: 16px 18px;
  background: var(--blue-50);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow-x: auto;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--ink-2);
}
.article-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
}

.article-note {
  margin-top: 34px;
  padding: 16px 20px;
  background: var(--blue-50);
  border: 1px dashed var(--blue-100);
  border-radius: var(--radius);
  font-size: 14px;
  line-height: 1.85;
  color: var(--gray);
}

.article-nav {
  max-width: 820px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 46px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
  font-size: 15px;
}
.article-nav a { color: var(--blue); font-weight: 500; max-width: 46%; }
.article-nav a:hover { text-decoration: underline; }
.article-nav .nav-next { margin-left: auto; text-align: right; }

/* --------------------------------------------------------------------------
   页面 Hero（内页）
   -------------------------------------------------------------------------- */

.page-hero {
  position: relative;
  padding: calc(var(--header-h) + 76px) 0 72px;
  background:
    radial-gradient(800px 400px at 78% 10%, rgba(17, 100, 234, .12), transparent 62%),
    linear-gradient(180deg, var(--blue-50), #fff);
  overflow: hidden;
}
/* 栏目页标题/概要区的实景背景（与首页 hero 同色调，主体在右、左侧留白） */
.page-hero-bg {
  position: absolute;
  inset: 0;
  background: center / cover no-repeat;
  opacity: .62;
  -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 62%, transparent 100%);
  pointer-events: none;
}
.page-hero-bg--tech { background-image: url("../img/tech-hero-bg.jpg"); }
.page-hero-bg--products { background-image: url("../img/page-hero-products.jpg"); }
.page-hero-bg--applications { background-image: url("../img/page-hero-applications.jpg"); }
.page-hero-bg--about { background-image: url("../img/page-hero-about.jpg"); }
.page-hero-bg--news { background-image: url("../img/page-hero-news.jpg"); }
.page-hero-bg--contact { background-image: url("../img/page-hero-contact.jpg"); }
.page-hero > .container { position: relative; z-index: 1; }

/* 宽版首页解决方案：上下留白与标题间距与团队介绍同档（section 默认 100px / head 56px） */
@media (min-width: 1081px) {
  #scenarios { padding: 100px 0; }
  #scenarios .section-head { margin-bottom: 56px; }
  #scenarios .section-title { margin-bottom: 10px; }
  /* 各场景的说明段已删除，面板不再需要 340px 的死高：高度回到内容本身，
     留白 = padding，切换场景时仍由 main.js 等高，避免忽高忽低 */
  .scene-panel { padding: 22px 30px; min-height: 0; }
  .scene-panel h3 { font-size: 20px; margin-bottom: 10px; }
  .scene-num { margin-bottom: 7px; }
  .scene-col-a p { margin-bottom: 14px; line-height: 1.66; font-size: 14.5px; }
  .scene-cases { gap: 7px; }   /* 底部的 12px 原本是给「推荐方案」框留的间距，框已移除，一并去掉 */
  .scene-cases li { padding: 10px 16px; }
  /* 左列 6 个 tab 与右侧面板等高：行高按 1fr 均分，整列上下都与面板齐平
     （此前 align-content:start 会在最下方空出一条） */
  .scene-layout { align-items: stretch; }
  .scene-tabs { align-content: stretch; grid-auto-rows: 1fr; }
  .scene-reco { margin-top: 0; padding: 10px 16px; }
  .scene-more { margin-top: 11px; padding-top: 10px; }
}
/* 1081~1279px：宽度更窄、文案换行更多，再收紧一档，保证同样一屏可见 */
@media (min-width: 1081px) and (max-width: 1279px) {
  #scenarios .section-desc { font-size: 15px; }
  .scene-panel { padding: 22px 26px; }
  .scene-cases li { padding: 10px 14px; }
  .scene-more { margin-top: 10px; padding-top: 10px; }
}

/* 解决方案四大场景区块背景：常态与栏目页同档虚化，悬停切到更实、色彩更深的第二张图 */
.scene-block { position: relative; overflow: hidden; }
.scene-block > .container { position: relative; z-index: 1; }
.scene-block::before,
.scene-block::after {
  content: "";
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  pointer-events: none;
  transition: opacity .55s ease;
}
.scene-block::before { background-image: var(--scene-bg); opacity: .22; }
.scene-block::after { background-image: var(--scene-bg-hover); opacity: 0; }
.scene-block:hover::before { opacity: 0; }
.scene-block:hover::after { opacity: .42; }
/* 首页各内容区块：沿用对应详情页的背景虚化图（关于我们/核心技术/新闻动态/解决方案） */
.home-block { position: relative; overflow: hidden; }
.home-block > .container { position: relative; z-index: 1; }
.home-block::before {
  content: "";
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: .20;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 62%, transparent 100%);
}
.home-about::before { background-image: url("../img/page-hero-about.jpg"); }
.home-tech::before { background-image: url("../img/tech-hero-bg.jpg"); }
.home-news::before { background-image: url("../img/page-hero-news.jpg"); }
/* 首页解决方案区块更高（约 1000px），cover 会裁掉主体，故提高可见度；
   换场景时用 ::after 叠一层做交叉淡入，避免图片瞬切产生跳动 */
.home-scene::before {
  background-image: var(--home-scene-bg, url("../img/scene-finance-home.jpg"));
  background-position: center 40%;
  opacity: .32;
  -webkit-mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
  transition: opacity .45s ease;
}
.home-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  background-position: center 40%;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: var(--home-scene-bg-next, none);
  opacity: 0;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
  transition: opacity .45s ease;
}
.home-scene.is-swapping::before { opacity: 0; }
.home-scene.is-swapping::after { opacity: .32; }

.scene-finance { --scene-bg: url("../img/scene-finance.jpg"); --scene-bg-hover: url("../img/scene-finance-hover.jpg"); }
.scene-pharma { --scene-bg: url("../img/scene-pharma.jpg"); --scene-bg-hover: url("../img/scene-pharma-hover.jpg"); }
.scene-material { --scene-bg: url("../img/scene-material.jpg"); --scene-bg-hover: url("../img/scene-material-hover.jpg"); }
.scene-space { --scene-bg: url("../img/scene-space.jpg"); --scene-bg-hover: url("../img/scene-space-hover.jpg"); }
.page-hero h1 { font-size: clamp(30px, 4vw, 46px); margin-bottom: 14px; }
.page-hero .crumb {
  font-size: 14px;
  color: var(--gray-light);
  margin-bottom: 18px;
}
.page-hero .crumb a:hover { color: var(--blue); }
.page-hero p.lead { color: var(--gray); font-size: 17px; max-width: 680px; }

/* --------------------------------------------------------------------------
   时间轴（发展历程）
   -------------------------------------------------------------------------- */

.timeline { position: relative; max-width: 880px; margin: 0 auto; padding-left: 36px; }
.timeline::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: linear-gradient(180deg, var(--blue), var(--blue-200));
  border-radius: 2px;
}
.tl-item { position: relative; padding-bottom: 44px; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
  content: "";
  position: absolute;
  left: -36px;
  top: 7px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--blue);
  box-shadow: 0 0 0 5px rgba(17, 100, 234, .12);
}
.tl-year {
  display: inline-block;
  font-size: 15px;
  font-weight: 700;
  color: var(--blue);
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  border-radius: 999px;
  padding: 3px 16px;
  margin-bottom: 12px;
  letter-spacing: .06em;
}
.tl-item h3 { font-size: 18.5px; margin-bottom: 8px; }
.tl-item p { color: var(--gray); font-size: 15px; }

/* --------------------------------------------------------------------------
   团队
   -------------------------------------------------------------------------- */

/* 团队（横向行卡 + 实照头像） */
.team-list {
  display: grid;
  gap: 26px;
}
.team-row {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 42px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 34px 44px 34px 36px;
  text-align: left;
  transition: all .35s;
}
.team-row:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.team-avatar {
  width: 190px; height: 190px;
  position: relative;
}
.team-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.team-row h3 { font-size: 22px; line-height: 1.4; margin-bottom: 14px; }
.team-row .team-role { font-size: 15.5px; color: var(--blue); font-weight: 600; margin-left: 2px; }
.team-row p { font-size: 15.5px; line-height: 1.8; color: var(--ink-soft, #4a5568); }
.team-row p + p { margin-top: 12px; }

@media (max-width: 760px) {
  /* 窄版：头像在上（加大、居中）、中间姓名+职位、下面简历 */
  .team-row {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 30px 24px 32px;
    justify-items: center;
    text-align: center;
  }
  .team-avatar { width: 168px; height: 168px; }
  .team-body { width: 100%; }
  .team-row h3 { font-size: 19.5px; margin-bottom: 8px; }
  .team-row .team-role { font-size: 14px; }
  .team-row p { font-size: 14.5px; line-height: 1.78; text-align: left; }
  .team-row p + p { margin-top: 10px; }
}

/* --------------------------------------------------------------------------
   使命愿景
   -------------------------------------------------------------------------- */

.value-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.value-card {
  display: block;
  padding: 38px 32px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid var(--line);
  transition: all .35s;
}
a.value-card { cursor: pointer; }
a.value-card:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.value-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--blue-200); }
.value-card .v-ico {
  width: 50px; height: 50px;
  border-radius: 12px;
  background: var(--blue);
  color: #fff;
  display: grid;
  place-items: center;
  margin-bottom: 20px;
  box-shadow: var(--shadow-blue);
}
.value-card .v-ico svg { width: 24px; height: 24px; }
.value-card h3 { font-size: 19px; margin-bottom: 10px; }
.value-card p { font-size: 14.5px; color: var(--gray); }

/* --------------------------------------------------------------------------
   首页 团队介绍（左文案 + 右 LOGO；LOGO 进入视口时逐渐浮现，此后保持常现）
   -------------------------------------------------------------------------- */

/* LOGO 背后的光晕 .team-logo::before 用了 inset:-6%，在单列窄版（≤860 时 .team-logo
   撑到近整屏宽）外扩量会超过容器留白，探出视口右侧：860px 溢 25px、800px 21px、
   760px 19px。这里裁掉越界部分——光晕渐变到 74% 已全透明，裁的是不可见区域，
   布局与视觉均无变化（2026-11-07）。overflow:hidden 作为旧 Safari 的兜底。 */
#team { overflow: hidden; overflow: clip; }

.team-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 72px;
  align-items: center;
}
.team-copy { max-width: 640px; }
.team-copy .eyebrow { display: flex; }
.team-copy .section-title { margin-bottom: 24px; }
.team-copy p {
  font-size: 16px;
  line-height: 2.05;
  color: var(--gray);
}
/* 段间距定版 9px（2026-11-07 四次调整：1em=半行 → 12px → 11/10px → 宽窄版统一 9px） */
.team-copy p + p { margin-top: 9px; }
.team-logo {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
.team-logo::before {
  content: "";
  position: absolute;
  inset: -6%;
  background: radial-gradient(closest-side, rgba(17, 100, 234, .09), rgba(17, 100, 234, 0) 74%);
  pointer-events: none;
}
.team-logo img {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 400px;
  height: auto;
  display: block;
}

/* LOGO 浮现动画：进入视口触发一次，之后保持常现 */
.logo-emerge {
  transition: opacity 1.8s cubic-bezier(.16, .84, .28, 1), transform 1.8s cubic-bezier(.16, .84, .28, 1);
}
.anim .logo-emerge { opacity: 0; transform: translateY(24px) scale(.94); }
.anim .logo-emerge.in { opacity: 1; transform: none; }
.no-anim .logo-emerge { opacity: 1 !important; transform: none !important; transition: none !important; }

@media (max-width: 1080px) {
  .team-layout { gap: 48px; }
  .team-copy { max-width: none; }
  .team-logo { padding: 16px; }
  .team-logo img { max-width: 320px; }
}
@media (max-width: 860px) {
  .team-layout { grid-template-columns: 1fr; gap: 36px; }
  .team-copy .section-title { margin-bottom: 18px; }
  .team-copy p { font-size: 15px; line-height: 1.95; }
  .team-logo { padding: 0; }
  .team-logo img { max-width: 280px; }
}


/* --------------------------------------------------------------------------
   首页 全栈平台（左标题 + 右文案与要点；2026-10-22 移除轮播，文字替代图片）
   -------------------------------------------------------------------------- */

/* 两列参数与 #team 的 .team-layout 一致（.92fr/1.08fr + 72px）：
   左列文案（标题 + 正文 + 要点）与上方 LOGO 列、右列产品图与上方文案列左右边缘对齐 */
.platform-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 72px;
  align-items: center;
}
.platform-copy .section-title { margin-bottom: 0; }
/* 2026-11-07：正文与要点从右列移到标题下方，随标题同列 */
.platform-text { min-width: 0; margin-top: 26px; }
.platform-text > p { color: var(--gray); font-size: 15.5px; line-height: 1.9; margin-bottom: 0; }
.platform-points {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: 12px 34px;
  margin-top: 22px;
}
.platform-points li {
  position: relative;
  padding-left: 20px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink-2);
}
.platform-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--blue);
}
/* 右列产品图 */
.platform-figure { margin: 0; min-width: 0; }
.platform-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
/* 宽版上下留白在团队介绍 100px 的基础上再放宽一档（≤1080 回落全局默认） */
@media (min-width: 1081px) {
  #platform { padding: 130px 0; }
}

@media (max-width: 1080px) {
  .platform-layout { grid-template-columns: 1fr; gap: 32px; }
  .platform-points { grid-template-columns: repeat(2, 1fr); }
  .platform-figure img { border-radius: 18px; }
}

/* --------------------------------------------------------------------------
   联系我们
   -------------------------------------------------------------------------- */

/* 联系页板块：与上方页面标题拉近（全局 section 上内边距 100px 太大）；
   下方接淡蓝留言板块，底部不再留 100px */
.contact-section { padding-top: 56px; padding-bottom: 56px; }

/* 顶部五联模块：无外框卡片，中间竖细线分隔（五格等宽，宽版见下方宽幅规则） */
.contact-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  margin-bottom: 0;
}
.contact-col { text-align: center; padding: 10px 24px; min-width: 0; }
.contact-col + .contact-col { border-left: 1px solid var(--line); }
.contact-col .c-ico {
  width: 54px; height: 54px;
  margin: 0 auto 16px;
  border-radius: 14px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  color: var(--blue);
  display: grid;
  place-items: center;
}
.contact-col .c-ico svg { width: 25px; height: 25px; }
.contact-col h3 { font-size: 17px; margin-bottom: 8px; }
.contact-col p { font-size: 14.5px; color: var(--gray); }
/* 公司地址格：地址整行不折行，列宽随内容自适应 */
.contact-col--addr { padding: 10px 0 10px 26px; }
.contact-col--addr p { font-size: 13.5px; white-space: nowrap; }
/* 宽版宽幅：五联条突破 1152 内容宽、相对居中左右外扩（最宽 1320），五格等宽；
   地址列空间够时仍单行，不够时自动折两行（不设 nowrap，避免压到分隔线） */
@media (min-width: 1081px) {
  .contact-strip {
    --strip-w: min(1320px, calc(100vw - 96px));
    width: var(--strip-w);
    margin-left: calc((100% - var(--strip-w)) / 2);
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .contact-col { padding: 10px 10px; }
  .contact-col--addr { padding: 10px 10px; }
  .contact-col--addr p { white-space: normal; line-height: 1.45; }
}
/* 13xx 及以下宽版：五等分后列宽收窄，地址降 1.5px 以保住单行 */
@media (min-width: 1081px) and (max-width: 1365px) {
  .contact-col--addr p { font-size: 12px; }
}
/* 中屏及以下：改「图标 + 名称 + 文字」横向一行，压缩上下占比 */
@media (max-width: 1080px) {
  .contact-strip { grid-template-columns: 1fr 1fr; }
  .contact-col {
    display: flex;
    align-items: center;
    gap: 18px;
    text-align: left;
    padding: 16px 20px;
  }
  .contact-col .c-ico {
    flex: none;
    width: 44px; height: 44px;
    margin: 0;
    border-radius: 11px;
  }
  .contact-col .c-ico svg { width: 22px; height: 22px; }
  .contact-col h3 { flex: none; margin: 0; font-size: 16.5px; }
  .contact-col p { flex: 1; min-width: 0; margin: 0; font-size: 15px; }
  .contact-col--addr p { white-space: normal; line-height: 1.45; }
  .contact-col:nth-child(3) { border-left: 0; }
  .contact-col:nth-child(n+3) { border-top: 1px solid var(--line); }
  .contact-col--addr { grid-column: 1 / -1; border-left: 0; padding: 16px 20px; }
}
@media (max-width: 860px) {
  .contact-section { padding-top: 44px; }
}
/* 两列在 900px 以下放不下整行（地址会被挤折行），改回单列横向行 */
@media (max-width: 900px) {
  .contact-strip { grid-template-columns: 1fr; }
  .contact-col + .contact-col { border-left: 0; border-top: 1px solid var(--line); }
  .contact-col--addr { grid-column: auto; }
}
@media (max-width: 640px) {
  .contact-col { padding: 12px 10px; gap: 14px; }
  .contact-col .c-ico { width: 38px; height: 38px; border-radius: 10px; }
  .contact-col .c-ico svg { width: 19px; height: 19px; }
  .contact-col h3 { font-size: 16px; }
  .contact-col p { font-size: 14.5px; }
  .contact-col--addr { padding: 12px 10px; }
  .contact-col--addr p { font-size: 12.5px; }
}
/* 极窄手机（≤430）：再压缩图标与内边距，保证地址仍是一整行 */
@media (max-width: 430px) {
  .contact-col { padding: 11px 8px; gap: 10px; }
  .contact-col .c-ico { width: 34px; height: 34px; border-radius: 9px; }
  .contact-col .c-ico svg { width: 18px; height: 18px; }
  .contact-col--addr { padding: 11px 8px; }
  .contact-col--addr p { font-size: 12px; letter-spacing: -.1px; }
}

/* 在线留言：整段淡蓝底（同首页团队介绍 .section-alt），宽版「左标题 + 右表单卡片」，
   上下留白收在 64px 内，整体高度不超过一屏 */
.message-band { background: var(--blue-50); padding: 64px 0; }
.message-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 56px;
  align-items: center;
  /* 宽版两列合计收到 1040 并居中，卡片不铺满整个容器 */
  max-width: 1040px;
  margin-left: auto;
  margin-right: auto;
}
.message-copy .eyebrow { display: flex; margin-bottom: 14px; }
.message-copy .section-title { font-size: 34px; margin-bottom: 14px; }
.message-copy .message-desc { color: var(--gray); font-size: 15px; line-height: 1.9; }
.message-layout .form-card { padding: 26px 28px 28px; }
/* 宽版卡片收窄后表单改 3 列，字段更舒展；「咨询类型」补满第二行 */
@media (min-width: 1081px) {
  .message-layout .form-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .message-layout .form-grid .form-field:nth-child(5) { grid-column: span 2; }
}
@media (max-width: 1080px) {
  .message-band { padding: 52px 0; }
  .message-layout { grid-template-columns: 1fr; gap: 26px; align-items: start; }
  .message-layout .form-card { padding: 24px 22px 26px; }
  .message-copy .section-title { font-size: 30px; }
  /* 窄版单列：标题板块整体居中（eyebrow 为 inline-flex，随 text-align 居中） */
  .message-copy { text-align: center; }
  .message-copy .eyebrow { justify-content: center; }
  .message-copy .message-desc { max-width: 520px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 860px) {
  .message-band { padding: 44px 0; }
  .message-copy .section-title { font-size: 26px; }
}

.form-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 30px 38px 32px;
  box-shadow: var(--shadow-sm);
}
.form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 18px; }
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field.full { grid-column: 1 / -1; }
.form-field.span3 { grid-column: span 3; }
.form-field label { font-size: 14px; font-weight: 600; color: var(--ink-2); }
.form-field input, .form-field select, .form-field textarea {
  font-family: inherit;
  font-size: 15px;
  color: var(--ink);
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #FBFCFE;
  outline: none;
  transition: all .25s;
  width: 100%;
}
.form-field textarea { resize: vertical; min-height: 76px; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(17, 100, 234, .10);
  background: #fff;
}
.form-field.error input, .form-field.error textarea {
  border-color: #E5484D;
  box-shadow: 0 0 0 4px rgba(229, 72, 77, .10);
}
.form-tip { font-size: 13px; color: var(--gray-light); }
.form-tip a { color: var(--blue); }
.form-tip a:hover { text-decoration: underline; }

/* 反垃圾蜜罐字段：对访客不可见，机器人仍会填写 */
.form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.side-panel {
  background: linear-gradient(160deg, var(--navy), var(--navy-2));
  border-radius: var(--radius-lg);
  padding: 44px;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.side-panel::after {
  content: "";
  position: absolute;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(74, 141, 245, .35), transparent 70%);
  top: -120px; right: -100px;
}
.side-panel h3 { font-size: 21px; margin-bottom: 26px; position: relative; }
.side-list { display: grid; gap: 22px; position: relative; }
.side-list li { display: flex; gap: 14px; font-size: 14.5px; color: rgba(255, 255, 255, .78); }
.side-list .s-ico {
  flex: none;
  width: 40px; height: 40px;
  border-radius: 11px;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .16);
  display: grid;
  place-items: center;
  color: var(--blue-soft);
}
.side-list .s-ico svg { width: 19px; height: 19px; }
.side-list b { display: block; color: #fff; font-size: 15px; margin-bottom: 3px; }

/* 招聘 */
.job-list { display: grid; gap: 14px; }
.job-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 22px 28px;
  transition: all .3s;
}
.job-item:hover { border-color: var(--blue-200); box-shadow: var(--shadow-sm); transform: translateX(4px); }
.job-item h3 { font-size: 17px; margin-bottom: 4px; }
.job-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--gray); }
.job-meta span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }

/* 岗位投递说明条（contact.html #jobs 顶部） */
.jobs-note {
  max-width: 880px;
  margin: 0 auto 18px;
  padding: 14px 22px;
  background: var(--blue-50);
  border: 1px dashed var(--blue-100);
  border-radius: var(--radius);
  font-size: 14px;
  line-height: 1.85;
  color: var(--gray);
  text-align: center;
}
.jobs-note a { color: var(--blue); font-weight: 600; }
.jobs-note a:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
   岗位 JD（careers.html #jobs）：左侧「书签式」竖向 Tab + 右侧 JD 面板
   Tab 鼠标悬停 / 点击 / 键盘聚焦都会切换右侧面板；各面板保持自然高度（不等高）。
   -------------------------------------------------------------------------- */
.jd-wrap {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

/* 左列书签：横向长条，只放岗位名称 */
.jd-tabs {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: sticky;
  top: calc(var(--header-h) + 24px);
}
.jd-tab {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 12px 18px 12px 16px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink-2);
  text-align: left;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background .25s, color .25s, border-color .25s, box-shadow .25s, transform .25s;
}
/* 左侧小色条（书签的书脊） */
.jd-tab::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 50%;
  width: 4px;
  height: 16px;
  border-radius: 0 4px 4px 0;
  background: var(--blue-200);
  transform: translateY(-50%);
  transition: background .25s, height .25s;
}
.jd-tab-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jd-tab:hover {
  border-color: var(--blue-200);
  color: var(--blue);
  box-shadow: var(--shadow-sm);
  transform: translateX(3px);
}
.jd-tab.is-active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-deep) 100%);
  box-shadow: var(--shadow-blue);
  transform: none;
}
.jd-tab.is-active::before { background: rgba(255, 255, 255, .92); height: 20px; }
/* 选中书签右指的小三角，指向右侧面板 */
.jd-tab.is-active::after {
  content: "";
  position: absolute;
  right: -9px;
  top: 50%;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 9px solid var(--blue-deep);
  transform: translateY(-50%);
}
.jd-tab:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

/* 右侧面板 */
.jd-panels {
  position: relative;
  min-width: 0;
  padding: 34px 40px 32px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.jd-panel { display: none; }
.jd-panel.is-active { display: block; }

/* 宽版：11 个岗位面板叠在同一个网格格里，只切显隐、不参与高度计算
   → 面板区高度恒等于最高岗位，切换时文档高度、书签列位置都不动。
   （2026-11-07：原先面板自然高度不等高 + JS 补偿滚动，切换会把光标甩到
     相邻书签上又触发切换，形成每帧回弹的闪屏；堆叠后从根上消除。） */
@media (min-width: 861px) {
  .jd-panels { display: grid; align-items: start; }
  .jd-panel {
    display: block;
    grid-area: 1 / 1;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
  }
  .jd-panel.is-active {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
}
.jd-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding-bottom: 16px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--line);
}
.jd-head h3 { font-size: 22px; }
.jd-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.jd-meta span {
  padding: 3px 12px;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--blue-deep);
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  border-radius: 999px;
  white-space: nowrap;
}

.jd-body { display: grid; gap: 22px; }
/* 注意：.jd-block 是 <section>，会被全站 `section { padding: 100px 0 }` 撑出 200px 空高，
   块间距由 .jd-body 的 gap 统一控制，这里必须清零 */
.jd-block { padding: 0; }
.jd-block-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 15.5px;
  color: var(--ink);
}
/* 「岗位职责 / 任职要求 / 加分项」标题前的圆点已去掉（2026-10-10） */
.jd-list { counter-reset: jd-num; display: grid; gap: 9px; }
.jd-list > li {
  position: relative;
  padding-left: 24px;
  font-size: 14.8px;
  line-height: 1.8;
  color: var(--ink-2);
}
/* 条目改为 1. 2. 3. 顺序编号（原圆点已去掉） */
.jd-list > li::before {
  counter-increment: jd-num;
  content: counter(jd-num) ".";
  position: absolute;
  left: 0;
  top: 0;
  width: 16px;
  text-align: right;
  font-weight: 600;
  line-height: inherit;
  color: var(--blue);
}
.jd-list b { font-weight: 600; color: var(--blue-deep); }
.jd-sub { counter-reset: jd-sub-num; display: grid; gap: 7px; margin-top: 9px; }
.jd-sub li {
  position: relative;
  padding-left: 22px;
  font-size: 14.3px;
  line-height: 1.78;
  color: var(--gray);
}
/* 二级条目改为 1) 2) 3)（原圆点已去掉） */
.jd-sub li::before {
  counter-increment: jd-sub-num;
  content: counter(jd-sub-num) ")";
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  text-align: right;
  line-height: inherit;
  color: var(--gray-light);
}
.jd-empty { font-size: 14.5px; line-height: 1.9; color: var(--gray-light); }

.jd-note {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.75;
  color: var(--gray);
}
.jd-note a { color: var(--blue); font-weight: 600; }
.jd-note a:hover { text-decoration: underline; }

@media (max-width: 1080px) {
  .jd-wrap { grid-template-columns: 178px minmax(0, 1fr); gap: 18px; }
  .jd-tab { padding: 10px 14px 10px 12px; font-size: 14px; }
  .jd-panels { padding: 28px 32px 26px; }
}

@media (max-width: 860px) {
  /* 窄版：改为手风琴 —— 书签条隐藏，10 个岗位叠成一个个独立模块，
     收起时只显示岗位名称，点标题展开该岗位 JD（展开态由 main.js 的窄版分支加 .is-open） */
  .jd-wrap { grid-template-columns: 1fr; gap: 14px; }
  .jd-tabs { display: none; }
  .jd-panels {
    display: grid;
    gap: 12px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .jd-panel,
  .jd-panel.is-active {
    display: block;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
  }
  .jd-head {
    align-items: center;
    gap: 10px 12px;
    padding: 17px 18px;
    margin-bottom: 0;
    border-bottom: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .jd-head h3 { font-size: 17.5px; }
  /* 右侧展开箭头：收起朝下、展开朝上 */
  .jd-head::after {
    content: "";
    order: 2;
    flex: none;
    width: 8px;
    height: 8px;
    margin-left: auto;
    margin-right: 5px;
    border-right: 2px solid var(--gray);
    border-bottom: 2px solid var(--gray);
    transform: rotate(45deg);
    transition: transform .22s ease;
  }
  .jd-panel.is-open .jd-head { border-bottom: 1px solid var(--line); }
  .jd-panel.is-open .jd-head::after { transform: rotate(-135deg); }
  /* 收起时只留岗位名称，展开后再显示信息胶囊 */
  .jd-meta { display: none; }
  .jd-panel.is-open .jd-meta { display: flex; order: 3; flex-basis: 100%; }
  .jd-body { display: none; gap: 18px; padding: 18px 18px 0; }
  .jd-panel.is-open .jd-body { display: grid; }
  .jd-note { display: none; }
  .jd-panel.is-open .jd-note { display: block; margin: 18px 18px 20px; }
}

@media (max-width: 560px) {
  .jd-list > li { font-size: 14.2px; }
  .jd-sub li { font-size: 13.8px; }
}

/* --------------------------------------------------------------------------
   CTA
   -------------------------------------------------------------------------- */

/* CTA 模块（联系我们 / 加入我们）：版心内的蓝色卡片，宽窄版同款
   背景 = 处理过的示意图（去水印 + 部分虚化 + 四周蓝光晕 assets/img/cta-bg.jpg）
   卡片取 2:1 的扁比例（用户要求宽版上下不要太高）：背景 cover 底对齐，宽度铺满、
   底部（人物脚部）完整保留，人物已居中（原图裁左 120px），仅裁掉顶部约 17% 的装饰；≤700px 见文件末尾媒体查询改为内容撑高 */
/* CTA 上下留白均为 50px（窄屏 38px）：上方与 solution section 的 100px(窄屏 76px) 底距衔接，
   下方到页脚同样 50px(窄屏 38px)，卡片上下白色间隔一致 */
.cta-band { padding: 50px 0; }
.cta-inner {
  position: relative;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-blue);
  padding: 52px 64px;
  aspect-ratio: 2 / 1;
  background:
    linear-gradient(105deg, rgba(9,34,90,.92) 0%, rgba(18,80,192,.68) 46%, rgba(88,152,244,.36) 80%, rgba(120,178,252,.22) 100%),
    url("../img/cta-bg.jpg?v=2") center bottom / cover no-repeat;
  color: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}
.cta-inner h2 { font-size: clamp(24px, 3vw, 34px); margin-bottom: 10px; }
.cta-inner p { color: rgba(255, 255, 255, .82); font-size: 16px; }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; flex: none; }

/* CTA 上下结构版（首页）：标题 / 说明 / 单个按钮 —— 居中纵向堆叠
   特异性 .cta-inner.cta-stack (0,2,0) 高于窄屏媒体查询里的 .cta-inner (0,1,0)，
   故 ≤860px 的 align-items:flex-start 不会把它拉回左对齐 */
.cta-inner.cta-stack {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
}
.cta-inner.cta-stack > div { width: 100%; }
.cta-inner.cta-stack h2 {
  font-size: clamp(30px, 3.8vw, 46px);
  line-height: 1.22;
  margin-bottom: 18px;
}
.cta-inner.cta-stack p {
  max-width: 820px;
  margin: 0 auto 32px;
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 1.7;
  color: rgba(255, 255, 255, .88);
}
.cta-inner.cta-stack .cta-actions { justify-content: center; }

/* --------------------------------------------------------------------------
   页脚
   -------------------------------------------------------------------------- */

.site-footer {
  background: var(--navy);
  color: rgba(255, 255, 255, .68);
  padding: 76px 0 0;
  position: relative;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(560px 280px at 12% 0%, rgba(17, 100, 234, .22), transparent 65%);
  pointer-events: none;
}

.footer-grid {
  position: relative;
  display: grid;
  /* 2026-11-02 重排：首列 312px 下限 = 图标 16 + 间距 10 + 地址单行 282（含「地址：」前缀），
     保证宽版地址不折行；中三列等分 1fr，末列固定 160px 与二维码同宽，四段间距一致 */
  grid-template-columns: minmax(312px, 1.35fr) repeat(3, minmax(0, 1fr)) 160px;
  gap: 38px;
  padding-bottom: 56px;
}
/* 1081~1199：容器宽度还在增长阶段，收紧列间距，避免中三列被地址列挤得过窄 */
@media (min-width: 1081px) and (max-width: 1199px) {
  .footer-grid { gap: 30px; grid-template-columns: minmax(312px, 1.2fr) repeat(3, minmax(0, 1fr)) 160px; }
}
.footer-brand img { height: 46px; width: auto; margin-bottom: 20px; }
.footer-brand p { font-size: 14px; max-width: 320px; }
.footer-col h4 {
  color: #fff;
  font-size: 15.5px;
  letter-spacing: .06em;
  margin-bottom: 20px;
  font-weight: 600;
}
/* 页脚栏目标题（产品中心 / 解决方案 / 新闻中心 / 关于我们）可点击进入对应栏目页 */
.footer-col h4 a {
  font-size: inherit;
  color: inherit;
  display: inline-block;
  transition: color .25s;
}
.footer-col h4 a:hover,
.footer-col h4 a:focus-visible { color: var(--blue-soft); }
.footer-col ul { display: grid; gap: 12px; }
.footer-col a { font-size: 14px; transition: color .25s; }
.footer-col a:hover { color: #fff; }
.footer-col li { font-size: 14px; display: flex; gap: 10px; align-items: flex-start; }
.footer-col li svg { width: 16px; height: 16px; flex: none; margin-top: 4px; color: var(--blue-soft); }
/* 微信公众号二维码：宽版作为页脚最右一列，与右侧栏目顶端对齐
   （2026-11-02 删除说明文字，二维码放大 92→160px） */
.footer-qr {
  margin-top: 0;
  align-self: start;
}
.footer-qr img {
  width: 160px; height: 160px;
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  display: block;
}

.footer-bottom {
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, .10);
  padding: 22px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 13px;
  color: rgba(255, 255, 255, .45);
}
.footer-bottom a:hover { color: #fff; }
.footer-bottom a {
  position: relative;
  transition: color .22s ease;
}
.footer-bottom a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .26s ease;
}
.footer-bottom a:hover::after,
.footer-bottom a:focus-visible::after { transform: scaleX(1); }

/* --------------------------------------------------------------------------
   其他
   -------------------------------------------------------------------------- */

.to-top {
  position: fixed;
  right: 26px;
  bottom: 26px;
  width: 46px; height: 46px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--blue);
  box-shadow: var(--shadow-md);
  display: grid;
  place-items: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: all .35s;
  z-index: 90;
}
.to-top.show { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--blue); color: #fff; border-color: var(--blue); }

.toast {
  position: fixed;
  left: 50%;
  bottom: 40px;
  transform: translate(-50%, 20px);
  background: var(--ink);
  color: #fff;
  font-size: 14.5px;
  padding: 13px 24px;
  border-radius: 999px;
  box-shadow: var(--shadow-md);
  opacity: 0;
  visibility: hidden;
  transition: all .35s;
  z-index: 200;
  display: flex;
  align-items: center;
  gap: 10px;
}
.toast.show { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.toast svg { width: 18px; height: 18px; color: #4ADE80; }

/* 进场动画（滚动浮现）
   隐藏态挂在 html.anim 上：该类由页内联脚本立即添加。
   这样无脚本环境下 .reveal 元素直接可见，不会出现「内容空白」 */
.reveal { transition: opacity .8s cubic-bezier(.2, .6, .2, 1), transform .8s cubic-bezier(.2, .6, .2, 1); }
.anim .reveal { opacity: 0; transform: translateY(28px); }
.anim .reveal.in { opacity: 1; transform: none; }
.no-anim .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
.reveal.d1 { transition-delay: .1s; }
.reveal.d2 { transition-delay: .2s; }
.reveal.d3 { transition-delay: .3s; }

@keyframes pageHeroBgIn {
  from { opacity: 0; }
  to   { opacity: .62; }
}
.page-hero-bg { animation: pageHeroBgIn 1.05s ease-out .04s both; }

/* 首屏浮现动效的关闭开关（?static=1 截图模式 / 打印 / 减少动态效果） */
.no-anim .hero-grid-bg { animation: none !important; }
.no-anim .page-hero-bg { animation: none !important; }
.no-anim .hero-badge,
.no-anim .hero h1,
.no-anim .hero-lines,
.no-anim .hero-actions,
.no-anim .hero-visual,
.no-anim .page-hero .eyebrow,
.no-anim .article-hero .back-link,
.no-anim .article-hero .news-meta,
.no-anim .page-hero h1,
.no-anim .article-hero h1,
.no-anim .page-hero .lead,
.no-anim .article-hero .lead,
.no-anim .page-hero + section,
.no-anim .article-hero + section,
.no-anim .page-hero + section > .container > *,
.no-anim .article-hero + section > .container > * { animation: none !important; opacity: 1 !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
  html { scroll-behavior: auto; }
}
@media print {
  .page-hero-bg { display: none !important; }
  .scene-block::before, .scene-block::after { display: none !important; }
  .hero-grid-bg, .hero-badge, .hero h1, .hero-lines, .hero-actions, .hero-visual,
  .page-hero .eyebrow, .article-hero .back-link, .article-hero .news-meta, .article-hero .news-meta *,
  .page-hero h1, .article-hero h1, .page-hero .lead, .article-hero .lead,
  .page-hero + section, .article-hero + section,
  .page-hero + section > .container > *, .article-hero + section > .container > * { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* --------------------------------------------------------------------------
   响应式
   -------------------------------------------------------------------------- */

@media (max-width: 1080px) {
  .tech-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-contact { grid-column: 1 / -1; }
  /* 窄版：微信公众号二维码整行落到页脚最下方 */
  .footer-qr { grid-column: 1 / -1; }
  /* 窄版：第四栏「加入我们 / 联系我们」并排一行并通栏，
     内部分两列 + 38px 间距 → 加入我们对齐上方「关于我们」，联系我们对齐上方「新闻动态」左缘 */
  .footer-grid > .footer-col:nth-child(4) {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 38px;
    align-content: start;
  }
  .footer-grid > .footer-col:nth-child(4) h4 { margin-bottom: 0; }
  .scene-layout { grid-template-columns: 1fr; }
  .scene-tabs { grid-template-columns: repeat(3, 1fr); }
  .hero-inner { grid-template-columns: 1fr; gap: 40px; }
  /* 窄版：示意图整体位于标题、文字与按钮下方，机柜占一半宽度居中 */
  .hero-visual { width: 100%; max-width: 620px; }
  .rack-card img { height: auto; width: 50%; }
}

@media (max-width: 860px) {
  :root { --header-h: 80px; }
  .brand img { height: 76px; }   /* 2026-11-10 窄版 LOGO 放大：墨迹 22→33px（SVG 上下各 28% 留白） */
  .hero-visual { max-width: 100%; }
  section { padding: 76px 0; }
  .cta-band { padding: 38px 0; }
  .pillar-strip { padding: 0 0 76px; }
  .tech-detail + .tech-detail { margin-top: 64px; }
  /* 窄版：名称与详情改为上下排布，名称统一在上 */
  .tech-row { grid-template-columns: 1fr; gap: 22px; align-items: start; }
  .tech-row.flip { grid-template-columns: 1fr; }
  .tech-row.flip .tech-name { order: 0; }
  /* 窄版：标题 → 示意图 → 正文 单列堆叠，收紧各段间距 */
  .tech-row.tech-stack .tech-name { margin-bottom: 14px; }
  .tech-row.tech-stack .tech-figure { margin-bottom: 16px; }
  .article-hero { padding: calc(var(--header-h) + 48px) 0 36px; }
  .article-section { padding: 44px 0 76px; }
  .article-body p, .article-body ul li { font-size: 15.5px; }
  .article-nav { flex-direction: column; gap: 12px; }
  .article-nav a { max-width: 100%; }
  .article-nav .nav-next { margin-left: 0; text-align: left; }

  .nav-toggle { display: flex; }
  .main-nav {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    background: rgba(255, 255, 255, .98);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--line);
    padding: 16px 24px 24px;
    box-shadow: 0 24px 48px rgba(10, 24, 48, .10);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: all .3s;
  }
  .main-nav.open { transform: none; opacity: 1; visibility: visible; }
  .nav-link { padding: 13px 12px; font-size: 16px; }
  .nav-link::after { display: none; }
  .nav-cta { margin: 10px 0 0; text-align: center; justify-content: center; }

  /* 窄版：不显示二级下拉列表，菜单保持原来只有主栏目的样式 */
  .nav-item { display: block; }
  .nav-item > .nav-link { display: block; }  /* 恢复原版整行可点、行高疏朗的列表样式 */
  .nav-caret { display: none; }
  .nav-menu { display: none; }
  /* 菜单可能高于视口，允许面板内部滚动 */
  .main-nav { max-height: calc(100vh - var(--header-h)); max-height: calc(100dvh - var(--header-h)); overflow-y: auto; }

  .about-grid, .contact-layout { grid-template-columns: 1fr; gap: 44px; }
  .news-grid, .value-grid, .contact-grid { grid-template-columns: 1fr; }
  .cta-inner { flex-direction: column; align-items: flex-start; padding: 48px 36px; }
  .scene-tabs { grid-template-columns: 1fr 1fr; }
  .scene-panel { padding: 30px 24px; }
  .form-card { padding: 32px 24px; }
  .side-panel { padding: 32px 24px; }
  .job-item { flex-direction: column; align-items: flex-start; gap: 12px; }
}

@media (max-width: 560px) {
  :root { --header-h: 74px; }
  .to-top { right: 16px; bottom: 16px; width: 42px; height: 42px; }
  .brand img { height: 72px; }   /* 2026-11-10 极窄版 LOGO 同步放大：墨迹 20→32px */
  .tech-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 36px; }
  /* 极窄单列：页脚已无右列可对齐，「加入我们 / 联系我们」改为紧挨并排、整体左对齐 */
  .footer-grid > .footer-col:nth-child(4) {
    grid-template-columns: auto auto;
    justify-content: start;
    column-gap: 40px;
  }
  .scene-tabs { grid-template-columns: 1fr; }
  .hero-visual { max-width: 100%; }
  .hero-badge { max-width: 100%; } /* 字号/内边距统一由上方 760px 断点按标题比例控制 */
  .hero-actions { gap: 14px; }
  /* 761~1080 标题同为 54px，按钮不再单独缩小，保持与宽版一致的比例（61/54） */
  .rack-tag { font-size: 13.5px; padding: 5px 15px; }
}

/* 极窄屏（≤700px）：卡片 2:1 的扁比例在窄宽度下已放不下标题+正文+按钮，
   故改为内容撑高，背景 cover 居中裁切（人物与握手仍在画面中央，裁掉两侧装饰） */
@media (max-width: 700px) {
  .cta-inner { aspect-ratio: auto; }

  /* 详情页「开放岗位」：四列变堆叠，每个岗位一张小卡 */
  .article-body .jobs-table thead { display: none; }
  .article-body .jobs-table,
  .article-body .jobs-table tbody,
  .article-body .jobs-table tr,
  .article-body .jobs-table td { display: block; width: auto; }
  .article-body .jobs-table tbody tr { padding: 13px 0 14px; border-bottom: 1px dashed var(--line); }
  .article-body .jobs-table tbody tr:last-child { border-bottom: 0; }
  .article-body .jobs-table tbody td { padding: 0; border-bottom: 0; }
  .article-body .jobs-table .col-job { margin-bottom: 5px; font-size: 16px; }
  .article-body .jobs-table .col-dir { margin-bottom: 5px; }
  .article-body .jobs-table .col-place,
  .article-body .jobs-table .col-req { display: inline-block; }
  .article-body .jobs-table .col-req { margin-left: 10px; }
  .article-body .jobs-table .col-req::before {
    content: "·";
    margin-right: 8px;
    color: var(--gray-light);
    font-weight: 400;
  }

  .article-cta { margin: 22px 0 0; }
  .article-cta .btn { width: 100%; padding: 15px 20px; }
}

/* 联系页表单栅格响应式（2026-11-02 表单改为通栏横向布局） */
@media (max-width: 1080px) {
  .form-card { padding: 28px 26px 30px; }
  .form-grid { grid-template-columns: 1fr 1fr; }
  .form-field.span3 { grid-column: span 2; }
}
@media (max-width: 560px) {
  .form-grid { grid-template-columns: 1fr; }
  .form-field.span3 { grid-column: auto; }
}