/*
 * Profigarden design tokens.
 *
 * Declared on body: Elementor puts its kit globals on body.elementor-kit-8,
 * so brand colours here follow the kit and fall back to today's values.
 * Values are 1:1 with what the site uses today (see ANALYZA-A-PLAN-REFACTORU.md, 3.3).
 * Breakpoints are not tokens (media queries cannot read them): 767px / 1024px.
 */
body {
	/* Brand, linked to the Elementor kit */
	--pg-accent:        var(--e-global-color-929565a, #659900);
	--pg-accent-hover:  var(--e-global-color-1f3ff73, #4E7501);
	--pg-border:        var(--e-global-color-6d5404a, #F2F2F2);
	--pg-beige:         var(--e-global-color-127f350, #FFEECF);
	--pg-green-dark:    #214332;
	--pg-badge-border:  #ccb68e;

	/* Text and surfaces */
	--pg-text:          #000;
	--pg-text-ui:       #111827;
	--pg-text-2:        #374151;
	--pg-muted:         #6b7280;
	--pg-muted-light:   #BBBBBB;
	--pg-line:          #e5e7eb;
	--pg-surface-hover: #f3f4f6;
	--pg-surface-soft:  #f9fafb;
	--pg-surface-card:  #F4F4F4;
	--pg-surface-light: #F8F8F8;
	--pg-white:         #fff;

	/* States */
	--pg-success:    #16a34a;
	--pg-success-bg: #f0fdf4;
	--pg-warning:    #d97706;
	--pg-warning-bg: #fffbeb;
	--pg-danger:     #dc2626;
	--pg-danger-bg:  #fef2f2;
	--pg-badge:      #e53935;

	/* Typography */
	--pg-font-body:    "Hanken Grotesk", sans-serif;
	--pg-font-display: "Unbounded", sans-serif;
	--pg-fs-11: 11px;
	--pg-fs-12: 12px;
	--pg-fs-13: 13px;
	--pg-fs-14: 14px;
	--pg-fs-15: 15px;
	--pg-fs-16: 16px;
	--pg-fs-18: 18px;
	--pg-fs-24: 24px;
	--pg-fs-32: 32px;
	--pg-fs-40: 40px;
	--pg-fs-48: 48px;

	/* Spacing and layout */
	--pg-space-4:  4px;
	--pg-space-8:  8px;
	--pg-space-12: 12px;
	--pg-space-16: 16px;
	--pg-space-20: 20px;
	--pg-space-24: 24px;
	--pg-space-32: 32px;
	--pg-space-48: 48px;
	--pg-container: 1440px;
	--pg-gutter:    100px;
	--pg-header-h:  96px;
	--pg-icon-btn:  38px;
	--pg-control-h: 52px;

	/* Shape, shadow, layers, motion */
	--pg-radius:        0;
	--pg-radius-pill:   999px;
	--pg-shadow-pop:    0 8px 24px rgba(0, 0, 0, .10);
	--pg-shadow-drawer: -4px 0 24px rgba(0, 0, 0, .12);
	--pg-overlay:       rgba(0, 0, 0, .45);
	--pg-z-header:  1000;
	--pg-z-overlay: 99998;
	--pg-z-drawer:  99999;
	--pg-dur-fast: .15s;
	--pg-dur:      .25s;
	--pg-ease:     cubic-bezier(.4, 0, .2, 1);
}

@media (max-width: 1024px) {
	body { --pg-gutter: 20px; }
}

@media (max-width: 767px) {
	body {
		--pg-gutter:   16px;
		--pg-header-h: 64px;
	}
}