/* ============================================================
   laowuyuan.css · 劳务员岗位详解（重构版）
   题头形态⑦：斜切/弧形背景题头（保留）
   中间区块：竖向时间线 / 四提醒大卡 / 图文 / 特性卡 / 对照表 / 备考方向 / FAQ
   类名前缀 lo-
   ============================================================ */

/* ---------- 题头：斜切弧形（保留） ---------- */
.lo-hero{
  background:linear-gradient(135deg,#E9F9F1 0%,#D5F2E3 60%,#EFFBF4 100%);
  padding:120px 0 90px;
  clip-path:polygon(0 0,100% 0,100% 88%,0 100%);
}
.lo-hero-inner{ position:relative; }
.lo-hero-flex{ display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:center; margin-top:10px; }
.lo-kicker{ display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:3px; color:var(--green-deep); margin-bottom:14px; }
.lo-kicker::before{ content:""; width:26px; height:3px; border-radius:3px; background:linear-gradient(90deg,var(--green),var(--orange)); }
.lo-kicker.k-green{ color:var(--green-deep); }
.lo-title{ font-size:46px; font-weight:800; color:var(--ink); letter-spacing:1px; }
.lo-sub{ margin-top:18px; color:var(--ink-2); font-size:16px; line-height:1.9; max-width:560px; }
.lo-actions{ margin-top:28px; display:flex; flex-wrap:wrap; gap:14px; }
.lo-hero-media img{ width:100%; height:320px; object-fit:cover; border-radius:20px; box-shadow:var(--shadow-lg); transform:rotate(1.5deg); border:6px solid #fff; }

/* ---------- 区块标题通用 ---------- */
.lo-head{ margin-bottom:36px; }
.lo-head .lo-kicker{ margin-bottom:10px; }
.lo-h2{ font-size:32px; font-weight:800; letter-spacing:.5px; }
.lo-sub{ margin-top:10px; color:var(--ink-2); font-size:15px; max-width:720px; }
.lo-head.ta-c{ text-align:center; }
.lo-head.ta-c .lo-sub{ margin-left:auto; margin-right:auto; }

/* ---------- 区块1：竖向时间线 ---------- */
.lo-timeline{ background:#fff; }
.lo-tlwrap{ margin-top:44px; position:relative; padding-left:30px; max-width:760px; }
.lo-tlwrap::before{ content:""; position:absolute; left:8px; top:6px; bottom:6px; width:3px; background:linear-gradient(180deg,var(--green),var(--orange)); border-radius:3px; }
.lo-tl{ position:relative; padding:0 0 30px 30px; }
.lo-tl:last-child{ padding-bottom:0; }
.lo-tl-dot{ position:absolute; left:-30px; top:6px; width:19px; height:19px; border-radius:50%; background:#fff; border:4px solid var(--green); box-shadow:0 0 0 4px var(--green-soft); }
.lo-tl:nth-child(even) .lo-tl-dot{ border-color:var(--orange); box-shadow:0 0 0 4px var(--orange-soft); }
.lo-tl-body h3{ font-size:18px; margin-bottom:6px; }
.lo-tl-body p{ color:var(--ink-2); font-size:14.5px; line-height:1.85; }

/* ---------- 区块2：四提醒大卡 ---------- */
.lo-remind{ background:var(--bg-green); }
.lo-four{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.lo-rcard{ background:#fff; border-radius:var(--radius); padding:28px 22px; border:1px solid var(--line); box-shadow:var(--shadow-sm); transition:transform .3s ease, box-shadow .3s ease; border-top:4px solid var(--green); }
.lo-rcard:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.lo-rcard b{ display:block; font-size:26px; font-weight:800; color:var(--orange); margin-bottom:10px; }
.lo-rcard h3{ font-size:17px; margin-bottom:8px; }
.lo-rcard p{ font-size:13.5px; color:var(--ink-2); line-height:1.8; }

/* ---------- 区块3：场景图文 ---------- */
.lo-scene-wrap{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; }
.lo-scene-media img{ width:100%; height:340px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); transform:rotate(-1.5deg); border:6px solid #fff; }
.lo-scene-copy p{ margin-top:14px; color:var(--ink-2); line-height:1.9; }

/* ---------- 区块4：适合人群特性卡 ---------- */
.lo-fit{ background:var(--bg-orange); }
.lo-fitgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:40px; }
.lo-fcard{ background:#fff; border-radius:var(--radius); padding:26px 22px; border:1px solid var(--line); transition:transform .3s ease, box-shadow .3s ease; }
.lo-fcard:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); }
.lo-fcard h3{ font-size:16.5px; margin-bottom:8px; color:var(--orange-deep); }
.lo-fcard p{ font-size:13.5px; color:var(--ink-2); line-height:1.8; }

/* ---------- 区块5：报考对照表 ---------- */
.lo-tablewrap{ border-radius:var(--radius-lg); overflow:auto; box-shadow:var(--shadow-sm); border:1px solid var(--line); }
.lo-table{ width:100%; border-collapse:collapse; background:#fff; min-width:640px; }
.lo-table th,.lo-table td{ padding:14px 18px; text-align:left; font-size:14px; }
.lo-table thead th{ background:var(--ink); color:#fff; letter-spacing:1px; }
.lo-table tbody tr{ border-bottom:1px solid var(--line); }
.lo-table tbody tr:nth-child(odd){ background:var(--bg-soft); }
.lo-table tbody tr:last-child{ border-bottom:none; }
.lo-table td:first-child{ font-weight:700; color:var(--green-deep); white-space:nowrap; width:140px; }
.lo-table td:last-child{ color:var(--ink-2); line-height:1.8; }
.lo-apply-links{ margin-top:24px; display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 区块6：备考方向 ---------- */
.lo-prep{ background:#fff; }
.lo-prep-inner{ display:grid; grid-template-columns:1.2fr .8fr; gap:40px; align-items:center; background:linear-gradient(135deg,#E9F9F1,#fff); border:1px solid rgba(18,183,106,.2); border-radius:var(--radius-lg); padding:44px; }
.lo-prep-copy p{ margin-top:14px; color:var(--ink-2); line-height:1.9; }
.lo-prep-copy .btn{ margin-top:22px; }
.lo-prep-media img{ width:100%; height:260px; object-fit:cover; border-radius:var(--radius); }

/* ---------- 区块7：FAQ ---------- */
.lo-faq-wrap{ max-width:860px; margin:0 auto; }
.lo-acc{ margin-top:30px; }
.lo-acc-item{ background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:14px; overflow:hidden; }
.lo-acc-head{ width:100%; text-align:left; padding:18px 22px; font-size:16px; font-weight:700; color:var(--ink); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.lo-acc-arrow{ flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--bg-orange); position:relative; transition:transform .3s ease; }
.lo-acc-arrow::before{ content:""; position:absolute; left:50%; top:50%; width:10px; height:2px; background:var(--orange-deep); transform:translate(-50%,-50%); }
.lo-acc-arrow::after{ content:""; position:absolute; left:50%; top:50%; width:2px; height:10px; background:var(--orange-deep); transform:translate(-50%,-50%); transition:opacity .3s ease; }
.lo-acc-item.open .lo-acc-arrow{ transform:rotate(180deg); }
.lo-acc-item.open .lo-acc-arrow::after{ opacity:0; }
.lo-acc-body{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.lo-acc-item.open .lo-acc-body{ max-height:320px; }
.lo-acc-body p{ padding:0 22px 20px; color:var(--ink-2); font-size:14.5px; line-height:1.9; }

/* ---------- 底部 CTA ---------- */
.lo-cta{ background:linear-gradient(120deg,var(--green),var(--green-deep)); padding:56px 0; color:#fff; }
.lo-cta .cta-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; }
.lo-cta .cta-copy h2{ font-size:28px; font-weight:800; }
.lo-cta .cta-copy p{ margin-top:10px; color:rgba(255,255,255,.92); max-width:520px; line-height:1.8; }
.lo-cta .cta-actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .lo-hero{ padding:104px 0 70px; clip-path:none; }
  .lo-hero-flex{ grid-template-columns:1fr; gap:28px; }
  .lo-title{ font-size:36px; }
  .lo-four{ grid-template-columns:1fr 1fr; }
  .lo-fitgrid{ grid-template-columns:1fr 1fr; }
  .lo-scene-wrap{ grid-template-columns:1fr; gap:28px; }
  .lo-prep-inner{ grid-template-columns:1fr; padding:28px; }
}
@media (max-width:640px){
  .lo-title{ font-size:30px; }
  .lo-four{ grid-template-columns:1fr; }
  .lo-fitgrid{ grid-template-columns:1fr; }
  .lo-cta .cta-inner{ flex-direction:column; align-items:flex-start; }
}
