/* ==========================================================================
   YFC Design Tokens — V16.0 UI/UX Refresh（GREEN × SKY × WHITE）
   yfc-front.css の :root（V8〜V15）の後に読み込み、同じ custom property を上書きする共通token層。
   既存CSSは var(--yfc-*) で色を参照しているため、ここを変えるだけで全ページに反映される
   （既存CSSは書き換えない）。
   役割:
     GREEN  = ブランド（人工芝・フットサル・YFC）… typography / icon / active / 小さなaccent
     SKY    = 爽快感・清潔感 … 背景accent・線・装飾（文字色には --yfc-sky-deep を使う）
     WHITE  = 見やすさ・軽さ … 大面積の背景
     YELLOW = Action … 重要CTA（特に予約）だけ
   コントラスト（WCAG）: 白地の --yfc-green 5.36 / --yfc-muted 4.77 / --yfc-sky-deep 5.57、
   黄色ボタン上の --yfc-green-deep 8.89、Footer（--yfc-footer-bg）上の白 15.0。
   ========================================================================== */

:root {
	/* GREEN（ブランド） */
	--yfc-green: #147A4B;
	--yfc-green-dark: #0F6139;
	--yfc-green-deep: #12352B;
	--yfc-green-light: #6FA86F;
	--yfc-green-tint: #E6F4EC;

	/* SKY（爽快感・背景accent。文字には sky-deep） */
	--yfc-sky: #4BAAD5;
	--yfc-sky-deep: #1F6F96;
	--yfc-sky-light: #EFF8FC;
	--yfc-sky-soft: #DCEFF8;

	/* WHITE / NEUTRAL */
	--yfc-white: #FFFFFF;
	--yfc-bg: #F7FAFB;
	--yfc-offwhite: #F7FAFB;
	--yfc-gray-100: #EDF2F4;
	--yfc-gray-300: #D5DEE1;
	--yfc-gray-600: #667672;
	--yfc-muted: #667672;
	--yfc-text: #122D28;
	--yfc-border: #DCE5E8;

	/* YELLOW（予約CTA。現行の値を維持） */
	--yfc-yellow: #EAD356;
	--yfc-yellow-hover: #D8B949;

	/* FOOTER（サイトを締める dark blue-green） */
	--yfc-footer-bg: #102A32;
	--yfc-footer-bar: #0B2027;
	--yfc-footer-text: #FFFFFF;
	--yfc-footer-muted: #B8C9CC;
	--yfc-footer-line: rgba(255, 255, 255, 0.12);

	/* 明るいsection（旧・濃緑の長いsectionの置き換え） */
	--yfc-surface-light: linear-gradient(135deg, var(--yfc-sky-light) 0%, #FFFFFF 58%, var(--yfc-green-tint) 100%);
	--yfc-pitch-line: rgba(20, 122, 75, 0.12);
}