:root {

	/* Fonts */
	--font-heading: "Oswald", sans-serif;
	--font-body: "Lato", sans-serif;

	/* Desktop Typography */
	--text-h1: 400 64px/68px var(--font-heading);
	--text-h2: 400 48px/52px var(--font-heading);
	--text-h3: 400 28px/32px var(--font-heading);
	--text-h4: 400 24px/28px var(--font-heading);
	--text-h5: 400 20px/24px var(--font-heading);

	--text-body-lg: 400 20px/24px var(--font-heading);
	--text-body: 300 16px/20px var(--font-body);
	--text-link: 500 14px/18px var(--font-body);

	/* Colors */
	--color-text: #1F1F1F;
	--color-muted: #777777;
	--color-accent: #F28C28;
	--color-bg: #F8F5F0;
	--color-border: #E8E2D8;
	--color-white: #FFFFFF;

	/* Layout */
	--container: 1440px;
	--content-width: 70%;
	--content-max: 980px;
	--hero-padding: 40px;

	/* Spacing */
	--space-xs: 8px;
	--space-sm: 16px;
	--space-md: 24px;
	--space-lg: 32px;
	--space-xl: 40px;
	--space-2xl: 56px;
	--space-3xl: 72px;
	--space-section: 120px;

	/* Radius */
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 16px;

	/* Motion */
	--transition: .25s ease;
}

@media (max-width:767px){

	:root{

		--text-h1:400 36px/40px var(--font-heading);
		--text-h2:400 28px/32px var(--font-heading);
		--text-h3:400 22px/26px var(--font-heading);
		--text-h4:400 18px/22px var(--font-heading);
		--text-h5:400 20px/24px var(--font-heading);

		--text-body-lg:300 16px/20px var(--font-body);
		--text-body:300 15px/19px var(--font-body);

		--hero-padding:20px;
		--content-width:100%;
	}

}