:root {
	--ks-color-white: #FAF8F4;
	--ks-color-text: #3C3C3C;
	--ks-color-primary: #B53018;
	--ks-color-primary-hover: #9D2712;
	--ks-color-border: #E9DDD4;
	--ks-color-line: #E9DDD4;
	--ks-color-surface: #F7EFEB;
	--ks-color-topbar: #FAF8F4;

	--ks-font-family-base: "Open Sans", Arial, sans-serif;
	--ks-font-size-body: 15px;
	--ks-font-size-small: 13px;
	--ks-font-size-h3: 20px;
	--ks-font-size-h2: 30px;
	--ks-font-size-h1: 50px;
	--ks-line-height-body: 1.4667;
	--ks-line-height-tight: 1.25;
	--ks-line-height-heading: 1.2;

	--ks-container: 1280px;
	--ks-container-narrow: 920px;
	--ks-gutter: 32px;
	--ks-radius-card: 14px;
	--ks-radius-image: 14px;
	--ks-radius-control: 999px;

	--ks-space-2xs: 8px;
	--ks-space-xs: 12px;
	--ks-space-s: 20px;
	--ks-space-m: 32px;
	--ks-space-l: 48px;
	--ks-space-xl: 72px;
	--ks-space-2xl: 96px;
}

@media (max-width: 960px) {
	:root {
		--ks-font-size-h1: 42px;
		--ks-font-size-h2: 28px;
		--ks-gutter: 24px;
		--ks-space-xl: 56px;
		--ks-space-2xl: 72px;
	}
}

@media (max-width: 600px) {
	:root {
		--ks-font-size-body: 16px;
		--ks-font-size-h1: 34px;
		--ks-font-size-h2: 25px;
		--ks-font-size-h3: 19px;
		--ks-gutter: 18px;
		--ks-space-l: 36px;
		--ks-space-xl: 44px;
		--ks-space-2xl: 56px;
	}
}