.spc-module { --blue:#1a56db; --cyan:#5fd6ff; --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --bg:#ffffff; --surface:#f8fafc;
    font-family:'Noto Sans SC','DM Sans',sans-serif; color:var(--ink); background:var(--bg);
    width:100%; min-height:100vh; display:flex; align-items:center; padding:0; line-height:1.55; }
  .spc-module * { box-sizing:border-box; margin:0; padding:0; }
  .spc-c { width:100%; padding:90px 100px; margin:0 auto; }
  .spc-h { font-size:34px; font-weight:900; letter-spacing:-.8px; display:flex; align-items:center; gap:12px; }
  .spc-h::before { content:''; width:6px; height:34px; border-radius:3px; background:var(--blue); }
  .spc-sub { color:var(--muted); font-size:17px; margin:12px 0 48px; }
  .spc-block { margin:44px 0; }
  .spc-bt { font-size:20px; font-weight:700; color:var(--blue); margin-bottom:26px; display:flex; align-items:center; gap:10px; }
  .spc-bt::before { content:''; width:20px; height:3px; background:var(--blue); border-radius:2px; }

  /* 板块1：闭环流程 */
  .spc-loop { display:flex; justify-content:center; align-items:flex-start; gap:10px; position:relative; padding-bottom:42px; }
  .spc-step { flex:1; max-width:180px; text-align:center; position:relative; z-index:1; }
  .spc-step .ring {
    width:86px; height:86px; margin:0 auto 16px; border-radius:50%;
    background:var(--bg); border:2px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    color:var(--blue); box-shadow:0 6px 20px rgba(26,86,219,.1);
    transition:all .35s cubic-bezier(.2,.7,.3,1);
  }
  .spc-step:hover .ring { border-color:var(--blue); transform:translateY(-5px); box-shadow:0 16px 34px rgba(26,86,219,.2); }
  .spc-step .ring svg { width:32px; height:32px; stroke-width:1.7; }
  .spc-step h4 { font-size:17px; font-weight:700; }
  .spc-step p { font-size:14px; color:var(--muted); margin-top:4px; }

  /* 连线 */
  .spc-join { flex:0 0 62px; height:86px; position:relative; }
  .spc-join svg { position:absolute; top:43px; left:0; transform:translateY(-50%); width:100%; height:14px; }
  .spc-join path.line { fill:none; stroke:var(--line); stroke-width:2; }
  .spc-join path.dash { fill:none; stroke:var(--blue); stroke-width:2; stroke-dasharray:5 5; animation:spcMove 1.1s linear infinite; opacity:.55; }
  .spc-join polyline { fill:none; stroke:var(--line); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
  @keyframes spcMove { to { stroke-dashoffset:-20; } }

  /* 回环 */
  .spc-back { position:absolute; left:50%; bottom:-32px; transform:translateX(-50%); display:flex; align-items:center; gap:8px; font-size:13px; color:var(--blue); font-weight:500; white-space:nowrap; }
  .spc-back svg { width:42px; height:18px; }

  /* 板块2：架构框架 */
  .spc-arch { border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--bg); }
  .spc-layer { display:flex; align-items:stretch; border-bottom:1px solid var(--line); position:relative; }
  .spc-layer:last-child { border-bottom:none; }
  .spc-layer::after {
    content:''; position:absolute; left:50%; bottom:-15px; transform:translateX(-50%);
    width:1px; height:14px; border-left:1px dashed var(--blue); opacity:.4; z-index:2;
  }
  .spc-layer:last-child::after { display:none; }
  .spc-layer::before {
    content:'↓'; position:absolute; left:50%; bottom:-24px; transform:translateX(-50%);
    font-size:12px; color:var(--blue); opacity:.55; z-index:2;
  }
  .spc-layer:last-child::before { display:none; }
  .spc-ltag {
    width:76px; flex:0 0 76px; display:flex; align-items:center; justify-content:center;
    writing-mode:vertical-rl; text-orientation:upright; font-size:14px; font-weight:700;
    letter-spacing:2px; color:#fff; background:var(--blue);
  }
  .spc-nodes { flex:1; display:flex; flex-wrap:wrap; gap:14px; padding:22px; align-items:center; min-height:76px; }
  .spc-chip { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 18px; font-size:15px; font-weight:500; transition:all .25s; color:var(--ink); }
  .spc-chip b { color:var(--blue); font-weight:700; }
  .spc-chip:hover { background:var(--blue); color:#fff; border-color:var(--blue); }
  .spc-chip:hover b { color:#fff; }

  /* 滚动渐显 */
  .spc-reveal { opacity:0; transform:translateY(22px); transition:all .7s cubic-bezier(.2,.7,.3,1); }
  .spc-reveal.spc-on { opacity:1; transform:none; }

  @media(max-width:680px){
    .spc-module { min-height:auto; padding:0; }
    .spc-c { padding:60px 40px; }
    .spc-h { font-size:26px; }
    .spc-h::before { height:26px; }
    .spc-sub { font-size:15px; }
    .spc-loop { flex-wrap:wrap; gap:22px 10px; padding-bottom:30px; }
    .spc-step { flex:1 1 30%; max-width:none; }
    .spc-step .ring { width:68px; height:68px; }
    .spc-step .ring svg { width:26px; height:26px; }
    .spc-join { display:none; }
    .spc-back { display:none; }
    .spc-ltag { width:52px; flex-basis:52px; font-size:11px; letter-spacing:1px; }
    .spc-nodes { padding:16px; gap:10px; }
    .spc-chip { padding:10px 14px; font-size:13px; }
  }