/* ============================================
   FONT VARIABLES
   ============================================ */
:root {
	--font-bebas: 'Bebas Neue', sans-serif;
	--font-inter: 'Inter', sans-serif;
}

/* ============================================
   GLOBAL FONT
   ============================================ */
body {
	font-family: var(--font-inter) !important;
}

/* ============================================
   H1
   ============================================ */
.text-h1 {
/* 	font-family: var(--font-bebas) !important; */
	font-size: 2.125rem !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;
	letter-spacing: 0em !important;
}

@media (max-width: 767px) {
	.text-h1 {
		font-size: 1.625rem !important;
		line-height: 1.1 !important;
		font-weight: 700 !important;
		letter-spacing: 0em !important;
	}
}

/* ============================================
   BOTTOM TEXT
   ============================================ */
.text-bottom {
	font-family: var(--font-bebas) !important;
	font-size: 3.5rem !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;
	letter-spacing: 0em !important;
}

@media (max-width: 1220px) {
	.text-bottom {
		font-size: 3rem !important;
		line-height: 1.1 !important;
		font-weight: 700 !important;
		letter-spacing: 0em !important;
	}
}

@media (max-width: 767px) {
	.text-bottom {
		font-size: 2.5rem !important;
		line-height: 1.1 !important;
		font-weight: 700 !important;
		letter-spacing: 0em !important;
	}
}

/* ============================================
   BOTTOM TEXT — ALT (longer taglines, e.g. Gloss)
   ============================================ */
.text-bottom-alt {
	font-family: var(--font-bebas) !important;
	font-size: 3rem !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;
	letter-spacing: 0em !important;
}

@media (max-width: 1220px) {
	.text-bottom-alt {
		font-size: 2.25rem !important;
		line-height: 1.1 !important;
		font-weight: 700 !important;
		letter-spacing: 0em !important;
	}
}

@media (max-width: 767px) {
	.text-bottom-alt {
		font-size: 1.3rem !important;
		line-height: 1.1 !important;
		font-weight: 700 !important;
		letter-spacing: 0em !important;
	}
}

/* ============================================
   H2
   ============================================ */
.text-h2 {
	font-size: 1.875rem !important;
	font-weight: 300 !important;
	line-height: 1.3 !important;
	letter-spacing: 0em !important;
}

@media (max-width: 767px) {
	.text-h2 {
		font-size: 1.5rem !important;
		font-weight: 300 !important;
		line-height: 1.3 !important;
		letter-spacing: 0em !important;
	}
}

/* ============================================
   H3
   ============================================ */
.text-h3 {
	font-size: 1.25rem !important;
	font-weight: 300 !important;
	line-height: 1.65 !important;
	letter-spacing: -0.03em !important;
}

@media (max-width: 767px) {
	.text-h3 {
		font-size: 1rem !important;
		font-weight: 300 !important;
		line-height: 1.65 !important;
		letter-spacing: -0.03em !important;
	}
}

/* ============================================
   H4
   ============================================ */
.text-h4 {
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.03em !important;
}

@media (max-width: 767px) {
	.text-h4 {
		font-size: 1rem !important;
		font-weight: 700 !important;
		line-height: 1.25 !important;
		letter-spacing: 0.03em !important;
	}
}

/* ============================================
   H5
   ============================================ */
.text-h5 {
	font-size: 1rem !important;
	font-weight: 500 !important;
	line-height: 1.65 !important;
	letter-spacing: 0.03em !important;
}

/* ============================================
   H6
   ============================================ */
.text-h6 {
	font-size: 0.875rem !important;
	font-weight: 700 !important;
	line-height: 0.035 !important;
	letter-spacing: -0.03em !important;
}

@media (max-width: 767px) {
	.text-h6 {
		font-size: 0.875rem !important;
		font-weight: 700 !important;
		line-height: 0.035 !important;
		letter-spacing: -0.03em !important;
	}
}

/* ============================================
   H7
   ============================================ */
.text-h7 {
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
}

@media (max-width: 767px) {
	.text-h7 {
		font-size: 1rem !important;
		font-weight: 700 !important;
		line-height: 1.25 !important;
	}
}

/* ============================================
   H8
   ============================================ */
.text-h8 {
	font-size: 1.125rem !important;
	font-weight: 400 !important;
	line-height: 1.35 !important;
	letter-spacing: 0.03em !important;
}

@media (max-width: 767px) {
	.text-h8 {
		font-size: 1.125rem !important;
		font-weight: 400 !important;
		line-height: 1.35 !important;
		letter-spacing: 0.03em !important;
	}
}

/* ============================================
   H9
   ============================================ */
.text-h9 {
	font-size: 1rem !important;
	font-weight: 700 !important;
	line-height: 1.65 !important;
	letter-spacing: 0.03em !important;
}

@media (max-width: 767px) {
	.text-h9 {
		font-size: 1rem !important;
		font-weight: 700 !important;
		line-height: 1.65 !important;
		letter-spacing: 0.03em !important;
	}
}

/* ============================================
   H10
   ============================================ */
.text-h10 {
	font-size: 0.875rem !important;
	font-weight: 300 !important;
	line-height: 1.35 !important;
	letter-spacing: 0em !important;
}

@media (max-width: 767px) {
	.text-h10 {
		font-size: 0.875rem !important;
		font-weight: 300 !important;
		line-height: 1.35 !important;
		letter-spacing: 0em !important;
	}
}