/* ═══ r43 · 服务页「多资产架构」装配图细化(2026-09-29)══════════════════
   委托人:「这个图也再细致优化一下」。旧图 = 四个资产方块 / 一条虚线插槽带 / 一块内核,
   三层各排各的列(4 / 5 / 一整块),连线只有四根短桩 + 一根总线,看着像线框稿。
   新图:三层压在同一条五列网格上,上下逐列对齐 ——
     资产大类(四类 + 一格虚线「新增资产大类」)
       ↓ 五根细连线(新增那根为虚线)
     接入插槽(五项,每项一枚插头小标)
       ↓ 五根总线
     统一交易内核(标题 + 五项功能逐列对应)
   「新增的是上面一格 + 插槽,内核不动」这件事由列对齐直接画出来,不再只靠图注。
   卡面按官网设计体系 v1:深灰底 + 极细白色半透明边框,不用投影;不可点 ⇒ 无悬停。
   撤销 = 两页恢复 retu-home-v5/_bak/svc-r43-(时间戳) 里的备份;markup 已换,只删 link 不够。 */

.page-services #more .asm42 {
  --asm-pad: var(--s-5);
  --asm-gap: var(--s-3);
  margin: var(--sec-head-gap, var(--s-8)) 0 0;
  padding: var(--s-6) var(--s-5);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, .14);
  background:
    radial-gradient(70% 60% at 50% 100%,
      color-mix(in srgb, var(--c-primary-500) 16%, 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 #more .asm42 { --asm-pad: var(--s-6); --asm-gap: var(--s-4); padding: var(--s-8) var(--s-8) var(--s-7); }
}

/* 三层共用:同宽内边距 + 1px 边(资产层边透明),五列才能逐列对齐 */
.asm42__tier {
  position: relative;
  padding: var(--s-5) var(--asm-pad);
  border: 1px solid transparent;
  border-radius: 16px;
}
.asm42__tier:first-of-type { padding-block: 0; }
.asm42__label {
  margin: 0 0 var(--s-4);
  font-size: 12px; line-height: 1.4; letter-spacing: .12em;
  color: var(--c-text-3);
}
.asm42__row {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: var(--asm-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 720px) {
  .asm42__row { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* ── 资产大类 ── */
.asm42__asset {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-3);
  min-block-size: 108px; padding: var(--s-4) var(--s-3);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--c-surface) 70%, #fff 4%),
    color-mix(in srgb, var(--c-surface) 92%, #000));
  text-align: center;
  font-size: var(--fs-h4, 17px); font-weight: 600; line-height: 1.35; color: var(--c-text);
}
.asm42__asset svg {
  inline-size: 26px; block-size: 26px; flex: none;
  fill: none; stroke: var(--c-accent-500); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.asm42__asset--new {
  border-style: dashed; border-color: rgba(255, 255, 255, .20);
  background: transparent;
  font-size: var(--fs-sm, 14px); font-weight: 500; color: var(--c-text-3);
}
.asm42__asset--new svg { stroke: var(--c-text-3); }
@media (max-width: 719.98px) {
  .asm42__asset { min-block-size: 88px; font-size: 15px; }
  .asm42__asset--new { grid-column: 1 / -1; min-block-size: 56px; flex-direction: row; }
}

/* ── 连线:五根细线逐列落下,末端一枚小接点 ── */
.asm42__wires {
  display: grid; gap: var(--asm-gap);
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-inline: calc(var(--asm-pad) + 1px);
  block-size: 36px;
}
.asm42__wires span {
  position: relative; justify-self: center; inline-size: 1px; block-size: 100%;
  background: linear-gradient(180deg, rgba(255, 255, 255, .10), color-mix(in srgb, var(--c-accent-500) 70%, transparent));
  overflow: visible;
}
.asm42__wires span::after {
  content: ""; position: absolute; inset-block-end: -3px; inset-inline-start: -2.5px;
  inline-size: 6px; block-size: 6px; border-radius: 50%;
  background: var(--c-accent-500);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-accent-500) 20%, transparent);
}
.asm42__wires span.is-new {
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, .28) 0 3px, transparent 3px 7px);
}
.asm42__wires span.is-new::after { background: transparent; border: 1px solid rgba(255, 255, 255, .36); box-shadow: none; inline-size: 7px; block-size: 7px; inset-inline-start: -3px; box-sizing: border-box; }
/* 总线:内核一侧用主色,表示五项规则都落进同一块内核 */
.asm42__wires--bus span { background: linear-gradient(180deg, color-mix(in srgb, var(--c-accent-500) 60%, transparent), var(--c-primary-500)); }
.asm42__wires--bus span::after { background: var(--c-primary-500); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-primary-500) 22%, transparent); }

/* 一颗很淡的光点沿线下行(只在动效允许时) */
@media (prefers-reduced-motion: no-preference) {
  .asm42__wires span:not(.is-new)::before {
    content: ""; position: absolute; inset-inline-start: -1px; inline-size: 3px; block-size: 10px; border-radius: 2px;
    background: linear-gradient(180deg, transparent, #fff);
    opacity: 0; animation: asm42-drop 3.6s ease-in infinite;
  }
  .asm42__wires span:nth-child(2)::before { animation-delay: .5s; }
  .asm42__wires span:nth-child(3)::before { animation-delay: 1s; }
  .asm42__wires span:nth-child(4)::before { animation-delay: 1.5s; }
  .asm42__wires span:nth-child(5)::before { animation-delay: 2s; }
  .asm42__wires--bus span::before { animation-delay: 1.8s; }
  .asm42__wires--bus span:nth-child(2)::before { animation-delay: 2.3s; }
  .asm42__wires--bus span:nth-child(3)::before { animation-delay: 2.8s; }
  .asm42__wires--bus span:nth-child(4)::before { animation-delay: 3.3s; }
  .asm42__wires--bus span:nth-child(5)::before { animation-delay: 3.8s; }
}
@keyframes asm42-drop {
  0% { top: -10px; opacity: 0; }
  15% { opacity: .7; }
  45% { top: 100%; opacity: 0; }
  100% { top: 100%; opacity: 0; }
}
/* 窄屏:五列连线挤不下,只留中间一根 */
@media (max-width: 719.98px) {
  .asm42__wires { grid-template-columns: 1fr; block-size: 28px; }
  .asm42__wires span:not(:nth-child(3)) { display: none; }
}

/* ── 接入插槽带 ── */
.asm42__band {
  border: 1px dashed color-mix(in srgb, var(--c-accent-500) 42%, transparent);
  background: color-mix(in srgb, var(--c-accent-500) 5%, transparent);
}
.asm42__band .asm42__label { color: var(--c-accent-500); }
.asm42__slot {
  display: flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-block-size: 52px; padding: var(--s-2) var(--s-3);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: color-mix(in srgb, var(--c-surface) 90%, #000);
  text-align: center;
  font-size: var(--fs-sm, 14px); line-height: 1.4; color: var(--c-text);
}
.asm42__plug {
  inline-size: 14px; block-size: 14px; flex: none;
  fill: none; stroke: var(--c-accent-500); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
}
@media (max-width: 719.98px) {
  .asm42__slot:last-child { grid-column: 1 / -1; }
}

/* ── 统一交易内核 ── */
.asm42__core {
  padding-block: var(--s-6) var(--s-5);
  border-color: color-mix(in srgb, var(--c-primary-500) 45%, rgba(255, 255, 255, .14));
  background:
    radial-gradient(60% 120% at 50% 0%,
      color-mix(in srgb, var(--c-primary-500) 22%, transparent) 0, transparent 70%),
    color-mix(in srgb, var(--c-surface) 88%, #000);
  overflow: hidden;
}
.asm42__core::before {
  content: ""; position: absolute; inset-inline: 12%; inset-block-start: -1px; block-size: 2px;
  background: linear-gradient(90deg, transparent, var(--c-accent-500), var(--c-primary-500), transparent);
}
.asm42__coretitle {
  display: flex; align-items: center; justify-content: center; gap: var(--s-3);
  margin: 0 0 var(--s-5);
  font-size: clamp(20px, 1rem + .6vw, 24px); font-weight: 700; letter-spacing: .02em; color: #fff;
}
.asm42__chip {
  inline-size: 26px; block-size: 26px; flex: none;
  fill: none; stroke: var(--c-accent-500); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.asm42__fns { gap: 0; }
.asm42__fn {
  padding: var(--s-3) var(--s-2);
  text-align: center;
  font-size: var(--fs-sm, 14px); line-height: 1.5; color: var(--c-text-2);
  border-block-start: 1px solid rgba(255, 255, 255, .10);
}
@media (min-width: 720px) {
  .asm42__fns { column-gap: var(--asm-gap); }
  .asm42__fn { border-block-start: 0; border-inline-start: 1px solid rgba(255, 255, 255, .10); padding-block: var(--s-2); }
  .asm42__fn:first-child { border-inline-start: 0; }
}
@media (max-width: 719.98px) {
  .asm42__fn:last-child { grid-column: 1 / -1; }
}

.page-services #more .asm42 .shape__cap { margin-block-start: var(--s-6); }

/* ── 验收后微调(同日) ── */
/* 总线末端的接点压在内核边框上,不被内核盖住 */
.asm42__wires { position: relative; z-index: 1; }
/* 英文功能名是从一句话里拆出来的,首字母补成大写(中文无影响) */
.asm42__fn::first-letter { text-transform: uppercase; }
.asm42__slot span, .asm42__asset span, .asm42__fn { text-wrap: balance; }
/* 中等宽度 / 窄屏:插头小标挪到文字上方,两行文字才居中不歪 */
@media (max-width: 1199.98px) {
  .asm42__slot { flex-direction: column; gap: 6px; padding-block: var(--s-3); }
}
@media (min-width: 720px) and (max-width: 999.98px) {
  .asm42__asset { font-size: 15px; padding-inline: var(--s-2); }
}