/* ================= Fonts ================= */

/* Oswald */
@font-face {
	font-family: "oswald-regular";
	src: url("../fonts/oswald/Oswald-Regular.ttf");
}

@font-face {
	font-family: "oswald-light";
	src: url("../fonts/oswald/Oswald-Light.ttf");
}

@font-face {
	font-family: "oswald-medium";
	src: url("../fonts/oswald/Oswald-Medium.ttf");
}

@font-face {
	font-family: "oswald-semibold";
	src: url("../fonts/oswald/Oswald-SemiBold.ttf");
}

@font-face {
	font-family: "oswald-bold";
	src: url("../fonts/oswald/Oswald-Bold.ttf");
}

/* Inter */
@font-face {
	font-family: "inter-regular";
	src: url("../fonts/inter/Inter-Regular.otf");
}

@font-face {
	font-family: "inter-medium";
	src: url("../fonts/inter/Inter-Medium.otf");
}

@font-face {
	font-family: "inter-italic";
	src: url("../fonts/inter/Inter-Italic.otf");
}

@font-face {
	font-family: "inter-semibold";
	src: url("../fonts/inter/Inter-SemiBold.otf");
}

@font-face {
	font-family: "inter-bold";
	src: url("../fonts/inter/Inter-Bold.otf");
}

/* ================= Variables ================= */

:root {
	/* Oswald */
	--heading-regular: "oswald-regular";
	--heading-medium: "oswald-medium";
	--heading-light: "heading-light";
	--heading-semibold: "oswald-semibold";
	--heading-bold: "oswald-bold";

	/* Inter */
	--text-regular: "inter-regular";
	--text-medium: "inter-medium";
	--text-italic: "inter-italic";
	--text-semibold: "inter-semibold";
	--text-bold: "inter-bold";
}

/* ================= Font Classes ================= */

/* Headings (Oswald) */

.heading-regular {
	font-family: var(--heading-regular);
}

.heading-medium {
	font-family: var(--heading-medium);
}

.heading-light {
	font-family: var(--heading-light);
}

.heading-semibold {
	font-family: var(--heading-semibold);
}

.heading-bold {
	font-family: var(--heading-bold);
}

/* Text (Inter) */

.text-regular {
	font-family: var(--text-regular);
}

.text-medium {
	font-family: var(--text-medium);
}

.text-italic {
	font-family: var(--text-italic);
}

.text-semibold {
	font-family: var(--text-semibold);
}

.text-bold {
	font-family: var(--text-bold);
}

/* ================= Font Sizes ================= */

.level-1 {
	font-size: 90px;
}
.level-2 {
	font-size: 65px;
}
.level-3 {
	font-size: 58px;
}
.level-3-lg {
	font-size: 46px;
}
.level-4 {
	font-size: 35px;
}
.level-5 {
	font-size: 26px;
}
.level-6 {
	font-size: 20px;
}
.level-7 {
	font-size: 16px;
}
.level-8 {
	font-size: 14px;
}
.level-9 {
	font-size: 12px;
}
.level-10 {
	font-size: 10px;
}

/* ================= Responsive ================= */

@media (max-width: 1200px) {
	.level-1 {
		font-size: 70px;
	}
	.level-2 {
		font-size: 55px;
	}
	.level-3 {
		font-size: 48px;
	}
	.level-4 {
		font-size: 30px;
	}
}

@media (max-width: 992px) {
	.level-1 {
		font-size: 60px;
	}
	.level-2 {
		font-size: 45px;
	}
	.level-3 {
		font-size: 40px;
	}
	.level-4 {
		font-size: 26px;
	}
}

@media (max-width: 768px) {
	.level-1 {
		font-size: 48px;
	}
	.level-2 {
		font-size: 38px;
	}
	.level-3 {
		font-size: 32px;
	}
	.level-4 {
		font-size: 24px;
	}
}

@media (max-width: 576px) {
	.level-1 {
		font-size: 38px;
	}
	.level-2 {
		font-size: 30px;
	}
	.level-3-lg {
		font-size: 28px;
	}
	.level-3 {
		font-size: 26px;
	}
	.level-4 {
		font-size: 22px;
	}
}