/* ============================================================
   材料员页 cailiaoyuan.css
   骨架：E 顶链（thread-top，板块顶部水平金链）+ hero-half
   母题：六角蜂巢（节点做成六边形小蜂巢吊坠）
   ============================================================ */

/* ---------- 顶链：板块顶部水平金线 ---------- */
.thread-top { position: relative; padding-top: 60px; }
.thread-top::before {
  content: ""; position: absolute; left: 0; right: 0; top: 26px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-light) 15%, var(--gold) 50%, var(--gold-light) 85%, transparent);
}
/* 六边形蜂巢节点（用 clip-path 画六角形） */
.hex {
  position: absolute; top: 20px; left: 50%; transform: translateX(-50%);
  width: 16px; height: 18px; background: var(--grad-gold);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  box-shadow: 0 0 0 5px rgba(194,160,75,.15);
  z-index: 2;
}

/* ---------- Hero 半幅 ---------- */
.cl-hero .hero-inner { padding-top: 140px; }
.cl-hero .crumb { color: rgba(110,102,89,.85); }
.cl-hero .crumb em { font-style: normal; color: var(--gold-deep); }

/* ---------- 职责三卡：蜂巢网格 ---------- */
.cl-duty-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.cl-duty-grid .pearl-card h3 {
  font-size: 20px; color: var(--ink); margin-bottom: 14px;
  display: flex; align-items: center; gap: 10px;
}
.cl-duty-grid .pearl-card h3::before {
  content: ""; width: 12px; height: 14px;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  background: var(--grad-gold);
}
@media (max-width: 980px) { .cl-duty-grid { grid-template-columns: 1fr; } }

/* ---------- 现场双图 ---------- */
.cl-imgs { padding-top: 10px; }
.cl-fig { padding: 14px; }
.cl-fig img { border-radius: 12px; width: 100%; height: auto; }
.cl-fig figcaption { margin-top: 12px; font-size: 13.5px; color: var(--ink-mute); text-align: center; }

/* ---------- 表与注释 ---------- */
.tbl-wrap { overflow-x: auto; border-radius: var(--radius); }
.cl-note { margin-top: 16px; font-size: 13px; color: var(--ink-mute); text-align: center; }

/* ---------- 本地场景：蜂巢 2x2 圆角 ---------- */
.cl-cfg { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.cl-cfg .card-soft { border-radius: 22px; }
.cl-cfg h3 { font-size: 18px; color: var(--gold-deep); margin-bottom: 8px; }
.cl-cfg p { font-size: 14.5px; color: var(--ink-soft); }
@media (max-width: 680px) { .cl-cfg { grid-template-columns: 1fr; } }

/* ---------- FAQ ---------- */
.cl-faq .acc { max-width: 860px; }
.cl-faq .acc-body-inner a { color: var(--gold-deep); text-decoration: underline; }

.cl-mt { margin-top: 22px; }