/* =====================================================================
   SOY-KUFU RECRUIT JOURNAL 専用スタイル
   採用LPの世界観(白基調×英字タイポ×広い余白)に統一。
   フォントは main.css のシステムスタック変数を継承(追加読込なし)。
   ===================================================================== */

/* ---------- レイアウト共通 ---------- */
.rj{max-width:1120px;margin-inline:auto;padding:clamp(24px,4vw,48px) 24px clamp(64px,9vw,128px)}
.rj-label{font-family:var(--font-en);font-size:11px;letter-spacing:.22em;color:var(--c-gray-d);margin-bottom:14px}

/* ---------- HERO ---------- */
.rj-hero{padding:clamp(28px,5vw,72px) 0 clamp(30px,4vw,56px)}
.rj-hero__eyebrow{font-family:var(--font-en);font-size:11px;letter-spacing:.26em;color:var(--c-gray-d);margin-bottom:18px}
.rj-hero__title{font-family:var(--font-en);font-weight:600;font-size:clamp(46px,8.5vw,104px);line-height:.98;letter-spacing:-.01em;color:var(--c-black)}
.rj-hero__sub{margin-top:22px;font-family:var(--font-serif);font-size:clamp(15px,1.6vw,19px);letter-spacing:.12em;color:var(--c-charcoal)}
.rj-hero__lead{margin-top:14px;font-size:14px;line-height:2.1;letter-spacing:.03em;color:var(--c-gray-d);max-width:36em}
.rj-hero--cat{padding-bottom:clamp(20px,3vw,36px)}
.rj-hero--cat .rj-hero__title{font-size:clamp(38px,6.5vw,76px)}

/* ---------- FEATURED ---------- */
.rj-featured{margin:clamp(8px,2vw,20px) 0 clamp(40px,5vw,64px)}
.rj-card--feature .rj-card__inner{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3.5vw,52px);align-items:end}
.rj-card--feature .rj-card__media{aspect-ratio:4/3}
.rj-card--feature .rj-card__title{font-size:clamp(22px,2.6vw,32px);line-height:1.55}
.rj-card--feature .rj-card__excerpt{font-size:14px;-webkit-line-clamp:4}
@media (max-width:820px){
  .rj-card--feature .rj-card__inner{grid-template-columns:1fr;align-items:start}
}

/* ---------- カテゴリフィルタ ---------- */
.rj-filter{display:flex;flex-wrap:wrap;gap:6px 26px;padding:18px 0;border-top:1px solid var(--c-gray-l);border-bottom:1px solid var(--c-gray-l);margin-bottom:clamp(34px,4.5vw,56px)}
.rj-filter__link{display:inline-flex;align-items:baseline;gap:8px;font-family:var(--font-en);font-size:12px;letter-spacing:.14em;color:var(--c-gray-d);padding:6px 0;position:relative;transition:color .3s ease}
.rj-filter__jp{font-family:var(--font-sans);font-size:10px;letter-spacing:.06em;color:var(--c-gray)}
.rj-filter__link::after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;background:var(--c-charcoal);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.rj-filter__link:hover{color:var(--c-black)}
.rj-filter__link:hover::after{transform:scaleX(1)}
.rj-filter__link.is-current{color:var(--c-black)}
.rj-filter__link.is-current::after{transform:scaleX(1)}
@media (max-width:600px){ .rj-filter{gap:4px 18px} .rj-filter__jp{display:none} }

/* ---------- 記事カード ---------- */
.rj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,3.4vw,48px) clamp(20px,2.6vw,36px)}
@media (max-width:960px){ .rj-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .rj-grid{grid-template-columns:1fr;gap:36px} }
.rj-card__inner{display:flex;flex-direction:column;gap:0;color:inherit;text-decoration:none}
.rj-card__media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--c-offwhite)}
.rj-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.16,1,.3,1)}
a.rj-card__inner:hover .rj-card__media img{transform:scale(1.045)}
.rj-card__body{padding-top:16px;display:flex;flex-direction:column}
.rj-card__meta{display:flex;align-items:baseline;gap:14px;margin-bottom:10px}
.rj-card__cat{font-family:var(--font-en);font-size:10px;letter-spacing:.2em;color:var(--c-black);border-bottom:1px solid var(--c-charcoal);padding-bottom:2px}
.rj-card__date{font-family:var(--font-en);font-size:11px;letter-spacing:.08em;color:var(--c-gray)}
.rj-card__title{font-family:var(--font-serif);font-weight:500;font-size:16.5px;line-height:1.75;letter-spacing:.03em;color:var(--c-black)}
a.rj-card__inner:hover .rj-card__title{opacity:.72;transition:opacity .3s ease}
.rj-card__excerpt{margin-top:10px;font-size:12.5px;line-height:1.95;letter-spacing:.02em;color:var(--c-gray-d);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rj-card__more{margin-top:14px;font-family:var(--font-en);font-size:10px;letter-spacing:.2em;color:var(--c-charcoal);display:inline-flex;align-items:center;gap:8px}
.rj-card__arrow{transition:transform .3s ease}
a.rj-card__inner:hover .rj-card__arrow{transform:translateX(4px)}
.rj-note{margin-top:28px;font-size:12.5px;letter-spacing:.04em;color:var(--c-gray-d)}
.rj-note a{color:var(--c-charcoal);text-decoration:underline;text-underline-offset:3px}

/* ---------- 採用CTA ---------- */
.rj-cta{margin-top:clamp(56px,8vw,104px);padding:clamp(40px,6vw,72px) 28px;background:var(--c-black);color:#fff;text-align:center}
.rj-cta__eyebrow{font-family:var(--font-en);font-size:11px;letter-spacing:.26em;color:rgba(255,255,255,.55);margin-bottom:18px}
.rj-cta__lead{font-family:var(--font-serif);font-size:clamp(16px,2vw,21px);line-height:2.1;letter-spacing:.08em;margin-bottom:30px}
.rj-cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.rj-cta .btn--ghost{color:#fff;border-color:rgba(255,255,255,.5)}
.rj-cta .btn--ghost:hover{background:#fff;color:var(--c-black);border-color:#fff}

/* ---------- 記事詳細 ---------- */
.rj-article__wrap{max-width:760px;margin-inline:auto}
.rj-article__hero{padding:clamp(16px,3vw,36px) 0 0}
.rj-article__meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 18px;margin-bottom:18px;font-family:var(--font-en);font-size:11px;letter-spacing:.1em;color:var(--c-gray)}
.rj-article__cat{font-size:10px;letter-spacing:.2em;color:var(--c-black);border-bottom:1px solid var(--c-charcoal);padding-bottom:2px}
.rj-article__updated{color:var(--c-gray)}
.rj-article__author{font-family:var(--font-sans);letter-spacing:.06em;color:var(--c-gray-d)}
.rj-article__title{font-family:var(--font-serif);font-weight:500;font-size:clamp(24px,3.6vw,38px);line-height:1.65;letter-spacing:.04em;color:var(--c-black);margin-bottom:clamp(24px,3.5vw,40px)}
.rj-article__eyecatch{margin:0 0 clamp(30px,4.5vw,52px);aspect-ratio:16/10;overflow:hidden}
.rj-article__eyecatch img{width:100%;height:100%;object-fit:cover;display:block}
.rj-article__lead{font-family:var(--font-serif);font-size:clamp(15px,1.7vw,18px);line-height:2.2;letter-spacing:.05em;color:var(--c-charcoal);padding:0 0 26px;margin-bottom:34px;border-bottom:1px solid var(--c-gray-l)}

/* 本文タイポグラフィ */
.rj-article__body{font-size:15.5px;line-height:2.15;letter-spacing:.03em;color:var(--c-charcoal)}
.rj-article__body>*+*{margin-top:1.6em}
.rj-article__body h2{font-family:var(--font-serif);font-weight:500;font-size:clamp(19px,2.2vw,24px);line-height:1.7;letter-spacing:.05em;color:var(--c-black);margin-top:2.6em;padding-top:1.4em;border-top:1px solid var(--c-gray-l)}
.rj-article__body h3{font-weight:600;font-size:16.5px;line-height:1.8;letter-spacing:.04em;color:var(--c-black);margin-top:2.2em}
.rj-article__body p{margin-top:1.4em}
.rj-article__body img{max-width:100%;height:auto;display:block;margin:2em auto}
.rj-article__body blockquote{margin:2em 0;padding:4px 0 4px 22px;border-left:2px solid var(--c-charcoal);font-family:var(--font-serif);color:var(--c-gray-d);line-height:2.1}
.rj-article__body ul,.rj-article__body ol{padding-left:1.3em}
.rj-article__body li{margin-top:.55em}
.rj-article__body ul li::marker{color:var(--c-gray)}
.rj-article__body a{color:var(--c-black);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.rj-article__body strong{font-weight:600}
/* 強調ボックス(エディタで className: rj-box を付与) */
.rj-article__body .rj-box,.rj-article__body .wp-block-group.rj-box{background:var(--c-offwhite);border:1px solid var(--c-gray-l);padding:22px 24px;font-size:14px;line-height:2.05}

.rj-article__joblink{margin-top:44px;padding:26px 28px;border:1px solid var(--c-gray-l);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.rj-article__joblink p{font-size:14px;letter-spacing:.03em;color:var(--c-charcoal)}
.rj-article__boilerplate{margin-top:44px;padding-top:24px;border-top:1px solid var(--c-gray-l);font-size:12.5px;line-height:2;letter-spacing:.02em;color:var(--c-gray-d)}

/* 関連記事 */
.rj-related{margin-top:clamp(52px,7vw,88px)}
.rj-grid--related .rj-card__excerpt{display:none}

/* ---------- 採用LP内 導線セクション(コンパクトなメディア導線) ---------- */
.rl-journal{max-width:1120px;margin-inline:auto}
.rl-journal--split{display:grid;grid-template-columns:minmax(250px,32%) 1fr;gap:clamp(28px,4vw,64px);align-items:start;padding:clamp(56px,8vw,110px) 24px}
.rl-journal__lead{margin-top:14px;font-size:13.5px;line-height:2.05;letter-spacing:.03em;color:var(--c-gray-d)}
.rl-journal__intro .rl-journal__more{margin-top:24px;text-align:left}
/* 右カラム: 横長サムネの小カードを縦に3件(巨大な縦長画像にしない) */
.rj-grid--onrecruit{display:flex;flex-direction:column;gap:clamp(14px,2vw,22px);margin-top:0}
.rj-grid--onrecruit .rj-card__inner{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center}
.rj-grid--onrecruit .rj-card__media{aspect-ratio:16/9;border-radius:2px}
.rj-grid--onrecruit .rj-card__body{padding-top:0}
.rj-grid--onrecruit .rj-card__meta{margin-bottom:7px}
.rj-grid--onrecruit .rj-card__title{font-size:15px;line-height:1.65}
.rj-grid--onrecruit .rj-card__excerpt{margin-top:7px;font-size:12px;-webkit-line-clamp:2}
.rj-grid--onrecruit .rj-card__more{display:none}
@media (max-width:820px){
  .rl-journal--split{grid-template-columns:1fr;gap:26px}
  .rj-grid--onrecruit .rj-card__inner{grid-template-columns:132px 1fr;gap:14px}
  .rj-grid--onrecruit .rj-card__excerpt{display:none}
}
@media (max-width:420px){
  .rj-grid--onrecruit .rj-card__inner{grid-template-columns:112px 1fr;gap:12px}
  .rj-grid--onrecruit .rj-card__title{font-size:14px}
}

/* =====================================================================
   採用LP SP: 画像→JOURNAL→JOBS→CTA の縦リズムを引き締め、
   画像とCTA周辺に不自然な余白が出ないよう調整(SPのみ・PC不変)。
   ===================================================================== */
@media (max-width:640px){
  .rl-journal--split{padding-top:clamp(40px,9vw,64px);padding-bottom:clamp(28px,6vw,40px)}
  .rl-jobs{padding-top:clamp(34px,6vw,48px);padding-bottom:clamp(34px,6vw,48px)}
  .rl-entry{padding-top:clamp(44px,8vw,64px)}
}