footer {
	width: 100%;
	background-color: var(--primary-p1);
}
footer > div {
	margin: auto;
	max-width: 1200px;
	min-height: 342px;
	display: flex;
	justify-content: start;
	align-items: center;
	flex-wrap: wrap;
	gap: 96px;
	color: white;
	padding: 30px 15px;
}

footer .about {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 12px;
	width: 380px;
}
footer .about div {
	display: flex;
	align-items: center;
	gap: 8px;
}
footer h4 {
	color: white;
	font-size: 20px;
	font-weight: 800;
}

footer .about p {
	font-size: 18px;
	font-weight: 400;
	line-height: 35.1px;
}
footer .access {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
footer .access a,
footer .contact p {
	font-size: 18px;
	margin: 0;
}

footer .contact p {
	line-height: 35.1px;
}
footer .access div {
	display: grid;
	flex-direction: column;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(4, 1fr);
	gap: 8px;
	padding-right: 8px;
}
footer .access a {
	color: white;
	font-weight: 400;
	line-height: 35px;
}

footer .contact {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
footer .contact > div {
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-width: 461px;
}
footer .contact > div > div {
	display: flex;
	gap: 6px;
}
@media screen and (max-width: 1040) {
	footer > div {
		padding: 30px 30px;
	}
}
@media screen and (max-width: 800px) {
	footer > div {
		flex-direction: column;
		gap: 0px;
		color: white;
		padding: 10px 24px;
	}
	footer > div > div {
		padding: 24px;
		width: 100%;
	}
	footer .about {
		width: 100%;

		align-items: center;
		text-align: center;
		border-bottom: 1px solid #ffffff40;
	}
	footer .about h4 {
		display: none;
	}
	footer .access {
		align-items: center;
		gap: 24px;
		border-bottom: 1px solid #ffffff40;
	}
	footer .access div {
		width: 100%;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: auto;
		justify-items: center;
		gap: 12px;
	}
	footer .contact {
		align-items: center;
		gap: 12px;
	}
	footer .contact > div {
		text-align: center;
		align-items: center;
	}
}
@media screen and (max-width: 450px) {
	footer .contact p,
	footer .access a {
		font-size: 12px;
	}
	footer .about p {
		font-size: 14px;
	}
}