/* ==========================================================================
   youxian-kongjian.html 有限空间作业证页私有样式
   版式：三段竖排 hero + 数字流程 + 监护要点卡
   ========================================================================== */

/* ---------- Hero 三段竖排 ---------- */
.yx-hero{padding-top:calc(var(--topbar-h) + var(--header-h))}
.yx-band-a{
  background:var(--green-dark);padding:48px 0 40px;
}
.yx-kicker{font-size:13px;letter-spacing:3px;color:var(--wood-light);font-weight:600;margin-bottom:14px}
.yx-title{color:#f6f2e6;font-size:clamp(30px,4.4vw,50px);line-height:1.3;letter-spacing:2px}
.yx-title-em{color:var(--wood-light)}
.yx-band-b{background:#0f1813}
.yx-band-b figure{margin:0}
.yx-band-b img{width:100%;height:340px;object-fit:cover;opacity:.92}
.yx-band-c{background:var(--cream-3);padding:40px 0 46px;border-top:1px solid var(--line)}
.yx-band-c-inner{max-width:820px}
.yx-desc{font-size:15.5px;line-height:2;color:var(--ink-soft);margin-bottom:22px}
.yx-actions{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- 通用区块 ---------- */
.yx-block{padding:76px 0}
.yx-cream{background:var(--cream-2)}

/* ---------- 报考条件 ---------- */
.yx-cond{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1000px;margin:0 auto}
.yx-cond-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow-sm);text-align:center;transition:transform .35s var(--ease)}
.yx-cond-card:hover{transform:translateY(-6px)}
.yx-cond-card h3{font-family:var(--font-serif);font-size:26px;color:var(--green-dark);margin-bottom:8px}
.yx-cond-card p{font-size:13.5px;line-height:1.8;color:var(--ink-soft)}
.yx-cond-note{text-align:center;margin-top:20px;font-size:13px;color:var(--ink-faint)}

/* ---------- 数字流程 ---------- */
.yx-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1080px;margin:0 auto}
.yx-flow-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px 22px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}
.yx-flow-num{font-family:var(--font-serif);font-size:40px;font-weight:700;color:var(--cream-2);position:absolute;top:10px;right:16px;line-height:1}
.yx-flow-item h3{font-size:18px;margin-bottom:8px;position:relative;z-index:1}
.yx-flow-item p{font-size:13.5px;line-height:1.85;color:var(--ink-soft);position:relative;z-index:1}

/* ---------- 监护要点卡 ---------- */
.yx-guard{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1080px;margin:0 auto}
.yx-guard-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--shadow-sm);border-bottom:4px solid var(--green-deep);transition:transform .35s var(--ease)}
.yx-guard-card:nth-child(2){border-bottom-color:#c0604a}
.yx-guard-card:hover{transform:translateY(-6px)}
.yx-guard-card h3{font-size:18px;margin-bottom:10px}
.yx-guard-card p{font-size:14px;line-height:1.9;color:var(--ink-soft)}

/* ---------- 考核内容 ---------- */
.yx-exam{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:920px;margin:0 auto}
.yx-exam-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-sm)}
.yx-exam-card h3{font-size:20px;margin-bottom:10px;color:var(--green-dark)}
.yx-exam-card p{font-size:14.5px;line-height:1.95;color:var(--ink-soft)}

/* ---------- 材料 + 费用 ---------- */
.yx-info{display:grid;grid-template-columns:1fr 1.2fr;gap:36px;max-width:960px;margin:0 auto}
.yx-info-mat h3,.yx-info-fee h3{font-size:19px;margin-bottom:14px}
.yx-info-mat ul{display:flex;flex-direction:column;gap:9px}
.yx-info-mat li{position:relative;padding-left:22px;font-size:14.5px;color:var(--ink-soft)}
.yx-info-mat li::before{content:"";position:absolute;left:4px;top:9px;width:6px;height:6px;background:var(--green-deep);border-radius:50%}
.yx-info-fee p{font-size:14.5px;line-height:1.95;color:var(--ink-soft)}

/* ---------- FAQ ---------- */
.yx-faq{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:13px}
.yx-faq-item{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:0 22px}
.yx-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:14px;cursor:pointer;padding:17px 0;font-weight:600;font-size:15.5px;list-style:none}
.yx-faq-item summary::-webkit-details-marker{display:none}
.yx-faq-arrow{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--cream-2);color:var(--wood-deep);display:grid;place-items:center;transition:.3s}
.yx-faq-item[open] .yx-faq-arrow{transform:rotate(45deg);background:var(--green);color:#fff}
.yx-faq-item p{padding:0 0 18px;font-size:14.5px;line-height:1.9;color:var(--ink-soft)}

/* ---------- 相关阅读 ---------- */
.yx-rel{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;max-width:1080px;margin:0 auto 40px}
.yx-rel-link{display:block;background:var(--cream-2);border:1px solid var(--line);border-radius:10px;padding:14px;text-align:center;font-size:13.5px;color:var(--ink-soft);transition:.25s}
.yx-rel-link:hover{color:var(--green-dark);border-color:var(--green);transform:translateY(-3px)}

/* ---------- 底部 CTA ---------- */
.yx-cta{text-align:center;background:var(--green-dark);border-radius:var(--radius);padding:46px 30px}
.yx-cta h2{color:#f6f2e6;font-size:24px;margin-bottom:10px}
.yx-cta p{color:#c6d1bd;margin-bottom:22px}
.yx-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.yx-btn-line{border-color:var(--wood-light);color:#f0e8d0}
.yx-btn-line:hover{background:var(--wood-light);color:var(--green-dark)}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .yx-cond{grid-template-columns:repeat(2,1fr)}
  .yx-flow{grid-template-columns:repeat(2,1fr)}
  .yx-guard{grid-template-columns:1fr}
  .yx-exam{grid-template-columns:1fr}
  .yx-info{grid-template-columns:1fr}
  .yx-rel{grid-template-columns:repeat(2,1fr)}
  .yx-band-b img{height:240px}
}
@media (max-width:600px){
  .yx-rel{grid-template-columns:1fr}
}