:root {
	--primary-dark: #d09758;
	--primary-mid: #8f9971;
	--primary-light: #c0beba;
	--primary-lightest: #ffffff;

	--font-family-base: "Raleway", sans-serif;
	--font-family-heading: "Raleway", sans-serif;

	--font-weight-light: 400;
	--font-weight-bold: 700;
	--font-weight-heavy: 800;

	--font-size-base: 17px;
	--font-size-large: 23px;
	--font-size-heading: 38px;

	--border-radius: 10px;
}

body {
	font-family: var(--font-family-base);
	font-optical-sizing: auto;
	font-weight: var(--font-weight-light);
	font-size: var(--font-size-base);
	font-style: normal;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-family-heading);
	font-optical-sizing: auto;
	font-weight: var(--font-weight-heavy);
	text-transform: uppercase;
}

h1,
h2 {
	font-size: var(--font-size-heading);
}

button {
	background-color: var(--primary-dark);
	padding: 8px 30px;
	color: var(--primary-lightest);
	display: inline-block;
	font-family: var(--font-family-heading);
	font-optical-sizing: auto;
	font-weight: var(--font-weight-heavy);
	text-decoration: none;
	border: solid 2px var(--primary-dark);
	transition: 0.3s ease-in-out;
	text-wrap: nowrap;
	font-size: 20px;
	height: 69px;
}

.full-width {
	width: 100%;
	max-width: 100%;
}

ul {
	padding: 0;
	list-style-type: none;
	display: flex;
	gap: 5px;
	flex-direction: column;
}
li {
	color: var(--primary-lightest);
	padding-bottom: 0;
	text-align: center;
	text-transform: uppercase;
}

button:hover {
	background-color: var(--primary-lightest);
	color: var(--primary-dark);
	border: solid 2px var(--primary-dark);
}

h2 {
	margin-bottom: 30px !important;
}

.py-5 {
	padding-top: 6rem !important;
	padding-bottom: 6rem !important;
}

@media (max-width: 768px) {
	.py-5 {
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
	}
}