/* =========================================================
   Saari 採用LP ── upgrade.css（2026-06-28 追加・①②③の図解/あしらい強化）
   既存CSSは変更せず追加スコープのみ。トークンは tokens.css を流用（繊細な世界観を維持）。
   ① Numbers：主役数値(月給)を大きく＝メリハリ ② こんな方に：バブルに葉のあしらい
   ③ 採用フロー：線ピクトグラム＋応募入口チップ
   ========================================================= */

/* 右上ヘッダー応募ボタン：固定フッタの応募(.btn--primary)と同じ＝ローズ地・白文字 */
.site-header a.site-header__cta{background:var(--c-rose);color:#fff;border-color:transparent;}
.site-header a.site-header__cta:hover{background:var(--c-rose-deep);color:#fff;}

/* ① Why Saari 数値：左の大型hero（縦2行）＋右の数値カード（カンプ準拠） */
.nums{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px;max-width:900px;margin:0 auto}
.nbig{grid-row:span 2;background:var(--c-rose-soft);border-radius:var(--radius-lg);padding:30px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.nbig .l{font-size:var(--fs-xs);letter-spacing:.12em;color:var(--c-clay)}
.nbig .v{font-family:var(--ff-display);font-weight:var(--fw-light);font-size:clamp(3rem,7vw,4.6rem);line-height:1;color:var(--c-rose-deep)}
.nbig .v small{font-size:.27em;margin-left:4px;color:var(--c-ink-soft)}
.nbig .s{font-size:var(--fs-sm);color:var(--c-ink-soft);line-height:1.75}
.ncell{background:var(--c-white);border:1px solid var(--c-line);border-radius:14px;padding:22px 20px;display:flex;flex-direction:column;justify-content:center;gap:6px;text-align:center}
.ncell .l{font-size:var(--fs-xs);letter-spacing:.08em;color:var(--c-clay)}
.ncell .v{font-family:var(--ff-display);font-weight:var(--fw-light);font-size:clamp(1.7rem,3.4vw,2.3rem);line-height:1.05;color:var(--c-rose-deep)}
.ncell .v small{font-size:.45em;color:var(--c-ink-soft);margin-left:2px}
@media(max-width:680px){.nums{grid-template-columns:1fr 1fr;gap:12px}.nbig{grid-row:auto;grid-column:1/-1}}

/* ② こんな方に：チェックカード（カンプ準拠） */
.checks{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:820px;margin:0 auto}
.chk{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;background:var(--c-white);border:1px solid var(--c-line);border-radius:14px;padding:16px 20px}
.chk .m{width:30px;height:30px;border-radius:50%;background:var(--c-rose);color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.chk .m svg{width:16px;height:16px;display:block}
.chk p{font-size:var(--fs-sm);color:var(--c-ink);line-height:1.7;margin:0}
.kw{color:var(--c-rose-deep);font-weight:700}
@media(max-width:680px){.checks{grid-template-columns:1fr;gap:10px}}

/* ③ 採用フロー：線ピクトグラム＋応募入口チップ */
.flow-ic{
  width:42px;height:42px;border-radius:50%;background:var(--c-rose-soft);color:var(--c-rose-deep);
  display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px;
}
.flow-ic svg{width:21px;height:21px;display:block}
/* ③ 採用フロー：横並びカード（カンプ準拠） */
.process .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.process .flow-step{flex-direction:column;align-items:center;text-align:center;gap:7px;padding:26px 16px}
.process .flow-step:hover{transform:translateY(-3px);border-color:var(--c-rose)}
.process .flow-ic{order:-1;margin:0}
.process .flow-step .n{font-size:1.3rem}
.process .flow-en{display:block;font-family:var(--ff-accent);font-style:italic;color:var(--c-rose-deep);font-size:.95rem;letter-spacing:.04em}
.process .flow-step h4{font-family:var(--ff-jp-serif);font-weight:var(--fw-regular);font-size:1.4rem;margin:2px 0 3px}
.process .flow-step p{font-size:var(--fs-sm);color:var(--c-ink-soft);line-height:1.7}
@media(max-width:680px){.process .flow{grid-template-columns:1fr 1fr;gap:12px}}
.entry-chips{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:22px;
}
.entry-chips a{
  font-size:var(--fs-xs);letter-spacing:.06em;color:var(--c-ink-soft);text-decoration:none;
  background:var(--c-white);border:1px solid var(--c-line);border-radius:999px;padding:7px 16px;
  display:inline-flex;align-items:center;gap:6px;transition:border-color var(--dur),color var(--dur),background var(--dur);
}
.entry-chips a::after{content:"›";color:var(--c-rose-deep);font-family:var(--ff-display)}
.entry-chips a:hover{border-color:var(--c-rose);color:var(--c-rose-deep);background:var(--c-rose-soft)}
.entry-lead{text-align:center;font-size:var(--fs-xs);color:var(--c-greige-deep);letter-spacing:.1em;margin-top:18px}

/* フォーム同意：チェックボックスとテキストの間に余白＋テキストを箱の中央高さへ */
.form label.form-consent{display:flex;align-items:center;gap:10px}
.form label.form-consent input[type="checkbox"]{flex:none;margin:0;width:18px;height:18px}
