/* ============================================================
   RECRUIT — CMS 追補
   prototype/css/recruit.css は SSOT のため一切変更しない。
   CMS 化によって「03 の項目数が可変になった」ことだけに対応する追補を置く。

   recruit.css の元の指定:
     .rc-terms__list > li{ border-top:1px solid var(--hair); }
     .rc-terms__list > li:nth-last-child(-n+2){ border-bottom:1px solid var(--hair); }
   これは Desktop の 2 列グリッドで「項目数が偶数」であることを前提にしている。
   項目数が奇数になると、最後の 2 件が別の行に来るため罫線が非対称になる。

   下記は「各 li に下線、各列の 1 件目にだけ上線」に置き換えたもの。
   項目数が偶数のときの見た目は元と完全に同一で、奇数でも崩れない。
   ============================================================ */

.rc-terms__list > li{ border-top: 0; border-bottom: 1px solid var(--hair); }

@media (min-width: 900px){
  /* 2 列グリッドの 1 行目 = 1・2 番目の li */
  .rc-terms__list > li:nth-child(-n+2){ border-top: 1px solid var(--hair); }
}
@media (max-width: 899px){
  .rc-terms__list > li:first-child{ border-top: 1px solid var(--hair); }
}

/* 検証用データであることを示す帯（テスト用注記が入力された求人にだけ出る）
   FV の写真は Frame を約 7vh はみ出す設計なので、この帯にも .rc-why と同じ
   スタッキングを与えて写真の下に潜らないようにする。 */
.rc-testnote{ position: relative; z-index: 2;
  background: var(--off-white); border-bottom: 1px solid var(--hair); }
.rc-testnote .devnote{ padding-block: 18px; }

/* 募集終了時の表示（CTA ボタンの位置をそのまま使う） */
.rc-closed{
  display:inline-block; border:1px solid var(--hair-strong);
  padding: 17px 22px; color: var(--ink-70);
  font-size: var(--fs-label); letter-spacing: .08em; margin:0;
}
.rc-closed--light{ border-color: var(--hair-light); color: var(--white-70); }

/* ------------------------------------------------------------
   CMS-2：項目の「補足」（Owner が入力したときだけ出力される）
   既存デザインに存在しない要素のため、新しい語彙は作らず
   recruit.css の .rc-terms__cap と同じ扱い（小ラベルのサイズ・色）に揃える。
   未入力時は要素そのものが出力されないため、現在の見た目は一切変わらない。
   ------------------------------------------------------------ */
.rc-terms__t{ display: block; }
.rc-terms__sub,
.rc-work__sub,
.rc-who__sub{
  display: block; margin-top: 8px;
  font-size: var(--fs-label); letter-spacing: .06em; line-height: 1.7;
  color: var(--ink-45);
}
.rc-work__sub{ max-width: 44ch; }
.rc-who__sub{ max-width: 52ch; }

/* ------------------------------------------------------------
   CMS-2 長文対応：紫の面（なぜ今募集するのか）が本文の量に応じて伸びるようにする。

   recruit.css では .rc-why__in と本文が絶対配置のため、セクションの高さは
   min-height:104vh に固定され、本文が長いと overflow:hidden で切れていた。
   （実測：全角130文字の段落を入れると本文下端がセクション下端を 78px 超過）

   本文だけを通常フローへ戻し、絶対配置の基準を .rc-why 自身へ移す。
   ・見出し・ラベル・巨大英字の % 位置はセクションを基準にするため変化しない
   ・本文の開始位置は 104vh × 63% = 65.52vh で従来と同一
   ・通常の文章量では min-height:104vh が勝つため、現在の見た目は 1px も変わらない
   ・長文のときだけセクションが下へ伸び、文字が切れない
   ------------------------------------------------------------ */
@media (min-width: 900px){
  .rc-why__in{ position: static; }

  /* 見出し：長文で本文に重なっていたため、本文と同じく通常フローへ戻す。
     padding-top 47.84vh（= 104vh × 46%）で開始位置は従来と同一。
     min-height 65.52vh（= 104vh × 63%）が本文の開始位置を保証するため、
     通常の見出し（2行）では本文の位置が 1px も動かない。
     見出しが長くて 65.52vh を超えたときだけ、本文が下へ押し出される。
     max-width は、絶対配置時に Viewport 右端まで伸びていたのを列幅に収めるため。 */
  .rc-why__h{
    position: relative; z-index: 3;
    top: auto; left: auto;
    margin-left: 40vw; max-width: 46vw;
    padding-top: 47.84vh; min-height: 65.52vh;
  }

  .rc-why__body{
    position: relative; z-index: 2;
    top: auto; left: auto;
    margin-left: 45vw; padding-top: 0;
    max-width: 34ch;
  }
}

/* 同じ理由で「レッスンについて」も本文の量に応じて伸ばす。
   .rc-lesson__o の min-height:84vh × top:68% = 57.12vh が従来の開始位置。
   通常の文章量では min-height が勝つため、現在の見た目は変わらない。 */
@media (min-width: 900px){
  .rc-lesson__body{
    position: relative; z-index: 3;
    top: auto; left: auto;
    margin-left: 5%; padding-top: 57.12vh;
    max-width: 32ch;
  }
}

/* ------------------------------------------------------------
   FV の CTA 直下の案内。
   「友だち追加＝応募完了」と誤解されないための 1 行。
   既存の .devnote / .rc-terms__cap と同じ語彙（小ラベルのサイズ・色）で組み、
   新しいタイポグラフィは足さない。Composition（Alignment Line・Empty Plane）は
   CTA と同じ内側の列に収めるため変わらない。
   ------------------------------------------------------------ */
.rc-hero__note{
  margin: 0;
  font-size: var(--fs-label); letter-spacing: .06em; line-height: 1.7;
  color: var(--ink-45);
}
@media (min-width: 900px){
  /* CTA（top:78% / 高さ52px）の直下。Alignment Line 2（内側）に揃える。 */
  .rc-hero__note{
    position: absolute; left: calc(var(--pad) + 6%); top: 86%;
    z-index: 2; max-width: 34vw;
  }
  /* Desktop は 1 行に収まるので、Mobile 用の改行は無効化する。 */
  .rc-hero__note br{ display: none; }
}
@media (max-width: 899px){
  .rc-hero__note{ margin-top: 14px; }
}

/* ------------------------------------------------------------
   写真が未設定のとき（本番で実写真を入れる前の状態）を安全にする。
   ・応募セクションの背景：写真がないと薄い面に白文字が乗って読めなくなるため、
     暗色（--ink）で塗る。グレインは残してトーンを保つ。
   ・「なぜ今募集するのか」の写真枠：紫の面に薄い矩形が残るため、枠ごと出さない。
     見出し・本文は絶対配置なので位置は動かない。
   ファーストビューとレッスンの写真枠は地色と同じ Off-white のため、
   未設定でも余白として自然に見える（対応不要）。
   ------------------------------------------------------------ */
.rc-cta__bg.is-empty{ background: var(--ink); }
.rc-cta__bg.is-empty::after{ display: none; }