/**
 * FenceWisePro - Footer
 * Footer columns, inline subscribe form and the bottom bar.
 */

.fwp-footer {
	background: var(--fwp-orange);
	color: var(--fwp-on-dark-80);
}

.fwp-footer a {
	color: var(--fwp-on-dark-80);
}

.fwp-footer a:hover {
	color: var(--fwp-ink);
}

.fwp-footer__top {
	display: grid;
	gap: var(--fwp-space-12);
	padding-block: var(--fwp-space-16);
	grid-template-columns: minmax(260px, 1.2fr) repeat(3, 1fr);
}

@media (max-width: 900px) {
	.fwp-footer__top {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.fwp-footer__top {
		grid-template-columns: 1fr;
	}
}

/* ------------------------------------------------------------------------
   Brand column
   ------------------------------------------------------------------------ */

.fwp-footer__brand {
	display: flex;
	flex-direction: column;
	gap: var(--fwp-space-5);
}

.fwp-footer__logo {
	width: auto;
}

.fwp-footer__logo--fallback {
	display: inline-flex;
	align-items: center;
	gap: var(--fwp-space-2);
	color: var(--fwp-white);
	font-size: 1.375rem;
	font-weight: var(--fwp-fw-extrabold);
}

.fwp-footer__about {
	margin: 0;
	max-width: 26rem;
	font-size: var(--fwp-fs-sm);
	line-height: var(--fwp-lh-loose);
}

/* Inline email subscribe row */
.fwp-subscribe {
	width: 100%;
	max-width: 22rem;
}

.fwp-subscribe__title {
	margin: 0 0 var(--fwp-space-3);
	color: var(--fwp-white);
	font-weight: var(--fwp-fw-semibold);
}

.fwp-subscribe__row {
	position: relative;
	display: flex;
}

.fwp-subscribe__field {
	flex: 1 1 auto;
	border: 0;
	border-radius: var(--fwp-radius-pill);
	padding: 14px 52px 14px 20px;
}

.fwp-subscribe__submit {
	position: absolute;
	top: 50%;
	right: 6px;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 0;
	border-radius: var(--fwp-radius-circle);
	background: var(--fwp-ink);
	color: var(--fwp-white);
	transition: background-color var(--fwp-transition);
}

.fwp-subscribe__submit:hover {
	background: var(--fwp-black);
}

.fwp-subscribe-embed :is(input, button) {
	border-radius: var(--fwp-radius-pill);
}

.fwp-socials {
	display: flex;
	gap: var(--fwp-space-3);
	margin: var(--fwp-space-2) 0 0;
	padding: 0;
	list-style: none;
}

.fwp-socials a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: var(--fwp-radius-circle);
	background: rgba(255, 255, 255, 0.18);
	color: var(--fwp-white);
	transition: background-color var(--fwp-transition);
}

.fwp-socials a:hover {
	background: var(--fwp-ink);
}

/* ------------------------------------------------------------------------
   Link columns
   ------------------------------------------------------------------------ */

.fwp-footer__heading {
	margin: 0 0 var(--fwp-space-5);
	color: var(--fwp-white);
	font-size: var(--fwp-fs-h5);
}

.fwp-footer__menu {
	display: flex;
	flex-direction: column;
	gap: var(--fwp-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--fwp-fs-sm);
}

/* ------------------------------------------------------------------------
   Contact column
   ------------------------------------------------------------------------ */

.fwp-footer__contact {
	display: flex;
	flex-direction: column;
	gap: var(--fwp-space-4);
	margin-bottom: var(--fwp-space-6);
	font-size: var(--fwp-fs-sm);
}

.fwp-footer__contact-item {
	display: flex;
	align-items: flex-start;
	gap: var(--fwp-space-3);
	margin: 0;
}

.fwp-footer__contact-item svg {
	flex: 0 0 auto;
	margin-top: 2px;
	color: var(--fwp-white);
}

/* ==========================================================================
   Bottom bar
   ========================================================================== */

.fwp-footer__bottom {
	border-top: 1px solid var(--fwp-hairline);
}

.fwp-footer__bottom-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--fwp-space-4);
	padding-block: var(--fwp-space-5);
	font-size: var(--fwp-fs-xs);
}

.fwp-footer__copyright {
	margin: 0;
}

.fwp-footer__legal {
	display: flex;
	gap: var(--fwp-space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}