/* ============================================================
   page-liucheng.css — 建站流程
   签名布局：七步双轨时间轴（左步骤 / 右交付物）+ 工期卡横卷
   作用域：body.page-liucheng
   ============================================================ */

.lc-hero .hero-hotline{margin-top:18px;font-size:14px;color:var(--c-muted)}

/* ---------- 双轨时间轴 ---------- */
.rail{position:relative;max-width:960px;margin:0 auto;list-style:none}
.rail::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--c-pink-300),var(--c-purple-300));transform:translateX(-50%)}
.rail-item{position:relative;display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;margin-bottom:34px}
.rail-item:last-child{margin-bottom:0}
/* 中间圆点 */
.rail-item::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--c-purple-300);box-shadow:0 0 0 6px var(--c-bg-purple);z-index:2}
.rail-step{padding:24px 26px;background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}
.rail-item:nth-child(even) .rail-step{order:3}
.rail-item:nth-child(even) .rail-deliver{order:1}
.rail-no{display:inline-block;font-size:13px;font-weight:800;color:var(--c-pink-400);letter-spacing:.1em;margin-bottom:6px}
.rail-step h3{font-size:19px;margin-bottom:8px}
.rail-step p{font-size:14px;color:var(--c-text)}
.rail-deliver{padding:20px 24px;border-radius:var(--radius-md);background:var(--c-bg-purple)}
.rail-deliver-tag{display:inline-block;font-size:12px;font-weight:700;color:var(--c-purple-400);background:#fff;padding:3px 12px;border-radius:999px;margin-bottom:8px}
.rail-deliver p{font-size:13.5px;color:var(--c-text)}

/* ---------- 工期横卷卡 ---------- */
.time-card{flex:0 0 210px;background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);padding:24px 22px;box-shadow:var(--shadow-card)}
.time-card strong{display:block;font-size:24px;font-weight:800;color:var(--c-purple-400);margin-bottom:6px}
.time-card h3{font-size:16px;margin-bottom:6px}
.time-card p{font-size:13px;color:var(--c-muted)}

/* ---------- 左图右文 透明进度 ---------- */
.tz-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.tz-text p{margin-bottom:14px}
.tz-figure{margin:0}
.tz-figure img{border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}
.tz-figure figcaption{margin-top:12px;font-size:13px;color:var(--c-muted)}

/* ---------- 沟通机制 ---------- */
.comm-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.comm-item{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);padding:24px 22px;box-shadow:var(--shadow-card)}
.comm-item h3{font-size:17px;margin-bottom:8px;color:var(--c-ink)}
.comm-item p{font-size:13.5px;color:var(--c-text)}

/* ---------- FAQ ---------- */
.faq-list{max-width:860px;margin:0 auto}
.faq-item{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);margin-bottom:14px;overflow:hidden}
.faq-item[open]{box-shadow:var(--shadow-card)}
.faq-item summary{cursor:pointer;list-style:none;padding:18px 22px;font-weight:700;color:var(--c-ink);font-size:15.5px;position:relative;padding-right:44px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--c-purple-400);transition:transform .3s}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-item p{padding:0 22px 20px;font-size:14px;color:var(--c-text)}
.faq-item p a{color:var(--c-purple-400);font-weight:600}

/* ---------- CTA ---------- */
.cta-sec{background:var(--grad-soft)}
.cta-box{text-align:center;max-width:760px;margin:0 auto;padding:56px 30px;border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-soft)}
.cta-box h2{margin-bottom:14px}
.cta-note{margin-top:18px;font-size:13.5px;color:var(--c-muted)}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .comm-row{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:768px){
  .rail::before{left:12px}
  .rail-item{grid-template-columns:1fr;gap:12px}
  .rail-item::before{left:12px}
  .rail-item:nth-child(even) .rail-step{order:0}
  .rail-item:nth-child(even) .rail-deliver{order:0}
  .rail-step{margin-left:34px}
  .rail-deliver{margin-left:34px}
  .tz-wrap{grid-template-columns:1fr;gap:28px}
  .comm-row{grid-template-columns:1fr}
}
@media (max-width:360px){
  .rail-step{padding:18px 16px;margin-left:30px}
  .rail-deliver{padding:16px;margin-left:30px}
}