/* zhiye-fazhan.html · 职业发展与前景专属样式 */

/* 题头：斜切浅蓝块 + 图 */
.zf-hero{
  background:linear-gradient(120deg,var(--blue-100),var(--blue-50));
  padding:calc(var(--header-h) + 48px) 0 64px;
  clip-path:polygon(0 0,100% 0,100% 90%,0 100%);
}
.zf-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.zf-hero h1{margin:12px 0 14px;font-weight:800}
.zf-hero-sub{color:var(--gray-600);font-size:15.5px;max-width:480px}
.zf-hero-img img{border-radius:var(--radius-l);box-shadow:var(--shadow-m);height:300px;width:100%;object-fit:cover}

/* 晋升通道节点图 */
.zf-path{padding:64px 0;background:var(--white)}
.zf-chain{
  display:flex;align-items:stretch;gap:12px;flex-wrap:wrap;justify-content:center;
}
.zf-node{
  flex:1;min-width:180px;background:var(--gray-50);border-radius:var(--radius-m);
  padding:26px 20px;text-align:center;position:relative;
}
.zf-node-dot{
  width:14px;height:14px;border-radius:50%;background:var(--blue-500);
  margin:0 auto 12px;display:block;box-shadow:0 0 0 5px var(--blue-100);
}
.zf-node h3{font-size:16px;margin-bottom:8px}
.zf-node p{font-size:13.5px;color:var(--gray-600)}
.zf-arrow{align-self:center;color:var(--blue-400);font-size:22px;font-weight:700}
.zf-path-note{text-align:center;font-size:13px;color:var(--gray-400);margin-top:20px}

/* 三条方向 */
.zf-ways{padding:64px 0;background:var(--gray-50)}
.zf-ways-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.zf-way{background:var(--white);border-radius:var(--radius-m);padding:28px 24px;box-shadow:var(--shadow-s)}
.zf-way-tag{
  display:inline-block;font-size:12px;font-weight:700;letter-spacing:2px;color:var(--blue-600);
  background:var(--blue-50);padding:4px 12px;border-radius:999px;margin-bottom:12px;
}
.zf-way h3{margin-bottom:10px}
.zf-way p{font-size:14px;color:var(--gray-600)}

/* 薪资参考 */
.zf-pay{padding:64px 0;background:var(--white)}
.zf-pay-in{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.zf-pay-text h2{margin:6px 0 16px}
.zf-pay-text p{color:var(--gray-700);margin-bottom:14px}
.zf-pay-cards{display:grid;gap:12px}
.zf-pay-card{
  background:var(--blue-50);border-radius:var(--radius-m);padding:18px 22px;
  border-left:4px solid var(--blue-500);
}
.zf-pay-card strong{display:block;color:var(--blue-800);font-size:16px;margin-bottom:4px}
.zf-pay-card span{font-size:13.5px;color:var(--gray-600)}

/* 本地前景 */
.zf-local{padding:64px 0;background:var(--blue-50)}
.zf-local-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.zf-local-img img{border-radius:var(--radius-l);box-shadow:var(--shadow-m);height:320px;width:100%;object-fit:cover}
.zf-local-text h2{margin:6px 0 16px}
.zf-local-text p{color:var(--gray-700);margin-bottom:14px}

/* 行动带 */
.zf-cta{padding:72px 0;background:linear-gradient(120deg,var(--blue-700),var(--blue-500))}
.zf-cta-in{text-align:center;color:#fff}
.zf-cta-in h2{color:#fff;margin-bottom:12px}
.zf-cta-in p{color:rgba(255,255,255,.9);margin-bottom:24px}

@media (max-width:920px){
  .zf-hero{clip-path:none}
  .zf-hero-in,.zf-pay-in,.zf-local-in{grid-template-columns:1fr;gap:26px}
  .zf-ways-grid{grid-template-columns:1fr}
  .zf-arrow{transform:rotate(90deg)}
}

/* 能力台阶表 */
.zf-skill{padding:64px 0;background:var(--gray-50)}
.zf-skill-wrap{margin-top:36px;overflow-x:auto}
.zf-skill-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:12px;overflow:hidden;font-size:14.5px}
.zf-skill-table th,.zf-skill-table td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--gray-200)}
.zf-skill-table th{background:var(--brand-50)}
.zf-skill-table td:first-child{font-weight:600;color:var(--brand);white-space:nowrap}
.zf-skill-table tbody tr:last-child td{border-bottom:none}
.zf-skill-note{text-align:center;margin-top:20px;font-size:14.5px;color:var(--gray-600)}

/* 本地趋势 */
.zf-trend{padding:64px 0;background:var(--white)}
.zf-trend-in{max-width:820px;margin:0 auto}
.zf-trend p{font-size:15px;color:var(--gray-600);line-height:1.9;margin-bottom:14px}