:root {
	--hhr-color-navy: #0d1b2a;
	--hhr-color-navy-soft: #17324d;
	--hhr-color-blue: #1e63d6;
	--hhr-color-blue-dark: #174fa9;
	--hhr-color-powder: #eef6fc;
	--hhr-color-powder-strong: #e1eff9;
	--hhr-color-green: #22a447;
	--hhr-color-green-dark: #187a35;
	--hhr-color-yellow: #f4bf21;
	--hhr-color-yellow-dark: #d9a500;
	--hhr-color-white: #ffffff;
	--hhr-color-surface: #f8fbfe;
	--hhr-color-text: #17212b;
	--hhr-color-muted: #5f6d7a;
	--hhr-color-border: #cbd8e4;
	--hhr-color-focus: #ffcf3f;

	--hhr-font-heading: "Inter Display", "Inter", "Segoe UI", Arial, sans-serif;
	--hhr-font-body: "Inter", "Segoe UI", Arial, sans-serif;

	--hhr-space-1: 0.25rem;
	--hhr-space-2: 0.5rem;
	--hhr-space-3: 0.75rem;
	--hhr-space-4: 1rem;
	--hhr-space-5: 1.5rem;
	--hhr-space-6: 2rem;
	--hhr-space-7: 3rem;
	--hhr-space-8: 4.5rem;

	--hhr-radius-small: 0.5rem;
	--hhr-radius-button: 0.75rem;
	--hhr-radius-card: 1rem;
	--hhr-radius-large: 1.5rem;

	--hhr-shadow-card: 0 0.75rem 2rem rgb(13 27 42 / 0.1);
	--hhr-shadow-raised: 0 1rem 3rem rgb(13 27 42 / 0.16);

	--hhr-container: 75rem;
	--hhr-content: 48rem;
	--hhr-transition: 180ms ease;
}