/* ============================================================
   baoming-cailiao.html · 报名材料
   题头形态⑤：渐变面板题头 + 分类标签墙
   ============================================================ */

/* ---------- 题头：渐变面板 ---------- */
.cl-hero{
  margin-top:72px; padding:64px 0 56px; color:#fff;
  background:linear-gradient(120deg,var(--green-deep) 0%,var(--green) 45%,var(--orange) 100%);
}
.crumbs-light{ color:rgba(255,255,255,.75); }
.crumbs-light a{ color:#fff; }
.crumbs-light span.sep{ color:rgba(255,255,255,.4); }
.cl-kicker{ font-size:13px; font-weight:800; letter-spacing:2px; color:#fff; margin:16px 0 10px; }
.cl-title{ font-size:42px; font-weight:900; line-height:1.28; max-width:760px; }
.cl-sub{ margin-top:16px; max-width:660px; font-size:16px; color:rgba(255,255,255,.94); }
.cl-tags{ margin-top:26px; display:flex; flex-wrap:wrap; gap:10px; }
.cl-tag{
  padding:8px 18px; border-radius:999px; font-size:13.5px; font-weight:700;
  color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.4);
}

/* ---------- 内容区1：清单表 ---------- */
.cl-tablewrap{ margin-top:34px; }
.cl-table{
  width:100%; border-collapse:separate; border-spacing:0; background:#fff;
  border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm);
}
.cl-table th, .cl-table td{ padding:15px 20px; text-align:left; font-size:14.5px; }
.cl-table thead th{ background:var(--ink); color:#fff; font-size:14px; letter-spacing:1px; }
.cl-table tbody td{ border-top:1px solid var(--line); color:var(--ink-2); }
.cl-table tbody td:first-child{ font-weight:800; color:var(--orange-deep); white-space:nowrap; }

/* ---------- 内容区2：材料详解卡片 ---------- */
.cl-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:36px; }
.cl-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:26px 24px; box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
}
.cl-card-no{
  position:absolute; right:16px; top:10px; font-size:44px; font-weight:900;
  color:var(--bg-orange); line-height:1;
}
.cl-card h3{ font-size:18px; margin-bottom:10px; }
.cl-card p{ font-size:14px; color:var(--ink-2); }
.cl-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); border-top:3px solid var(--green); }

/* ---------- 内容区3/5：手风琴 ---------- */
.cl-faqwrap, .cl-faq2wrap{ max-width:880px; }
.cl-acc, .cl-acc2{ margin-top:30px; display:flex; flex-direction:column; gap:14px; }
.cl-acc .acc-item, .cl-acc2 .acc-item{
  background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden;
}
.cl-acc2 .acc-item{ background:#fff; }
.cl-acc .acc-item.open{ border-color:var(--orange); box-shadow:var(--shadow-sm); }
.cl-acc2 .acc-item.open{ border-color:var(--green); }
.cl-acc .acc-head, .cl-acc2 .acc-head{
  width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:18px 22px; font-size:16px; font-weight:700;
}
.cl-acc .acc-arrow{
  flex-shrink:0; width:28px; height:28px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-weight:700; color:var(--orange-deep);
  background:var(--orange-soft); transition:transform .3s ease, background .3s ease, color .3s ease;
}
.cl-acc2 .acc-arrow{
  flex-shrink:0; width:28px; height:28px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-weight:700; color:var(--green-deep);
  background:var(--green-soft); transition:transform .3s ease, background .3s ease, color .3s ease;
}
.cl-acc .acc-item.open .acc-arrow{ transform:rotate(45deg); background:var(--orange); color:#fff; }
.cl-acc2 .acc-item.open .acc-arrow{ transform:rotate(45deg); background:var(--green); color:#fff; }
.cl-acc .acc-body, .cl-acc2 .acc-body{ max-height:0; overflow:hidden; transition:max-height .4s ease; }
.cl-acc .acc-item.open .acc-body, .cl-acc2 .acc-item.open .acc-body{ max-height:380px; }
.cl-acc .acc-body p, .cl-acc2 .acc-body p{ padding:0 22px 20px; color:var(--ink-2); font-size:14.5px; }

/* ---------- 内容区4：准备建议带 ---------- */
.cl-tipband{ background:var(--bg-orange); padding:64px 0; }
.cl-tipband-inner{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; }
.cl-tipband-img img{ border-radius:var(--radius-lg); height:300px; width:100%; object-fit:cover; box-shadow:var(--shadow-md); }
.cl-quote-mark{ font-size:60px; line-height:0.5; color:var(--orange); font-weight:900; }
.cl-quote{ font-size:22px; font-weight:800; color:var(--ink); margin:14px 0 18px; line-height:1.5; }
.cl-tipband-text ul{ display:flex; flex-direction:column; gap:10px; }
.cl-tipband-text li{ position:relative; padding-left:24px; font-size:14.5px; color:var(--ink-2); }
.cl-tipband-text li::before{
  content:""; position:absolute; left:0; top:8px; width:9px; height:9px;
  border-radius:50%; background:var(--orange);
}

/* ---------- 底部咨询行动带 ---------- */
.cl-cta{
  background:linear-gradient(120deg,#0F1F17 0%,#143526 100%);
  color:#fff; padding:54px 0;
}
.cl-cta-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:26px; }
.cl-cta-copy h2{ font-size:27px; font-weight:900; }
.cl-cta-copy p{ margin-top:10px; color:rgba(255,255,255,.82); font-size:15px; }
.cl-cta-actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .cl-cards{ grid-template-columns:repeat(2,1fr); }
  .cl-tipband-inner{ grid-template-columns:1fr; gap:28px; }
}
@media (max-width:640px){
  .cl-title{ font-size:30px; }
  .cl-cards{ grid-template-columns:1fr; }
}

/* 问答正文内链接 */
.cl-acc .acc-body a, .cl-acc2 .acc-body a{ color:var(--green-deep); font-weight:700; }