/* footer-recruit — 反転の帯（地 = 文字色）。2 段で反転する（同じ要素で両方書くと var() が循環する: LEARNED-RULES §10）
   組み（依頼側 2026-10-18「ヘッダーに合わせて英語に、レイアウトをもっと綺麗に」）: 上段はロゴ（左）と英字のナビ（右、Chillax 13 / 500 / 0.14em、間 40）を天地中央に、
   下に 1px の罫、下段に ©。上 112 / 下 48、罫の上下 48 / 32。hover は上端の線ではなく透明度（.72 → 1）と 1px の下線 */
.rcft { --rcft-bg: var(--cds-text); --rcft-fg: var(--cds-bg); padding: 112px 0 48px; background: var(--rcft-bg); }
.rcft__in { --cds-bg: var(--rcft-bg); --cds-text: var(--rcft-fg); --cds-text-body: color-mix(in srgb, var(--rcft-fg) 82%, transparent); --cds-text-secondary: color-mix(in srgb, var(--rcft-fg) 55%, transparent); --cds-rule: color-mix(in srgb, var(--rcft-fg) 16%, transparent); color: var(--cds-text-body); }
.rcft__top { display: flex; align-items: center; justify-content: space-between; gap: 32px 64px; flex-wrap: wrap; padding-bottom: 48px; border-bottom: 1px solid var(--cds-rule); }
.rcft__brand { display: block; line-height: 0; color: var(--cds-text); font-family: var(--cds-font-en); font-weight: 700; font-size: 18px; letter-spacing: 0.18em; white-space: nowrap; }
.rcft__brand img { display: block; width: 120px; height: auto; }
.rcft__nav { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.rcft__nav a { position: relative; padding: 8px 0; font-family: var(--cds-font-display, var(--cds-font-en)); font-size: 13px; font-weight: 500; line-height: 1; letter-spacing: 0.14em; text-transform: uppercase; color: var(--cds-text); opacity: 0.72; transition: opacity 0.5s var(--cds-ease); }
.rcft__nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left center; transition: transform 0.6s var(--cds-ease); }
@media (hover: hover) { .rcft__nav a:hover { opacity: 1; } .rcft__nav a:hover::after { transform: scaleX(1); transition-duration: 0.4s; } }
.rcft__copy { margin-top: 32px; padding-right: 88px; font-family: var(--cds-font-en); font-size: 12px; letter-spacing: 0.06em; color: var(--cds-text-secondary); }
/* to-top: 本体サイト C案（c-top?c=2、miai の作法）を踏襲（依頼側 2026-10-18）。64 の角丸 4、墨の地に白い矢印。hover で明るい差し色（--cds-accent-bright、無ければ --cds-accent）が左から満ち、矢印は墨に。
   暗い面（フッター）の上ではすりガラス（白 10% ＋ blur 12）。矢印は動かさない（2 枚目は出さない）。footer-editorial.css の 48 角を上書きする */
.rc ~ .to-top, .to-top { width: 64px; height: 64px; border-radius: 4px; border: 1px solid transparent; background: var(--cds-text); color: var(--cds-bg); overflow: hidden; isolation: isolate;
  transition: opacity 0.5s var(--cds-ease-out), transform 0.5s var(--cds-ease-out), color 0.45s ease, background-color 0.45s ease, border-color 0.45s ease; }
.to-top::after { content: ""; position: absolute; inset: 0; z-index: 0; background: var(--cds-accent-bright, var(--cds-accent)); transform: scaleX(0); transform-origin: left center; transition: transform 0.4s cubic-bezier(0.16, 0.5, 0.25, 1); }
.to-top__win { position: relative; z-index: 1; }
.to-top__win svg + svg { display: none; }
.to-top.on-dark { background: rgba(255, 255, 255, 0.1); color: #fff; -webkit-backdrop-filter: blur(12px) saturate(140%); backdrop-filter: blur(12px) saturate(140%); }
@media (hover: hover) {
  .to-top:hover .to-top__win svg { transform: none; }
  .to-top:hover, .to-top.on-dark:hover { color: var(--cds-text); border-color: var(--cds-accent-bright, var(--cds-accent)); }
  .to-top:hover::after { transform: scaleX(1); }
}
@media (prefers-reduced-motion: reduce) { .to-top, .to-top::after { transition: none; } }
@media (max-width: 767px) {
  .rcft { padding: 72px 0 32px; }
  .rcft__top { flex-direction: column; align-items: flex-start; gap: 32px; padding-bottom: 32px; }
  .rcft__brand img { width: 108px; }
  .rcft__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; }
  .rcft__nav a { padding: 10px 0; }
  .rcft__copy { margin-top: 24px; padding-right: 0; }
}