/* =========================================================
   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;

}


/* =========================================================
   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%;

	}

}

/* =========================================================
   MOBILE
========================================================= */

@media (
	max-width: 767px
) {

	.ponce-footer {

		padding:
			38px
			22px
			18px;

	}


	.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-bottom {

		width:
			100%;

		margin-top:
			32px;

		flex-direction:
			column;

		justify-content:
			center;

		text-align:
			center;

		gap:
			6px;

	}

}
