/* =========================================================
   株式会社Unity — /recruit/ page-specific styles
   style.css は編集せず :root 変数・既存クラス語彙のみ再利用。
   既存の .recruit（Safety Orange 地）を、採用ヒーローのみ
   実写真 + 暗オーバーレイへ差し替える追加スタイル。
   ========================================================= */

/* ---- 採用ヒーロー：実写真 genba-04 + 暗オーバーレイ ---- */
.recruit-hero{
  background:var(--ink);
  color:var(--concrete);
}
.recruit-hero::before{
  /* 既存 .recruit::before のグリッドは活かしつつ、写真と暗幕を重ねる */
  background:
    linear-gradient(180deg, rgba(13,12,8,.78), rgba(13,12,8,.62) 45%, rgba(13,12,8,.86)),
    radial-gradient(120% 90% at 80% 0%, rgba(255,77,0,.22), transparent 55%),
    image-set(
      url("/assets/works/genba-04.webp") type("image/webp"),
      url("/assets/works/genba-04.jpg") type("image/jpeg"));
  background-size:cover, cover, cover;
  background-position:center, center, center 30%;
  background-repeat:no-repeat;
  mask-image:none;
  opacity:1;
}
.recruit-hero .recruit-inner{color:var(--concrete)}
.recruit-hero .eyebrow{color:var(--accent)}
.recruit-hero .eyebrow::before{background:var(--accent)}
.recruit-hero h1{
  font-family:var(--disp);
  font-size:clamp(2.6rem,8vw,6rem);line-height:.9;letter-spacing:.01em;
  margin-top:18px;
}
.recruit-hero h1 .jp{
  display:block;font-family:var(--sans);font-weight:900;
  font-size:clamp(1.1rem,3vw,1.9rem);line-height:1.4;margin-top:18px;letter-spacing:.03em;
  color:var(--concrete);
}
.recruit-hero p{color:rgba(244,243,240,.86)}

/* 急募 / 未経験歓迎 バッジ */
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:6px}
.hero-badges .badge{
  font-family:var(--mono);font-size:.7rem;font-weight:700;letter-spacing:.14em;
  padding:7px 14px;border:1px solid var(--accent);text-transform:uppercase;line-height:1;
}
.hero-badges .badge.fill{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.hero-badges .badge.line{color:var(--accent)}

/* ダーク写真上で .btn-dark を可視化（既定の ink 地は背景に埋もれるため反転） */
.recruit-hero .btn-dark{
  background:var(--accent);border-color:var(--accent);color:var(--ink);
}
.recruit-hero .btn-dark:hover{background:transparent;color:var(--concrete);border-color:var(--concrete)}

/* ヒーロー内のポイント枠：暗地に合わせ反転 */
.recruit-hero .recruit-points{
  background:rgba(244,243,240,.16);border-color:rgba(244,243,240,.16);
}
.recruit-hero .recruit-points li{background:rgba(13,12,8,.55);color:var(--concrete)}
.recruit-hero .recruit-points .rk{color:var(--accent)}

/* ---- 仕事内容ブロック（耐火塗装メイン） ---- */
.job-lead{
  border-left:3px solid var(--accent);
  padding-left:clamp(20px,3vw,34px);
  max-width:64ch;
}
.job-lead .lead{
  font-family:var(--disp);
  font-size:clamp(1.7rem,4.5vw,3rem);
  line-height:1.1;letter-spacing:.02em;margin-bottom:22px;
}
.job-lead .lead .accent{display:block}
.job-lead p{font-size:1rem;line-height:2.15;color:var(--ink-2)}
.job-lead p + p{margin-top:18px}

/* ---- 待遇テーブル内の強調値 ---- */
.spec-table td b.fig{
  font-family:var(--disp);font-weight:400;
  font-size:clamp(1.2rem,3vw,1.7rem);letter-spacing:.02em;
  color:var(--ink);line-height:1.2;
}

@media (min-width:560px){
  .recruit-hero .recruit-points{grid-template-columns:repeat(3,1fr)}
}