/* ==========================================================================
   xuchang-kaoshi.html 许昌考试批次私有样式
   版式：居中 head + 左右 VS 对照双卡（理论 vs 实操）+ 横幅图
        + 批次表 + 四格注意事项条 + 四格亮点 + 折叠 FAQ + 互链卡
   ========================================================================== */

/* ---------- Hero：VS 对照 ---------- */
.ks2-hero{
  padding:calc(var(--topbar-h) + var(--header-h) + 48px) 0 80px;
  background:
    radial-gradient(800px 380px at 0% 0%, rgba(185,138,94,.16), transparent 55%),
    var(--cream);
  overflow:hidden;
}
.ks2-head{text-align:center;max-width:760px;margin:0 auto 48px}
.ks2-kicker{display:inline-flex;align-items:center;gap:12px;font-size:13.5px;letter-spacing:3px;color:var(--green-deep);font-weight:600;margin-bottom:18px}
.ks2-kline{width:40px;height:2px;background:var(--wood);display:inline-block}
.ks2-title{font-size:clamp(30px,4.4vw,48px);line-height:1.28;letter-spacing:2px;margin-bottom:16px;animation:ks2Fade .8s var(--ease) both}
@keyframes ks2Fade{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.ks2-desc{font-size:15.5px;line-height:2;color:var(--ink-soft);margin-bottom:26px}
.ks2-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

.ks2-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:stretch;max-width:980px;margin:0 auto 40px}
.ks2-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;box-shadow:var(--shadow-sm);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.ks2-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.ks2-tag{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:2px;color:#fff;background:var(--green);border-radius:999px;padding:6px 16px;margin-bottom:16px}
.ks2-tag-2{background:var(--wood)}
.ks2-card h3{font-size:22px;margin-bottom:16px;letter-spacing:1px}
.ks2-card ul{display:flex;flex-direction:column;gap:10px}
.ks2-card li{position:relative;padding-left:20px;font-size:14px;color:var(--ink-soft);line-height:1.7}
.ks2-card li::before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--wood-light)}
.ks2-vs-mid{display:grid;place-items:center}
.ks2-vs-mid span{
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-serif);font-weight:700;color:#fff;background:var(--green-dark);
  box-shadow:0 0 0 6px rgba(63,90,69,.12);
}
.ks2-banner{width:100%;border-radius:var(--radius);box-shadow:var(--shadow-md);display:block}

/* ---------- 区块 ---------- */
.ks2-sec{padding:80px 0}
.ks2-sec-alt{background:var(--white)}
.ks2-note{margin-top:16px;font-size:13.5px;color:var(--ink-faint);border-left:3px solid var(--wood-light);padding:4px 0 4px 14px}

/* ---------- 注意事项条 ---------- */
.ks2-notes{background:linear-gradient(135deg,#eef2e6,#e3ecd9);padding:64px 0}
.ks2-notes-title{font-size:clamp(22px,3vw,32px);text-align:center;letter-spacing:2px;margin-bottom:36px}
.ks2-note-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ks2-note-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow-sm)}
.ks2-note-ic{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;color:var(--green-deep);background:rgba(143,174,138,.18);margin-bottom:16px}
.ks2-note-item h3{font-size:16.5px;margin-bottom:8px}
.ks2-note-item p{font-size:13.5px;line-height:1.8;color:var(--ink-soft)}

/* ---------- 亮点 ---------- */
.ks2-feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ks2-feat{background:var(--cream-3);border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s}
.ks2-feat:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);background:#fff}
.ks2-feat h3{font-size:17px;margin-bottom:8px;padding-left:12px;border-left:3px solid var(--wood)}
.ks2-feat p{font-size:13.5px;line-height:1.85;color:var(--ink-soft)}

/* ---------- FAQ ---------- */
.ks2-faq{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.ks2-faq-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);padding:0 22px;box-shadow:var(--shadow-sm)}
.ks2-faq-item summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 4px;font-size:16px;font-weight:600;color:var(--ink)}
.ks2-faq-item summary::-webkit-details-marker{display:none}
.ks2-faq-item summary::after{content:"+";font-size:22px;color:var(--wood);transition:transform .3s var(--ease)}
.ks2-faq-item[open] summary::after{transform:rotate(45deg)}
.ks2-faq-item p{padding:2px 4px 20px;font-size:14.5px;line-height:1.95;color:var(--ink-soft)}

/* ---------- 互链 ---------- */
.ks2-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ks2-rel-card{background:var(--cream-3);border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s}
.ks2-rel-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);background:#fff}
.ks2-rel-card h3{font-size:17.5px;margin-bottom:8px}
.ks2-rel-card p{font-size:14px;color:var(--ink-soft);line-height:1.75;margin-bottom:14px}
.ks2-rel-more{font-size:13.5px;color:var(--green-deep);font-weight:600;letter-spacing:1px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .ks2-vs{grid-template-columns:1fr;gap:16px}
  .ks2-vs-mid{order:-1}
  .ks2-note-grid{grid-template-columns:repeat(2,1fr)}
  .ks2-feat-grid{grid-template-columns:repeat(2,1fr)}
  .ks2-rel-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .ks2-hero{padding-top:calc(var(--topbar-h) + var(--header-h) + 24px)}
  .ks2-sec{padding:60px 0}
  .ks2-note-grid,.ks2-feat-grid,.ks2-rel-grid{grid-template-columns:1fr}
}
