/* ============================================================
   洛阳荣峰塑业有限公司 - 人才招聘页专用样式
   依赖 page-about.css（内页 banner / 二级导航 / section-head / timeline）
   ============================================================ */

/* ---------- 招聘理念 ---------- */
.job-intro{margin-top:30px; max-width:900px;  margin: 0px auto; text-align: center; color: var(--text-light);}
.job-intro .lead{font-size:18px;color:var(--text);line-height:1.8;margin-bottom:22px;}
.job-reason-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:34px}
.job-reason{
  background:#f8f8f8;border-radius:10px;padding:30px 24px;transition:var(--transition);
  border:1px solid transparent;
  text-align:center;
}
.job-reason:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--green)}
.job-reason .jr-ico{
  width:54px;height:54px;border-radius:14px;background:rgba(10,102,89,.1);color:var(--green);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
}
.job-reason .jr-ico i{font-size:26px}
.job-reason h4{font-size:18px;color:var(--text);margin-bottom:10px;letter-spacing:.5px}
.job-reason p{font-size:14.5px;line-height:1.85;color:var(--text-light);margin:0}

/* ---------- 员工福利 ---------- */
.job-band{background:#f8f8f8}
/* 员工福利版块几何背景（作用域隔离，不影响招聘流程版块） */
#benefit-sec{
  position: relative;
  overflow: hidden;
  background-color: var(--bg-light);
  background-image:
    radial-gradient(circle at 92% 8%, rgba(10,102,89,.12), rgba(10,102,89,0) 40%),
    radial-gradient(circle at 4% 96%, rgba(10,102,89,.07), rgba(10,102,89,0) 34%),
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='64'%20height='64'%3E%3Cg%20fill='none'%20stroke='%230A6659'%20stroke-opacity='0.10'%20stroke-width='1.2'%3E%3Ccircle%20cx='13'%20cy='13'%20r='3'/%3E%3Crect%20x='44'%20y='40'%20width='7'%20height='7'/%3E%3Cpath%20d='M44%209%20L51%209%20L47.5%2016%20Z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat, repeat;
  background-position: top right, bottom left, center;
  background-size: auto, auto, 64px 64px;
}
#benefit-sec > .container{position:relative;z-index:1}
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.benefit-item{
  display:flex;gap:16px;background:#fff;border-radius:10px;padding:24px;transition:var(--transition);
  align-items:flex-start;
}
.benefit-item:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.benefit-item .be-ico{
  flex:0 0 auto;width:46px;height:46px;border-radius:12px;background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.benefit-item .be-ico i{font-size:22px}
.benefit-text h4{font-size:16.5px;color:var(--text);margin-bottom:6px;letter-spacing:.5px}
.benefit-text p{font-size:14px;line-height:1.75;color:var(--text-light);margin:0}

/* ---------- 在招职位（手风琴：点击展开详情） ---------- */
.job-list{display:flex;flex-direction:column;gap:14px;margin-top:34px}
.job-item{
  background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;
  transition:box-shadow .25s ease,border-color .25s ease;
}
.job-item:hover{box-shadow:0 10px 26px rgba(10,102,89,.08)}
.job-item[open]{border-color:rgba(10,102,89,.35);box-shadow:0 14px 30px rgba(10,102,89,.12)}
.job-item-head{
  list-style:none;cursor:pointer;user-select:none;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:20px 24px;
  transition:background .2s ease;
}
.job-item-head::-webkit-details-marker{display:none}
.job-item-head:hover{background:#fafcfb}
.job-item[open] .job-item-head{background:#fafcfb}
.job-item-title{min-width:0}
.job-title{font-size:20px;color:var(--text);font-weight:700;letter-spacing:.5px;margin:0}
.job-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.job-tag{
  font-size:12px;padding:3px 10px;border-radius:20px;background:rgba(10,102,89,.1);color:var(--green);
}
.job-tag.hot{background:#fdecec;color:#e0492f}
.job-item-side{flex:0 0 auto;display:flex;align-items:center;gap:16px}
.job-salary{
  flex:0 0 auto;font-size:18px;font-weight:700;color:var(--green);white-space:nowrap;
}
.job-salary small{font-size:12px;font-weight:500;color:var(--text-light)}
.job-toggle-icon{
  flex:0 0 auto;width:32px;height:32px;border-radius:50%;
  background:rgba(10,102,89,.1);color:var(--green);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;transition:transform .25s ease,background .25s ease,color .25s ease;
}
.job-item[open] .job-toggle-icon{transform:rotate(180deg);background:var(--green);color:#fff}
.job-item-body{padding:0 24px 24px}
.job-meta{
  display:flex;flex-wrap:wrap;gap:8px 18px;padding:14px 0;
  font-size:14px;color:var(--text-light);
  border-bottom:1px dashed #e6ecea;
}
.job-meta span{display:inline-flex;align-items:center;gap:5px}
.job-meta i{font-size:14px;color:var(--green)}
.job-desc{list-style:none;margin:16px 0 18px;padding:0}
.job-desc p{margin-top:1em; margin-bottom: 1em;}
.job-desc li{
  position:relative;padding-left:18px;font-size:14px;line-height:1.8;color:var(--text-light);margin-bottom:6px;
}
.job-desc li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--green)}
.job-apply{
  display:inline-flex;align-items:center;gap:6px;
  padding:11px 26px;border-radius:30px;background:var(--green);color:#fff;font-size:14.5px;font-weight:600;
  transition:var(--transition);
}
.job-apply:hover{background:var(--green-dark);transform:translateY(-2px)}
.job-apply i{font-size:15px}

/* ---------- 招聘流程 ---------- */
.flow-section .timeline{max-width:880px;margin-left:auto;margin-right:auto}

/* ---------- 投递方式（通屏） ---------- */
.apply-sec{
  background:#fff url('/style/images/cta-strip-bg.jpg') right center / 100% 100% no-repeat;   /* 沿用首页 CTA 的浅色纹理背景（拉伸铺满，纹理在右侧） */
  color:var(--text);
  padding:60px 0;
}
.apply-wrap{
  display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;
}
.apply-text h3{font-size:24px;font-weight:700;margin-bottom:14px}
.apply-text p{font-size:15px;line-height:1.9;color:var(--text-light);margin-bottom:22px}
.apply-channels{display:flex;flex-direction:column;gap:14px}
.apply-channel{
  display:flex;align-items:center;gap:14px;background:#f5f8f7;border:1px solid #eaeff0;border-radius:12px;padding:16px 18px;
}
.apply-channel .ac-ico{width:40px;height:40px;border-radius:10px;background:rgba(10,102,89,.08);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.apply-channel .ac-ico i{font-size:20px}
.apply-channel .ac-main{font-size:14px;line-height:1.5}
.apply-channel .ac-main strong{display:block;font-size:15.5px;margin-bottom:2px}
.apply-channel .ac-main a{color:var(--green);text-decoration:underline}

@media (max-width:992px){
  .job-reason-grid{grid-template-columns:repeat(2,1fr)}
  .benefit-grid{grid-template-columns:repeat(2,1fr)}
  .apply-sec{padding:48px 0}
  .apply-wrap{grid-template-columns:1fr}
}
@media (max-width:768px){
  .job-reason-grid{grid-template-columns:1fr;gap:16px}
  .benefit-grid{grid-template-columns:1fr}
  .job-item-head{flex-direction:column;align-items:flex-start;gap:8px;padding:16px 18px}
  .job-item-side{width:100%;justify-content:space-between}
  .job-item-body{padding:0 18px 20px}
  .job-title{font-size:17px}
  .job-tags{margin-top:8px}
  .apply-sec{padding:40px 0}
  .apply-text h3{font-size:21px}
}

/* ============ 公共 chrome 图标（job.html 已转 FontAwesome，仅本页生效，不影响其他页 svg） ============ */
.search-btn i{font-size:19px}
.search-form button i{font-size:20px}
.footer-col h4 .fcol-ico{font-size:15px}
.mobile-bottom-nav a i{font-size:19px}
.mobile-bottom-nav .mb-call .mb-call-icon i{font-size:20px;animation:mbCallShake 3.2s ease-in-out infinite}
.mobile-bottom-nav .mb-call .mb-call-icon i{position:relative}