:root {
	--color-blue-jc: #184784;
	--color-blue-dark: #0f2a4a;
	--color-blue-deep: #10315c;
	--color-blue-bright: #1c5197;
	--color-blue-900: #0e2a50;
	--color-blue-700: #184784;
	--color-blue-500: #3d6bae;
	--color-blue-300: #8fb0d6;
	--color-blue-100: #e7eff8;
	--color-orange: #f0a23c;
	--color-coral: #df4c37;
	--color-bg: #ffffff;
	--color-bg-soft: #f4f7fb;
	--color-border: #e4e9f0;
	--color-text: #0f2a4a;
	--color-text-muted: #44546a;
	--color-text-soft: #5b6b82;
	--color-success: #16a34a;
	--color-error: #dc2626;
	--color-warning: #f59e0b;
	--surface-page: #ffffff;
	--surface-muted: #f4f7fb;
	--surface-dark: #0f2a4a;
	--surface-card: #ffffff;
	--surface-card-muted: #f8fafd;
	--text-heading: #0f2a4a;
	--text-body: #44546a;
	--text-caption: #5b6b82;
	--text-on-dark: #ffffff;
	--text-on-dark-muted: #c7d6ea;
	--action-primary: #184784;
	--action-primary-hover: #10315c;
	--action-accent: #f0a23c;
	--action-accent-strong: #df4c37;
	--focus-ring: #f0a23c;
	--gradient-hero: linear-gradient(160deg, #0c2647 0%, #10315c 52%, #1c5197 100%);
	--gradient-accent: linear-gradient(90deg, #f0a23c 0%, #df4c37 100%);
	--font-heading: "Plus Jakarta Sans", system-ui, sans-serif;
	--font-body: "IBM Plex Sans", system-ui, sans-serif;
	--text-xs: 0.75rem;
	--text-sm: 0.875rem;
	--text-md: 1rem;
	--text-lg: 1.125rem;
	--text-xl: 1.375rem;
	--text-h2: 1.875rem;
	--text-h1: 2.375rem;
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 20px;
	--space-6: 24px;
	--space-8: 32px;
	--space-10: 40px;
	--space-12: 48px;
	--space-16: 64px;
	--space-20: 80px;
	--space-24: 96px;
	--container-max: 1180px;
	--container-padding: 20px;
	--radius-xs: 6px;
	--radius-sm: 8px;
	--radius-md: 12px;
	--radius-lg: 16px;
	--radius-xl: 24px;
	--radius-pill: 999px;
	--shadow-sm: 0 1px 2px rgba(15, 42, 74, 0.06);
	--shadow-md: 0 12px 28px rgba(15, 42, 74, 0.1);
	--shadow-lg: 0 24px 56px rgba(16, 49, 92, 0.16);
	--shadow-focus: 0 0 0 4px rgba(240, 162, 60, 0.28);
}

@media (min-width: 768px) {
	:root {
		--container-padding: 32px;
		--text-xl: 1.5rem;
		--text-h2: 2.5rem;
		--text-h1: 3.75rem;
	}
}

@media (min-width: 1024px) {
	:root {
		--container-padding: 40px;
	}
}