/* ============================================================
   机械员页 jixieyuan.css
   骨架：F 曲线（thread-arc，左侧 SVG 摆动曲线）+ hero-half
   母题：齿轮（节点做成齿轮形状吊坠）
   ============================================================ */

/* ---------- 曲线串：左侧 SVG 路径 ---------- */
.thread-arc { position: relative; padding-left: 80px; }
.arc-line {
  position: absolute; left: 10px; top: 0; bottom: 0;
  width: 60px; height: 100%; opacity: .7;
}
/* 齿轮节点：用 CSS 画齿轮（圆+齿） */
.gear {
  position: absolute; left: 22px; width: 18px; height: 18px;
  border-radius: 50%; background: var(--grad-gold);
  box-shadow: 0 0 0 4px rgba(194,160,75,.16), 0 3px 10px rgba(154,123,46,.4);
}
.gear::before {
  content: ""; position: absolute; inset: -4px;
  border-radius: 50%;
  background:
    conic-gradient(from 0deg, var(--gold) 0 12deg, transparent 12deg 45deg,
    var(--gold) 45deg 57deg, transparent 57deg 90deg,
    var(--gold) 90deg 102deg, transparent 102deg 135deg,
    var(--gold) 135deg 147deg, transparent 147deg 180deg,
    var(--gold) 180deg 192deg, transparent 192deg 225deg,
    var(--gold) 225deg 237deg, transparent 237deg 270deg,
    var(--gold) 270deg 282deg, transparent 282deg 315deg,
    var(--gold) 315deg 327deg, transparent 327deg 360deg);
  z-index: -1; opacity: .55;
}
@media (max-width: 680px) { .thread-arc { padding-left: 40px; } .arc-line { left: 0; } }

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

/* ---------- 职责三卡 ---------- */
.jx-duty-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.jx-duty-grid .pearl-card h3 { font-size: 20px; color: var(--ink); margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--gold-light); }
@media (max-width: 980px) { .jx-duty-grid { grid-template-columns: 1fr; } }

/* ---------- 现场双图 ---------- */
.jx-imgs { padding-top: 10px; }
.jx-fig { padding: 14px; }
.jx-fig img { border-radius: 12px; width: 100%; height: auto; }
.jx-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); }
.jx-note { margin-top: 16px; font-size: 13px; color: var(--ink-mute); text-align: center; }

/* ---------- 本地场景四卡：错落排列 ---------- */
.jx-cfg { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.jx-cfg .card-soft:nth-child(odd) { transform: translateY(14px); }
.jx-cfg h3 { font-size: 18px; color: var(--gold-deep); margin-bottom: 8px; }
.jx-cfg p { font-size: 14.5px; color: var(--ink-soft); }
@media (max-width: 680px) { .jx-cfg { grid-template-columns: 1fr; } .jx-cfg .card-soft:nth-child(odd) { transform: none; } }

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

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