/*
 * Fluid values scale between 375px (mobile) and 1312px (desktop).
 * Formula: clamp(min, slope*vw + intercept, max)
 */

:root {

	/* ── Primary ── */
	--color-white:         #FFFFFF;
	--color-off-white-50:  #FCFAF7;
	--color-off-white-100: #F7F5F2;
	--color-off-white-200: #F1EFEC;

	/* ── Sky ── */
	--color-sky-200: #D9E9FA;
	--color-sky:     #B2CBE5;
	--color-sky-700: #7AA2CC;

	/* ── Gold ── */
	--color-gold-200: #FFD480;
	--color-gold:     #EDAA24;
	--color-gold-700: #CC8800;

	/* ── Green ── */
	--color-green-200: #BECC70;
	--color-green:     #748003;
	--color-green-700: #5D662E;

	/* ── Grayscale ── */
	--color-black:    #191919;
	--color-gray-500: #807E7C;
	--color-gray-400: #B2B1AE;
	--color-gray-200: #CCCAC7;
	--color-gray-100: #E0DEDB;

	/* ── Font ── */
	--font-base:   'Figtree', sans-serif;
	--fw-light:    300;
	--fw-regular:  400;
	--fw-medium:   500;
	--fw-semibold: 600;
	--fw-bold:     700;

	/* ── Fluid headings ── */
	/* min→max: H1 48→74, H2 40→60, H3 28→44, H4 24→32, H5 20→26 */
	--fs-h1: clamp(48px, 2.78vw + 2.35rem, 74px);
	--fs-h2: clamp(40px, 2.13vw + 2rem,    60px);
	--fs-h3: clamp(28px, 1.71vw + 1.35rem, 44px);
	--fs-h4: clamp(24px, 0.85vw + 1.3rem,  32px);
	--fs-h5: clamp(20px, 0.64vw + 1.1rem,  26px);

	--lh-h1: 1.0;
	--lh-h2: 1.1;
	--lh-h3: 1.1;
	--lh-h4: 1.3;
	--lh-h5: 1.24;

	--ls-h1: -0.02em;
	--ls-h2: -0.02em;
	--ls-h3: -0.015em;
	--ls-h4: -0.005em;
	--ls-h5: -0.015em;

	/* ── Fluid body ── */
	/* min→max: L 18→22, M 18→20, S 16→18, XS 14→16, XXS 14 */
	--fs-body-l:   clamp(18px, 0.43vw + 1.025rem, 22px);
	--fs-body-m:   clamp(18px, 0.21vw + 1.075rem, 20px);
	--fs-body-s:   clamp(16px, 0.21vw + 0.95rem,  18px);
	--fs-body-xs:  clamp(14px, 0.21vw + 0.825rem, 16px);
	--fs-body-xxs: 14px;

	--lh-body-l:   1.3;
	--lh-body-m:   1.4;
	--lh-body-s:   1.4;
	--lh-body-xs:  1.4;
	--lh-body-xxs: 1.4;

	--ls-body-l:  -0.015em;
	--ls-body-m:  0;
	--ls-body-s:  0;
	--ls-body-xs: 0;

	/* ── Labels ── */
	--fs-label-m: clamp(14px, 0.21vw + 0.825rem, 16px);
	--fs-label-s: 14px;
	--lh-label-m: 1.3;
	--lh-label-s: normal;
	--ls-label-m: 0;
	--ls-label-s: -0.01em;

	/* ── Buttons ── */
	--fs-btn-s: 12px; --lh-btn-s: 16px;
	--fs-btn-m: 14px; --lh-btn-m: 16px;
	--fs-btn-l: 16px; --lh-btn-l: 20px;

	/* ── CTA ── */
	--fs-cta: clamp(24px, 0.85vw + 1.3rem, 32px);
	--lh-cta: 1.1;
	--ls-cta: -0.015em;

	/* ── Fluid spacing ── */
	/* min→max: xs 4→8, s 8→16, m 16→32, l 24→48, xl 40→80, 2xl 60→120, 3xl 80→160 */
	--space-xs:  clamp(4px,  0.43vw + 0.15rem, 8px);
	--space-s:   clamp(8px,  0.85vw + 0.3rem,  16px);
	--space-m:   clamp(16px, 1.71vw + 0.6rem,  32px);
	--space-l:   clamp(24px, 2.56vw + 0.9rem,  48px);
	--space-xl:  clamp(40px, 4.27vw + 1.5rem,  80px);
	--space-2xl: clamp(60px, 6.4vw  + 2.25rem, 120px);
	--space-3xl: clamp(80px, 8.54vw + 2.8rem,  160px);
}