/* ==========================================================================
   NEXT GENERATION ─ デザイントークン
   全セクション共通の色・書体をここで定義する。
   個別のCSSはこの変数を参照すること。
   ========================================================================== */

:root {
	/* 色 */
	--ng-ink:      #14110f;              /* 本文・見出し（真っ黒を避けた墨色） */
	--ng-ink-70:   rgba(20, 17, 15, .70); /* 補助テキスト */
	--ng-ink-45:   rgba(20, 17, 15, .45); /* ラベル・注釈 */
	--ng-ink-12:   rgba(20, 17, 15, .12); /* 罫線 */
	--ng-paper:    #ffffff;
	--ng-offwhite: #f6f4f1;              /* セクション地 */
	--ng-sand:     #efeae3;              /* 引用・プレースホルダ */
	--ng-green:    #4ca85c;              /* アクセント（Big upロゴの緑。色相130°） */
	--ng-green-dk: #3d8b4a;              /* 白背景上のリンクホバー（白地 4.21／オフ白 3.83） */
	/* 小さい文字に使える緑（2026-09-13）。ロゴと同じ色相130°のまま暗くした。
	   --ng-green は白地で 2.97、--ng-green-dk でも 4.21 しかなく、
	   11px前後のラベルには足りない。こちらは 白地 5.40／オフ白 4.92。 */
	--ng-green-deep: #367741;
	--ng-beige:    #c9bca8;              /* 罫・番号 */

	/* 黄緑（2026-09-05、クライアント要望でヘッダーに導入）

	   ロゴの緑（色相130°）より黄色寄りの色相88°。
	   白地と写真の上とで必要な明るさが逆になるため、2色を用意している。
	   数字は白地／墨地に対するコントラスト比。4.5以上で本文サイズでも読める。 */
	--ng-ygreen-dk: #4a7020;             /* 白地の文字用（白地 5.79 ／ 墨地 3.25） */
	--ng-ygreen:    #6a9e2f;             /* 白地のホバー用（白地 3.21 ／ 墨地 5.86） */
	--ng-ygreen-lt: #b6de6b;             /* 暗い面のボタン用（上に置く墨文字と 12.22） */
	--ng-ygreen-hi: #c5e588;             /* 暗い幕の上の文字用（黒68%の幕の上で 4.17〜） */
	/* リクルート帯の面。Canva案の色をそのまま採っている。
	   2026-09-19にクライアントが黄緑 #c1ff72 からこの色に変更した。
	   輝度が 0.841 → 0.413 と半分以下になっている。

	   **この上には濃い文字しか置けない。**
	     墨 8.30 ／ 墨70% 4.59 ／ 白 2.27（白は使えない）

	   墨70%が4.59と基準ぎりぎりなので、**この緑をこれ以上暗くするなら
	   補足文の色も一緒に見直すこと。** */
	--ng-green-band: #66bd93;

	/* 書体 */
	--ng-en: "Jost", "Helvetica Neue", Arial, sans-serif;
	--ng-ja: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
	/* 英字と和文が混ざる見出し用（英字はJost、和文はNoto Sans JPに落ちる） */
	--ng-mix: "Jost", "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;

	/* イージング */
	--ng-ease: cubic-bezier(.22, .61, .36, 1);
}
