/* =========================================================

   FOOTER GLOBAL - PONCE PARK

========================================================= */

.ponce-footer {

	width: 100%;

	padding:

		48px

		30px

		18px;

	background:

		#0c1b31;

	color:

		#ffffff;

}


/* =========================================================

   CONTEĆDO PRINCIPAL

========================================================= */

.ponce-footer-inner {

	width: 100%;

	max-width: 1180px;

	margin: 0 auto;

	display: grid;

	grid-template-columns:

		240px

		280px

		260px

		240px;

	justify-content: center;

	align-items: center;

	column-gap: 42px;

}

/* =========================================================

   BRAND

========================================================= */

.ponce-footer-brand {

	width: 240px;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: flex-start;

	text-align: center;

}

.ponce-footer-logo {

	display: block;

	width: 170px;

	height: auto;

	margin:

		0 auto

		18px;

}


.ponce-footer-brand p {

	width: 100%;

	margin: 0;

	color:

		rgba(

			255,

			255,

			255,

			.68

		);

	font-size: 12px;

	line-height: 1.5;

	text-align: center;

}

/* =========================================================

   COLUNAS

========================================================= */

.ponce-footer-column {

	width: 100%;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: flex-start;

	gap: 13px;

	text-align: center;

}

.ponce-footer-title {

	display: block;

	width: 100%;

	margin: 0 0 8px;

	color: #ffffff;

	font-size: 14px;

	font-weight: 700;

	text-align: center;

}


.ponce-footer-column a,

.ponce-footer-static {

	width: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

	gap: 9px;

	color:

		rgba(

			255,

			255,

			255,

			.76

		);

	font-size: 12px;

	line-height: 1.4;

	text-align: center;

	text-decoration: none;

}

.ponce-footer-column a {

	transition:

		color .2s ease;

}


.ponce-footer-column a:hover {

	color:

		#f05a00;

}


.ponce-footer-column i,

.ponce-footer-static i {

	flex:

		0 0 auto;

	color:

		#f05a00;

	font-size:

		16px;

}


/* =========================================================

   RODAPĆ‰ INFERIOR

========================================================= */

.ponce-footer-bottom {

	width:

		min(

			100%,

			1180px

		);

	margin:

		38px auto

		0;

	padding-top:

		17px;

	display:

		flex;

	align-items:

		center;

	justify-content:

		space-between;

	gap:

		20px;

	border-top:

		1px solid

		rgba(

			255,

			255,

			255,

			.10

		);

	color:

		rgba(

			255,

			255,

			255,

			.48

		);

	font-size:

		10px;

}

/* =========================================================
   IDENTIFICAÇÃO DA EMPRESA
========================================================= */

.ponce-footer-company {

	width:
		min(
			100%,
			1180px
		);

	margin:
		28px auto
		0;

	color:
		rgba(
			255,
			255,
			255,
			.68
		);

	font-size:
		11px;

	line-height:
		1.5;

	text-align:
		center;

}

.ponce-footer-company span {

	margin:
		0 6px;

	color:
		#f05a00;

}


/* =========================================================
   RODAPÉ INFERIOR
========================================================= */

.ponce-footer-bottom {

	width:
		min(
			100%,
			1180px
		);

	margin:
		28px auto
		0;

	padding-top:
		17px;

	display:
		grid;

	grid-template-columns:
		1fr
		auto
		1fr;

	align-items:
		center;

	column-gap:
		24px;

	border-top:
		1px solid
		rgba(
			255,
			255,
			255,
			.10
		);

	color:
		rgba(
			255,
			255,
			255,
			.48
		);

	font-size:
		10px;

	line-height:
		1.4;

}


/* =========================================================
   COPYRIGHT
========================================================= */

.ponce-footer-copyright {

	justify-self:
		start;

}


/* =========================================================
   LINKS LEGAIS
========================================================= */

.ponce-footer-legal {

	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	gap:
		7px;

	white-space:
		nowrap;

}


.ponce-footer-legal a {

	color:
		rgba(
			255,
			255,
			255,
			.62
		);

	text-decoration:
		none;

	transition:
		color .2s ease;

}


.ponce-footer-legal a:hover {

	color:
		#f05a00;

}


.ponce-footer-separator {

	color:
		rgba(
			255,
			255,
			255,
			.26
		);

}


/* =========================================================
   VERSÃO
========================================================= */

.ponce-footer-version {

	justify-self:
		end;

	white-space:
		nowrap;

}

/* =========================================================

   TABLET

========================================================= */

@media (

	max-width: 991px

) {

	.ponce-footer-inner {

		max-width: 650px;

		grid-template-columns:

			1fr

			1fr;

		justify-content: center;

		gap:

			38px

			30px;

	}


	.ponce-footer-brand {

		width: 100%;

	}

		.ponce-footer-company {

		margin-top:
			30px;

	}


	.ponce-footer-bottom {

		grid-template-columns:
			1fr;

		row-gap:
			9px;

		text-align:
			center;

	}


	.ponce-footer-copyright,
	.ponce-footer-version {

		justify-self:
			center;

	}

}

/* =========================================================

   MOBILE

========================================================= */

@media (

	max-width: 767px

) {

	html {

		background:
			#0c1b31;

	}


	.ponce-footer {

		padding:

			38px

			22px

			calc(
				18px +
				env(safe-area-inset-bottom)
			);

	}


	.ponce-footer-inner {

		width:

			100%;

		grid-template-columns:

			1fr;

		gap:

			32px;

	}


	.ponce-footer-logo {

		width:

			165px;

	}


	.ponce-footer-brand,

	.ponce-footer-column {

		align-items:

			center;

		text-align:

			center;

	}


	.ponce-footer-column a,

	.ponce-footer-static {

		justify-content:

			center;

	}


		.ponce-footer-company {

		width:
			100%;

		margin-top:
			28px;

		font-size:
			10px;

		line-height:
			1.6;

		text-align:
			center;

	}


	.ponce-footer-bottom {

		width:
			100%;

		margin-top:
			22px;

		padding-top:
			16px;

		grid-template-columns:
			1fr;

		row-gap:
			8px;

		text-align:
			center;

	}


	.ponce-footer-copyright,
	.ponce-footer-version {

		justify-self:
			center;

	}


	.ponce-footer-legal {

		justify-content:
			center;

		flex-wrap:
			wrap;

		white-space:
			normal;

	}

}
