/**
 * PCB 中心页 · 段5 从制造数据到成品板
 *
 * 数值取自 Figma 实测：段背景 #F9FBFA / 1920×1003；标题 #14363F 40px/73（左对齐，587 宽 2 行）；
 * 右列标题 28px/42（深色 + 品牌绿混排）；说明 #666666 16px/20（810 宽）；
 * 按钮 404×60（圆角 4 + 描边 #008C11，两个上下排列）；
 * 圆形插图 141×141（5 个，x=141/488/819/1158/1529）；步骤名品牌绿 16px/28；说明 #666666 14px/18（255 宽）。
 */

.pcb-path {
  /* 设计稿：段顶到标题 107（PCB 4797−4690）；末位卡片说明底 → 段底 106（PCB 5586 → 5692）。 */
  padding-block: 107px 106px;
  background: #f9fbfa;
}

.pcb-path__inner {
  max-width: 1718px /* = 设计稿内容宽 1638 + 左右各 40 padding */;
  margin: 0 auto;
  padding: 0 40px;
}

/* 头部：左（标题 + 双按钮）/ 右（标题 + 说明） */
.pcb-path__head-right {
  /* 客户需求表第 6 行「左右文字需要齐平」：右列与左列标题**同顶**。
     （早前按节点量出右列低 73，客户复核后明确要齐平，以客户为准。） */
  padding-top: 0;
}

.pcb-path__head {
  display: grid;
  grid-template-columns: minmax(0, 587px) minmax(0, 810px);
  gap: 0 60px;
  justify-content: space-between;
  max-width: 1720px;
  margin: 0 auto 100px;
}

.pcb-path__title {
  max-width: 587px;
  /* 设计稿：标题框底 → 双按钮顶 32（PCB 4797+146=4943 → 4975；PCBA 5249+146=5395 → 5427）。 */
  margin: 0 0 32px;
  font-family: var(--pcb-font-display);
  font-size: 40px;
  font-weight: 900;
  line-height: 73px;
  color: #14363f;
}

.pcb-path__actions {
  display: flex;
  flex-direction: column;
  gap: 21px;
  /* 纵向 flex 默认 stretch，会把两个按钮拉满容器（实测 587 宽）；
     设计稿两个按钮同宽、圆心右缘都在 x=544。 */
  align-items: flex-start;
}

.pcb-path__cta {
  display: inline-flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  /* 设计稿（1:840 / 1:841 / 1:843 / 1:844）：按钮 x141、绿圆右缘 544、
     右内边距 14 → 宽 417；原 404 + 被 stretch 到 587，客户反馈「按钮没这么长」。 */
  min-width: 417px;
  min-height: 60px;
  padding: 0 14px 0 22px;
  font-size: 16px;
  font-weight: 600;
  color: #14363f;
  text-decoration: none;
  border: 1px solid #008c11;
  border-radius: 4px;
  transition: background 0.24s ease, box-shadow 0.24s ease;
}

.pcb-path__cta-dot {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 32px;
  height: 32px;
  color: #ffffff;
  background: #008c11;
  border-radius: 50%;
}

.pcb-path__cta-dot svg { width: 14px; height: 14px; }

.pcb-path__cta:hover {
  background: #eff5f3;
  box-shadow: 0 12px 26px rgba(0, 140, 17, 0.12);
}

.pcb-path__subtitle {
  /* 设计稿小标题是**两行**（左列 541 宽框 → 2 行）；不限宽时会排成一行，
     把说明上移 42px。标题框底 → 说明顶 49（PCB 4870+84=4954 → 5003）。 */
  max-width: 541px;
  margin: 0 0 49px;
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  color: #14363f;
}

.pcb-path__subtitle-lead { color: #008c11; }

.pcb-path__body {
  max-width: 810px;
  margin: 0;
  font-size: 16px;
  line-height: 20px;
  color: #666666;
}

/* ── 5 个步骤（141 圆图 + 编号名 + 说明）────────────── */

.pcb-path__steps {
  display: grid;
  /*
   * 卡片宽度取设计稿的实测值 255（5 个正文框为 251~265 宽），横向按 space-between 分布：
   * 1638 内容宽内 5×255 + 4 个间距。
   * 实现原为 repeat(5, 1fr) + 40px 间距 → 卡片 296 宽，正文每行能多放几个字，
   * 行数比设计稿少（实测最后一个卡片的说明 6 行 vs 设计稿 7 行）。
   */
  grid-template-columns: repeat(5, minmax(0, 255px));
  justify-content: space-between;
  gap: 0 24px;
  max-width: 1720px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.pcb-path-step__media {
  width: 141px;
  height: 141px;
  margin: 0 0 30px;
}

.pcb-path-step__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pcb-path-step__label {
  display: block;
  /* 设计稿：步骤名框底 → 说明顶 19（PCB 5385+56=5441 → 5460）。 */
  margin-bottom: 19px;
  font-size: 16px;
  line-height: 28px;
  color: #008c11;
}

/*
 * 步骤编号与标题排版（客户 9/23 设计新增 r9 PCB / r19 PCBA「文字排版颜色」）：
 * 对照正确稿（image280/289）—— 编号（01…）**独占一行**（绿），
 * 标题另起一行、**深色 #14363F**。原来编号与标题同行且标题也是绿的。
 */
.pcb-path-step__index {
  display: block;
  margin: 0 0 2px;
  font-weight: 700;
}

.pcb-path-step__title {
  display: block;
  min-height: 56px; /* 标题区固定两行：1 行/2 行标题的正文都落在同一条线上 */
  font-weight: 700;
  color: #14363f;
}

.pcb-path-step__body {
  margin: 0;
  /* 客户 9/28 r6 曾加两端对齐；同日复核改为「流程管线不需要两端对齐」（仅 PCB 页）。
     PCBA 页（.pcba-path）仍保留两端对齐，见 pcba-center/07-assembly-path.css。 */
  font-size: 14px;
  line-height: 18px;
  color: #666666;
}

/* ── 响应式 ─────────────────────────────────────────── */

@media (max-width: 1500px) {
  .pcb-path { padding-block: 80px 78px; }
  .pcb-path__head { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); margin-bottom: 70px; }
  .pcb-path__title { font-size: 34px; line-height: 60px; margin-bottom: 34px; }
  .pcb-path__subtitle { font-size: 24px; line-height: 36px; }
  .pcb-path__steps { gap: 0 26px; }
  .pcb-path-step__media { width: 116px; height: 116px; margin-bottom: 22px; }
}

@media (max-width: 1080px) {
  .pcb-path { padding-block: 56px 64px; }
  .pcb-path__head { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-bottom: 50px; }
  .pcb-path__title { max-width: none; font-size: 26px; line-height: 46px; }
  .pcb-path__cta { min-width: 0; width: 100%; }
  .pcb-path__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
  .pcb-path-step__media { width: 104px; height: 104px; }
}

@media (max-width: 640px) {
  .pcb-path__steps { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .pcb-path-step__media { width: 92px; height: 92px; margin-bottom: 16px; }
  .pcb-path-step__body { font-size: 14px; line-height: 22px; }
}