/* ==========================================================================
   components.css — 组件与构成层
   构成原则：非对称、重叠、破格、全幅（full-bleed）；卡片一律无边框，靠阴影与底色分层。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 顶部导航 —— 首屏透明融入，滚动后玻璃化（无边界关键动作）
   -------------------------------------------------------------------------- */
.site-header{
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  height: var(--header-h);
  display: flex;
  align-items: center;
  transition: background var(--dur-base) var(--ease-out),
    box-shadow var(--dur-base) var(--ease-out),
    backdrop-filter var(--dur-base) var(--ease-out);
}.site-header.is-stuck{
  background: var(--on-tech-80);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  box-shadow: 0 1px 0 var(--ink-a1), var(--sh-1);
}.header-inner{
  width: min(var(--max), 100% - var(--gutter) * 2);
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: var(--sp-8);
}.brand{
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex: none;
}.nav{ display: flex; align-items: center; gap: var(--sp-2); margin-left: auto; }.nav__link{
  position: relative;
  padding: 10px 14px;
  font-size: var(--fs-15, 0.9375rem);
  font-weight: 500;
  color: var(--c-ink-2);
  border-radius: var(--r-sm);
  transition: color var(--dur-fast) var(--ease-out);
}/* 悬停：下划线扫过，而非简单变亮 */
.nav__link::after{
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 6px;
  height: 2px;
  border-radius: 2px;
  background: var(--c-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur-base) var(--ease-out);
}.nav__link:hover{ color: var(--c-ink); }.nav__link:hover::after{ transform: scaleX(1); }.nav__link.is-active{ color: var(--c-ink); font-weight: 650; }.nav__link.is-active::after{ transform: scaleX(1); }.header-cta{ flex: none; }/* --------------------------------------------------------------------------
   2. 按钮
   -------------------------------------------------------------------------- */
.btn{
  --btn-bg: var(--c-accent);
  --btn-fg: var(--c-bg);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  min-height: 48px;
  padding: 0 26px;
  border: 0;
  border-radius: var(--r-pill);
  background: var(--btn-bg);
  color: var(--btn-fg);
  font-size: var(--fs-16);
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  white-space: nowrap;
  transition: transform var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-base) var(--ease-out),
    background var(--dur-fast) var(--ease-out);
}.btn:hover{ transform: translateY(-2px); box-shadow: var(--sh-accent); }.btn:active{ transform: translateY(0); }.btn--primary{ --btn-bg: var(--c-accent); }.btn--primary:hover{ --btn-bg: var(--c-accent-600); }.btn--ghost{
  --btn-bg: transparent;
  --btn-fg: var(--c-ink);
  box-shadow: inset 0 0 0 1px var(--c-line);
}.btn--ghost:hover{
  --btn-bg: var(--ink-a1);
  box-shadow: inset 0 0 0 1px var(--ink-a3), var(--sh-1);
}.btn--dark{
  --btn-bg: var(--c-ink);
  --btn-fg: var(--c-bg);
}.btn--dark:hover{ box-shadow: var(--sh-2); }.btn--sm{ min-height: 40px; padding: 0 18px; font-size: var(--fs-14); }.btn__arrow{
  transition: transform var(--dur-base) var(--ease-out);
}.btn:hover .btn__arrow{ transform: translateX(4px); }.btn.is-loading{ pointer-events: none; opacity: 0.7; }.spinner{
  width: 16px;
  height: 16px;
  border: 2px solid var(--on-tech-3);
  border-top-color: var(--c-bg);
  border-radius: 50%;
  animation: spin 700ms linear infinite;
}

@keyframes spin{ to { transform: rotate(360deg); } }/* --------------------------------------------------------------------------
   3. Hero 首屏 —— 右视觉冲出容器（破格），环境光从右上角溢出
   -------------------------------------------------------------------------- */
.hero{
  position: relative;
  padding-top: calc(var(--header-h) + 96px);
  padding-bottom: var(--sp-9);
  overflow: hidden;
}.hero::before{
  content: "";
  position: absolute;
  top: -220px;
  right: -180px;
  width: 900px;
  height: 900px;
  pointer-events: none;
  background: radial-gradient(
    circle at 50% 50%,
    var(--accent-a2) 0%,
    var(--accent-a1) 38%,
    transparent 68%
  );
}.hero::after{
  content: "";
  position: absolute;
  left: -260px;
  bottom: -320px;
  width: 760px;
  height: 760px;
  pointer-events: none;
  background: radial-gradient(
    circle at 50% 50%,
    var(--ink-a2) 0%,
    transparent 66%
  );
}.hero__grid{
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: var(--sp-8);
  align-items: center;
}.hero__title{ max-width: 15em; }.hero__title em{
  font-style: normal;
  background: linear-gradient(96deg, var(--c-accent) 0%, var(--c-accent-400) 55%, var(--c-accent-200) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}.hero__sub{
  margin-top: var(--sp-5);
  max-width: 34em;
  font-size: var(--fs-18);
  line-height: 1.8;
  color: var(--c-ink-2);
}/* 首屏副标题整句不断行（窄屏自动回退为正常换行） */
.hero__sub--one{ max-width: none; white-space: nowrap; }@media (max-width: 1280px) {.hero__sub--one{ white-space: normal; }
}.hero__actions{
  margin-top: var(--sp-7);
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
}.hero__chips{
  margin-top: var(--sp-7);
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
}/* 首页四要素：2×2 十字分布，避免单项孤行 */
.hero__chips--grid{
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: var(--sp-2) var(--sp-4);
  justify-content: start;
}.chip{
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 7px 14px;
  border-radius: var(--r-pill);
  background: var(--on-tech-2);
  box-shadow: inset 0 0 0 1px var(--c-line);
  font-size: var(--fs-13, 0.8125rem);
  font-weight: 500;
  color: var(--c-ink-2);
  backdrop-filter: blur(8px);
}.chip__dot{
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--c-accent);
}/* 首屏视觉：硬件悬浮 + 光环，右侧溢出容器 */
.hero__visual{
  position: relative;
  margin-right: -8%;
  min-height: 480px;
  display: grid;
  place-items: center;
}.orb{
  position: absolute;
  border-radius: 50%;
  filter: blur(40px);
  pointer-events: none;
}.orb--a{
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, var(--accent-a3), transparent 65%);
  top: 8%;
  left: 12%;
}.orb--b{
  width: 340px;
  height: 340px;
  background: radial-gradient(circle, var(--ink-a2), transparent 66%);
  bottom: 4%;
  right: 6%;
}.stack{
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: var(--sp-5);
  animation: floatY 9s var(--ease-io) infinite;
}

@keyframes floatY{
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}@media (prefers-reduced-motion: reduce) {.stack{ animation: none; }
}.stack__item{ position: relative; }.stack__item--main{ z-index: 2; }.stack__item--side{ margin-bottom: 26px; }/* 悬浮信息卡：压在视觉边缘，构成重叠关系 */
.float-card{
  position: absolute;
  z-index: 3;
  bottom: 6%;
  left: -6%;
  padding: 14px 18px;
  border-radius: var(--r-md);
  background: var(--on-tech-80);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  box-shadow: var(--sh-2);
}.float-card__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
}.float-card__head .pulse-dot{ position: relative; top: auto; right: auto; flex: none; }.float-card__label{
  font-size: var(--fs-12);
  color: var(--c-ink-3);
  letter-spacing: 0.08em;
}.float-card__value{
  font-family: var(--font-num);
  font-size: var(--fs-20);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}.float-card__value span{ color: var(--c-accent); }.pulse-dot{
  position: absolute;
  top: 16px;
  right: 18px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-accent);
}.pulse-dot::after{
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px solid var(--c-accent);
  opacity: 0;
  animation: pulse 2.4s var(--ease-out) infinite;
}

@keyframes pulse{
  0% { transform: scale(0.6); opacity: 0.9; }
  100% { transform: scale(1.9); opacity: 0; }
}/* --------------------------------------------------------------------------
   4. 硬核数据横栏 —— 数字压住区块分界（重叠），滚动触发翻滚
   -------------------------------------------------------------------------- */
.stats-wrap{ position: relative; margin-top: -72px; z-index: 4; }.stats{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-3);
  overflow: hidden;
}.stat{
  position: relative;
  padding: var(--sp-8) var(--sp-6);
  text-align: center;
}.stat + .stat::before{
  content: "";
  position: absolute;
  left: 0;
  top: 22%;
  bottom: 22%;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--c-line), transparent);
}.stat__num{
  font-family: var(--font-num);
  font-size: clamp(1.75rem, 2.6vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}.stat__num em{
  font-style: normal;
  color: var(--c-accent);
}.stat__label{
  margin-top: var(--sp-3);
  font-size: var(--fs-14);
  color: var(--c-ink-2);
  line-height: 1.6;
}/* --------------------------------------------------------------------------
   5. 通用卡片与网格
   -------------------------------------------------------------------------- */
.grid-3{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-6);
}.grid-2{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-6);
}.card{
  position: relative;
  padding: var(--sp-7);
  border-radius: var(--r-lg);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  transition: transform var(--dur-base) var(--ease-out),
    box-shadow var(--dur-base) var(--ease-out);
}.card:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }/* 优势卡：序号超大且半透明，压在卡片内构成层次 */
.card--adv{ overflow: hidden; }.card__index{
  position: absolute;
  top: 18px;
  right: 24px;
  font-family: var(--font-num);
  font-size: 4rem;
  font-weight: 700;
  line-height: 1;
  color: var(--c-ink);
  opacity: 0.06;
  letter-spacing: -0.04em;
}.card__icon{
  width: 46px;
  height: 46px;
  border-radius: var(--r-md);
  display: grid;
  place-items: center;
  background: var(--c-accent-soft);
  color: var(--c-accent);
  margin-bottom: var(--sp-5);
}.card__title{ margin-bottom: var(--sp-3); }/* --------------------------------------------------------------------------
   6. 产品阵列卡
   -------------------------------------------------------------------------- */
.pcards{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-6);
}.pcard{
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  overflow: hidden;
  transition: transform var(--dur-base) var(--ease-out),
    box-shadow var(--dur-base) var(--ease-out);
}.pcard:hover{ transform: translateY(-4px); box-shadow: var(--sh-3); }.pcard__visual{
  position: relative;
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, var(--c-surface) 0%, var(--c-bg) 100%);
  overflow: hidden;
}.pcard__visual::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(var(--c-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--c-line) 1px, transparent 1px);
  background-size: 44px 44px;
  opacity: 0.4;
  mask-image: radial-gradient(70% 70% at 50% 45%, #000 0%, transparent 100%);
  -webkit-mask-image: radial-gradient(70% 70% at 50% 45%, #000 0%, transparent 100%);
}.pcard__glow{
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--accent-a2), transparent 62%);
  filter: blur(24px);
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out);
}.pcard:hover .pcard__glow{ opacity: 1; }.pcard__device{
  position: relative;
  height: 232px;
  transition: transform var(--dur-slow) var(--ease-out);
}.pcard:hover .pcard__device{ transform: translateY(-8px) scale(1.03); }.pcard__tag{
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
  padding: 5px 12px;
  border-radius: var(--r-pill);
  background: var(--on-tech-80);
  box-shadow: var(--sh-1);
  font-size: var(--fs-12);
  font-weight: 600;
  color: var(--c-ink-2);
  letter-spacing: 0.04em;
}.pcard__body{ padding: var(--sp-6) var(--sp-6) var(--sp-7); flex: 1; display: flex; flex-direction: column; }.pcard__title{ margin-bottom: var(--sp-3); }.pcard__desc{ font-size: var(--fs-15, 0.9375rem); color: var(--c-ink-2); line-height: 1.75; }.pcard__meta{ margin-top: var(--sp-4); display: flex; gap: var(--sp-2); flex-wrap: wrap; }.tag{
  padding: 4px 10px;
  border-radius: var(--r-xs);
  background: var(--c-surface-2);
  font-size: var(--fs-12);
  color: var(--c-ink-2);
}.pcard:hover .pcard__more svg{ transform: translateX(5px); }/* --------------------------------------------------------------------------
   7. 科技深色板块（小谷云）—— 全幅通栏，无左右边界
   -------------------------------------------------------------------------- */
.tech{
  position: relative;
  color: var(--on-tech);
  background: var(--c-tech);
  padding: var(--sp-10) 0;
  overflow: hidden;
}.tech::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(var(--c-tech-ghost) 1px, transparent 1px),
    linear-gradient(90deg, var(--c-tech-ghost) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(80% 70% at 60% 30%, #000 0%, transparent 78%);
  -webkit-mask-image: radial-gradient(80% 70% at 60% 30%, #000 0%, transparent 78%);
}.tech::after{
  content: "";
  position: absolute;
  top: -180px;
  left: 30%;
  width: 900px;
  height: 720px;
  background: radial-gradient(circle, var(--accent-a3), transparent 62%);
  pointer-events: none;
}.tech .eyebrow{ color: var(--c-accent-200); }.tech .eyebrow::before{ background: var(--c-accent-200); box-shadow: 0 0 0 4px var(--accent-lit); }.tech .h2, .tech .h3{ color: var(--on-tech); }.tech .sec-desc, .tech .body{ color: var(--on-tech-2); }.tech__inner{ position: relative; z-index: 2; }.tech__grid{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: var(--sp-9);
  align-items: center;
}/* 仪表盘模拟：真实信息的视觉锚点，不是装饰插画 */
.dash{
  position: relative;
  border-radius: var(--r-lg);
  background: linear-gradient(160deg, var(--c-tech-card) 0%, var(--c-tech-lo) 100%);
  box-shadow: 0 40px 80px -24px var(--tech-shadow),
    inset 0 0 0 1px var(--c-tech-veil);
  overflow: hidden;
}.dash__bar{
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: 14px 18px;
  border-bottom: 1px solid var(--c-tech-line);
}.dash__dots{ display: flex; gap: 6px; }.dash__dots i{ width: 9px; height: 9px; border-radius: 50%; background: var(--c-tech-mist); }.dash__dots i:first-child{ background: var(--accent-a5); }.dash__title{ font-size: var(--fs-12); color: var(--on-tech-3); letter-spacing: 0.08em; }.dash__live{
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-12);
  color: var(--c-accent-200);
}.dash__body{ display: grid; grid-template-columns: 156px minmax(0, 1fr); }.dash__side{ padding: 18px; border-right: 1px solid var(--c-tech-line); display: grid; gap: 10px; }.dash__nav{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--r-xs);
  font-size: var(--fs-12);
  color: var(--on-tech-3);
}.dash__nav.is-on{ background: var(--accent-a2); color: var(--c-accent-200); }.dash__nav i{ width: 14px; height: 14px; border-radius: 4px; background: var(--c-tech-mist); flex: none; }.dash__nav.is-on i{ background: var(--c-accent); }.dash__main{ padding: 18px; }.dash__kpis{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.kpi{
  padding: 12px 14px;
  border-radius: var(--r-sm);
  background: var(--c-tech-ghost);
  box-shadow: inset 0 0 0 1px var(--c-tech-ghost);
}.kpi__k{ font-size: var(--fs-12); color: var(--on-tech-3); }.kpi__v{
  margin-top: 4px;
  font-family: var(--font-num);
  font-size: var(--fs-20);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}.kpi__v em{ font-style: normal; color: var(--c-accent); }.dash__chart{
  margin-top: 14px;
  padding: 14px;
  border-radius: var(--r-sm);
  background: var(--c-tech-faint);
  box-shadow: inset 0 0 0 1px var(--c-tech-ghost);
}.chart__head{ display: flex; justify-content: space-between; font-size: var(--fs-12); color: var(--on-tech-3); }.spark{ width: 100%; height: 108px; margin-top: 10px; }.spark__line{
  fill: none;
  stroke: var(--c-accent);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 620;
  stroke-dashoffset: 620;
  animation: draw 2.6s var(--ease-out) forwards;
}

@keyframes draw{ to { stroke-dashoffset: 0; } }@media (prefers-reduced-motion: reduce) {.spark__line{ stroke-dashoffset: 0; animation: none; }
}.spark__area{ fill: url(#sparkFill); opacity: 0.5; }.spark__grid{ stroke: var(--c-tech-ghost); stroke-width: 1; }.dash__rows{ margin-top: 12px; display: grid; gap: 8px; }.dash__row{
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) 62px max-content;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--r-xs);
  background: var(--c-tech-faint);
  font-size: var(--fs-12);
  color: var(--on-tech-2);
}.dash__row b{ font-family: var(--font-num); color: var(--on-tech); font-weight: 600; }.pill{
  justify-self: end;
  white-space: nowrap;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  background: var(--c-tech-veil);
  color: var(--on-tech);
  box-shadow: inset 0 0 0 1px var(--c-tech-mist);
}.pill--warn{
  background: var(--accent-a3);
  color: var(--c-accent-200);
  box-shadow: inset 0 0 0 1px var(--accent-a4);
}/* 看板动态感：图表扫描光带 + LIVE 呼吸 + 行错峰入场 */
.dash__chart{ position: relative; overflow: hidden; }.dash__chart::after{
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -90px;
  width: 64px;
  background: linear-gradient(90deg, transparent, var(--accent-a3), transparent);
  animation: dash-scan 5.2s var(--ease-io) infinite;
  pointer-events: none;
}

@keyframes dash-scan{
  0% { left: -90px; }
  62%, 100% { left: 105%; }
}.dash__live .pulse-dot{ animation: live-blink 1.8s ease-in-out infinite; }

@keyframes live-blink{
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}.js .reveal .dash__row{ opacity: 0; transform: translateX(14px); }.reveal.is-in .dash__row{ animation: dash-row-in 0.6s var(--ease-out) forwards; }.reveal.is-in .dash__rows .dash__row:nth-child(1){ animation-delay: 0.45s; }.reveal.is-in .dash__rows .dash__row:nth-child(2){ animation-delay: 0.62s; }.reveal.is-in .dash__rows .dash__row:nth-child(3){ animation-delay: 0.79s; }

@keyframes dash-row-in{
  to { opacity: 1; transform: none; }
}@media (prefers-reduced-motion: reduce) {.dash__chart::after{ animation: none; display: none; }.dash__live .pulse-dot{ animation: none; }.js .reveal .dash__row{ opacity: 1; transform: none; }.reveal.is-in .dash__row{ animation: none; }
}/* --------------------------------------------------------------------------
   9. 合作模式卡
   -------------------------------------------------------------------------- */
.mode{
  position: relative;
  padding: var(--sp-7);
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  overflow: hidden;
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}.mode:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }.mode__fit{
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  box-shadow: inset 0 1px 0 var(--c-line);
  font-size: var(--fs-14);
  color: var(--c-ink-3);
}.mode__fit b{ color: var(--c-ink); font-weight: 600; }/* --------------------------------------------------------------------------
   10. 七步流程
   -------------------------------------------------------------------------- */
.flow{
  display: flex;
  align-items: flex-start;
  gap: 0;
  flex-wrap: wrap;
}/* --------------------------------------------------------------------------
   11. 时间轴（关于我们）
   -------------------------------------------------------------------------- */
.timeline{ position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }.timeline::before{
  content: "";
  position: absolute;
  top: 12px;
  left: 4%;
  right: 4%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-line) 12%, var(--c-line) 88%, transparent);
}.tl__item{ position: relative; padding-top: var(--sp-6); }.tl__node{
  position: absolute;
  top: 4px;
  left: 0;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--c-bg);
  box-shadow: inset 0 0 0 2px var(--c-line);
  z-index: 2;
}.tl__item:first-child .tl__node{ box-shadow: inset 0 0 0 2px var(--c-accent); }.tl__item:first-child .tl__node::after{
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--c-accent);
}.tl__era{
  font-family: var(--font-num);
  font-size: var(--fs-14);
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--c-accent);
}.tl__title{ margin: var(--sp-2) 0 var(--sp-3); }.tl__desc{ font-size: var(--fs-15, 0.9375rem); color: var(--c-ink-2); line-height: 1.8; }.tl__tags{ margin-top: var(--sp-4); display: flex; gap: var(--sp-2); flex-wrap: wrap; }/* --------------------------------------------------------------------------
   12. 荣誉墙 / 合作伙伴
   -------------------------------------------------------------------------- */
.honors{ display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); }.honor{
  padding: var(--sp-6);
  border-radius: var(--r-lg);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}.honor:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }.honor__no{ font-family: var(--font-num); font-size: var(--fs-12); color: var(--c-accent); letter-spacing: 0.1em; }.honor__t{ margin: var(--sp-3) 0 var(--sp-2); font-size: var(--fs-18); font-weight: 650; }.honor__d{ font-size: var(--fs-14); color: var(--c-ink-2); line-height: 1.7; }.logos{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--c-line); border-radius: var(--r-lg); overflow: hidden; }.logo-cell{
  display: grid;
  place-items: center;
  min-height: 112px;
  padding: var(--sp-5);
  background: var(--c-bg);
  font-family: var(--font-num);
  font-size: var(--fs-16);
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--c-ink-3);
  transition: color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out);
}.logo-cell:hover{ color: var(--c-ink); background: var(--c-surface); }.logo-cell span{ display: block; margin-top: 6px; font-family: var(--font-cn); font-size: var(--fs-12); font-weight: 400; letter-spacing: 0.1em; }/* --------------------------------------------------------------------------
   13. 商务合作页
   -------------------------------------------------------------------------- */
.contact__grid{ display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: var(--sp-9); }.info-list{ display: grid; gap: var(--sp-6); margin-top: var(--sp-6); }.info-item__k{
  font-size: var(--fs-12);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ink-3);
}.info-item__v{ margin-top: 6px; font-size: var(--fs-18); font-weight: 600; line-height: 1.6; }.info-item__v a:hover{ color: var(--c-accent); }.info-item__sub{ font-size: var(--fs-14); color: var(--c-ink-2); }.qr{
  width: 132px;
  border-radius: var(--r-md);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  padding: 12px;
  text-align: center;
}/* --------------------------------------------------------------------------
   14. 表单
   -------------------------------------------------------------------------- */
.form-card{
  padding: var(--sp-8);
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-3);
}.form__grid{ display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }.field{ display: flex; flex-direction: column; gap: var(--sp-2); }.field--full{ grid-column: 1 / -1; }.field__label{
  font-size: var(--fs-14);
  font-weight: 600;
  color: var(--c-ink);
}.field__label em{ font-style: normal; color: var(--c-accent); margin-left: 2px; }.input,
.select,
.textarea{
  width: 100%;
  min-height: 50px;
  padding: 12px 16px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--c-surface);
  box-shadow: inset 0 0 0 1px var(--c-line);
  color: var(--c-ink);
  font-family: inherit;
  font-size: var(--fs-15, 0.9375rem);
  transition: box-shadow var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}.textarea{ min-height: 116px; resize: vertical; line-height: 1.7; }.select{
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 42px;
  cursor: pointer;
}.input::placeholder, .textarea::placeholder{ color: var(--c-ink-3); }.input:focus,
.select:focus,
.textarea:focus{
  outline: none;
  background: var(--c-bg);
  box-shadow: inset 0 0 0 1.5px var(--c-accent), 0 0 0 4px var(--accent-a2);
}.field.has-error .input,
.field.has-error .select{ box-shadow: inset 0 0 0 1.5px var(--c-danger); }.field__err{
  font-size: var(--fs-12);
  color: var(--c-danger);
  min-height: 1px;
  opacity: 0;
  transform: translateY(-4px);
  transition: all var(--dur-fast) var(--ease-out);
}.field.has-error .field__err{ opacity: 1; transform: none; }/* 无 JS 兜底提示：表单靠 JS 提交，禁用 JS 时必须告知替代联系方式 */
.form__noscript{
  margin: 0 0 var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid rgba(249,115,22,0.32);
  border-radius: var(--r-sm, 8px);
  background: rgba(249,115,22,0.06);
  font-size: var(--fs-12);
  line-height: 1.7;
  color: var(--c-ink-2);
}.form__noscript a{ color: var(--c-accent, #F97316); text-decoration: underline; }/* 多选：胶囊式勾选 */
.chips{ display: flex; gap: var(--sp-3); flex-wrap: wrap; }.form__note{ margin-top: var(--sp-4); font-size: var(--fs-12); color: var(--c-ink-3); line-height: 1.7; }.form__foot{ margin-top: var(--sp-6); display: flex; align-items: center; gap: var(--sp-5); flex-wrap: wrap; }/* --------------------------------------------------------------------------
   15. 弹层：留资表单 / 参数浮窗
   -------------------------------------------------------------------------- */
.modal{
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: var(--sp-6);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-base) var(--ease-out);
}.modal.is-open{ opacity: 1; pointer-events: auto; }.modal__mask{
  position: absolute;
  inset: 0;
  background: var(--ink-a4);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}.modal__panel{
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 64px);
  overflow: auto;
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-3);
  transform: translateY(18px) scale(0.98);
  transition: transform var(--dur-base) var(--ease-out);
}.modal.is-open .modal__panel{ transform: none; }.modal__close{
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 4;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--ink-a1);
  color: var(--c-ink-2);
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out);
}.modal__close:hover{ background: var(--c-ink); color: var(--c-bg); }.modal__head{ padding: var(--sp-7) var(--sp-8) 0; }.modal__body{ padding: var(--sp-6) var(--sp-8) var(--sp-8); }/* 参数浮窗：左 40% 视觉轮播 / 右 60% 规格 */
.spec{ display: grid; grid-template-columns: 40% 60%; }.spec__shot.is-on{ opacity: 1; transform: none; }.spec__thumb.is-on{ background: var(--c-ink); color: var(--c-bg); box-shadow: none; }/* --------------------------------------------------------------------------
   16. Toast
   -------------------------------------------------------------------------- */
.toast{
  position: fixed;
  left: 50%;
  top: calc(var(--header-h) + 20px);
  z-index: 200;
  transform: translate(-50%, -16px);
  opacity: 0;
  pointer-events: none;
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: 14px 22px;
  border-radius: var(--r-pill);
  background: var(--c-ink);
  color: var(--c-bg);
  box-shadow: var(--sh-3);
  font-size: var(--fs-15, 0.9375rem);
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}.toast.is-on{ opacity: 1; transform: translate(-50%, 0); }.toast i{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--c-accent);
  display: grid;
  place-items: center;
  flex: none;
}/* --------------------------------------------------------------------------
   17. 底部 CTA 与页脚
   -------------------------------------------------------------------------- */
.cta-band{
  position: relative;
  overflow: hidden;
  border-radius: var(--r-xl);
  padding: var(--sp-10) var(--sp-9);
  background: linear-gradient(120deg, var(--c-ink) 0%, var(--c-tech-card) 58%, var(--c-tech-hi) 100%);
  color: var(--c-bg);
}.cta-band::after{
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--accent-a4), transparent 62%);
  filter: blur(20px);
}.cta-band__inner{ position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); flex-wrap: wrap; }.cta-band .h2{ color: var(--c-bg); }.cta-band p{ margin-top: var(--sp-3); color: var(--on-tech-2); max-width: 46em; }.site-footer{ padding: var(--sp-9) 0 var(--sp-7); background: var(--c-surface); }.footer__grid{ display: grid; grid-template-columns: minmax(0, 430px) repeat(3, 1fr); gap: var(--sp-8); }/* 页脚公司简介：只在句号处换行，词组不拆分 */
.footer__line{ white-space: normal; overflow-wrap: break-word; }.footer__col .nw{ white-space: normal; }
}.footer__col h4{
  font-size: var(--fs-14);
  font-weight: 650;
  margin-bottom: var(--sp-4);
  letter-spacing: 0.04em;
}.footer__col li{ margin-bottom: var(--sp-3); }.footer__col a{ font-size: var(--fs-14); color: var(--c-ink-2); }.footer__col a:hover{ color: var(--c-accent); }.footer__bottom{
  margin-top: var(--sp-8);
  padding-top: var(--sp-5);
  display: flex;
  justify-content: space-between;
  gap: var(--sp-5);
  flex-wrap: wrap;
  box-shadow: inset 0 1px 0 var(--c-line);
  font-size: var(--fs-12);
  color: var(--c-ink-3);
}.footer__bottom a:hover{ color: var(--c-accent); }/* --------------------------------------------------------------------------
   17.2 深色首屏页：导航在未滚动时反白，滚动后回归玻璃白底
   -------------------------------------------------------------------------- */
.hero--dark{
  position: relative;
  background: var(--c-tech);
  color: var(--on-tech);
  padding-top: calc(var(--header-h) + 104px);
  padding-bottom: var(--sp-10);
  overflow: hidden;
}.hero--dark::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(var(--c-tech-ghost) 1px, transparent 1px),
    linear-gradient(90deg, var(--c-tech-ghost) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(70% 80% at 70% 20%, #000 0%, transparent 76%);
  -webkit-mask-image: radial-gradient(70% 80% at 70% 20%, #000 0%, transparent 76%);
}.hero--dark::after{
  content: "";
  position: absolute;
  top: -160px;
  left: 46%;
  width: 860px;
  height: 720px;
  background: radial-gradient(circle, var(--accent-a3), transparent 64%);
  pointer-events: none;
}.hero--dark .hero__sub{ color: var(--on-tech-2); }.hero--dark .chip{ background: var(--c-tech-ghost); box-shadow: inset 0 0 0 1px var(--c-tech-mist); color: var(--on-tech-2); }.hero--dark .h1{ color: var(--c-bg); }.hero--dark .btn--ghost{ --btn-fg: var(--c-bg); box-shadow: inset 0 0 0 1px var(--on-tech-4); }.hero--dark .btn--ghost:hover{ --btn-bg: var(--c-tech-veil); box-shadow: inset 0 0 0 1px var(--on-tech-3); }.hero__panel{ position: relative; z-index: 2; }.page-dark-hero .site-header:not(.is-stuck) .brand__en,
.page-dark-hero .site-header:not(.is-stuck) .nav__link{ color: var(--c-bg); }.page-dark-hero .site-header:not(.is-stuck) .brand__cn{ color: var(--on-tech-50); }.page-dark-hero .site-header:not(.is-stuck) .nav__link:hover{ color: var(--c-bg); }/* 中台能力卡：卡片内嵌一块信息可视化，而非装饰图标 */
.caps{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6); }.cap{
  padding: var(--sp-7);
  border-radius: var(--r-xl);
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}.cap:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }.cap__viz{
  height: 132px;
  margin-bottom: var(--sp-6);
  border-radius: var(--r-md);
  background: linear-gradient(160deg, var(--c-surface) 0%, var(--c-surface-2) 100%);
  display: grid;
  place-items: center;
  overflow: hidden;
}.cap__viz svg{ width: 100%; height: 100%; }.cap__no{ font-family: var(--font-num); font-size: var(--fs-12); letter-spacing: 0.14em; color: var(--c-accent); }.cap__title{ margin: var(--sp-2) 0 var(--sp-3); }.cap__desc{ font-size: var(--fs-15, 0.9375rem); color: var(--c-ink-2); line-height: 1.75; }/* 聚合 — 适配 — 赋能：三段式中台架构 */
.arch{ display: grid; grid-template-columns: repeat(3, 1fr) ; gap: 0; align-items: stretch; }.arch__node{ position: relative; padding: var(--sp-7) var(--sp-6); }.arch__node + .arch__node::before{
  content: "";
  position: absolute;
  left: 0;
  top: 26%;
  bottom: 26%;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--c-tech-line), transparent);
}.arch__k{ font-family: var(--font-num); font-size: var(--fs-12); letter-spacing: 0.16em; color: var(--c-accent-200); }.arch__t{ margin: var(--sp-3) 0; font-size: var(--fs-20); font-weight: 650; color: var(--c-bg); }.arch__d{ font-size: var(--fs-14); color: var(--on-tech-2); line-height: 1.8; }.pcard__device svg,
.spec__shot svg,
.stack__item svg{ height: 100%; width: auto; }.stack__item--main{ height: 336px; }.stack__item--side{ height: 232px; opacity: 0.94; }/* --------------------------------------------------------------------------
   18. 响应式：桌面优先，向下兼容
   -------------------------------------------------------------------------- */
@media (max-width: 1439px) {:root{ --gutter: 32px; }
}@media (max-width: 1180px) {.hero__grid{ grid-template-columns: 1fr; gap: var(--sp-7); }.hero__visual{ margin-right: 0; min-height: 380px; }.tech__grid{ grid-template-columns: 1fr; gap: var(--sp-7); }.contact__grid{ grid-template-columns: 1fr; gap: var(--sp-7); }.grid-3, .pcards, .honors, .timeline{ grid-template-columns: repeat(2, 1fr); }.footer__grid{ grid-template-columns: 1fr 1fr; }
}@media (max-width: 900px) {:root{ --gutter: 24px; --sp-10: 88px; }.nav{ display: none; }.stats{ grid-template-columns: repeat(2, 1fr); }.stat:nth-child(3)::before, .stat:nth-child(3){ }.stat:nth-child(3)::before{ display: none; }.grid-3, .pcards, .honors, .timeline, .grid-2{ grid-template-columns: 1fr; }.logos{ grid-template-columns: repeat(2, 1fr); }.spec{ grid-template-columns: 1fr; }.form__grid{ grid-template-columns: 1fr; }.footer__grid{ grid-template-columns: 1fr; }
}/* 数据横栏中的正版数据（信任蓝变体） */
.stat--trust .stat__num em{ color: var(--c-trust); }/* ---- 双轮合作伙伴矩阵 ---- */
.partner-block + .partner-block{ margin-top: var(--sp-7); }.partner-block__head{ display: flex; align-items: baseline; gap: var(--sp-3); margin-bottom: var(--sp-4); flex-wrap: wrap; }.partner-block__title{ font-size: var(--fs-16); font-weight: 700; color: var(--c-ink); }.partner-block__note{ font-size: var(--fs-13); color: var(--c-ink-3); }
@keyframes marquee{ to { transform: translateX(-50%); } }/* 数据横栏：中文单位词（跟随数字字号的一半） */
.stat__num .stat__cn{
  font-family: var(--font-cn);
  font-size: 0.52em;
  font-weight: 700;
  margin-left: 4px;
  letter-spacing: 0;
}/* 荣誉墙：版权合规认证（信任蓝变体） */
.honor--trust .honor__no{ color: var(--c-trust); }.honor--trust .honor__t{ color: var(--c-trust); }/* 表单标签：选填标记 */
.field__opt{
  margin-left: 6px;
  font-size: var(--fs-12);
  font-style: normal;
  font-weight: 400;
  color: var(--c-ink-3);
}
@keyframes rail{ to { background-position: 120px 0; } }/* ---- 20.5 免责声明双栏：正文与联系方式分区，不再是一整段堆在卡片里 ---- */
.disc{
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  gap: var(--sp-5);
  margin-top: var(--sp-7);
}.disc__aside .btn{ margin-top: var(--sp-5); align-self: flex-start; }/* --------------------------------------------------------------------------
   20.7 版权专区响应式：保持表格形态与链路可读性
   -------------------------------------------------------------------------- */
@media (max-width: 1180px) {.disc{ grid-template-columns: 1fr; }
}/* ==========================================================================
   14. V3.0 新增组件 —— 技术攻坚案例 / 下游脱敏生态墙
   设计语言沿用：极简白底 + 深空灰技术面 + 亮橘唯一强调（≤10%）
   ========================================================================== */

/* ---- 14.1 场景化技术攻坚案例（挑战 → 攻坚 → 指标，三段式） ---- */
.cases{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-5);
}.case{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: var(--sp-6);
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}/* 左侧橘色竖向标识条：点明「攻坚」属性 */
.case::before{
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--c-accent-400), var(--c-accent-deep));
}/* 右上角极淡橘晕，hover 时浮现 */
.case::after{
  content: '';
  position: absolute;
  right: -60px; top: -60px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--accent-a1), transparent 68%);
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out);
  pointer-events: none;
}.case:hover{
  transform: translateY(-4px);
  box-shadow: var(--sh-2);
  border-color: var(--accent-a3);
}.case:hover::after{ opacity: 1; }.case .h3{
  margin: 0;
  font-size: var(--fs-18);
  font-weight: 650;
  line-height: 1.55;
  letter-spacing: -0.01em;
}.case__tag{
  align-self: flex-start;
  padding: 5px 11px;
  background: var(--c-accent-soft);
  color: var(--c-accent-deep);
  border-radius: var(--r-pill);
  font-family: var(--font-num);
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.08em;
}.case__block{
  font-size: var(--fs-14);
  line-height: 1.8;
  color: var(--c-ink-2);
}.case__block .k{
  display: block;
  margin-bottom: var(--sp-1);
  font-family: var(--font-num);
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--c-ink-3);
}/* 第二段为「技术攻坚」，用橘色标记转折 */
.case__block + .case__block .k{ color: var(--c-accent); }.case__metrics{
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin-top: auto;
  padding-top: var(--sp-4);
  border-top: 1px dashed var(--c-line);
}.case__metrics span{
  padding: 5px 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-xs);
  font-family: var(--font-num);
  font-size: var(--fs-13);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--c-ink);
  transition: color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out);
}.case:hover .case__metrics span{ border-color: var(--accent-a3); }/* ---- 14.2 下游脱敏徽章阵列（NDA 匿名化） ---- */
.anon-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: var(--c-line);
  border-radius: var(--r-lg);
  overflow: hidden;
}.anon-cell{
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-height: 104px;
  padding: var(--sp-5);
  background: var(--c-surface);
  font-size: var(--fs-14);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: var(--c-ink-2);
  transition: background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out);
}/* 斜向细纹：视觉上表达「已脱敏 / 遮蔽」，不改变可读性 */
.anon-cell::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    135deg,
    transparent 0 6px,
    var(--ink-a1) 6px 7px
  );
  pointer-events: none;
}.anon-cell svg{
  position: relative;
  flex: none;
  color: var(--c-ink-3);
  transition: color var(--dur-base) var(--ease-out);
}.anon-cell:hover{ background: var(--c-bg); color: var(--c-ink); }.anon-cell:hover svg{ color: var(--c-accent); }/* ---- 14.3 保密协议注脚 ---- */
.nda-note{
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-sm);
  font-size: var(--fs-13);
  line-height: 1.7;
  color: var(--c-ink-2);
}.nda-note svg{ flex: none; color: var(--c-accent); }/* ---- 响应式 ---- */
@media (max-width: 1024px) {.cases{ grid-template-columns: repeat(2, minmax(0, 1fr)); }.anon-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}@media (max-width: 720px) {.cases{ grid-template-columns: minmax(0, 1fr); }.anon-grid{ grid-template-columns: minmax(0, 1fr); }.case{ padding: var(--sp-5); }.anon-cell{ min-height: 84px; }
}/* ==========================================================================
   21. V3.1 质感与科技感动效增强层（严守三色系统：白 / 深空灰 / 亮橘 ≤10%）
   仅追加覆盖，不改动既有令牌与结构。
   ========================================================================== */

/* ---- 21.1 主按钮扫光：hover 时一道光扫过，强化「行动」质感 ---- */
.btn--primary{ overflow: hidden; }.btn--primary::after{
  content: "";
  position: absolute;
  top: -2px; bottom: -2px;
  left: -160%;
  width: 55%;
  background: linear-gradient(105deg,
    transparent 0%, rgba(255, 255, 255, 0.5) 50%, transparent 100%);
  transform: skewX(-20deg);
  pointer-events: none;
  animation: shimmer 1.6s var(--ease-out) infinite;
  animation-delay: 1.2s;
}.btn--primary:hover::after{ animation-delay: 0s; }

@keyframes shimmer{
  0% { left: -160%; }
  55% { left: 160%; }
  100% { left: 160%; }
}/* ---- 21.2 产品卡：光斑跟随 + 3D 微倾（触屏/减少动效自动降级） ---- */
.pcard{ --mx: 50%; --my: 50%; --rx: 0deg; --ry: 0deg; }.pcard::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: radial-gradient(
    260px circle at var(--mx) var(--my),
    var(--accent-a2) 0%,
    transparent 65%
  );
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out);
  pointer-events: none;
}.pcard:hover::after{ opacity: 1; }.pcard__visual{ perspective: 900px; }.pcard__device{
  transform-style: preserve-3d;
  will-change: transform;
}.pcard:hover .pcard__device{
  transform: translateY(-10px) scale(1.045)
    rotateX(var(--rx)) rotateY(var(--ry));
}/* ---- 21.3 Hero 光环呼吸：光晕缓慢明暗缩放，营造「活体」感 ---- */
.orb{ animation: orbBreathe 8s var(--ease-io) infinite; }.orb--b{ animation-delay: -4s; }

@keyframes orbBreathe{
  0%, 100% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.14); opacity: 1; }
}/* ---- 21.4 深色板块光晕漂移：缓慢流动，避免静态死板 ---- */
.tech::after{ animation: drift 20s var(--ease-io) infinite; }

@keyframes drift{
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(-70px, 46px, 0); }
}/* ---- 21.5 优势卡序号微光：hover 时大数字微微点亮为橘 ---- */
.card__index{ transition: color var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out); }.card--adv:hover .card__index{ color: var(--c-accent); opacity: 0.12; }/* ---- 21.6 滚动入场增强：叠加轻微缩放与聚焦模糊，更有「对焦」质感 ---- */
.js .reveal{ opacity: 0; transform: translateY(30px) scale(0.99); filter: blur(4px); }.reveal.is-in{
  opacity: 1;
  transform: none;
  filter: blur(0);
  transition: opacity var(--dur-slow) var(--ease-out),
    transform var(--dur-slow) var(--ease-out),
    filter var(--dur-slow) var(--ease-out);
  transition-delay: var(--d, 0ms);
}/* ---- 21.7 底部 CTA 斜光扫动：深色面上的一抹橘光缓慢往返 ---- */
.cta-band::before{
  content: "";
  position: absolute;
  top: -40%;
  bottom: -40%;
  left: -30%;
  width: 46%;
  background: linear-gradient(105deg,
    transparent 0%, var(--accent-a2) 50%, transparent 100%);
  transform: skewX(-16deg);
  pointer-events: none;
  animation: ctaSweep 9s var(--ease-io) infinite;
}
@keyframes ctaSweep{
  0%, 100% { transform: translateX(-60%) skewX(-16deg); }
  50% { transform: translateX(320%) skewX(-16deg); }
}/* ---- 21.8 脱敏徽章 hover：斜向细纹淡出，图标点亮，强化反馈 ---- */
.anon-cell::before{ transition: opacity var(--dur-base) var(--ease-out); }.anon-cell:hover::before{ opacity: 0.35; }/* ---- 21.9 深色面板呼吸描边：dash 仪表盘浮起一层淡光 ---- */
.dash{ transition: box-shadow var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }.dash:hover{ transform: translateY(-3px); }/* ---- 动效降级：减少动效时全部关停 ---- */
@media (prefers-reduced-motion: reduce) {.btn--primary::after,
  .orb,
  .tech::after,
  .cta-band::before{ animation: none; }.pcard::after{ display: none; }.js .reveal{ opacity: 1; transform: none; filter: none; }
}/* --------------------------------------------------------------------------
   22. 全志芯片代理 & AI 核心板（新增）
   -------------------------------------------------------------------------- */
.chips-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); }.chip-card{
  padding: var(--sp-6);
  border-radius: var(--r-lg);
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  box-shadow: var(--sh-1);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}.chip-card:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }.chip-card__icon{
  display: block;
  margin-bottom: var(--sp-4);
  color: var(--c-accent);
}.chip-card__name{
  font-family: var(--font-num);
  font-size: var(--fs-20);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--c-ink);
}.chip-card__role{
  margin-top: 3px;
  font-size: var(--fs-12);
  font-weight: 600;
  color: var(--c-accent);
  letter-spacing: 0.04em;
}.chip-card__spec{
  margin-top: var(--sp-4);
  font-size: var(--fs-14);
  color: var(--c-ink-2);
  line-height: 1.7;
}.chip-tags{ margin-top: var(--sp-6); display: flex; gap: var(--sp-2); flex-wrap: wrap; align-items: center; }.chip-tags .chip-tags__lead{
  background: var(--c-accent-soft);
  color: var(--c-accent-deep);
  font-weight: 600;
}.chip-core{
  margin-top: var(--sp-6);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-5);
}.chip-core__item{
  padding: var(--sp-6);
  border-radius: var(--r-lg);
  background: var(--c-bg);
  border: 1px solid var(--c-line);
}.chip-core__t{ font-size: var(--fs-16); font-weight: 650; color: var(--c-ink); margin-bottom: var(--sp-2); }.chip-core__d{ font-size: var(--fs-14); color: var(--c-ink-2); line-height: 1.7; }@media (max-width: 900px) {.chips-grid, .chip-core{ grid-template-columns: repeat(2, 1fr); }
}@media (max-width: 620px) {.chips-grid, .chip-core{ grid-template-columns: 1fr; }
}/* --------------------------------------------------------------------------
   23. 产品卡图片轮播（真实渲染图 + 多图切换）
   -------------------------------------------------------------------------- */
.pcard__gallery{ width: 100%; height: 100%; }.gallery__track{
  position: relative;
  width: 100%;
  height: 100%;
}.gallery__slide{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out);
  pointer-events: none;
}.gallery__slide.is-on{ opacity: 1; }.gallery__slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}.gallery__dots{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 8px;
  display: flex;
  justify-content: center;
  gap: 6px;
  z-index: 3;
}.gallery__dot{
  width: 6px;
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.28);
  cursor: pointer;
  transition: width var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}.gallery__dot.is-on{
  width: 16px;
  border-radius: 3px;
  background: var(--c-accent);
}.gallery__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: var(--c-bg);
  box-shadow: var(--sh-1);
  color: var(--c-ink);
  display: grid;
  place-items: center;
  opacity: 0;
  pointer-events: none;
  cursor: pointer;
  z-index: 3;
  transition: opacity var(--dur-fast) var(--ease-out);
}.gallery__nav svg{ width: 14px; height: 14px; }.pcard:hover .gallery__nav{ opacity: 1; pointer-events: auto; }@media (hover: none) {.gallery__nav{ opacity: 0.92; pointer-events: auto; }
}/* --------------------------------------------------------------------------
   24. 大模型生态标签条（平台页「聚合—适配—赋能」下）
   -------------------------------------------------------------------------- */
.model-eco{ margin-top: var(--sp-7); }.model-eco__head{
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-bottom: var(--sp-4);
}.model-eco__title{ font-size: var(--fs-16); font-weight: 650; color: var(--c-bg); }.model-eco__hint{ font-size: var(--fs-14); color: var(--on-tech-2); }.model-eco__groups{ display: flex; flex-wrap: wrap; gap: var(--sp-4) var(--sp-7); }.model-eco__group{ display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }.model-eco__label{
  font-size: var(--fs-12);
  font-weight: 600;
  color: var(--c-accent-200);
  letter-spacing: 0.04em;
}.model-chip{
  padding: 6px 14px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--c-bg);
  font-size: var(--fs-14);
  font-weight: 600;
}/* --------------------------------------------------------------------------
   25. 首屏产品悬浮图（透明羽化 PNG，无边界、自然悬浮）
   -------------------------------------------------------------------------- */
.stack{ max-width: 100%; }.stack__item--photo{
  position: relative;
  height: auto;
  /* 无背景 / 无边框 / 无圆角 —— 透明羽化图直接融入页面 */
}.stack__item--photo img{
  display: block;
  width: 100%;
  height: auto;
  /* 悬浮投影：跟随透明轮廓的自然阴影，而非方形卡片阴影 */
  filter: drop-shadow(0 30px 26px rgba(15, 23, 42, 0.20))
          drop-shadow(0 10px 14px rgba(15, 23, 42, 0.10));
  transition: transform var(--dur-base) var(--ease-out),
    filter var(--dur-base) var(--ease-out);
}.stack__item--photo:hover img{
  transform: translateY(-8px);
  filter: drop-shadow(0 40px 34px rgba(15, 23, 42, 0.24))
          drop-shadow(0 14px 18px rgba(15, 23, 42, 0.12));
}/* 落地接触影：产品脚下的柔和椭圆影，增强悬浮落地层次 */
.stack__item--photo::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -12px;
  width: 62%;
  height: 20px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(15, 23, 42, 0.26), transparent 70%);
  filter: blur(5px);
  pointer-events: none;
}/* 双卡错峰悬浮：各自缓慢上下漂浮，营造自然悬浮感 */
.stack__item--main.stack__item--photo{ width: 288px; animation: floatY 7s var(--ease-io) infinite; }.stack__item--side.stack__item--photo{
  width: 228px;
  margin-bottom: 34px;
  margin-right: -56px;
  opacity: 1;
  animation: floatY 7s var(--ease-io) -3.5s infinite;
}/* 去掉整体 stack 的浮动（改由各卡独立错峰悬浮） */
.stack{ animation: none; }.stack__tag{
  position: absolute;
  top: 10px;
  left: 14px;
  z-index: 2;
  padding: 4px 11px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: var(--sh-1);
  font-size: var(--fs-12);
  font-weight: 650;
  letter-spacing: 0.08em;
  color: var(--c-ink-2);
}@media (prefers-reduced-motion: reduce) {.stack__item--photo{ animation: none; }
}@media (max-width: 640px) {.stack__item--main.stack__item--photo{ width: min(288px, 62vw); }.stack__item--side.stack__item--photo{
    width: min(228px, 48vw);
    margin-right: -40px;
    margin-bottom: 26px;
  }
}/* 实时波动计数器：等宽数字，位数变化不抖动 */
[data-live-devices]{
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}/* --------------------------------------------------------------------------
   26. CJK 排版优化：标点不悬挂、标题均衡换行、词组防拆
   -------------------------------------------------------------------------- */
/* 中文严格换行规则：闭标点（，。、；：？！）不落于行首，开标点（“（【）不落于行尾 */
body{ line-break: strict; }/* 多行标题行长均衡，避免孤词短行（渐进增强，不支持的浏览器回退默认换行） */
.h1, .h2, .h3{ text-wrap: balance; }/* 语义完整短语块：块内不换行，块间自然换行；窄屏回退为正常换行防溢出 */
.nb{ white-space: nowrap; }@media (max-width: 1180px) {.nb{ white-space: normal; }
}/* --------------------------------------------------------------------------
   27. V6 商业合作页组件 + 品牌 LOGO 放大
   -------------------------------------------------------------------------- */
/* 品牌 LOGO 放大（用户要求）：导航 30→40px，页脚 34→46px */
.brand__logo{ height: 40px; width: auto; display: block; }.site-footer .brand__logo{ height: 46px; }/* 四列网格（首页四大终端入口 / 优势速览） */
.grid-4{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-6);
}/* 5 大硬核支柱卡：痛点/解法双段式 */
.pillar__tag{
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--r-pill);
  background: var(--accent-a2);
  color: var(--c-accent);
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.06em;
}.pillar__block{
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px dashed var(--c-line);
  font-size: var(--fs-14);
  color: var(--c-ink-2);
  line-height: 1.75;
}.pillar__block .k{
  display: block;
  margin-bottom: 4px;
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--c-ink-3);
}.pillar__block--cure .k{ color: var(--c-accent); }/* 采购决策对比表 */
.cmp{
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--sh-1);
  background: var(--c-bg);
}.cmp__row{
  display: grid;
  grid-template-columns: 0.9fr 1.15fr 1.3fr 1.05fr;
}.cmp__row + .cmp__row{ border-top: 1px solid var(--c-line); }.cmp__cell{
  padding: var(--sp-5) var(--sp-5);
  font-size: var(--fs-14);
  line-height: 1.7;
  color: var(--c-ink-2);
}.cmp__cell--h{
  background: var(--c-tech);
  color: rgba(255, 255, 255, 0.92);
  font-weight: 650;
  font-size: var(--fs-13);
  letter-spacing: 0.04em;
}.cmp__cell--dim{ background: var(--c-bg-2, #f8fafc); color: var(--c-ink-3); }.cmp__cell--key{ font-weight: 650; color: var(--c-ink); }.cmp__cell--our{
  background: var(--accent-a2);
  color: var(--c-ink);
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--c-accent);
}.cmp__row--head .cmp__cell--our{ color: var(--c-accent-200, #fdba74); box-shadow: none; }/* 合作模式卡序号 */
.mode__fit{ margin-top: auto; }@media (max-width: 1080px) {.grid-4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }.cmp__row{ grid-template-columns: 1fr 1fr; }.cmp__cell--h{ display: none; }.cmp__cell::before{
    display: block;
    margin-bottom: 4px;
    font-size: var(--fs-12);
    font-weight: 700;
    color: var(--c-ink-3);
    letter-spacing: 0.08em;
  }
}@media (max-width: 640px) {.grid-4{ grid-template-columns: 1fr; }.cmp__row{ grid-template-columns: 1fr; }
}/* 单品类卡片网格：单列限宽（V6 毛绒 / 具身机器人区） */
.pcards--solo{
  grid-template-columns: minmax(0, 560px);
}/* 对比表移动端列标签 + RFQ 双栏响应式兜底 */
@media (max-width: 1080px) {.cmp__cell::before{ content: attr(data-k); }.cmp__cell--h::before{ content: none; }.contact__grid{ grid-template-columns: 1fr; }
}/* --------------------------------------------------------------------------
   28. 卡片标题单行化治理（V6.1）
   策略：按栏宽精确降字号 + nowrap 强制单行；窄屏回退允许换行防溢出
   -------------------------------------------------------------------------- */
/* 5 列支柱卡：内边距降密度（40→24），标题 24→16px 单行 */
.grid-5 .card{ padding: var(--sp-5); }.grid-5 .card__title{
  font-size: 16px;
  white-space: nowrap;
  letter-spacing: -0.02em;
}/* 4 列卡（优势速览 / 合作模式 / 终端入口 / 售后承诺）：内边距 40→32，标题 24→16px 单行 */
.grid-4 .card{ padding: var(--sp-6); }.grid-4 .card__title,
.grid-4 .pcard__title{
  font-size: 16px;
  white-space: nowrap;
  letter-spacing: -0.02em;
}/* 产品中心 3 列产品卡：标题 24→20px，桌面自然单行、窄屏正常换行不溢出 */
.pcards .pcard__title{
  font-size: var(--fs-20);
  letter-spacing: -0.02em;
}/* 窄屏回退：放开单行约束，避免文字溢出卡片 */
@media (max-width: 640px) {.grid-4 .card__title,
  .grid-4 .pcard__title{ white-space: normal; }
}@media (max-width: 560px) {.grid-5 .card__title{ white-space: normal; }
}.spec__thumb--dot.is-on{ background: var(--c-accent); box-shadow: none; }/* 使命宣言卡：背景图 + 橙色动态高亮（v6.3） */
.mission-card{
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 4 / 3;
  min-height: 0;
  padding: var(--sp-7);
  border-radius: var(--r-xl);
  background: url("../img/mission-bg-43.jpg") center 45% / cover no-repeat;
  box-shadow: var(--sh-3);
}.mission-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.02) 0%, rgba(15, 23, 42, 0.48) 90%);
}.mission-card__label{
  position: relative;
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.88);
}.mission-card__text{
  position: relative;
  margin-top: var(--sp-3);
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 800;
  line-height: 1.38;
  letter-spacing: -0.01em;
  color: #fff;
}.mission-hl{
  padding: 0 0.18em 0.05em;
  border-radius: 0.16em;
  color: #fff;
  background: linear-gradient(90deg, rgba(249, 115, 22, 0.9), rgba(251, 146, 60, 0.55), rgba(249, 115, 22, 0.9));
  background-size: 200% 100%;
  animation: missionHl 3s linear infinite;
}
@keyframes missionHl{
  to { background-position: -200% 0; }
}@media (prefers-reduced-motion: reduce) {.mission-hl{ animation: none; }
}/* h2 强制单行（仅宽屏，窄屏回退自然换行防溢出） */
.h2--oneline{ white-space: nowrap; }@media (max-width: 860px) {.h2--oneline{ white-space: normal; }
}/* about 使命卡加宽（桌面 0.8/1.2，窄屏回退单列） */
.hero__grid--mission{ grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }@media (max-width: 1080px) {.hero__grid--mission{ grid-template-columns: 1fr; }
}/* --------------------------------------------------------------------------
   29. 资质与荣誉墙 · 深色强化版（v6.4）
   -------------------------------------------------------------------------- */
.honors-v2{
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, #0b1220 0%, #0f172a 55%, #16213c 100%);
  color: #e8eef7;
}.honors-v2::before{
  content: "";
  position: absolute;
  width: 560px;
  height: 560px;
  right: -180px;
  top: -220px;
  background: radial-gradient(circle, rgba(249, 115, 22, 0.16), transparent 65%);
  pointer-events: none;
}.honors-v2 .h2{ color: #ffffff; }.honors-v2 .sec-desc{ color: rgba(232, 238, 247, 0.66); }.honors-v2__grid{
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 1.58fr);
  gap: var(--sp-6);
}/* 特色大卡：小巨人 + 奖杯视觉图 */
.hv2-feature{
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  min-height: 560px;
  border-radius: var(--r-xl);
  background: url("../img/honors-wall.jpg") center 28% / cover no-repeat;
  box-shadow: 0 30px 60px -18px rgba(2, 6, 23, 0.6);
}.hv2-feature::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11, 18, 32, 0.04) 30%, rgba(11, 18, 32, 0.86) 90%);
}.hv2-feature__body{ position: relative; padding: var(--sp-7); }.hv2-feature__badge{
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--r-pill);
  background: var(--c-accent);
  color: #fff;
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.08em;
}.hv2-feature__title{
  margin-top: var(--sp-4);
  font-size: clamp(1.5rem, 2.2vw, 1.9rem);
  font-weight: 750;
  line-height: 1.35;
  color: #fff;
}.hv2-feature__desc{
  margin-top: var(--sp-3);
  font-size: var(--fs-14);
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.78);
}.hv2-feature__stats{
  display: flex;
  gap: var(--sp-7);
  margin-top: var(--sp-5);
  padding-top: var(--sp-5);
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}.hv2-feature__stats b{
  display: block;
  font-family: var(--font-num);
  font-size: var(--fs-24);
  color: var(--c-accent-400);
}.hv2-feature__stats span{
  font-size: var(--fs-12);
  color: rgba(255, 255, 255, 0.66);
}/* 荣誉条目：玻璃拟态 + 图标 */
.hv2-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-5);
  align-content: start;
}.hv2-item{
  display: flex;
  gap: var(--sp-4);
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: transform var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out);
}.hv2-item:hover{
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.09);
}.hv2-item svg{ flex: none; color: var(--c-accent-400); margin-top: 2px; }.hv2-item__no{
  font-family: var(--font-num);
  font-size: var(--fs-12);
  letter-spacing: 0.1em;
  color: var(--c-accent-200);
}.hv2-item__t{
  margin: 4px 0;
  font-size: var(--fs-16);
  font-weight: 650;
  line-height: 1.45;
  color: #fff;
}.hv2-item__d{
  margin: 0;
  font-size: var(--fs-13);
  line-height: 1.7;
  color: rgba(232, 238, 247, 0.62);
}.hv2-item--wide{ grid-column: span 2; }@media (max-width: 1080px) {.honors-v2__grid{ grid-template-columns: 1fr; }.hv2-feature{ min-height: 420px; }
}@media (max-width: 640px) {.hv2-list{ grid-template-columns: 1fr; }.hv2-item--wide{ grid-column: auto; }
}/* --------------------------------------------------------------------------
   30. 移动端修复包（v6.5）：汉堡菜单 / dash 折叠 / 浮动卡 / 断词与字号
   -------------------------------------------------------------------------- */
/* 强制不换行工具类（.nb 在窄屏会回退，此类不随断点回退，用于短词防断） */
.nw{ white-space: nowrap; }/* 汉堡按钮（桌面隐藏） */
.nav-toggle{
  display: none;
  margin-left: auto;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}.nav-toggle span{
  display: block;
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--c-ink);
  transition: transform 0.25s var(--ease-out), opacity 0.25s;
}.nav-toggle.is-x span:nth-child(1){ transform: translateY(7px) rotate(45deg); }.nav-toggle.is-x span:nth-child(2){ opacity: 0; }.nav-toggle.is-x span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }/* 移动抽屉导航 */
.mobile-nav{ display: none; }/* 数据横栏数字与单位不拆分 */
.stat__num{ white-space: nowrap; }@media (max-width: 900px) {/* 汉堡按钮显示，抽屉展开 */
  /* P0-3：显式宽高必须在 900px 断点内声明。原实现放在 640px 断点，
     导致 360–640px 区间按钮被 flex 压缩到 20px 宽，主菜单几乎点不开。 */
  .nav-toggle{ display: flex; width: 44px; height: 44px; flex: none; }.header-cta{ margin-left: var(--sp-3); min-width: 0; flex-shrink: 1; }.mobile-nav{
    display: block;
    max-height: 0;
    overflow: hidden;
    background: var(--c-bg);
    box-shadow: 0 22px 34px -20px rgba(15, 23, 42, 0.28);
    transition: max-height 0.3s var(--ease-out);
  }.mobile-nav.is-open{ max-height: 340px; }.mobile-nav__link{
    display: block;
    padding: 13px var(--gutter);
    font-size: var(--fs-15);
    font-weight: 600;
    color: var(--c-ink);
    border-top: 1px solid var(--c-line);
  }.mobile-nav__link.is-active{ color: var(--c-accent); }/* 仪表盘矩阵：侧栏改顶部横排，主区全宽防挤压 */
  .dash__body{ grid-template-columns: 1fr; }.dash__side{
    display: flex;
    gap: 8px;
    padding: 10px 14px;
    border-right: 0;
    border-bottom: 1px solid var(--c-tech-line);
    overflow-x: auto;
  }.dash__nav{
    flex: none;
    padding: 6px 10px;
    font-size: var(--fs-12);
    white-space: nowrap;
  }.dash__main{ min-width: 0; padding: 14px; }.dash__kpis{ grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }.kpi{ min-width: 0; padding: 10px 8px; }.kpi__k{ white-space: nowrap; }.kpi__v{ font-size: var(--fs-16); }.dash__row{ grid-template-columns: 22px minmax(0, 1fr) max-content max-content; gap: 8px; }/* 首页浮动卡：不再悬出左边界 */
  .float-card{ left: 0; bottom: 4%; max-width: 64vw; }.float-card__value{ font-size: var(--fs-16); }
}/* 移动端字号整体降档（用户要求：手机上字体多降一些，贴近原生 App 紧凑观感） */
@media (max-width: 640px) {html{ font-size: 14px; }
}/* v6.5b 溢出修正：页头 flex 间距 + hero 叠卡 + 平台 dash 负边距 */
@media (max-width: 900px) {.header-inner{ gap: var(--sp-4); }.hero__visual .dash{ margin-right: 0 !important; }
}@media (max-width: 640px) {.site-header .brand__logo{ height: 34px; }.header-inner{ gap: var(--sp-3); }.hero__grid > *{ min-width: 0; }.stack{ gap: var(--sp-3); }.stack__item--side.stack__item--photo{ width: min(200px, 44vw); margin-right: -70px; }.stack__item--main.stack__item--photo{ width: min(250px, 56vw); }
}/* CTA 大标题双版本断行（移动端阶梯式，避免孤字与断词） */
.cta-h2-m{ display: none; }@media (max-width: 640px) {.cta-h2-d{ display: none; }.cta-h2-m{ display: inline; }
}/* CTA 内栏移动端纵向铺满（配合双版本断行） */
@media (max-width: 640px) {.cta-band__inner{ flex-direction: column; align-items: flex-start; gap: var(--sp-6); }.cta-band__inner > div{ width: 100%; max-width: 100%; }
}/* CTA 横幅移动端内边距收敛（原 96px 双侧把内容栏挤到 150px） */
@media (max-width: 640px) {.cta-band{ padding: var(--sp-7) var(--sp-6); }
}/* --------------------------------------------------------------------------
   31. UI 美化专项（v6.7）
   -------------------------------------------------------------------------- */
/* 孤字预防机制：描述性文本统一 pretty 换行（Chromium 117+，不支持自动回退） */
.pcard__desc, .card .body, .sec-desc, .cap__desc, .tl__desc,
.case__block, .chip-card__spec, .chip-core__d, .hv2-item__d, .hv2-feature__desc{
  text-wrap: pretty;
}/* 竖排标记清单（主张标签 / 模式要点共用组件） */
.ticks{
  list-style: none;
  margin: var(--sp-3) 0 var(--sp-4);
  padding: 0;
  display: grid;
  gap: 8px;
}.ticks li{
  position: relative;
  padding-left: 16px;
  font-size: var(--fs-13);
  font-weight: 600;
  line-height: 1.6;
  color: var(--c-ink);
}.ticks li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  background: var(--c-accent);
}.ticks--room{ gap: 10px; margin-top: var(--sp-4); }.ticks--room li{ font-weight: 500; color: var(--c-ink-2); }/* 优势卡：引导句 + 结果句分层 */
.adv__lead{
  font-size: var(--fs-14);
  line-height: 1.85;
  color: var(--c-ink-2);
}.adv__result{
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px dashed var(--c-line);
  font-size: var(--fs-14);
  line-height: 1.85;
  color: var(--c-ink);
}.adv__result b{ color: var(--c-accent); font-weight: 700; }/* 合作模式卡头：序号与标题同行 */
.mode2__head{ display: flex; align-items: baseline; gap: var(--sp-4); }.mode2__head .card__index{ position: static; }/* 时间轴渐进动效 */
.tlx__track{
  position: absolute;
  top: 11px;
  left: 4%;
  right: 4%;
  height: 2px;
  border-radius: 2px;
  background: var(--c-line);
  z-index: 0;
}.tlx__fill{
  display: block;
  height: 100%;
  width: 0;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--c-accent), var(--c-accent-400));
  transition: width 1.8s var(--ease-out);
}.tlx.is-in .tlx__fill{ width: 100%; }.tlx .tl__node{
  z-index: 1;
  transform: scale(0.55);
  opacity: 0.35;
  transition: transform 0.5s var(--ease-out), opacity 0.5s var(--ease-out);
  transition-delay: var(--d, 0ms);
}.tlx.is-in .tl__node{ transform: scale(1); opacity: 1; }.tlx.is-in .tl__item:last-child .tl__node::after{ animation: tlPing 2.4s ease-out 1s infinite; }
@keyframes tlPing{
  0% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.45); }
  100% { box-shadow: 0 0 0 16px rgba(249, 115, 22, 0); }
}@media (prefers-reduced-motion: reduce) {.tlx__fill{ width: 100% !important; transition: none; }.tlx .tl__node{ transform: none; opacity: 1; transition: none; }.tlx.is-in .tl__item:last-child .tl__node::after{ animation: none; }
}/* 荣誉墙：词条单行化 */
.hv2-feature__title{ font-size: clamp(1.15rem, 2vw, 1.5rem); white-space: nowrap; }.hv2-item__t{ font-size: var(--fs-15); letter-spacing: -0.01em; }@media (min-width: 900px) {.hv2-item__t{ white-space: nowrap; }
}/* 联系区二维码占位 */
.qr-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: var(--sp-6);
}.qr-slot{ width: 96px; text-align: center; }.qr-slot__icon{
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  border: 1.5px dashed var(--c-line-2);
  border-radius: var(--r-md);
  background: var(--c-surface);
  color: var(--c-ink-3);
}.qr-slot__label{
  display: block;
  margin-top: 6px;
  font-size: var(--fs-12);
  color: var(--c-ink-2);
}/* 平台 CTA：长句整行展示（桌面） */
@media (min-width: 1080px) {.cta-band--solo .cta-band__inner{ flex-direction: column; align-items: flex-start; gap: var(--sp-5); }.cta-band--solo .cta-band__inner > div{ width: 100%; max-width: 100%; }.cta-band--solo .cta-band__inner p{ white-space: nowrap; font-size: var(--fs-15); }
}/* 平台四大能力卡：排布舒展 */
.cap{ padding: var(--sp-6); display: flex; flex-direction: column; }.cap__viz{ margin-bottom: var(--sp-4); }.cap__viz svg{ display: block; margin-inline: auto; }.cap__desc{ flex: 1; }@media (max-width: 900px) {.spec{ grid-template-columns: minmax(0, 1fr); }
}/* 整句单行（≥1024 锁定，1024-1179 降字号防溢出，窄屏回退正常换行） */
@media (min-width: 1024px) {.nl-d{ white-space: nowrap; }
}@media (min-width: 1024px) and (max-width: 1179px) {.nl-d{ font-size: 15px; }
}/* 语言切换（v7.0 EN） */
.lang-switch{
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 13px;
  border-radius: var(--r-pill);
  box-shadow: inset 0 0 0 1px var(--c-line-2);
  font-family: var(--font-num);
  font-size: var(--fs-13);
  font-weight: 650;
  letter-spacing: 0.04em;
  color: var(--c-ink-2);
  transition: color var(--dur-fast, 0.2s), box-shadow var(--dur-fast, 0.2s);
}.lang-switch:hover{ color: var(--c-accent); box-shadow: inset 0 0 0 1px var(--c-accent); }.mobile-nav__link--lang{ color: var(--c-ink-3); font-family: var(--font-num); }/* EN 长文本徽章：窄屏允许换行防裁切 */
@media (max-width: 640px) {.hero__chips--grid .chip,
  .hero__chips .chip{ white-space: normal; line-height: 1.35; padding-top: 6px; padding-bottom: 6px; }
}

/* --------------------------------------------------------------------------
   32. WHY GUROBOT 深色板块（v8.0）+ 使命卡立体字
   -------------------------------------------------------------------------- */
.why-v2 {
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, #f8fafc 0%, #eff3f9 55%, #e8eef7 100%);
  color: var(--c-ink);
}
.why-v2__bg {
  position: absolute;
  inset: 0;
  background: url("../img/why-bg.jpg") center 42% / cover no-repeat;
  opacity: 0.2;
}
.why-v2__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.62) 45%, rgba(255, 255, 255, 0.92) 100%);
}
.why-v2__inner { position: relative; z-index: 2; }
.why-v2 .h2 { color: var(--c-ink); }
.why-v2 .sec-desc { color: var(--c-ink-2); max-width: 780px; }

.why-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-8);
  align-items: stretch;
}
.why-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--sp-6);
  border-radius: var(--r-xl);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.why-card:hover { transform: translateY(-5px); }
.why-card--light {
  background: rgba(255, 255, 255, 0.94);
  color: var(--c-ink);
  box-shadow: 0 24px 44px -22px rgba(2, 6, 23, 0.5);
}
.why-card--dark {
  background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.84) 0%, rgba(15, 23, 42, 0.92) 100%),
    url("../img/why-bg-2.jpg");
  background-size: cover;
  background-position: center;
  color: #e8eef7;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 24px 44px -22px rgba(2, 6, 23, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.why-card__tag {
  align-self: flex-start;
  padding: 4px 12px;
  border-radius: var(--r-pill);
  background: var(--c-accent);
  color: #fff;
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: 0.06em;
}
.why-card__title {
  margin: var(--sp-4) 0 var(--sp-3);
  font-size: var(--fs-18);
  font-weight: 700;
  line-height: 1.45;
}
.why-card__cure {
  font-size: var(--fs-14);
  line-height: 1.8;
  color: var(--c-ink-2);
}
.why-card--dark .why-card__cure { color: rgba(232, 238, 247, 0.76); }
.why-card__cure .k {
  display: block;
  margin-bottom: 6px;
  font-family: var(--font-num);
  font-size: var(--fs-13);
  font-weight: 700;
  color: var(--c-accent);
}
.why-card--dark .why-card__cure .k { color: var(--c-accent-400); }

@media (max-width: 1180px) {
  .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .why-grid { grid-template-columns: 1fr; }
  .why-v2__bg { opacity: 0.22; }
}

/* 使命卡：立体字 + 品牌标语 */
.mission-card__text {
  position: relative;
  margin-top: var(--sp-3);
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 800;
  line-height: 1.34;
  letter-spacing: -0.01em;
  color: #ffffff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 1px rgba(15, 23, 42, 0.28),
    0 6px 14px rgba(15, 23, 42, 0.42), 0 16px 32px rgba(15, 23, 42, 0.34);
}
.mission-card__tagline {
  position: relative;
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  border-top: 1px solid rgba(255, 255, 255, 0.24);
  font-size: var(--fs-15);
  font-weight: 600;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 2px 8px rgba(15, 23, 42, 0.45);
}
.mission-card__tagline-em { color: var(--c-accent-200); }

/* 合作页副文案：整幅宽度 + 自然换行（避免 nowrap 裁切） */
.hero__sub--wide { max-width: 100%; }

/* 关于页使命卡：跨两列宽版横幅（v8.3） */
.hero__visual--full {
  grid-column: 1 / -1;
  display: block;
  margin: var(--sp-4) 0 0;
  min-height: 0;
}
.mission-card--wide { width: 100%; }
.mission-card--wide {
  min-height: 320px;
  aspect-ratio: auto;
  background-position: center 38%;
  padding: var(--sp-8);
}
.mission-card--wide .mission-card__text { font-size: clamp(2rem, 3.6vw, 3rem); }
.mission-card--wide .mission-card__tagline { max-width: 760px; }
@media (max-width: 900px) {
  .mission-card--wide { min-height: 260px; padding: var(--sp-6); }
}
@media (max-width: 640px) {
  .mission-card--wide { aspect-ratio: 4 / 3; min-height: 0; }
}

/* 关于页 HERO：使命卡下移文字组，标题单行 + 胶囊整行（v8.4） */
.hero__text--full { grid-column: 1 / -1; margin-top: var(--sp-7); }
.mission-card--wide .mission-card__tagline {
  font-size: clamp(1.1rem, 1.6vw, 1.4rem);
  font-weight: 700;
}
@media (min-width: 900px) {
  .about-h1--one { white-space: nowrap; }
  .hero__text--full .hero__chips { flex-wrap: nowrap; }
}

/* RFQ 说明文字：弱化字号（v8.5） */
.rfq-note { display: block; font-size: var(--fs-13); line-height: 1.75; color: var(--c-ink-3); }

/* 关于页 HERO：eyebrow 置顶，标题紧贴横幅（v8.6） */
.hero__eyebrow--full { grid-column: 1 / -1; margin-bottom: var(--sp-4); }
.hero__text--full { margin-top: var(--sp-4); }
@media (max-width: 640px) {
  .hero__text--full { margin-top: var(--sp-3); }
}

/* 安全规则：深色表头内的 --key 不再刷成深色，避免文字与底色同化 */
.cmp__row--head .cmp__cell--key { color: inherit; font-weight: 600; }

/* 关于页 HERO 间距收紧：eyebrow 贴近横幅（v8.7） */
.hero__grid--mission { gap: var(--sp-5); }
.hero__eyebrow--full { margin-bottom: 0; }
.hero__text--full { margin-top: 0; }

/* 荣誉墙：高含金量条目的鎏金质感（v8.8） */
.hv2-item--gold {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.07) 0%, rgba(212, 175, 55, 0.12) 100%);
  box-shadow: inset 0 0 0 1px rgba(212, 175, 55, 0.34), 0 18px 34px -20px rgba(212, 175, 55, 0.5);
}
.hv2-item--gold:hover {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.09) 0%, rgba(212, 175, 55, 0.18) 100%);
}
.hv2-item--gold svg { color: #e8c168; }
.hv2-item--gold .hv2-item__no { color: #e8c168; }
.hv2-item--gold .hv2-item__t { text-shadow: 0 0 14px rgba(212, 175, 55, 0.35); }
.hv2-feature--gold::before { background: linear-gradient(180deg, rgba(11, 18, 32, 0.02) 20%, rgba(11, 18, 32, 0.88) 92%); }
.hv2-feature--gold .hv2-feature__badge {
  background: linear-gradient(120deg, #d4af37 0%, #f0d478 55%, #b8860b 100%);
  color: #1a1305;
  box-shadow: 0 8px 22px -8px rgba(212, 175, 55, 0.7);
}
.hv2-feature--gold .hv2-feature__title { text-shadow: 0 0 22px rgba(212, 175, 55, 0.32); }
.hv2-feature--gold .hv2-feature__stats b { color: #e8c168; }

/* 二维码面板（v8.9）：浅色底 + 三码美化排列 */
.qr-panel {
  margin-top: var(--sp-6);
  padding: var(--sp-6);
  border-radius: var(--r-lg);
  background: #ffffff;
  box-shadow: var(--sh-1), inset 0 0 0 1px var(--c-line);
}
.qr-panel__head {
  margin-bottom: var(--sp-4);
  font-size: var(--fs-14);
  font-weight: 700;
  color: var(--c-ink);
}
.qr-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-4);
}
.qr-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: var(--sp-4) var(--sp-3);
  border-radius: var(--r-md, 12px);
  background: var(--c-surface, #f8fafc);
  box-shadow: inset 0 0 0 1px var(--c-line);
  text-align: center;
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.qr-cell:hover {
  transform: translateY(-3px);
  box-shadow: inset 0 0 0 1px var(--c-line-2), 0 16px 28px -18px rgba(15, 23, 42, 0.28);
}
.qr-cell__img {
  width: 100%;
  height: auto;
  max-width: 128px;
  aspect-ratio: 1;
  padding: 6px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.35);
}
.qr-cell__t { font-size: var(--fs-14); font-weight: 700; color: var(--c-ink); }
.qr-cell__d { font-size: var(--fs-12); line-height: 1.6; color: var(--c-ink-2); }
@media (max-width: 640px) {
  .qr-grid { grid-template-columns: 1fr; gap: var(--sp-3); }
  .qr-cell {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: var(--sp-4);
    row-gap: 4px;
    text-align: left;
  }
  .qr-cell__img { grid-row: 1 / span 2; width: 96px; max-width: 96px; }
  .qr-cell__t { align-self: end; }
  .qr-cell__d { align-self: start; }
}

/* 产品卡轮播：箭头左右定位 + 拖拽手势（v9.0 修复被误删的定位样式） */
.pcard__gallery { position: relative; cursor: grab; user-select: none; -webkit-user-select: none; }
.pcard__gallery:active { cursor: grabbing; }
.pcard__gallery .gallery__nav--prev { left: 10px; }
.pcard__gallery .gallery__nav--next { right: 10px; }
.gallery__slide img { -webkit-user-drag: none; user-select: none; }

/* 轮播轨道不拦截指针事件（否则会盖住左右箭头） */
.gallery__track { pointer-events: none; }
.pcard__gallery .gallery__nav { z-index: 4; pointer-events: auto; }
.pcard__gallery .gallery__nav:active { transform: translateY(-50%) scale(0.94); }
.pcard__gallery .gallery__dots { z-index: 4; }

/* RFQ 版式：表单紧随标题，联系信息与二维码收进右侧栏（v9.2） */
.contact__grid {
  grid-template-columns: minmax(0, 1.22fr) minmax(0, 0.78fr);
}
/* RFQ 顶边对齐：标题块独占第一行，表单卡片与联系信息卡片同处第二行，天然平行

   P0-6 ArkWeb（鸿蒙）兼容：显式 `grid-row` / `grid-column` 是 Grid 子特性中
   兼容性最差的一类，被内核忽略后 rfq__form 与 contact__side 会重叠。
   改用「不依赖显式行列」的等价实现：
     - `.rfq__intro` 用 `grid-column: 1 / -1` 横跨整行（grid-column 的
       跨列语义在所有实现里都稳定，且退化后果仅是 intro 变窄而非重叠）；
     - 其余两个子项**完全不写** grid-column/grid-row，交给 grid 自动流。
       DOM 顺序为 intro → form → side，自动流即得
       row1: intro(整行) / row2: form(col1) + side(col2)。
   这样即使 ArkWeb 完全忽略本段，布局也只是退回单列纵向堆叠（因为
   1180px 断点会把两列改回 1fr），绝不会出现元素重叠。 */
#rfq .contact__grid { row-gap: var(--sp-7); }
#rfq .rfq__intro{ grid-column: 1 / -1; }
#rfq .contact__grid .form-card { margin-top: 0; }
#rfq .contact__side { align-self: start; }
/* 窄屏必须用同等特异度（#id）把两列改回单列：上一条 #rfq .contact__grid
   的 grid-template-columns 特异度高于 components.css:869 媒体查询里的
   .contact__grid，导致 ≤1180px 仍是双列，390px 下表单列被压到 117px。 */
@media (max-width: 1180px) {
  #rfq .contact__grid{ grid-template-columns: minmax(0, 1fr); }
  #rfq .rfq__intro{ grid-column: auto; }
}
.contact__side { display: flex; flex-direction: column; gap: var(--sp-5); }

/* 联系信息：小字紧凑排布 */
.info-list--compact {
  gap: var(--sp-3);
  margin-top: 0;
  padding: var(--sp-5) var(--sp-6);
  border-radius: var(--r-lg);
  background: #ffffff;
  box-shadow: var(--sh-1), inset 0 0 0 1px var(--c-line);
}
.info-list--compact .info-item__k {
  font-size: var(--fs-12);
  color: var(--c-ink-3);
  letter-spacing: 0.04em;
}
.info-list--compact .info-item__v {
  margin-top: 2px;
  font-size: var(--fs-13);
  line-height: 1.6;
}
.info-list--compact .info-item__v a { color: var(--c-ink); }
.info-list--compact .info-item__v a:hover { color: var(--c-accent); }

/* 二维码标题居中 */
.qr-panel__head { text-align: center; }

/* 页脚备案信息（v9.5）：ICP 链接工信部 + 公安备案图标链接 */
.footer__legal { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.footer__beian { display: inline-flex; align-items: center; gap: 5px; color: var(--c-ink-3); }
.footer__beian:hover { color: var(--c-accent); }
.footer__beian-icon { height: 16px; width: auto; display: inline-block; vertical-align: middle; }

/* 法务页排版（隐私政策 / 用户服务协议） */
.legal-doc { max-width: 860px; margin-top: var(--sp-7); }
.legal-doc h2 {
  margin: var(--sp-8) 0 var(--sp-3);
  font-size: var(--fs-18);
  font-weight: 700;
  color: var(--c-ink);
}
.legal-doc h3 { margin: var(--sp-5) 0 var(--sp-2); font-size: var(--fs-15); font-weight: 650; color: var(--c-ink); }
.legal-doc p { margin: 0 0 var(--sp-3); font-size: var(--fs-14); line-height: 1.9; color: var(--c-ink-2); }
.legal-doc ul { margin: 0 0 var(--sp-4); padding-left: 20px; }
.legal-doc li { margin-bottom: 6px; font-size: var(--fs-14); line-height: 1.85; color: var(--c-ink-2); }
.legal-doc a { color: var(--c-accent); }
.legal-doc .note { font-size: var(--fs-13); color: var(--c-ink-3); }

/* 表单同意勾选 + 仪表盘示意标注 */
.consent { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 var(--sp-4); font-size: var(--fs-13); line-height: 1.7; color: var(--c-ink-2); }
.consent input { margin-top: 4px; width: 15px; height: 15px; accent-color: var(--c-accent); }
.consent a { color: var(--c-accent); }
.dash-note { margin: 6px 0 0; font-size: var(--fs-12); color: var(--c-ink-3); }
.dash__live--demo {
  font-size: 11px;
  opacity: 0.5;
  letter-spacing: 0.06em;
  color: var(--c-ink-3);
  padding: 0;
  background: none;
  border: 0;
}

/* 样品/表单提示条 */
.sample-note {
  margin: 0 0 var(--sp-4);
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--c-surface);
  box-shadow: inset 0 0 0 1px var(--c-line);
  font-size: var(--fs-12);
  line-height: 1.75;
  color: var(--c-ink-3);
}
.sample-note strong { color: var(--c-ink-2); }

/* ==========================================================================
   40. P0 移动端修复包
   --------------------------------------------------------------------------
   本块集中处理 6 项P0 缺陷，与上文既有规则冲突时以本块为准（位于文件末尾，
   同特异度下later 胜出）。

   P0-1 grid 溢出：grid 子项默认 min-width:auto，其 min-content 尺寸会撑破
         轨道。英文长句（.nw nowrap，118 字符 → 677px）在 312px 容器里必然
         溢出。此处对全站 grid 子项统一加 min-width:0 兜底。
   P0-2 安全区：见下方 41节。
   P0-3 汉堡按钮：见 900px 断点内声明。
   P0-4 触控目标：见 900px 断点内声明。
   P0-5 滚动入场：已改为 .js .reveal（见 base.css / 上文 552、1104 行）。
   P0-6 ArkWeb：见上文 RFQ 段（已去掉显式 grid-row/grid-column 定位）。
   ========================================================================== */

/* --------------------------------------------------------------------------
   40.1 grid / flex 子项 min-width 兜底
   覆盖全站所有 grid 容器（含 CSS 里声明但 HTML 未使用的，宁多勿漏）。
   -------------------------------------------------------------------------- */
.footer__grid > *,
.hv2-feature, .hv2-feature__body, .hv2-list > *, .honors-v2__grid > *,
.hero__grid > *, .hero__visual, .hero__text--full, .hero__eyebrow--full,
.tech__grid > *, .grid-2 > *, .grid-3 > *, .grid-4 > *, .grid-5 > *,
.pcards > *, .pcard__visual, .pcard__device,
.honors > *, .timeline > *, .caps > *, .cap__viz,
.arch > *, .cases > *, .anon-grid > *, .why-grid > *,
.chips-grid > *, .chip-core > *, .chip-core,
.dash__body > *, .dash__side, .dash__main, .dash__kpis > *, .dash__rows > *,
.dash__row > *, .dash__chart, .cmp__row > *,
.contact__grid > *, .contact__side, .info-list > *, .info-list--compact,
.disc > *, .form__grid > *, .field, .stats > *, .logos > *, .logo-cell,
.stack > *, .float-card, .cta-band__inner > div,
.hero__chips > *, .hero__actions > *, .hero__chips--grid > *,
.qr-grid > *, .qr-cell, .rfq__form, .rfq__intro,
.spec > *, .ticks > *, .modal__body > *, .card__icon, .toast,
.galaxy__item, .mission-card--wide, .legal-doc > *{ min-width: 0; }

/* flex 子项同样需要（flex 的 min-width:auto 也会撑破） */
.header-inner > *, .hero__panel, .hero__actions, .cta-band__inner,
.form__foot, .chips, .info-item, .footer__bottom, .mobile-nav__link,
.spec__thumbs, .dash__side{ min-width: 0; }

/* 文本类子项允许任意位置断行，避免 min-content 过大 */
.hv2-item__t, .hv2-item__d, .hv2-feature__title, .hv2-feature__desc,
.arch__t, .arch__d, .case__title, .card__title, .card .body,
.anon-cell, .cap__desc, .chip-card__spec, .chip-core__d, .chip-core__t,
.why-card__cure, .mission-card__tagline, .sec-desc, .pcard__desc{
  overflow-wrap: break-word;
  word-break: normal;
}

/* --------------------------------------------------------------------------
   40.2 P0-6 ArkWeb 降级：不支持 Grid 时整体退回单列纵向流
   ArkWeb / 老旧 WebView 对 Grid 支持不完整时，下面这组单列布局保证内容
   仍然完整可读、绝不重叠。
   -------------------------------------------------------------------------- */
@supports not (display: grid) {
  .footer__grid, .hv2-list, .honors-v2__grid, .hero__grid, .tech__grid,
  .grid-2, .grid-3, .grid-4, .grid-5, .pcards, .honors, .timeline,
  .caps, .arch, .cases, .anon-grid, .why-grid, .chips-grid, .chip-core,
  .dash__body, .contact__grid, .disc, .form__grid, .stats, .logos,
  .stack, .hero__chips--grid, .qr-grid, .spec, .cmp__row, .dash__row{
    display: block !important;
  }
  .footer__grid > *, .contact__grid > *, .hero__grid > *,
  .form__grid > *, .dash__body > *{ margin-bottom: var(--sp-6); }
  #rfq .rfq__intro{ display: block; }
  .field--full{ grid-column: auto; }
}

/* --------------------------------------------------------------------------
   40.3 @supports 兜底：不支持 backdrop-filter 时用更高不透明度实色替代
   全站 14 处 backdrop-filter；无模糊时玻璃感会「透出」正文导致可读性下降，
   故退化为不透明底色。
   -------------------------------------------------------------------------- */
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .site-header.is-stuck{ background: rgba(255, 255, 255, 0.97); }
  .mobile-nav{ background: #ffffff; }
  .float-card{ background: #ffffff; }
  .chip{ background: var(--c-surface); }
  .hv2-item{ background: #16203a; }
  .toast{ background: var(--c-ink); }
  .dash__panel, .spec__panel, .modal__panel, .form-card{ background: #ffffff; }
}

/* --------------------------------------------------------------------------
   40.4 @supports 兜底：不支持 aspect-ratio 时用 padding-top 撑出固定比例
   涉及 mission-card(3/4)、pcard 图(4/3)、qr-cell(1/1) 等。
   -------------------------------------------------------------------------- */
@supports not (aspect-ratio: 1 / 1) {
  .mission-card{ min-height: 300px; }
  .mission-card--wide{ min-height: 320px; }
  .pcard__device{ min-height: 220px; }
  .qr-cell__img{ min-height: 96px; }
  .stack__item--photo{ min-height: 180px; }
}

/* --------------------------------------------------------------------------
   40.5 clamp 兜底：clamp() 不被支持时整条声明失效，必须先写静态值。
   本节把关键标题/正文字号在 @supports not 中显式给出静态 px 值。
   -------------------------------------------------------------------------- */
@supports not (font-size: clamp(1rem, 2vw, 2rem)) {
  .h1{ font-size: 2.5rem; }
  .h2{ font-size: 1.75rem; }
  .hv2-feature__title{ font-size: 1.15rem; }
  .mission-card__text{ font-size: 1.8rem; }
  .mission-card__tagline{ font-size: 1.1rem; }
  .mission-card--wide .mission-card__text{ font-size: 2rem; }
  .mission-card--wide .mission-card__tagline{ font-size: 1.25rem; }
  .nav__link{ font-size: 0.9375rem; }
}

/* --------------------------------------------------------------------------
   40.6 窄屏兜底：≤900px 解除强制不换行
   .nw（15字中文没事，118 字符英文致命）与 .footer__line 在窄屏必须回退。
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .nw, .footer__line, .nb{ white-space: normal; }
  /* ≤640px 才成立的 nowrap 工具类，在 641–900px 区间同样需要解掉 */
  .one-line, .sec-desc--one, .hero__sub--one, .h2--oneline, .nl-d,
  .stat__num, .kpi__k{ white-space: normal; }
  .footer__col{ min-width: 0; overflow-wrap: break-word; }
  .footer__grid{ grid-template-columns: minmax(0, 1fr); }

  /* 表格容器：窄屏横向滚动而不是撑破页面 */
  .legal-scroll{ overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
}

/* --------------------------------------------------------------------------
   40.7 P0-2 安全区适配
   需配合 14 页 <meta viewport ... viewport-fit=cover>。
   所有 padding 均为「原设计间距 + 安全区」叠加，不覆盖原值。
   -------------------------------------------------------------------------- */

/* 顶部固定 header：刘海屏 / 挖孔屏纵向避让 */
@media (max-width: 900px) {
  .site-header{
    height: calc(var(--header-h) + var(--sa-t));
    padding-top: var(--sa-t);
    padding-left: var(--sa-l);
    padding-right: var(--sa-r);
  }
  /* header 变高后，正文锚点与首屏留白同步补足 */
  .hero{ padding-top: calc(var(--header-h) + var(--sa-t) + var(--sp-8)); }
  .page-hero, .legal-hero{ padding-top: calc(var(--header-h) + var(--sa-t) + var(--sp-8)); }
  /* 抽屉菜单整体下移，避开刘海 */
  .mobile-nav{ padding-bottom: var(--sa-b); }
  .mobile-nav__link{ min-height: 48px; display: flex; align-items: center; }
}

/* 底部：home indicator / 底部横条避让 */
.site-footer{
  padding-bottom: calc(var(--sp-7) + var(--sa-b));
  padding-left: var(--sa-l);
  padding-right: var(--sa-r);
}
.footer__legal{ padding-bottom: var(--sa-b); }

/* 留资表单侧栏与底部操作区：全站最靠近拇指底部的可点区域 */
.contact__side{ padding-bottom: calc(var(--sp-2) + var(--sa-b)); }
.form__foot{ padding-bottom: var(--sa-b); }
.modal__body{ padding-bottom: calc(var(--sp-6) + var(--sa-b)); }
.toast{ bottom: calc(var(--sp-5) + var(--sa-b)); }

/* 移动端横向内边距：内容不贴刘海边 */
@media (max-width: 900px) {
  .wrap, .section, .band{ padding-left: var(--sa-l); padding-right: var(--sa-r); }
  .cta-band{ padding-left: calc(var(--sp-6) + var(--sa-l)); padding-right: calc(var(--sp-6) + var(--sa-r)); }
  .form-card, .info-list--compact, .legal-doc{
    padding-left: calc(var(--sp-4) + var(--sa-l));
    padding-right: calc(var(--sp-4) + var(--sa-r));
  }
  .float-card{ max-width: min(64vw, calc(100% - var(--sa-l) - var(--sa-r))); }
}

/* --------------------------------------------------------------------------
   40.8 P0-4 触控目标 ≥44px（仅窄屏，桌面视觉语言不变）
   原则：视觉尽量不变，用 min-width/min-height + 透明内边距扩大热区。
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  /* 40.8.1 汉堡按钮：360–900px 全区间 ≥44px（与上文 900px 段一致） */
  .nav-toggle{ width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: none; }

  /* 40.8.2 语言切换：原 34px 高 → 44px */
  .lang-switch{ min-height: 44px; display: inline-flex; align-items: center; padding: 0 14px; }

  /* 40.8.3 品牌 logo 链接：原 34px → 44px */
  .brand{ min-height: 44px; }

  /* 40.8.4 轮播指示点：视觉 6px 圆点保留，热区提到 44px
     做法：按钮本体 44×44 透明，用 ::before 画原来的小圆点 */
  .gallery__dots{ gap: 0; bottom: 0; }
  button.gallery__dot{
    position: relative;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    transition: none;
  }
  button.gallery__dot::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 6px;
    height: 6px;
    margin: -3px 0 0 -3px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.28);
    transition: width var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
  }
  button.gallery__dot.is-on{ width: 44px; border-radius: 0; background: transparent; }
  button.gallery__dot.is-on::before{
    width: 16px;
    margin-left: -8px;
    border-radius: 3px;
    background: var(--c-accent);
  }

  /* 40.8.5 轮播左右箭头：28×28 → 44×44 */
  button.gallery__nav{
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    opacity: 1;
    pointer-events: auto;
  }
  button.gallery__nav svg{ width: 18px; height: 18px; }
  .pcard__gallery .gallery__nav--prev{ left: 4px; }
  .pcard__gallery .gallery__nav--next{ right: 4px; }

  /* 40.8.6 浮窗关闭按钮：39×39 → 44×44 */
  .modal__close{
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    top: 10px;
    right: 10px;
  }

  /* 40.8.7 同意勾选框：13×15 → 44×44 热区
     用 appearance:none 自绘，保留 accent-color 的橘色语义；
     视觉方块 24px 居中，外圈 10px 透明热区。 */
  .consent{ padding-left: 0; }
  input[type="checkbox"]{
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    flex: none;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    margin: -10px 0 -10px -14px;
    background: transparent;
    cursor: pointer;
  }
  input[type="checkbox"]::before{
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: inset 0 0 0 1.5px var(--c-line-2);
    transition: background var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
  }
  input[type="checkbox"]:checked::before{
    background: var(--c-accent);
    box-shadow: inset 0 0 0 1.5px var(--c-accent);
  }
  input[type="checkbox"]:checked::after{
    content: "";
    position: absolute;
    left: 18px;
    top: 18px;
    width: 12px;
    height: 7px;
    border-left: 2.5px solid #ffffff;
    border-bottom: 2.5px solid #ffffff;
    transform: rotate(-45deg);
  }
  input[type="checkbox"]:focus-visible{ outline: 2px solid var(--c-accent); outline-offset: -2px; }

  /* 40.8.8 页脚链接：原 18px 行高 → 44px 触控热区。

     ⚠️ 这里刻意**不用负边距抵消**。原实现给链接加
     `padding:13px 0; margin:-13px 0` 来保持视觉行距，在中文短文案下没问题，
     但英文页脚链接更长（“Platform & Partnership”列有 4 条长链接），行高本
     就接近 44px，负边距会把列表内容推出容器 —— 实测全英文页、所有视口恒定
     溢出 13px，视觉上就是末行文字叠字/被裁。

     现方案：热区用 padding 撑开，行间距交给 li 的 margin-bottom 自然留白，
     不做任何负边距抵消。这样热区达标（≥44px）且不挤压内容。 */
  .footer__col a,
  .footer__bottom a,
  .footer__beian,
  .footer__line a,
  .info-item__v a{
    display: inline-block;
    min-height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  /* 链接自带上下留白后，li 只需极小间距，避免行间过疏 */
  .footer__col li{ margin-bottom: 0; }
  .footer__col ul{ margin-top: 0; margin-bottom: 0; }

  /* 40.8.9 条款内联链接（.consent 里的《隐私政策》等）：负边距扩热区 */
  .consent a, .legal-doc p a, .legal-doc li a, .form__note a{
    display: inline-block;
    min-height: 44px;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-top: -13px;
    margin-bottom: -13px;
  }

  /* 40.8.10 主按钮 / 次按钮：确保 ≥44px 高 */
  .btn{ min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  .btn--sm{ min-height: 44px; }
  .header-cta .btn--sm{ padding-left: 12px; padding-right: 12px; }
  .nav__link{ min-height: 44px; display: inline-flex; align-items: center; }

  /* 40.8.11 dash 侧栏导航项 */
  .dash__nav{ min-height: 44px; display: flex; align-items: center; }

  /* 40.8.12 规格缩略图切换（spec__thumb） */
  .spec__thumb{ min-height: 44px; min-width: 44px; }
}

/* --------------------------------------------------------------------------
   41. P0 验收第二轮：溢出与字号残余项
   --------------------------------------------------------------------------
   41.1 首屏胶囊标签（.hero__chips--grid 用 max-content 列 + .chip 内
        white-space 继承 nowrap）→ 英文长标签单列宽达 615px。
        改为 minmax(0,1fr) 双列 + 强制允许断行。
   41.2 环境光斑.orb 是绝对定位装饰，left:12% + width:420px 必然溢出。
        pointer-events:none，纯装饰，窄屏直接收窄并靠左。
   41.3 .btn 的 white-space:nowrap 在英文长文案 CTA 上溢出
        （"Request a Quote / Sample"类）。窄屏允许换行。
   41.4 法务表格：.legal-doc 内的 table 未被 .legal-scroll 包裹时无法滚动，
        退而求其次：给 table 本体加 display:block + overflow-x:auto 兜底。
   41.5 正文 <p> 最小字号：html{font-size:14px} 的降档使 --fs-13 = 11.375px、
        --fs-12 = 10.5px。窄屏把正文阶梯托底到 14px（只抬小字号，
        不动 16px 以上，避免破坏既有排版平衡）。
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  /* 41.1 胶囊标签 */
  .hero__chips--grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero__chips--grid .chip,
  .hero__chips .chip{
    white-space: normal;
    overflow-wrap: break-word;
    line-height: 1.35;
    min-width: 0;
    max-width: 100%;
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .chip{ white-space: normal; overflow-wrap: break-word; max-width: 100%; }
  .chip__dot{ flex: none; }

  /* 41.2 环境光斑：装饰元素，窄屏收窄避免溢出 */
  .orb--a{ width: 240px; height: 240px; left: 0; }
  .orb--b{ width: 200px; height: 200px; right: 0; }
  .hero__visual{ overflow: visible; }
  /* 悬浮硬件照溢出：原本就靠负边距做破格，窄屏收敛 */
  .stack__item--side.stack__item--photo{ margin-right: 0; }
  .stack__item--photo{ max-width: 100%; }

  /* 41.3 按钮换行 */
  .btn{ white-space: normal; text-align: center; min-width: 0; max-width: 100%; }
  .hero__actions .btn{ flex: 1 1 auto; }
  .header-cta .btn{ white-space: nowrap; }

  /* 41.4 法务表格兜底滚动 */
  .legal-doc table,
  table.legal-table{
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  /* 41.5 正文字号托底 14px（≤640px 时 html 降档到 14px，
     rem 阶梯被二次缩小；这里只把最小的几级抬到 14px） */
  :root{
    --fs-12: 14px;
    --fs-13: 14px;
    --fs-14: 14px;
    --fs-15: 15px;
  }
  /* 明确不使用 fs-12/13 语义的元素回退原尺寸，避免徽章类被撑大 */
  .eyebrow{ font-size: 12px; }
  .chip__dot{ width: 5px; height: 5px; }
  .kv__k, .stat__label{ font-size: 12px; }
  .form__err, .field__err{ font-size: 13px; }
  .footer__beian{ font-size: 13px; }
  .dash__nav{ font-size: 13px; }
  .lang-switch{ font-size: 14px; }
  .chip{ font-size: 14px; }
  .mission-hl, .card__index, .honor__no{ font-size: var(--fs-12); }
}

/* --------------------------------------------------------------------------
   42. 第三轮：.stack 悬浮硬件组与表单残余溢出
   --------------------------------------------------------------------------
   42.1 .stack 是 flex 行，两个 .stack__item--photo 各自带显式 width
        （main 250px + side 200px + gap 12px ≈ 462px），在 375px 视口必然
        溢出 36px。窄屏改为按视口比例收缩，且允许 flex 压缩。
   42.2 表单里 <strong>/.form__note 等 inline 元素在 360px 下溢出 1–3px：
        英文长邮箱/URL 的 min-content 撑破。加 overflow-wrap 断行兜底。
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  /* 42.1 悬浮硬件组：宽度随视口收缩，禁止溢出 */
  .stack{ max-width: 100%; overflow: visible; }
  .stack > .stack__item{ flex: 0 1 auto; max-width: 100%; }
  .stack__item--main.stack__item--photo{
    width: min(250px, 54vw);
    max-width: 100%;
  }
  .stack__item--side.stack__item--photo{
    width: min(200px, 42vw);
    max-width: 100%;
    margin-right: 0;
  }
  /* 42.2 inline 长串断行 */
  .form__note, .sample-note, .rfq-note, .consent, .legal-doc p,
  .legal-doc li, .info-item__v, .info-item__sub, .field__label,
  .form-card p, .form-card li{
    overflow-wrap: break-word;
    word-break: break-word;
  }
  .form__note strong, .form__note a{ overflow-wrap: break-word; }
}

/* --------------------------------------------------------------------------
   43. 第四轮：.stack 悬浮硬件组溢出（根因修复）
   --------------------------------------------------------------------------
   根因：.stack 是 .hero__visual（display:grid; place-items:center）的子项，
   place-items:center 使其宽度取 max-content —— 即两个 .stack__item--photo
   显式 width 之和（250+200+gap）。而 .hero__visual 实测只有 327px，
   于是 .stack 372px 恒定溢出 21–45px，且与视口宽度无关（这是之前
   按 vw 反复调值始终修不掉的根因）。

   修法：把 .stack 拉成 100% 宽并居中，内部两项改为百分比宽度 +
   flex 收缩 + 图片 max-width:100%，让整组始终内嵌于父容器。
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .stack{
    width: 100%;
    max-width: 100%;
    justify-content: center;
    gap: var(--sp-3);
  }
  .stack > .stack__item{
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
  }
  .stack__item--main.stack__item--photo{
    width: 54%;
    max-width: 54%;
  }
  .stack__item--side.stack__item--photo{
    width: 42%;
    max-width: 42%;
    margin-right: 0;
    margin-bottom: 26px;
  }
  .stack__item--photo img{ max-width: 100%; height: auto; }
}

/* --------------------------------------------------------------------------
   44. 第五轮：窄屏页头 CTA 被挤压裁切
   --------------------------------------------------------------------------
   现象：en 页页头 .header-cta 里的 "Request Samples & Quote" 按钮在
   360–430px 被 flex 压到 82–94px 宽，配合 .btn{overflow:hidden} 导致
   文案被拦腰截断（截图里只剩 "t Samples &"）。

   根因：min-width:0 兜底让 .header-cta 可以被压缩，而按钮文字是
   nowrap 的长英文串，压缩后必然裁切。

   修法（窄屏重排，而非继续压缩）：
     - 品牌 logo 限宽 88px；
     - 语言切换收窄padding；
     - CTA 按钮允许换行并占据剩余空间（flex:1），min-height 仍 ≥44px；
     - 汉堡按钮固定 44px 不参与压缩。
   360px 下预算：88 + 8 + (60 + flex) + 8 + 44 ≤ 312，恰好放下。
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
  .header-inner{ gap: var(--sp-2); }
  .site-header .brand__logo{ height: 30px; max-width: 88px; width: auto; }
  .brand{ min-height: 44px; flex: none; }

  .header-cta{
    flex: 1 1 auto;
    min-width: 0;
    margin-left: var(--sp-2);
    gap: var(--sp-2);
    display: flex;
    align-items: center;
  }
  .header-cta .lang-switch{
    flex: none;
    min-height: 44px;
    padding: 0 10px;
    font-size: 13px;
  }
  .header-cta .btn--sm{
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    height: auto;
    padding: 6px 10px;
    font-size: 13px;
    line-height: 1.25;
    white-space: normal;   /* 关键：允许换行，避免被裁切 */
    overflow: visible;
    text-align: center;
    word-break: break-word;
  }
  .nav-toggle{ margin-left: 0; }
}

/* 641–900px：空间较充裕，但仍需保证按钮不被裁切 */
@media (min-width: 641px) and (max-width: 900px) {
  .header-cta{ min-width: 0; flex: 0 1 auto; }
  .header-cta .btn--sm{
    min-height: 44px;
    padding: 6px 14px;
    white-space: normal;
    line-height: 1.25;
    overflow: visible;
  }
  .site-header .brand__logo{ max-width: 104px; width: auto; height: 34px; }
}

/* --------------------------------------------------------------------------
   45. 第六轮：窄屏页头空间预算（最终方案）
   --------------------------------------------------------------------------
   上一轮用 flex:1 让 CTA 按钮「吃掉剩余空间」，实测在 360px 下按钮被压到
   21px 宽、272px 高（每个单词独占一行），比裁切更糟。

   重新算预算：≤640px 时 .header-inner 可用宽 = 100vw - 2×24(gutter)
   360px → 312px。四个元素：logo + 语言切换 + CTA 按钮 + 汉堡。
   英文 CTA "Request Samples & Quote" 在 13px nowrap 下约 150px，
   汉堡 44px，gap 2×8=16px → logo 只能分到 312-150-44-16 = 102px。

   结论：≤640px 必须让出一个元素。语言切换在抽屉里已有一份
   （.mobile-nav__link--lang「中文」），故窄屏从页头移除页头内的
   lang-switch，logo 限宽 84px，CTA 保持 nowrap 单行。
   360px：84 + 150 + 44 + 16 = 294 ≤ 312✅ 有18px 余量。
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
  /* 语言切换在抽屉中已有等价入口，窄屏页头不再重复 */
  .header-cta .lang-switch{ display: none; }

  .header-inner{ gap: var(--sp-2); }
  .site-header .brand__logo{ height: 30px; width: auto; max-width: 84px; }
  .brand{ flex: none; min-height: 44px; }

  .header-cta{ flex: 1 1 auto; min-width: 0; margin-left: var(--sp-2); }
  .header-cta .btn--sm{
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    padding: 0 12px;
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;/* 单行，不换行也不裁切：宽度不够时由 max-width 兜底 */
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .nav-toggle{ margin-left: 0; flex: none; }
}

/* 641–900px：空间够用，保留语言切换 */
@media (min-width: 641px) and (max-width: 900px) {
  .header-cta{ min-width: 0; flex: 0 1 auto; gap: var(--sp-3); }
  .header-cta .btn--sm{
    min-height: 44px;
    padding: 0 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .header-cta .lang-switch{ min-height: 44px; }
  .site-header .brand__logo{ height: 34px; width: auto; max-width: 104px; }
}
