/* ============================================================
   tiku-anquan.css · 安全员题库（重构版，tk- 前缀）
   题头形态④：大图卡片题头
   区块序列：8枚磁贴 / 高频考点SVG卡 / 禁令示例题 / 图文方法 / 错题清单卡 / 竖向时间轴 / FAQ / CTA
   ============================================================ */

/* ---------- 题头：大图卡片 ---------- */
.tk-card-hero{ padding:110px 0 60px; background:var(--bg-soft); }
.tk-hcard{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg);
  min-height:480px; display:flex; align-items:flex-end;
}
.tk-hcard-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.tk-hcard-mask{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,31,23,.35) 0%, rgba(15,31,23,.55) 45%, rgba(15,31,23,.85) 100%); }
.tk-hcard-body{ position:relative; padding:48px; color:#fff; max-width:720px; }
.tk-crumbs{ display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:rgba(255,255,255,.75); margin-bottom:14px; }
.tk-crumbs a{ color:#fff; }
.tk-crumbs .sep{ color:rgba(255,255,255,.4); }
.tk-kicker{ display:inline-block; font-size:12.5px; font-weight:800; letter-spacing:2px; color:#fff; background:var(--orange); padding:5px 14px; border-radius:999px; margin-bottom:14px; }
.tk-title{ font-size:40px; font-weight:800; line-height:1.3; }
.tk-sub{ margin-top:14px; font-size:15px; line-height:1.9; color:rgba(255,255,255,.93); }
.tk-actions{ margin-top:24px; display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 通用区块 ---------- */
.tk-sec{ padding:72px 0; }
.tk-tiles-sec{ background:#fff; }

/* ---------- 磁贴 ---------- */
.tk-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:36px; }
.tk-tile{
  border-radius:var(--radius); padding:22px 20px; box-shadow:var(--shadow-sm);
  border-bottom:4px solid var(--orange); background:var(--bg-orange); transition:transform .3s ease, box-shadow .3s ease;
}
.tk-tile.t-green{ border-bottom-color:var(--green); background:var(--bg-green); }
.tk-tile:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.tk-tile b{ font-size:16.5px; display:block; margin-bottom:6px; }
.tk-tile p{ font-size:13px; color:var(--ink-2); line-height:1.7; }

/* ---------- 高频考点卡 ---------- */
.tk-pts-sec{ background:var(--bg-soft); }
.tk-pts{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:36px; }
.tk-pt{ background:#fff; border-radius:var(--radius-lg); padding:26px 24px; box-shadow:var(--shadow-sm); transition:transform .3s ease, box-shadow .3s ease; }
.tk-pt:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.tk-pt-ic{ display:inline-flex; width:50px; height:50px; border-radius:14px; align-items:center; justify-content:center; color:var(--orange-deep); background:var(--orange-soft); margin-bottom:14px; }
.tk-pt:nth-child(even) .tk-pt-ic{ color:var(--green-deep); background:var(--green-soft); }
.tk-pt h3{ font-size:16.5px; margin-bottom:8px; }
.tk-pt p{ font-size:14px; color:var(--ink-2); line-height:1.85; }

/* ---------- 示例题 ---------- */
.tk-demo-sec{ background:var(--bg-orange); }
.tk-d-list{ max-width:900px; margin-top:32px; display:grid; gap:20px; }
.tk-d-item{ background:#fff; border-radius:var(--radius-lg); padding:28px 30px; box-shadow:var(--shadow-sm); border-top:5px solid var(--green); }
.tk-d-item:nth-child(2){ border-top-color:var(--orange); }
.tk-d-tag{ display:inline-block; font-size:12.5px; font-weight:700; color:#fff; background:var(--ink); padding:5px 12px; border-radius:6px; margin-bottom:14px; letter-spacing:1px; }
.tk-d-item h3{ font-size:16.5px; line-height:1.7; margin-bottom:14px; }
.tk-opts{ margin-bottom:14px; }
.tk-opts li{ font-size:14.5px; color:var(--ink-2); background:var(--bg-soft); border-radius:8px; padding:7px 14px; margin-bottom:8px; }
.tk-ans{ font-size:14px; color:var(--green-deep); background:var(--green-soft); border-radius:10px; padding:12px 16px; line-height:1.8; }

/* ---------- 图文方法 ---------- */
.tk-m-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; }
.tk-m-list{ margin-top:18px; display:flex; flex-direction:column; gap:12px; }
.tk-m-list li{ background:#fff; border-radius:var(--radius); padding:14px 18px; box-shadow:var(--shadow-sm); border-left:4px solid var(--orange); }
.tk-m-list b{ font-size:14.5px; color:var(--orange-deep); }
.tk-m-list p{ font-size:13.5px; color:var(--ink-2); margin-top:3px; line-height:1.75; }
.tk-m-photo{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); }
.tk-m-photo img{ width:100%; height:340px; object-fit:cover; }

/* ---------- 错题清单卡 ---------- */
.tk-list-sec{ background:var(--bg-green); }
.tk-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:36px; }
.tk-card{ background:#fff; border-radius:var(--radius-lg); padding:26px 24px; box-shadow:var(--shadow-sm); border-top:4px solid var(--orange); }
.tk-card:nth-child(2){ border-top-color:var(--green); }
.tk-card:nth-child(3){ border-top-color:var(--orange-deep); }
.tk-card-ic{
  display:inline-flex; width:40px; height:40px; border-radius:10px; align-items:center; justify-content:center;
  font-weight:800; color:#fff; background:var(--orange); margin-bottom:14px;
}
.tk-card:nth-child(2) .tk-card-ic{ background:var(--green); }
.tk-card h3{ font-size:16px; margin-bottom:8px; }
.tk-card p{ font-size:13.5px; color:var(--ink-2); line-height:1.8; }

/* ---------- 竖向时间轴 ---------- */
.tk-vtl-sec{ background:#fff; }
.tk-vtl{ max-width:760px; margin:36px auto 0; position:relative; padding-left:28px; }
.tk-vtl::before{ content:""; position:absolute; left:8px; top:6px; bottom:6px; width:3px; background:linear-gradient(180deg,var(--orange),var(--green)); border-radius:3px; }
.tk-vtl-item{ position:relative; padding:0 0 26px 26px; }
.tk-vtl-item:last-child{ padding-bottom:0; }
.tk-vtl-dot{ position:absolute; left:-28px; top:4px; width:19px; height:19px; border-radius:50%; background:#fff; border:4px solid var(--orange); }
.tk-vtl-item:nth-child(even) .tk-vtl-dot{ border-color:var(--green); }
.tk-vtl-item b{ font-size:16.5px; }
.tk-vtl-item p{ font-size:14.5px; color:var(--ink-2); margin-top:4px; line-height:1.85; }

/* ---------- FAQ ---------- */
.tk-faq-sec{ background:var(--bg-soft); }
.tk-faq{ max-width:860px; margin:32px auto 0; }
.tk-faq .acc-item{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); margin-bottom:14px; overflow:hidden; }
.tk-faq .acc-head{ width:100%; text-align:left; padding:18px 22px; font-size:16px; font-weight:700; display:flex; justify-content:space-between; gap:14px; }
.tk-faq .acc-head::after{
  content:"+"; flex-shrink:0; width:30px; height:30px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:18px;
  background:var(--orange-soft); color:var(--orange-deep); transition:transform .3s ease;
}
.tk-faq .acc-item.open .acc-head::after{ transform:rotate(45deg); background:var(--green-soft); color:var(--green-deep); }
.tk-faq .acc-panel{ display:none; padding:0 22px 20px; }
.tk-faq .acc-item.open .acc-panel{ display:block; }
.tk-faq .acc-panel p{ font-size:14.5px; color:var(--ink-2); line-height:1.9; }
.tk-link{ color:var(--orange-deep); font-weight:700; border-bottom:1px dashed var(--orange); }

/* ---------- CTA ---------- */
.tk-cta{ background:linear-gradient(120deg, #0F1F17 0%, var(--green-deep) 70%, var(--orange-deep) 140%); }
.tk-cta-inner{ display:grid; grid-template-columns:1.4fr 1fr; gap:32px; align-items:center; padding:60px 0; color:#fff; }
.tk-cta-copy h2{ font-size:30px; font-weight:800; margin-bottom:12px; }
.tk-cta-copy p{ font-size:15px; line-height:1.9; color:rgba(255,255,255,.92); }
.tk-cta-act{ display:flex; flex-wrap:wrap; gap:14px; justify-content:flex-end; }

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .tk-title{ font-size:30px; }
  .tk-tiles{ grid-template-columns:repeat(2,1fr); }
  .tk-pts{ grid-template-columns:repeat(2,1fr); }
  .tk-cards{ grid-template-columns:1fr; }
  .tk-m-grid{ grid-template-columns:1fr; gap:28px; }
  .tk-cta-inner{ grid-template-columns:1fr; }
  .tk-cta-act{ justify-content:flex-start; }
}
@media (max-width:640px){
  .tk-tiles{ grid-template-columns:1fr; }
  .tk-pts{ grid-template-columns:1fr; }
  .tk-hcard-body{ padding:28px; }
}
