@font-face {
	font-family: "Gilroy";
	src: url("../fonts/gilroy-regular.ttf") format("truetype");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Gilroy";
	src: url("../fonts/gilroy-medium.ttf") format("truetype");
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: "Gilroy";
	src: url("../fonts/gilroy-semibold.ttf") format("truetype");
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}

@font-face {
	font-family: "Gilroy";
	src: url("../fonts/gilroy-bold.ttf") format("truetype");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "Gilroy";
	src: url("../fonts/gilroy-black.ttf") format("truetype");
	font-style: normal;
	font-weight: 900;
	font-display: swap;
}

:root {
	--color-brand-red: #b42d27;
	--color-brand-gold: #c2a170;
	--color-button-gold: #e0b26e;
	--color-sand: #f3d1a0;
	--color-white: #fff;
	--color-dark: #0b0b0b;
	--type-font-body: "Gilroy", Arial, sans-serif;
	--type-font-display: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	--type-weight-regular: 400;
	--type-weight-medium: 500;
	--type-weight-semibold: 600;
	--type-weight-bold: 700;
	--type-weight-black: 900;
	--type-body-size: 16px;
	--type-body-line: 24px;
	--type-body-small-size: 15px;
	--type-body-small-line: 22px;
	--type-body-large-size: 18px;
	--type-body-large-line: 27px;
	--type-label-size: 13px;
	--type-label-line: 18px;
	--type-caption-size: 12px;
	--type-caption-line: 16px;
	--type-card-title-size: 18px;
	--type-card-title-line: 24px;
	--type-feature-title-size: 22px;
	--type-feature-title-line: 26px;
	--type-section-title-size: 60px;
	--type-section-title-line: 64px;
	--type-phone-size: 20px;
	--type-phone-line: 24px;
}

.type-body,
.type-body-small,
.type-body-large,
.type-card-title,
.type-label,
.type-caption {
	font-family: var(--type-font-body);
}

.type-body {
	font-size: var(--type-body-size);
	font-weight: var(--type-weight-medium);
	line-height: var(--type-body-line);
}

.type-body-small {
	font-size: var(--type-body-small-size);
	font-weight: var(--type-weight-medium);
	line-height: var(--type-body-small-line);
}

.type-body-large {
	font-size: var(--type-body-large-size);
	font-weight: var(--type-weight-medium);
	line-height: var(--type-body-large-line);
}

.type-section-title {
	font-family: var(--type-font-display);
	font-size: var(--type-section-title-size);
	font-weight: var(--type-weight-bold);
	line-height: var(--type-section-title-line);
}

.type-card-title {
	font-size: var(--type-card-title-size);
	font-weight: var(--type-weight-bold);
	line-height: var(--type-card-title-line);
}

.type-label {
	font-size: var(--type-label-size);
	font-weight: var(--type-weight-bold);
	line-height: var(--type-label-line);
}

.type-caption {
	font-size: var(--type-caption-size);
	font-weight: var(--type-weight-medium);
	line-height: var(--type-caption-line);
}

@media (min-width: 681px) and (max-width: 1100px) {
	:root {
		--type-card-title-size: 17px;
		--type-card-title-line: 23px;
		--type-section-title-size: 46px;
		--type-section-title-line: 54px;
	}
}

@media (max-width: 680px) {
	:root {
		--type-body-large-size: 16px;
		--type-body-large-line: 24px;
		--type-section-title-size: 36px;
		--type-section-title-line: 42px;
	}
}
