/* ==========================================================================
   服务流程页 liucheng.css（周口八大员人才网 pzsr.cn）
   骨架：页面横幅 → 六步环形流程(SVG圆环) → 每步说明卡 → 时间承诺条
       → 图文区 → 底部CTA
   前缀：lc-
   ========================================================================== */

/* ---------- 1. 页面横幅 ---------- */
.lc-hero{padding-top:calc(var(--nav-h) + 40px)}
.lc-hero .sub{margin-top:16px;max-width:680px}

/* ---------- 2. 六步环形流程 ---------- */
.lc-ring{
  position:relative;width:480px;max-width:100%;aspect-ratio:1/1;
  margin:0 auto;
}
.lc-ring-svg{position:absolute;inset:0;width:100%;height:100%}
/* 6 个节点绝对定位在圆环周边 */
.lc-node{
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  width:96px;
}
.lc-n-dot{
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:800;color:#fff;
  background:var(--grad-brand);box-shadow:0 0 0 6px rgba(255,255,255,.85),var(--shadow-md);
  transition:transform .3s;
}
.lc-node:hover .lc-n-dot{transform:scale(1.15)}
.lc-n-txt{
  font-size:13px;font-weight:600;color:var(--ink);
  background:#fff;padding:3px 10px;border-radius:var(--r-full);
  box-shadow:var(--shadow-sm);white-space:nowrap;
}
/* 节点位置（基于 480 容器，圆心 50%/50%，半径约 37.5%） */
.lc-node.n1{left:50%;  top:12.5%}
.lc-node.n2{left:82.5%;top:31.25%}
.lc-node.n3{left:82.5%;top:68.75%}
.lc-node.n4{left:50%;  top:87.5%}
.lc-node.n5{left:17.5%;top:68.75%}
.lc-node.n6{left:17.5%;top:31.25%}

/* ---------- 3. 每步说明卡 ---------- */
.lc-steps-sec{background:rgba(255,255,255,.5)}
.lc-steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.lc-step{
  background:var(--glass);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:28px 24px;box-shadow:var(--shadow-sm);backdrop-filter:blur(10px);
  display:flex;flex-direction:column;gap:10px;position:relative;
  transition:transform .35s,box-shadow .35s;
}
.lc-step:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.lc-s-num{
  font-size:30px;font-weight:800;
  background:var(--grad-purple);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.lc-s-num.pink{background:var(--grad-pink);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lc-s-num.blue{background:var(--grad-blue);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lc-step h3{font-size:19px}
.lc-step p{font-size:14px;color:var(--ink-3);flex:1}
.lc-step p a{color:var(--purple-deep);font-weight:600}
.lc-s-time{
  display:inline-block;align-self:flex-start;font-size:12.5px;font-weight:600;
  padding:4px 12px;border-radius:var(--r-full);
  background:var(--blue-mist);color:#3E8BC7;
}

/* ---------- 4. 时间承诺条 ---------- */
.lc-time-sec{
  padding:clamp(40px,5vw,64px) 0;
  background:linear-gradient(120deg,var(--purple-mist),var(--pink-soft) 55%,var(--blue-mist));
}
.lc-time-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;text-align:center}
.lc-time-item .num{font-size:clamp(30px,3.6vw,44px);font-weight:800}
.lc-time-item .lbl{font-size:13.5px;color:var(--ink-2);margin-top:4px}

/* ---------- 5. 图文区 ---------- */
.lc-doc-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:center}
.lc-doc-img img{width:100%;height:360px;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--shadow-md)}
.lc-doc-txt h2{font-size:clamp(22px,2.6vw,30px);margin:14px 0 16px}
.lc-doc-txt p{font-size:15px;margin-bottom:14px}
.lc-doc-txt p a{color:var(--purple-deep);font-weight:600}

/* ---------- 6. 底部 CTA ---------- */
.lc-bottom-cta{
  text-align:center;padding:clamp(56px,8vw,90px) 0;
  background:linear-gradient(135deg,var(--purple-mist),var(--pink-soft) 55%,var(--blue-mist));
}
.lc-bottom-cta h2{font-size:clamp(24px,3.4vw,38px);margin-bottom:12px}
.lc-bottom-cta p{color:var(--ink-2);margin-bottom:26px;font-size:clamp(14px,1.5vw,16px)}
.lc-bottom-cta .btn{margin:0 6px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  /* 环形降级为纵向列表 */
  .lc-ring{width:100%;max-width:420px;aspect-ratio:auto;display:grid;grid-template-columns:1fr;gap:14px}
  .lc-ring-svg{display:none}
  .lc-node{
    position:static;transform:none;width:100%;flex-direction:row;
    background:var(--glass);border:1px solid var(--line);border-radius:var(--r-md);
    padding:12px 16px;box-shadow:var(--shadow-sm);
  }
  .lc-n-txt{white-space:normal;background:transparent;box-shadow:none;padding:0;font-size:14px}
  .lc-steps-grid{grid-template-columns:1fr 1fr}
  .lc-doc-grid{grid-template-columns:1fr}
  .lc-time-bar{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .lc-steps-grid{grid-template-columns:1fr}
}
@media (max-width:480px){
  .lc-time-bar{grid-template-columns:1fr 1fr;gap:12px}
  .lc-bottom-cta .btn{width:100%;margin:6px 0}
}

/* ---------- 6. 流程对照表 ---------- */
.lc-type-wrap{
  overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--glass);box-shadow:var(--shadow-md);backdrop-filter:blur(10px);
}
.lc-type-table{width:100%;border-collapse:collapse;table-layout:fixed;min-width:720px}
.lc-type-table thead th{
  background:var(--grad-purple);color:#fff;font-size:14px;font-weight:600;padding:14px 12px;text-align:left;
}
.lc-type-table tbody td{
  padding:14px 12px;font-size:14px;color:var(--ink-2);border-bottom:1px solid var(--line);vertical-align:top;
}
.lc-type-table tbody tr:last-child td{border-bottom:none}
.lc-type-table tbody tr{transition:background .25s}
.lc-type-table tbody tr:hover{background:var(--purple-mist)}
.lc-type-table .lc-t-cat{font-weight:600;color:var(--ink);background:rgba(237,230,252,.5)}

/* ---------- 7. 服务承诺（承诺条） ---------- */
.lc-promise-sec{padding:clamp(46px,6vw,72px) 0;background:linear-gradient(120deg,var(--pink-soft),var(--purple-mist) 55%,var(--blue-mist))}
.lc-promise-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.lc-p-item{display:flex;gap:12px;align-items:flex-start}
.lc-p-ico{
  flex:none;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.85);color:var(--purple-deep);
}
.lc-p-ico svg{width:22px;height:22px}
.lc-p-item h4{font-size:15px;margin-bottom:4px}
.lc-p-item p{font-size:12.5px;color:var(--ink-3)}

@media (max-width:1024px){
  .lc-promise-bar{grid-template-columns:1fr 1fr}
}

/* ===== 自动生成列宽规则（修复 th 内联样式）===== */
.lc-type-table{table-layout:fixed;width:100%}
.lc-type-table th:nth-child(1){width:16%}
.lc-type-table th:nth-child(2){width:30%}
.lc-type-table th:nth-child(3){width:34%}
.lc-type-table th:nth-child(4){width:20%}