/* ============================================================
   tiku-cailiao.html · 材料员题库（去重重构）
   题头：深色统计题头 tk-stat-hero
   中间区块（类名本站独占）：zebra-sec / offset-sec / demo-sec /
        nums-sec / ledger-sec / vaxis-sec
   共享件（全站统一，不计入同质化）：tk-faq / acc-* / tk-cta
   ============================================================ */

/* ---------- 深色统计题头 ---------- */
.tk-stat-hero{
  margin-top:72px; overflow:hidden;
  background:
    radial-gradient(1100px 480px at 88% -10%, rgba(255,122,28,.28), transparent 60%),
    radial-gradient(900px 460px at -8% 108%, rgba(18,183,106,.30), transparent 60%),
    linear-gradient(150deg,#0F1F17 0%, #132A1E 55%, #0C1A13 100%);
  color:#fff; padding:64px 0 56px;
}
.tk-stat-in{ position:relative; z-index:2; }
.tk-stat-crumb{ display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:#9DB3A6; padding:0 0 18px; }
.tk-stat-crumb a{ color:#C7D8CE; }
.tk-stat-crumb a:hover{ color:var(--orange-2); }
.tk-stat-crumb .sep{ color:#3E5747; }
.tk-stat-kick{ display:inline-block; font-size:13px; font-weight:700; letter-spacing:3px; color:var(--orange-2); margin-bottom:14px; }
.tk-stat-ttl{ font-size:40px; font-weight:800; line-height:1.25; letter-spacing:.5px; }
.tk-stat-desc{ margin-top:16px; max-width:760px; color:#C2D4C9; font-size:15.5px; line-height:1.9; }
.tk-stat-act{ margin-top:26px; display:flex; flex-wrap:wrap; gap:14px; }
.tk-stat-nums{ margin-top:44px; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:820px; list-style:none; }
.tk-stat-nums li{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius); padding:18px 18px 16px; }
.tk-stat-nums b{ display:block; font-size:34px; font-weight:800; line-height:1; color:var(--orange-2); }
.tk-stat-nums span{ display:block; margin-top:8px; font-size:13px; color:#9DB3A6; }

/* ---------- 六章斑马纹框架 ---------- */
.zebra-sec{ background:var(--bg-soft); }
.zebra-list{ margin-top:34px; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); list-style:none; }
.zebra-list li{ display:flex; gap:18px; align-items:flex-start; background:#fff; padding:22px 26px; border-bottom:1px solid var(--line); }
.zebra-list li:nth-child(even){ background:var(--bg-green); }
.zebra-list li:last-child{ border-bottom:none; }
.zebra-no{ flex-shrink:0; width:84px; padding-top:2px; font-size:14px; font-weight:800; color:var(--orange-deep); border-right:2px solid var(--orange-soft); padding-right:14px; }
.zebra-body h3{ font-size:18px; margin-bottom:6px; }
.zebra-body p{ color:var(--ink-2); font-size:14.5px; line-height:1.85; }

/* ---------- 错落考点卡 ---------- */
.offset-sec{ background:#fff; }
.off-cards{ margin-top:40px; display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:980px; }
.off-card{ background:var(--bg-orange); border-radius:var(--radius); padding:26px 26px 24px; border:1px solid #FFE3CC; }
.off-card.alt{ transform:translateY(26px); }
.off-no{ display:inline-block; font-size:15px; font-weight:800; color:#fff; background:linear-gradient(135deg,var(--orange),var(--orange-deep)); width:38px; height:38px; line-height:38px; text-align:center; border-radius:50%; margin-bottom:12px; }
.off-card h3{ font-size:18px; margin-bottom:8px; }
.off-card p{ color:var(--ink-2); font-size:14.5px; line-height:1.85; }

/* ---------- 示例题 ---------- */
.demo-sec{ background:var(--bg-soft); }
.demo-list{ margin-top:34px; display:grid; gap:20px; max-width:920px; list-style:none; }
.demo-item{ background:#fff; border-radius:var(--radius); padding:26px 28px; box-shadow:var(--shadow-sm); border-left:4px solid var(--green); }
.demo-tag{ display:inline-block; font-size:12.5px; font-weight:700; color:var(--green-deep); background:var(--green-soft); border-radius:999px; padding:4px 14px; margin-bottom:14px; }
.demo-item h3{ font-size:17.5px; line-height:1.6; margin-bottom:14px; }
.demo-opts{ display:grid; gap:9px; margin-bottom:16px; list-style:none; }
.demo-opts li{ font-size:14.5px; color:var(--ink-2); padding:9px 14px; background:var(--bg-soft); border-radius:10px; }
.demo-ans{ font-size:14.5px; color:var(--ink); background:var(--orange-soft); border-radius:10px; padding:12px 16px; line-height:1.8; }

/* ---------- 数字大卡 ---------- */
.nums-sec{ background:#fff; }
.nums-grid{ margin-top:38px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.num-card{ border:1px solid var(--line); border-radius:var(--radius); padding:26px 22px; text-align:center; transition:transform .28s ease, box-shadow .28s ease; }
.num-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.num-v{ display:inline-block; font-size:15px; font-weight:800; color:#fff; background:linear-gradient(135deg,var(--orange),var(--orange-deep)); padding:6px 16px; border-radius:999px; }
.num-card h3{ font-size:17px; margin:12px 0 8px; }
.num-card p{ font-size:14px; color:var(--ink-2); line-height:1.8; }

/* ---------- 台账对照双栏 ---------- */
.ledger-sec{ background:var(--bg-green); }
.ledger-cmp{ margin-top:34px; display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.ledger-good, .ledger-bad{ border-radius:var(--radius-lg); padding:28px; background:#fff; }
.ledger-good{ border:1px solid #CDEFE0; }
.ledger-bad{ border:1px solid #FFE3CC; }
.ledger-good h3{ color:var(--green-deep); margin-bottom:16px; font-size:18px; padding-bottom:12px; border-bottom:2px solid var(--green); }
.ledger-bad h3{ color:var(--orange-deep); margin-bottom:16px; font-size:18px; padding-bottom:12px; border-bottom:2px solid var(--orange); }
.ledger-cmp ul{ display:grid; gap:14px; list-style:none; }
.ledger-cmp li b{ display:block; font-size:15px; margin-bottom:4px; }
.ledger-good li b{ color:var(--green-deep); }
.ledger-bad li b{ color:var(--orange-deep); }
.ledger-cmp li p{ font-size:14px; color:var(--ink-2); line-height:1.8; }

/* ---------- 竖向时间轴 ---------- */
.vaxis-sec{ background:#fff; }
.vaxis-list{ margin:38px auto 0; max-width:760px; list-style:none; position:relative; padding-left:26px; }
.vaxis-list::before{ content:""; position:absolute; left:6px; top:6px; bottom:6px; width:2px; background:linear-gradient(var(--orange),var(--green)); border-radius:2px; }
.vaxis-list li{ position:relative; padding-bottom:26px; }
.vaxis-list li:last-child{ padding-bottom:0; }
.vaxis-dot{ position:absolute; left:-26px; top:2px; width:14px; height:14px; border-radius:50%; background:#fff; border:3px solid var(--orange); transform:translateX(-1px); }
.vaxis-card{ background:var(--bg-soft); border-radius:var(--radius); padding:18px 22px; margin-left:18px; }
.vaxis-card h3{ font-size:16.5px; margin-bottom:6px; }
.vaxis-card p{ font-size:14.5px; color:var(--ink-2); line-height:1.8; }

/* ---------- 问答（共享件） ---------- */
.tk-faq{ background:var(--bg-soft); }
.q-wrap{ margin:30px auto 0; max-width:820px; }
.acc-item{ background:#fff; border-radius:var(--radius); margin-bottom:12px; overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--line); }
.acc-head{ display:flex; justify-content:space-between; align-items:center; gap:14px; width:100%; text-align:left; padding:18px 22px; font-size:16px; font-weight:700; color:var(--ink); }
.acc-head::after{ content:"+"; font-size:22px; color:var(--orange-deep); transition:transform .25s ease; }
.acc-item.open .acc-head::after{ transform:rotate(45deg); }
.acc-panel{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.acc-item.open .acc-panel{ max-height:320px; }
.acc-panel p{ padding:0 22px 20px; font-size:14.5px; color:var(--ink-2); line-height:1.9; }
.acc-panel p a{ color:var(--orange-deep); font-weight:600; }
.acc-panel p a:hover{ text-decoration:underline; }

/* ---------- 底部 CTA（共享件） ---------- */
.tk-cta{ background:linear-gradient(135deg,var(--orange),var(--orange-deep)); color:#fff; padding:56px 0; }
.tk-cta-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; }
.tk-cta-copy h2{ font-size:28px; font-weight:800; }
.tk-cta-copy p{ margin-top:10px; color:#FFE9D6; max-width:560px; font-size:15px; line-height:1.8; }
.tk-cta-act{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .tk-stat-ttl{ font-size:30px; }
  .tk-stat-nums{ grid-template-columns:repeat(2,1fr); }
  .off-cards{ grid-template-columns:1fr; }
  .off-card.alt{ transform:none; }
  .nums-grid{ grid-template-columns:repeat(2,1fr); }
  .ledger-cmp{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .zebra-list li{ flex-direction:column; gap:8px; }
  .zebra-no{ border-right:none; padding-right:0; width:auto; }
  .nums-grid{ grid-template-columns:1fr; }
  .tk-cta-inner{ flex-direction:column; align-items:flex-start; }
}
