/* ============================================================
   CF Korea — Design tokens (single source of truth)
   Imported first by all cf-korea block styles.
   Must stay in sync with E:\Парсинг\типографика\carfinance-design-map.html
============================================================ */

:root {
	/* ---- Core brand palette ---- */
	--cf-primary:        #1A3A5C;
	--cf-primary-light:  #2A5A8C;
	--cf-primary-dark:   #0F2640;
	--cf-bg-dark:        #0B1B2B;
	--cf-bg-darker:      #05101C;

	--cf-cyan:           #009EE3;
	--cf-cyan-light:     #3FBFFA;
	--cf-cyan-dark:      #0077B2;

	--cf-accent:         #F5A623;  /* amber */
	--cf-accent-light:   #FFC360;
	--cf-accent-dark:    #E89400;

	--cf-green:          #22C97A;
	--cf-red:            #E24B4A;

	--cf-text:           #1A1D22;
	--cf-text-muted:     #5A6472;
	--cf-text-light:     #8E96A0;

	--cf-bg:             #FFFFFF;
	--cf-bg-alt:         #F7F8FA;
	--cf-border:         #E2E6EB;
	--cf-border-light:   #F0F2F5;

	/* Semantic overlays (on dark bg) */
	--cf-glass-bg:       rgba(255, 255, 255, 0.04);
	--cf-glass-bg-hi:    rgba(255, 255, 255, 0.07);
	--cf-glass-border:   rgba(255, 255, 255, 0.10);
	--cf-glass-border-hi: rgba(255, 255, 255, 0.16);

	/* ---- Type families ---- */
	--cf-font:         'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--cf-font-display: 'Bebas Neue', 'Manrope', sans-serif;
	--cf-font-mono:    'JetBrains Mono', ui-monospace, monospace;

	/* ---- Type scale (strict — use ONLY these) ---- */
	/* Labels & micro */
	--cf-text-10: 10px;
	--cf-text-11: 11px;
	--cf-text-12: 12px;
	/* Body */
	--cf-text-13: 13px;
	--cf-text-14: 14px;
	--cf-text-15: 15px;
	--cf-text-16: 16px;
	/* Headings */
	--cf-text-18: 18px;
	--cf-text-20: 20px;
	--cf-text-24: 24px;
	--cf-text-28: 28px;
	/* Display */
	--cf-text-32: 32px;
	--cf-text-40: 40px;
	--cf-text-56: 56px;

	/* ---- Weight scale (strict) ---- */
	--cf-w-regular: 400;
	--cf-w-medium:  500;
	--cf-w-semi:    600;
	--cf-w-bold:    700;
	--cf-w-black:   800;

	/* ---- Spacing grid (4px base) ---- */
	--cf-s-1:  4px;
	--cf-s-2:  8px;
	--cf-s-3:  12px;
	--cf-s-4:  16px;
	--cf-s-5:  20px;
	--cf-s-6:  24px;
	--cf-s-8:  32px;
	--cf-s-10: 40px;
	--cf-s-12: 48px;
	--cf-s-16: 64px;

	/* ---- Radius ---- */
	--cf-radius-sm: 8px;
	--cf-radius:    12px;
	--cf-radius-lg: 16px;
	--cf-radius-xl: 20px;

	/* ---- Shadows (restrained, editorial) ---- */
	--cf-shadow-sm:     0 1px 2px rgba(15, 38, 64, 0.04), 0 2px 8px rgba(15, 38, 64, 0.04);
	--cf-shadow-md:     0 4px 16px rgba(15, 38, 64, 0.06), 0 2px 4px rgba(15, 38, 64, 0.04);
	--cf-shadow-lg:     0 20px 48px rgba(15, 38, 64, 0.10), 0 4px 12px rgba(15, 38, 64, 0.05);
	--cf-shadow-accent: 0 12px 28px rgba(245, 166, 35, 0.25);

	/* ---- Motion ---- */
	--cf-ease:      cubic-bezier(0.22, 1, 0.36, 1);
	--cf-ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
}