/* ===== B2B 橫幅卡（11-04：#service 結尾改有份量的收束）===== */
.b2b-band{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;
  margin:40px 0 0;min-height:184px;padding:36px 40px;border-radius:var(--r,18px);overflow:hidden;
  background:#1D2A36;color:#F3EEE1;text-decoration:none;isolation:isolate}
/* 柔光：跟 hero 同一組色，用 transform 慢漂（compositor） */
.b2b-band::before{content:'';position:absolute;inset:-30%;z-index:-1;pointer-events:none;
  background:radial-gradient(38% 42% at 76% 24%,rgba(142,98,40,.46),transparent 70%),
             radial-gradient(40% 46% at 22% 88%,rgba(44,106,168,.55),transparent 70%),#172430;
  animation:b2b-drift 18s ease-in-out infinite alternate}
@keyframes b2b-drift{from{transform:translate(0,0) scale(1)}to{transform:translate(-3%,2%) scale(1.06)}}
.b2b-body{display:flex;flex-direction:column;align-items:flex-start;gap:14px;position:relative;z-index:1}
.b2b-k{color:#D9A66B;display:flex;align-items:center;gap:10px}
.b2b-k::before{content:'';width:24px;height:2px;background:#D9A66B;flex:none}       /* 跟 hero 編號短線同款 */
.b2b-t{font:700 clamp(28px,3vw,40px)/1.25 var(--f-serif);letter-spacing:.01em;color:#F3EEE1}
.b2b-p{max-width:32em;text-wrap:pretty;margin-top:-4px;font:400 15px/1.75 var(--f-sans);color:rgba(243,238,225,.78)}
.b2b-row{display:flex;align-items:center;flex-wrap:wrap;gap:16px 28px;margin-top:6px}
.b2b-n{display:flex;align-items:center;gap:12px;color:rgba(243,238,225,.78);font:400 14px/1.45 var(--f-sans)}
.b2b-band .b2b-n strong{font:700 44px/1 var(--f-serif);color:#D9A66B;letter-spacing:-.01em;white-space:nowrap}
.b2b-band .b2b-n strong small{font-size:16px;margin-left:2px;color:#D9A66B}
.b2b-n span{max-width:7.5em}
.b2b-cta{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 22px;border-radius:999px;
  box-shadow:inset 0 0 0 1.5px rgba(243,238,225,.85);font:600 var(--t-body)/1 var(--f-sans);color:#F3EEE1;
  transition:background .25s,color .25s}
.b2b-cta svg{width:8px;height:16px;fill:currentColor;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.b2b-band:hover .b2b-cta{background:#F3EEE1;color:#1D2A36}
.b2b-band:hover .b2b-cta svg{transform:translateX(4px)}
.b2b-band:focus-visible{outline:2px solid #F4F0B8;outline-offset:3px}
/* 冷媒管走線串三個施工節點：進畫面畫一次，節點依序亮 */
.b2b-route{position:relative;align-self:stretch;min-height:150px;margin:-8px 0 -8px -120px}
/* 走線從左欄文字後方淡入接出來（只遮線，不遮節點） */
.b2b-pipe{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}
.b2b-pipe{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.b2b-pipe path{fill:none;stroke:rgba(243,238,225,.4);stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke;
  stroke-dasharray:1;stroke-dashoffset:1}
.b2b-node{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-7px);display:flex;flex-direction:column;align-items:center;gap:12px;
  font:600 14px/1 var(--f-sans);letter-spacing:.08em;color:rgba(243,238,225,.45);transition:color .4s var(--d,0s);white-space:nowrap}
.b2b-node small{margin-top:-4px;font:400 12px/1.3 var(--f-sans);letter-spacing:.04em;color:rgba(243,238,225,.6)}
.b2b-node i{display:block;width:14px;height:14px;border-radius:50%;background:#1D2A36;box-shadow:inset 0 0 0 1.5px rgba(243,238,225,.45);
  transition:background .4s var(--d,0s),box-shadow .4s var(--d,0s),transform .4s var(--d,0s)}
.b2b-band.b2b-on .b2b-pipe path{animation:b2b-draw 1.6s cubic-bezier(.4,0,.4,1) .2s forwards}
.b2b-band.b2b-on .b2b-node{color:#F3EEE1}
.b2b-band.b2b-on .b2b-node i{background:#D9A66B;box-shadow:0 0 0 5px rgba(217,166,107,.18);transform:scale(1.1)}
@keyframes b2b-draw{to{stroke-dashoffset:0}}
/* 手機：單欄；走線收掉，三節點改成一列小流程 */
@media (max-width:768px){
  .b2b-band{grid-template-columns:1fr;min-height:0;padding:28px 22px 24px;margin-top:28px;gap:22px}
  .b2b-cta{width:100%;justify-content:center}
  .b2b-body{order:1}.b2b-route{order:0;min-height:0;margin:0;display:flex;align-items:center;gap:0}
  .b2b-pipe{display:none}
  .b2b-route{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-top:4px;border-top:1px solid rgba(243,238,225,.18)}
  .b2b-node{position:relative;left:auto;top:auto;transform:none;align-items:flex-start;gap:6px;font-size:14px;color:#F3EEE1;padding-top:12px}
  .b2b-node i{position:absolute;top:-6px;left:0;width:10px;height:10px;background:#D9A66B;box-shadow:none}
  .b2b-node small{margin-top:0;white-space:normal;font-size:12px}
  @media (max-width:420px){.b2b-node small{display:none}}
  .b2b-band .b2b-n strong{font-size:36px}
}
/* 減少動態：線畫滿、節點直接亮、柔光停住、箭頭不滑 */
@media (prefers-reduced-motion:reduce){
  .b2b-band::before{animation:none;transform:translate(-1.5%,1%) scale(1.03)}
  .b2b-pipe path{stroke-dashoffset:0;animation:none}
  .b2b-node,.b2b-node i{transition:none;color:#F3EEE1}
  .b2b-node i{background:#D9A66B}
  .b2b-cta svg{transition:none}
}
