/*
 * ASEO custom footer — official brand kit (owner-supplied image, 2026-07-16):
 * Primary #37B776, Secondary #676675, Accent #2C211B,
 * extended: Yellow #F7CD40, Deep Green #1D7151, Darkest Green #194035.
 * --aseo-text / --aseo-text-muted are light on-dark neutrals with no official
 * equivalent in the kit — sanctioned readability exceptions on the dark bg.
 * Dark accent background + light text, not light-bg + dark text: the light-bg
 * version shipped 2026-07-04 had near-invisible link text because a global
 * Elementor style was winning the color cascade against our light-ink links.
 * !important is used deliberately here (not elsewhere in the codebase) to
 * guarantee this footer's text stays readable regardless of that override.
 */
.aseo-footer {
	--aseo-primary: #37B776;
	--aseo-primary-hover: #1D7151;
	--aseo-secondary: #676675;
	--aseo-bg: #2C211B;
	--aseo-text: #F1EDE4;
	--aseo-text-muted: #C9C4BC;
	background: var(--aseo-bg);
	color: var(--aseo-text) !important;
	/* Some page templates (e.g. the real-estate form section) end in the
	   same dark accent color as this footer, so the two blocks merge into
	   one continuous block with no visible seam. This hairline (brand
	   primary at low opacity, not a plain gray) gives every page a
	   consistent boundary regardless of what precedes the footer. */
	border-top: 1px solid rgba(55, 183, 118, .25);
	padding: 64px 40px 0;
	font-size: 15px;
}

.aseo-footer__inner {
	max-width: 1240px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	padding-bottom: 48px;
}
/* flex (not grid) so the layout adapts whether or not the Reviews column renders */
.aseo-footer__brand { flex: 1.6 1 260px; }
.aseo-footer__col { flex: 1 1 140px; }

/* Resources + Our Company stacked in one column (set 2026-07-06,
   reaffirmed 2026-08-17 when Services became its own column): stacking these
   two short lists is what holds the row at four columns instead of five. */
.aseo-footer__col--stacked .aseo-footer__stack-block + .aseo-footer__stack-block {
	margin-top: 24px;
}

.aseo-footer__logo {
	display: inline-block;
	font-size: 22px;
	font-weight: 700;
	text-decoration: none;
	margin-bottom: 16px;
}
.aseo-footer .aseo-footer__logo-easy { color: var(--aseo-text) !important; }
.aseo-footer .aseo-footer__logo-outsource { color: var(--aseo-primary) !important; }

.aseo-footer__tagline {
	max-width: 34ch;
	line-height: 1.5;
	margin: 0 0 16px;
	color: var(--aseo-text-muted) !important;
}

.aseo-footer__nap {
	font-style: normal;
	line-height: 1.6;
	margin: 0 0 20px;
	color: var(--aseo-text-muted) !important;
}
.aseo-footer .aseo-footer__nap a {
	color: var(--aseo-text) !important;
	text-decoration: none;
}
.aseo-footer .aseo-footer__nap a:hover { color: var(--aseo-primary) !important; }

.aseo-footer__social {
	display: flex;
	gap: 12px;
}
.aseo-footer .aseo-footer__social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--aseo-primary);
	color: var(--aseo-bg) !important;
	text-decoration: none;
}
.aseo-footer .aseo-footer__social-icon:hover { background: var(--aseo-primary-hover); }

.aseo-footer__heading {
	font-size: 15px;
	font-weight: 700;
	color: var(--aseo-primary) !important;
	margin: 0 0 16px;
}

.aseo-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.aseo-footer__list li { margin-bottom: 10px; }
.aseo-footer .aseo-footer__list a {
	color: var(--aseo-text) !important;
	text-decoration: none;
}
.aseo-footer .aseo-footer__list a:hover { color: var(--aseo-primary) !important; }

.aseo-footer .aseo-footer__review-btn {
	display: inline-block;
	background: var(--aseo-primary);
	color: var(--aseo-bg) !important;
	text-decoration: none;
	font-weight: 700;
	padding: 10px 16px;
	border-radius: 6px;
	font-size: 14px;
}
.aseo-footer .aseo-footer__review-btn:hover { background: var(--aseo-primary-hover); }

.aseo-footer__legal {
	border-top: 1px solid rgba(241, 237, 228, 0.15);
	padding: 20px 0;
}
.aseo-footer__legal-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	max-width: 1240px;
	margin: 0 auto;
}
.aseo-footer .aseo-footer__legal-nav a {
	color: var(--aseo-text-muted) !important;
	text-decoration: underline;
	font-size: 13px;
}
.aseo-footer .aseo-footer__legal-nav a:hover { color: var(--aseo-primary) !important; }

@media (max-width: 960px) {
	.aseo-footer__brand { flex-basis: 100%; }
	/* Four link columns fit side by side on desktop but not here: below this
	   width they shrink past their 140px basis and the longer role labels
	   ("Customer Service Representative") wrap to one word per line. 50% minus
	   half the 32px gap puts them in a 2x2 block instead. */
	.aseo-footer__col { flex-basis: calc(50% - 16px); }
}

@media (max-width: 560px) {
	.aseo-footer { padding: 48px 20px 0; }
	.aseo-footer__col { flex-basis: 100%; }
}