/* beikao-zhinan.css · 备考指南（叠字题头 / 大图浮卡 / 横向步进 / 阶梯错落 / 进度条 / 铆钉卡 / 手风琴 / 电话横幅） */

/* H7 双层叠字题头 */
.zh-hero{
  background:linear-gradient(160deg,#241407 0%,#452712 100%);
  color:var(--cream-100);
  padding-top:calc(var(--header-h) + 60px);
  padding-bottom:clamp(50px,7vw,90px);position:relative;overflow:hidden;
}
.zh-hero::after{
  content:"";position:absolute;right:-60px;bottom:-80px;width:360px;height:360px;
  border:2px solid rgba(181,137,63,.25);border-radius:50%;
  box-shadow:0 0 0 40px rgba(181,137,63,.08),0 0 0 90px rgba(181,137,63,.05);
}
.zh-hero-inner{position:relative;z-index:2;max-width:840px}
.zh-stack{position:relative;margin-bottom:14px}
.zh-stack-lg{
  position:absolute;left:-6px;top:-34px;font-family:var(--font-display);
  font-size:clamp(60px,10vw,120px);font-weight:700;color:rgba(210,176,120,.12);
  letter-spacing:.04em;line-height:1;pointer-events:none;
}
.zh-stack h1{
  position:relative;font-size:clamp(30px,4.4vw,52px);color:var(--cream-50);
  margin-top:34px;
}
.zh-lead{font-size:16.5px;color:var(--cream-200);max-width:660px;line-height:1.9}

/* B4 大图 + 浮动信息卡 */
.zh-big{position:relative;padding-bottom:clamp(40px,5vw,70px)}
.zh-big-img img{width:100%;height:clamp(280px,42vw,440px);object-fit:cover;box-shadow:var(--shadow-lg)}
.zh-float-card{
  position:relative;margin:-70px 6% 0 auto;width:min(420px,90%);
  background:var(--green-800);color:var(--cream-100);
  border:1px solid var(--line-dark);border-top:4px solid var(--brass);
  border-radius:var(--r-sm);padding:24px 26px;box-shadow:var(--shadow-lg);
}
.zh-float-card h3{color:var(--brass-light);font-size:18px;margin-bottom:10px}
.zh-float-card p{font-size:14.5px;line-height:1.85;color:var(--cream-200)}

/* D1 横向步进箭头 */
.zh-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:step}
.zh-steps li{
  position:relative;padding:26px 20px;background:var(--cream-50);
  border:1px solid var(--line);border-right:none;
}
.zh-steps li:last-child{border-right:1px solid var(--line)}
.zh-steps li:not(:last-child)::after{
  content:"";position:absolute;right:-13px;top:50%;transform:translateY(-50%);
  width:0;height:0;border-left:13px solid var(--green-700);
  border-top:12px solid transparent;border-bottom:12px solid transparent;z-index:2;
}
.zh-step-no{font-family:var(--font-display);color:var(--brass);font-weight:700;font-size:13px;letter-spacing:.14em}
.zh-steps h3{font-size:18px;margin:10px 0 8px}
.zh-steps p{font-size:13.5px;color:var(--ink-soft);line-height:1.75}

/* B5 阶梯错落 */
.zh-stair{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.zh-step-card{
  background:rgba(251,247,236,.06);border:1px solid var(--line-dark);
  border-radius:var(--r-sm);padding:26px 22px;color:var(--cream-100);
  transform:translateY(calc(var(--d) * 16px));
}
.zh-step-card b{display:block;font-family:var(--font-display);font-size:20px;color:var(--brass-light);margin-bottom:12px}
.zh-step-card p{font-size:14px;color:var(--cream-200);line-height:1.8}
.zh-step-card:nth-child(1){--d:0}
.zh-step-card:nth-child(2){--d:1}
.zh-step-card:nth-child(3){--d:2}

/* E3 进度条组 */
.zh-ratio{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(28px,4vw,60px);align-items:center}
.zh-ratio-head h2{font-size:clamp(24px,3vw,34px);margin:12px 0 10px}
.zh-ratio-head p{color:var(--muted)}
.zh-bar{margin-bottom:18px}
.zh-bar-top{display:flex;justify-content:space-between;font-size:14px;font-weight:600;color:var(--ink-soft);margin-bottom:7px}
.zh-track{height:14px;background:var(--cream-200);border-radius:var(--r-xs);overflow:hidden;border:1px solid var(--line)}
.zh-track i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--green-600),var(--brass));border-radius:var(--r-xs)}
.zh-bar:nth-child(1) .zh-track i{--w:45%}
.zh-bar:nth-child(2) .zh-track i{--w:30%}
.zh-bar:nth-child(3) .zh-track i{--w:15%}
.zh-bar:nth-child(4) .zh-track i{--w:10%}
.zh-ratio-note{font-size:12.5px;color:var(--muted);margin-top:6px}

/* C5 铆钉角标卡 */
.zh-pit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.zh-pit{
  position:relative;background:var(--cream-50);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:26px 20px 22px;box-shadow:var(--shadow-sm);
}
.zh-rivet{
  position:absolute;top:12px;right:12px;width:10px;height:10px;border-radius:50%;
  background:radial-gradient(circle at 3px 3px,var(--brass-light),var(--brown-500));
}
.zh-pit h3{font-size:17px;margin-bottom:10px;color:var(--rust)}
.zh-pit p{font-size:13.5px;color:var(--ink-soft);line-height:1.75}

/* F1 手风琴 */
.zh-qa-narrow{max-width:840px;margin:0 auto}
.zh-qa-item{background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:12px;overflow:hidden}
.zh-qa-q{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;text-align:left;padding:16px 20px;font-weight:600;font-size:15.5px;color:var(--brown-800)}
.zh-qa-q:hover{background:var(--cream-100)}
.zh-qa-sign{color:var(--brass);font-size:20px;transition:transform .3s ease;flex-shrink:0}
.zh-qa-item.open .zh-qa-sign{transform:rotate(45deg)}
.zh-qa-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.zh-qa-a p{padding:0 20px 18px;color:var(--ink-soft);font-size:14.5px;line-height:1.8}

/* G3 电话横幅 */
.zh-call{text-align:center;padding:clamp(56px,7vw,90px) 0}
.zh-call-inner{max-width:760px;margin:0 auto}
.zh-call h2{color:var(--cream-50);font-size:clamp(26px,3.6vw,40px);margin-bottom:14px}
.zh-call p{color:var(--cream-200);margin-bottom:26px}
.zh-call-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* 响应式 */
@media (max-width:1024px){
  .zh-steps{grid-template-columns:repeat(2,1fr)}
  .zh-steps li{border-right:1px solid var(--line);border-bottom:none}
  .zh-steps li:nth-child(2)::after{display:none}
  .zh-pit-grid{grid-template-columns:repeat(2,1fr)}
  .zh-ratio{grid-template-columns:1fr}
  .zh-stair{grid-template-columns:1fr;transform:none}
  .zh-step-card{transform:none}
}
@media (max-width:640px){
  .zh-steps{grid-template-columns:1fr}
  .zh-steps li,.zh-steps li:last-child{border-right:1px solid var(--line)}
  .zh-steps li::after{display:none}
  .zh-pit-grid{grid-template-columns:1fr}
}

/* ===== 扩充模块 ===== */
.zhn-who{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.zhn-who-card{background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-sm);padding:24px;border-top:3px solid var(--brass)}
.zhn-who-card h3{font-size:16.5px;color:var(--brown-800);margin-bottom:10px}
.zhn-who-card p{font-size:14px;color:var(--ink-soft);line-height:1.85}
.zhn-local{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.zhn-local-img img{width:100%;height:300px;object-fit:cover;border:1px solid var(--line);box-shadow:var(--shadow-md)}
.zhn-local-body h2{font-size:clamp(22px,3vw,32px);margin-bottom:14px}
.zhn-local-body p{color:var(--ink-soft);margin-bottom:14px;line-height:1.9;font-size:15px}
.zhn-related h2{font-size:22px;margin-bottom:18px;color:var(--brown-800)}
.zhn-chips{display:flex;flex-wrap:wrap;gap:10px}
.zhn-chips a{background:var(--cream-50);border:1px solid var(--line);border-left:3px solid var(--green-700);border-radius:var(--r-xs);padding:9px 16px;font-size:13.5px;color:var(--brown-700)}
.zhn-chips a:hover{background:var(--green-700);color:var(--cream-50)}
@media(max-width:1024px){.zhn-who,.zhn-local{grid-template-columns:1fr}}
.zhn-mind{max-width:880px;margin:0 auto;text-align:center}
.zhn-mind h2{color:var(--cream-50);margin-bottom:16px;font-size:clamp(22px,3vw,30px)}
.zhn-mind p{color:var(--cream-200);font-size:15px;line-height:2}

/* endnote */
.endnote-wrap{max-width:860px;margin:0 auto}
.endnote-wrap h2{font-size:22px;margin-bottom:14px;color:var(--brown-800)}
.endnote-wrap p{font-size:15px;color:var(--ink-soft);line-height:2}