/* Design tokens από το Figma (Ilbagno). Το Figma υπερισχύει σε χρώματα και opacity (ρίσκα AA: docs/placeholders-and-deviations.md). */
:root {
	/* Χρώματα */
	--color-black: #000;
	--color-white: #fff;
	--color-bg: #f3f3f3;                    /* Figma: φόντο σελίδων */
	--color-text: #000;
	--color-text-muted: rgba(0, 0, 0, 0.5); /* Figma: breadcrumb, περιγραφές */
	--color-header: #604d43;                /* Figma: header εσωτερικών σελίδων */
	--color-mega: #9b9b9b;                  /* Figma: Nav Bar V.2 */
	--color-accent: #9f866e;                /* Figma: ενεργό "Κατάλογος" */
	--color-line: rgba(255, 255, 255, 0.6);
	--color-field: #e8e8e8;                 /* Figma: κουτιά επιλογών */
	--color-field-border: #eddfff;          /* Figma: πεδίο ποσότητας */
	--color-input: #e9e9e9;                 /* Figma: πεδία φόρμας επικοινωνίας */
	--color-input-border: #737373;
	--color-badge: #fdfffb;                 /* Figma: badge και κείμενο κουμπιών */

	/* Γραμματοσειρές (self-hosted, assets/fonts) */
	--font-primary: "Geom", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
	--font-alt: "TikTok Sans", "Geom", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
	--font-inter: "Inter", "Geom", system-ui, -apple-system, Arial, sans-serif;
	--font-manrope: "Manrope", "Geom", system-ui, -apple-system, Arial, sans-serif;

	/* Τυπογραφία (Figma: Body 20/26, H1 45/1.2, H2 36, H3 26. Mobile: 16/22, 26/32, 22/28) */
	--font-size-body: 20px;
	--line-height-body: 26px;
	--font-size-h1: 45px;
	--font-size-h2: 36px;
	--font-size-h3: 26px;
	--font-weight-regular: 400;
	--font-weight-bold: 700;

	/* Spacing */
	--space-container: 100px;               /* πλευρικό padding στα 1920 */
	--space-xs: 6px;
	--space-sm: 10px;
	--space-md: 16px;
	--space-lg: 24px;
	--space-xl: 40px;
	--space-2xl: 60px;
	--space-3xl: 100px;

	/* Radius */
	--radius-btn: 32px;

	/* Layout */
	--header-pad-y: 30px;
	--max-width: 1920px;
}

@media (max-width: 1440px) {
	:root { --space-container: 60px; }
}
@media (max-width: 1024px) {
	:root {
		--space-container: 40px;
		--font-size-h1: 36px;
		--font-size-h2: 30px;
		--font-size-h3: 24px;
		--font-size-body: 18px;
		--line-height-body: 24px;
		--header-pad-y: 20px;
	}
}
@media (max-width: 767px) {
	:root {
		--space-container: 20px;
		--font-size-h1: 32px;
		--font-size-h2: 26px;
		--font-size-h3: 22px;
		--font-size-body: 16px;
		--line-height-body: 22px;
	}
}