/**
 * משתני העיצוב המרכזיים של התבנית (Design Tokens).
 * כל צבע, מרווח וגודל טיפוגרפי בשאר קבצי ה-CSS חייב להפנות לכאן —
 * אין להשתמש בערכים "קשיחים" (hardcoded) בקבצי הרכיבים.
 */

:root {
	/* ===== צבעים ===== */
	--color-primary: #0b1f17; /* ירוק אזמרגד כהה */
	--color-primary-light: #123526;
	--color-gold: #c9a24b;
	--color-gold-light: #e4c77a;
	--color-white: #ffffff;
	--color-cream: #faf7f0;
	--color-black: #141414;
	--color-gray-600: #5c5c5c;
	--color-gray-200: #e7e4dd;
	--color-error: #b3261e;
	--color-success: #1e6b4e;

	/* ===== טיפוגרפיה ===== */
	--font-heading: 'Frank Ruhl Libre', 'Times New Roman', serif;
	--font-body: 'Assistant', -apple-system, 'Segoe UI', sans-serif;

	--fs-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
	--fs-sm: clamp(0.875rem, 0.84rem + 0.18vw, 0.9375rem);
	--fs-base: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
	--fs-md: clamp(1.125rem, 1.07rem + 0.28vw, 1.25rem);
	--fs-lg: clamp(1.375rem, 1.28rem + 0.48vw, 1.625rem);
	--fs-xl: clamp(1.75rem, 1.58rem + 0.85vw, 2.25rem);
	--fs-2xl: clamp(2.25rem, 1.95rem + 1.5vw, 3.25rem);
	--fs-3xl: clamp(2.75rem, 2.3rem + 2.25vw, 4.25rem);

	--lh-tight: 1.15;
	--lh-normal: 1.5;
	--lh-relaxed: 1.75;

	--ls-wide: 0.08em; /* letter-spacing לכותרות בסגנון הלוגו */
	--ls-wider: 0.16em;

	/* ===== מרווחים (סקאלה של 4px) ===== */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;
	--space-9: 6rem;
	--space-10: 8rem;
	--space-11: 10rem;
	--space-12: 12rem;

	/* ===== פריסה ===== */
	--container-max: 1440px;
	--container-padding: clamp(1.25rem, 4vw, 4rem);

	/* ===== תנועה ===== */
	--transition-fast: 200ms ease-out;
	--transition-base: 350ms ease-out;
	--transition-slow: 500ms ease-out;

	/* ===== צללים ===== */
	--shadow-sm: 0 1px 3px rgba(20, 20, 20, 0.08);
	--shadow-md: 0 4px 16px rgba(20, 20, 20, 0.1);
	--shadow-lg: 0 12px 32px rgba(20, 20, 20, 0.14);

	/* ===== רדיוסים ===== */
	--radius-sm: 2px;
	--radius-md: 4px;

	/* ===== Z-index ===== */
	--z-header: 100;
	--z-modal: 1000;
	--z-toast: 1100;
}

/*
 * נקודות שבירה (breakpoints) — CSS אינו תומך במשתנים בתוך @media,
 * לכן אלה מתועדות כאן כמקור אמת יחיד ומשוכפלות ידנית בכל media query:
 * --bp-sm: 480px
 * --bp-md: 768px
 * --bp-lg: 1024px
 * --bp-xl: 1280px
 */