/* ==========================================================================
   about-licheng.html · 发展历程 — F3 纵轴时间线
   设计：左年份 / 中轴圆点 / 右内容卡 三列纵轴时间线 → 三阶段小结 → 数字带 → 下一步 → CTA
   命名空间：lc-
   ========================================================================== */

/* ===== ① Banner ===== */
.lc-hero{position:relative;height:min(56vh,480px);min-height:360px;display:flex;align-items:flex-end;overflow:hidden}
.lc-hero .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lc-hero .mask-ink{background:linear-gradient(180deg,rgba(29,52,38,.2),rgba(29,52,38,.62) 80%)}
.lc-hero-inner{position:relative;z-index:2;color:#F7F5EE;padding-block:46px 56px}
.lc-hero-inner h1{color:#FCFBF7;font-size:clamp(28px,4vw,46px);letter-spacing:.06em;margin-top:16px}
.lc-hero-inner .sub{max-width:620px;margin-top:16px;color:rgba(247,245,238,.88);line-height:1.9}

/* ===== ② 总述 ===== */
.lc-intro-box{max-width:760px}
.lc-intro-desc{margin-inline:auto}
.lc-intro{background:var(--moon-50);text-align:center}

/* ===== ③ 纵轴时间线 ===== */
.lc-timeline{background:var(--moon-100)}
.lc-line{max-width:900px;margin-inline:auto;position:relative}
.lc-node{
  display:grid;grid-template-columns:110px 44px 1fr;
  align-items:start;padding-block:26px;
}
.lc-year{
  font-family:var(--serif);font-size:clamp(24px,2.6vw,32px);font-weight:700;
  color:var(--bamboo-700);text-align:right;padding-top:22px;padding-right:18px;
  letter-spacing:.04em;
}
.lc-axis{position:relative;height:100%;display:flex;justify-content:center}
/* 轴线：用 ::before 从节点顶部连到底部 */
.lc-axis::before{
  content:"";position:absolute;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--bamboo-300),var(--bamboo-500));
}
.lc-dot{
  position:relative;z-index:2;margin-top:30px;width:16px;height:16px;border-radius:50%;
  background:#fff;border:4px solid var(--bamboo-500);box-shadow:0 0 0 4px rgba(78,124,91,.15);
}
.lc-dot-now{border-color:var(--cinnabar-500);background:var(--cinnabar-500)}
.lc-card{
  background:#fff;border-radius:var(--radius-lg);padding:24px 28px;margin-left:14px;
  box-shadow:var(--shadow-soft);border-left:3px solid var(--bamboo-400);
  transition:transform .3s ease,box-shadow .3s ease;
}
.lc-card:hover{transform:translateX(4px);box-shadow:var(--shadow-lift)}
.lc-card h3{font-size:18.5px;letter-spacing:.03em}
.lc-card p{margin-top:10px;font-size:14.5px;color:var(--ink-500);line-height:1.95}
.lc-card-now{border-left-color:var(--cinnabar-500);background:linear-gradient(120deg,#FFF8F2,#fff)}

/* ===== ④ 三阶段小结 ===== */
.lc-phases{background:var(--moon-50)}
.lc-phase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px}
.lc-phase-grid article{
  background:#fff;border-radius:var(--radius-lg);padding:32px 28px;box-shadow:var(--shadow-soft);
}
.lc-phase-grid span{font-size:13px;letter-spacing:.2em;color:var(--cinnabar-600);font-weight:600}
.lc-phase-grid h3{font-size:24px;margin-top:10px}
.lc-phase-grid p{margin-top:12px;font-size:14.5px;color:var(--ink-500);line-height:1.95}

/* ===== ⑤ 数字带 ===== */
.lc-numbers{background:linear-gradient(135deg,var(--bamboo-900),var(--bamboo-700));padding-block:clamp(44px,6vw,64px)}
.lc-numbers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.lc-numbers-grid div{text-align:center;color:var(--moon-100)}
.lc-numbers-grid strong{font-family:var(--serif);font-size:clamp(34px,4vw,50px);display:block;line-height:1.1}
.lc-numbers-grid strong em{font-style:normal;font-size:.5em;color:var(--cinnabar-400);margin-left:4px}
.lc-numbers-grid span{display:block;margin-top:8px;font-size:14px;color:rgba(247,245,238,.7);letter-spacing:.1em}

/* ===== ⑥ 下一步 ===== */
.lc-next{background:var(--moon-100)}
.lc-next-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,60px);align-items:center}
.lc-p{margin-top:16px;font-size:15.5px;color:var(--ink-700);line-height:2.05}
.lc-next-body .btn{margin-top:26px}
.lc-next-fig img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);aspect-ratio:4/3;object-fit:cover}

/* ===== ⑦ CTA ===== */
.lc-cta{background:linear-gradient(120deg,var(--bamboo-900),var(--bamboo-700));text-align:center;position:relative;overflow:hidden}
.lc-cta::before{content:"";position:absolute;left:-80px;bottom:-80px;width:240px;height:240px;border-radius:50%;border:1px solid rgba(192,47,43,.4);box-shadow:0 0 0 26px rgba(192,47,43,.1)}
.lc-cta-inner{position:relative;z-index:2;padding-block:clamp(52px,7vw,80px)}
.lc-cta-inner h2{color:#FCFBF7;font-size:clamp(24px,3.2vw,38px)}
.lc-cta-inner p{max-width:560px;margin:18px auto 30px;color:rgba(247,245,238,.82);line-height:2}

/* ===== 响应式 ===== */
@media (max-width:920px){
  .lc-node{grid-template-columns:64px 32px 1fr;padding-block:20px}
  .lc-year{font-size:18px;text-align:right;padding-right:8px}
  .lc-card{padding:20px 20px;margin-left:8px}
  .lc-phase-grid{grid-template-columns:1fr;gap:16px}
  .lc-numbers-grid{grid-template-columns:repeat(2,1fr);gap:20px}
  .lc-next-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .lc-node{grid-template-columns:1fr;gap:0}
  .lc-axis{display:none}
  .lc-year{text-align:left;padding:0 0 8px}
  .lc-card{margin-left:0}
}