/* ==========================================================================
   baokao-liucheng.html 报考流程页专属样式
   母题：路线站牌头图 + 八步编号邮戳时间轴 + 材料清单卡
   ========================================================================== */

/* ---------- 1. 头图 ---------- */
.lc-hero {
  background:
    linear-gradient(105deg, rgba(52,49,41,.9) 0%, rgba(52,49,41,.72) 55%, rgba(52,49,41,.45) 100%),
    url("../images/gongdi-dajing.jpg") center/cover no-repeat;
  color: #fff; padding: clamp(130px,15vw,180px) 0 clamp(56px,7vw,84px);
}
.lc-hero .crumbs { color: rgba(255,255,255,.8); margin-bottom: 24px; }
.lc-hero .crumbs a { color: #fff; }
.lc-hero .crumbs .sep { color: rgba(255,255,255,.5); }
.lc-hero .eyebrow { color: var(--khaki-200); }
.lc-hero h1 { color: #fff; margin: 6px 0 16px; }
.lc-lead { color: rgba(255,255,255,.9); max-width: 620px; line-height: 1.9; }
.lc-route {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 30px;
  background: rgba(255,255,255,.1); border: 1px dashed rgba(255,255,255,.4);
  border-radius: var(--radius-m); padding: 14px 20px; backdrop-filter: blur(4px);
}
.lc-route span {
  font-size: 13.5px; font-weight: 600; color: #fff; background: rgba(178,90,51,.85);
  padding: 5px 13px; border-radius: 50px;
}
.lc-route i { color: rgba(255,255,255,.7); font-style: normal; }

/* ---------- 2. 八步时间轴（编号节点） ---------- */
.lc-steps { background: var(--paper); }
.lc-tl { max-width: 800px; margin-inline: auto; }
.lc-tl .tl-row { --tw: 96px; --aw: 64px; padding: 16px 0; align-items: center; }
.lc-tl .tl-time { text-align: right; padding-right: 16px; }
.lc-tl .tl-time em {
  font-style: normal; font-family: var(--font-mono); font-size: 12px; font-weight: 700;
  color: var(--khaki-600); letter-spacing: .1em;
}
.lc-tl .tl-node {
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--khaki-100); border: 2px solid var(--khaki-500); color: var(--khaki-700,#8a7a57);
  font-weight: 800; font-size: 17px;
}
.lc-tl .tl-row:nth-child(odd) .tl-node { background: var(--khaki-600); color: #fff; border-color: var(--khaki-600); box-shadow: 0 0 0 5px var(--khaki-200); }
.lc-tl .tl-body {
  background: var(--mist); border: 1px solid var(--line); border-radius: var(--radius-m);
  padding: 14px 20px; margin-right: 6px;
}
.lc-tl .tl-body h3 { font-size: 16.5px; margin-bottom: 4px; }
.lc-tl .tl-body p { font-size: 14px; color: var(--ink-soft); margin: 0; }
.lc-tl .tl-body a { color: var(--stamp); border-bottom: 1px dashed var(--stamp); }

/* ---------- 3. 材料清单 ---------- */
.lc-material { background: var(--mist); }
.lc-mat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.lc-mat {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-l);
  padding: 28px 26px; position: relative; transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.lc-mat:hover { transform: translateY(-5px); box-shadow: var(--shadow-m); }
.lc-mat-no {
  position: absolute; top: 14px; right: 18px; font-family: var(--font-serif);
  font-size: 46px; color: var(--khaki-100); line-height: 1;
}
.lc-mat h3 { font-size: 18px; margin-bottom: 10px; }
.lc-mat p { font-size: 14px; color: var(--ink-soft); margin: 0; }
.lc-mat-note { font-size: 12.5px; color: var(--ink-faint); margin-top: 18px; }

/* ---------- 4. 常见卡点 ---------- */
.lc-block { background: var(--paper); }
.lc-block .faq-list { max-width: 820px; margin-inline: auto; }

/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
  .lc-mat-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .lc-tl .tl-row { --tw: 74px; --aw: 44px; }
  .lc-tl .tl-node { width: 36px; height: 36px; font-size: 14px; }
  .lc-tl .tl-body { padding: 12px 14px; margin-right: 0; }
  .lc-route span { font-size: 12px; padding: 4px 10px; }
}