/* ═══ r42 · 服务页两张图重做(2026-09-29)══════════════════════════════
   委托人反馈:r41 的资金路径图画得太具体(一格一格写满字),显得不专业;
   序号小标(01/02/03/05 方块)粗糙;下面「市场行情与热点」的样例图也不够精致。
   ① 支付能力:左图右列。
      图 = 抽象示意,图内不写字:三条出入金渠道汇入中央核验环 → 交易账户;
      虚线轨道 = 持续风险监控;第三方一条淡虚线,止于阻断点。图例放图下(HTML,可随语言换)。
      右列 = 五条要点,去掉方块序号,改发丝分隔 + 标题前一截主色短竖线。
   ② 市场行情与热点:原始资讯卡 → 四段框架环 → 四格结构化解读(每格一个微型示意)。
   段尾两句 pivot 已从页面删除(服务页「本地的判断…」、运作方式页「能力越强…」)。
   卡面按官网设计体系 v1:深灰底 + 极细白色半透明边框,不用投影;不可点 ⇒ 无悬停。
   连线只用曲线 / 正交直线,无走势折线(gate-no-trend)。
   撤销 = 四页恢复 retu-home-v5/_bak/svc-r42-(时间戳) 里的备份;只删这一行 link 不够,markup 已换。 */

/* ─────────────── ① 支付能力 ─────────────── */
.page-services #payments .pay42 {
  margin-block-start: var(--sec-head-gap, var(--s-8));
  display: grid;
  gap: var(--s-7);
  align-items: center;
}
@media (min-width: 1000px) {
  .page-services #payments .pay42 {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
    gap: var(--s-9);
  }
}

.page-services #payments .pay42__fig {
  margin: 0;
  padding: var(--s-7) var(--s-6) var(--s-6);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, .14);
  background:
    radial-gradient(90% 70% at 58% 40%,
      color-mix(in srgb, var(--c-primary-500) 12%, transparent) 0, transparent 70%),
    linear-gradient(180deg,
      color-mix(in srgb, var(--c-surface) 78%, transparent),
      color-mix(in srgb, var(--c-surface) 46%, transparent));
}
@media (min-width: 1000px) {
  .page-services #payments .pay42__fig { padding: var(--s-7) var(--s-7) var(--s-6); }
}
.pf42 { display: block; inline-size: 100%; block-size: auto; overflow: visible; }

/* 线 */
.pf42-w { fill: none; stroke: rgba(255, 255, 255, .20); stroke-width: 1.4; stroke-linecap: round; }
.pf42-w--out { stroke: color-mix(in srgb, var(--c-accent-500) 70%, transparent); stroke-width: 2; }
.pf42-w--blk { stroke: rgba(255, 255, 255, .16); stroke-dasharray: 3 5; }
.pf42-flow path {
  fill: none; stroke: var(--c-accent-500); stroke-width: 2; stroke-linecap: round;
  stroke-dasharray: 2 18; opacity: .9;
  animation: pf42-flow 2.8s linear infinite;
}
@keyframes pf42-flow { to { stroke-dashoffset: -40; } }

/* 核验环 + 监控轨道 */
.pf42-orbit {
  fill: none; stroke: color-mix(in srgb, var(--c-primary-500) 55%, transparent);
  stroke-width: 1.2; stroke-dasharray: 2 6;
}
.pf42-sat { fill: var(--c-accent-500); transform-box: view-box; transform-origin: 318px 172px; animation: pf42-spin 36s linear infinite; }
.pf42-sat circle { stroke: var(--c-bg, #0E1A21); stroke-width: 3; paint-order: stroke; }
@keyframes pf42-spin { to { transform: rotate(360deg); } }
.pf42-ringbg { fill: color-mix(in srgb, var(--c-surface) 90%, #000); }

/* 节点 */
.pf42-node rect, .pf42-acc > rect {
  fill: color-mix(in srgb, var(--c-surface) 92%, #fff 3%);
  stroke: rgba(255, 255, 255, .16); stroke-width: 1;
}
.pf42-g { fill: none; stroke: var(--c-text-2); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.pf42-g--hi { stroke: #fff; stroke-width: 1.8; }
.pf42-dot { fill: var(--c-accent-500); }
.pf42-accbar { fill: color-mix(in srgb, var(--c-primary-500) 26%, transparent); }
.pf42-acc > rect { stroke: color-mix(in srgb, var(--c-accent-500) 55%, transparent); }
.pf42-sk { fill: none; stroke: rgba(255, 255, 255, .22); stroke-width: 5; stroke-linecap: round; }

/* 第三方:整组退后,止于阻断点 */
.pf42-off rect { fill: none; stroke: rgba(255, 255, 255, .12); stroke-dasharray: 3 4; }
.pf42-off circle, .pf42-off path { fill: none; stroke: var(--c-text-3); stroke-width: 1.4; opacity: .6; stroke-linecap: round; }
.pf42-stop circle { fill: color-mix(in srgb, var(--c-danger-600, #BE4B40) 16%, var(--c-surface)); stroke: color-mix(in srgb, var(--c-danger-700, #C77B74) 70%, transparent); stroke-width: 1.2; }
.pf42-stop path { fill: none; stroke: var(--c-danger-700, #C77B74); stroke-width: 1.6; stroke-linecap: round; }

@media (prefers-reduced-motion: reduce) {
  .pf42-flow path, .pf42-sat { animation: none; }
  .pf42-flow { display: none; }
}

/* 图例 */
.page-services #payments .pay42__fig figcaption {
  margin-block-start: var(--s-6);
  padding-block-start: var(--s-5);
  border-block-start: 1px solid rgba(255, 255, 255, .10);
}
.pay42__keys {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5);
  font-size: var(--fs-sm, 14px); line-height: 1.5; color: var(--c-text-3);
}
.pay42__key { display: inline-flex; align-items: center; gap: var(--s-2); }
.pay42__key svg {
  inline-size: 14px; block-size: 14px; flex: none;
  fill: none; stroke: var(--c-text-2); stroke-width: 1.4; stroke-linecap: round;
}
.pay42__key--ver svg { stroke: var(--c-accent-500); stroke-width: 1.8; }
.pay42__key--mon svg { stroke: var(--c-primary-500); }
.pay42__key--acc svg { stroke: var(--c-accent-500); }
.pay42__key--blk svg { stroke: var(--c-danger-700, #C77B74); }

/* 右列要点:无序号,发丝分隔 + 标题前主色短竖线 */
.pay42__list { list-style: none; margin: 0; padding: 0; }
.pay42__item { padding-block: var(--s-5); border-block-start: 1px solid rgba(255, 255, 255, .10); }
.pay42__item:first-child { padding-block-start: 0; border-block-start: 0; }
.pay42__item:last-child { padding-block-end: 0; }
.pay42__title {
  position: relative; margin: 0; padding-inline-start: 14px;
  font-size: var(--fs-h4, 17px); font-weight: 600; line-height: 1.4; letter-spacing: .01em;
  color: var(--c-text);
}
.pay42__title::before {
  content: ""; position: absolute; inset-inline-start: 0; inset-block: .28em;
  inline-size: 2px; border-radius: 2px;
  background: linear-gradient(180deg, var(--c-accent-500), var(--c-primary-500));
}
.pay42__body {
  margin: var(--s-2) 0 0; padding-inline-start: 14px;
  font-size: var(--fs-sm, 14px); line-height: 1.8; color: var(--c-text-2);
  text-wrap: pretty;
}

/* ─────────────── ② 市场行情与热点 · 样例 ─────────────── */
.page-services #insight .ins42 {
  margin: 0;
  display: grid; gap: var(--s-5);
  padding: var(--s-6);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, .14);
  background:
    radial-gradient(60% 80% at 38% 50%,
      color-mix(in srgb, var(--c-primary-500) 10%, transparent) 0, transparent 70%),
    linear-gradient(180deg,
      color-mix(in srgb, var(--c-surface) 78%, transparent),
      color-mix(in srgb, var(--c-surface) 46%, transparent));
}
@media (min-width: 1000px) {
  .page-services #insight .ins42 {
    grid-template-columns: minmax(0, .9fr) 96px minmax(0, 1.55fr);
    align-items: start; gap: var(--s-4);
    padding: var(--s-8) var(--s-7);
  }
  /* 两侧小标同一基线起排;中间的框架环对准两张卡的中线(让开小标那一行) */
  .page-services #insight .ins42__link { align-self: stretch; padding-block-start: 34px; }
}
@media (max-width: 639.98px) {
  .page-services #insight .ins42 { padding: var(--s-5) var(--s-4); }
  .ins42__doc, .ins42__cell { padding-inline: var(--s-4); }
}

.ins42__tag {
  margin: 0 0 var(--s-4);
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--c-text-3);
}
:lang(zh) .ins42__tag, .ins42__tag:lang(zh-Hans) { font-family: inherit; letter-spacing: .12em; }

/* 原始资讯卡 */
.ins42__doc {
  padding: var(--s-5) var(--s-4) var(--s-4);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: color-mix(in srgb, var(--c-surface) 88%, #000);
}
.ins42-doc { display: block; inline-size: 100%; block-size: auto; }
.ins42__note { margin: var(--s-3) 0 0; font-size: 12px; line-height: 1.6; color: var(--c-text-3); }

.ins42-s { fill: rgba(255, 255, 255, .13); }
.ins42-s--dim { fill: rgba(255, 255, 255, .08); }
.ins42-h { fill: rgba(255, 255, 255, .34); }
.ins42-live { fill: var(--c-accent-500); animation: ins42-pulse 2.4s ease-in-out infinite; }
@keyframes ins42-pulse { 50% { opacity: .35; } }
.ins42-panel { fill: rgba(255, 255, 255, .02); stroke: rgba(255, 255, 255, .08); }
.ins42-base { fill: none; stroke: rgba(255, 255, 255, .10); stroke-dasharray: 2 4; }
.ins42-cd path { stroke: rgba(255, 255, 255, .30); stroke-width: 1; }
.ins42-cd rect { fill: rgba(255, 255, 255, .22); }
.ins42-cd--b rect { fill: none; stroke: rgba(255, 255, 255, .34); stroke-width: 1; }
.ins42-cd--ev path { stroke: var(--c-accent-500); }
.ins42-cd--ev rect { fill: var(--c-accent-500); }
.ins42-evline { fill: none; stroke: color-mix(in srgb, var(--c-accent-500) 55%, transparent); stroke-dasharray: 2 3; }
.ins42-evmark { fill: var(--c-accent-500); }

/* 中间:四段框架环 */
.ins42__link { display: grid; place-items: center; }
.ins42-hub { inline-size: 96px; block-size: 96px; }
@media (max-width: 999.98px) {
  .ins42-hub { inline-size: 64px; block-size: 64px; transform: rotate(90deg); }
}
.ins42-hl { fill: none; stroke: rgba(255, 255, 255, .20); stroke-width: 1.4; }
.ins42-hc { fill: color-mix(in srgb, var(--c-surface) 90%, #000); stroke: rgba(255, 255, 255, .12); }
.ins42-arc { fill: none; stroke-width: 3.2; stroke-linecap: round; }
.ins42-arc--1 { stroke: var(--c-accent-500); }
.ins42-arc--2 { stroke: color-mix(in srgb, var(--c-accent-500) 60%, var(--c-primary-500)); }
.ins42-arc--3 { stroke: var(--c-primary-500); }
.ins42-arc--4 { stroke: color-mix(in srgb, var(--c-primary-500) 60%, transparent); }
.ins42-hd { fill: #fff; }

/* 四格结构化解读 */
.ins42__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: var(--s-3);
}
@media (min-width: 640px) {
  .ins42__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.ins42__cell {
  display: flex; flex-direction: column; gap: var(--s-4);
  padding: var(--s-5) var(--s-5) var(--s-4);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: color-mix(in srgb, var(--c-surface) 88%, #000);
}
.ins42__name {
  display: inline-flex; align-items: center; gap: var(--s-2);
  font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--c-text);
}
.ins42__name::before {
  content: ""; inline-size: 6px; block-size: 6px; border-radius: 50%; flex: none;
  background: var(--c-accent-500);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-accent-500) 18%, transparent);
}
.ins42__cell svg { display: block; inline-size: 100%; max-inline-size: 280px; block-size: auto; }

.ins42-chip { fill: color-mix(in srgb, var(--c-accent-500) 14%, transparent); stroke: color-mix(in srgb, var(--c-accent-500) 40%, transparent); }
.ins42-pill { fill: rgba(255, 255, 255, .03); stroke: rgba(255, 255, 255, .16); }
.ins42-pill--on { fill: color-mix(in srgb, var(--c-accent-500) 12%, transparent); stroke: color-mix(in srgb, var(--c-accent-500) 50%, transparent); }
.ins42-pd { fill: var(--c-accent-500); }
.ins42-pd--b { fill: var(--c-primary-500); }
.ins42-pd--c { fill: var(--c-text-3); }
.ins42-ln { fill: none; stroke: rgba(255, 255, 255, .22); stroke-width: 1.4; stroke-linecap: round; }
.ins42-ln--on { stroke: var(--c-accent-500); }
.ins42-n { fill: color-mix(in srgb, var(--c-surface) 88%, #000); stroke: rgba(255, 255, 255, .40); stroke-width: 1.4; }
.ins42-n--on { fill: var(--c-accent-500); stroke: color-mix(in srgb, var(--c-accent-500) 40%, transparent); stroke-width: 4; paint-order: stroke; }

@media (prefers-reduced-motion: reduce) {
  .ins42-live { animation: none; }
}

/* 删掉 pivot 后,支付段收尾不再留 pivot 的上距 */
.page-services #insight .ins42 + .shape__cap { margin-block-start: var(--s-5); }