/*----------------------------------------------------------------- */
/* VARIABLES / CUSTOM PROPERTIES
/*----------------------------------------------------------------- */

:root
{
	/* BLOCKS
	----------------------------------------- */
	--blocks__gap: 30px;
	--blocks__gap-negative: -30px;
	--font-size__default: 2rem;

	/* FONTS
	----------------------------------------- */
	--font-size__rem-constant: 62.5%;
	--font-weight__bold: 600;
	--font-weight__normal: 400;

	/* HEADER
	----------------------------------------- */
	--header__height: 170px;
	--header__height-sticky: 60px;

	/* PADDINGS | MARGINS | BORDERS
	----------------------------------------- */
	--padding__default: 30px;
	--transform-scale__width: 0;

	/* ANIMATIONS
	----------------------------------------- */
	--transition-delay__default: 0.5s;
	--transition-delay__faster: 0.25s;
	--width__content: 920px;
	--width__layout: 1670px;

	/* LAYOUT
	----------------------------------------- */
	--width__website: 1920px;
}

:root,
html[data-theme='design']
{
	/* COLORS
	----------------------------------------- */
	--color__brown: #754922;
	--color__brown-dark: #3f230b;
	--color__brown-dark-rgb: 63, 35, 11;
	--color__brown-darker: #2b1806;
	--color__brown-light: #6a411c;
	--color__brown-light-rgb: 106, 65, 28;
	--color__brown-lighter: #9d8a7a;
	--color__brown-rgb: 117, 73, 34;
	--color__grey: #ede5e3;
	--color__grey-dark: #dcd4cc;
	--color__grey-light: #f9f5f4;
	--color__orange: #f17735;
	--color__orange-dark: #e16a2a;

	/* FONTS
	----------------------------------------- */
	--font-family__default: 'Barlow', sans-serif;
	--font-family__heading: 'DM Serif Display', serif;

	/* GRADIENTS
	----------------------------------------- */
	--gradient__grey: radial-gradient(112.56% 50% at 17.79% 35.66%, #f6f3ed 0%, #d9cec8 100%);
	--gradient__grey-dark: linear-gradient(180deg, #ded4ce 0%, rgba(222, 212, 206, 0.0001) 200%);
}

html[data-theme='wireframe']
{
	/* COLORS
	----------------------------------------- */
	--color__brown: #000;
	--color__brown-dark: #000;
	--color__brown-dark-rgb: 0, 0, 0;
	--color__brown-darker: #000;
	--color__brown-light: #000;
	--color__brown-light-rgb: 0, 0, 0;
	--color__brown-lighter: #000;
	--color__brown-rgb: 0, 0, 0;
	--color__grey: #fff;
	--color__grey-dark: #000;
	--color__grey-light: #fff;
	--color__orange: #000;
	--color__orange-dark: #000;

	/* FONTS
	----------------------------------------- */
	--font-family__default: 'Arial', sans-serif;
	--font-family__heading: 'Times New Roman', serif;

	/* GRADIENTS
	----------------------------------------- */
	--gradient__grey: radial-gradient(112.56% 50% at 17.79% 35.66%, #fff 0%, #fff 100%);
	--gradient__grey-dark: linear-gradient(180deg, #fff 0%, #fff 200%);
}

@media (max-width: 1200px)
{
	:root
	{
		/* HEADER
		----------------------------------------- */
		--header__height: 60px;
	}
}

@media (max-width: 760px)
{
	:root
	{
		/* FONTS
		----------------------------------------- */
		--font-size__default: 1.7rem;

		/* PADDINGS | MARGINS | BORDERS
		----------------------------------------- */
		--padding__default: 15px;
	}
}