/*
 * Footer — four-column nav zone over the brand-dark surface, plus a sub-bar
 * with copyright + policy links.
 */

/* No margin-top here. Every eqx block is a `.eqx-section` carrying its own
   `.eqx-pad--*` vertical padding, so a blanket 96px above the footer just
   painted a white band between the last section's background and the navy
   footer — visible on any page ending in a tinted section (client, 11/08).
   Pages whose content is raw HTML rather than blocks get their spacing from
   the `.eqx-pad--md` wrapper page.php puts around them. */
.eqx-footer {
	background: var(--eqx-brand-dark);
	color: var(--eqx-warm-white);
}

.eqx-footer a { color: var(--eqx-warm-white); text-decoration: none; }
.eqx-footer a:hover, .eqx-footer a:focus { color: var(--eqx-brand-accent); text-decoration: underline; }

.eqx-footer__heading {
	font-family: var(--ff-body);
	font-size: var(--font-small);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--eqx-brand-accent);
	margin: 0 0 var(--spacing-sm);
}

/* ── Newsletter signup band ───────────────────────────────────────── */
.eqx-footer__signup { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.eqx-footer__signup-inner {
	padding-block: var(--spacing-xl);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--spacing-lg);
	flex-wrap: wrap;
}
.eqx-footer__signup-copy { max-width: 46ch; }
.eqx-footer__signup-heading { color: var(--eqx-warm-white); margin: 0 0 var(--spacing-xs); }
.eqx-footer__signup-sub { color: rgba(255, 255, 255, 0.78); margin: 0; }
.eqx-footer__signup-form {
	display: flex;
	gap: var(--spacing-sm);
	flex: 1 1 320px;
	max-width: 480px;
}
.eqx-footer__signup-form input[type="email"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 48px;
	padding: 0 var(--spacing-md);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: var(--radius-button);
	background: rgba(255, 255, 255, 0.06);
	color: var(--eqx-warm-white);
	font-family: var(--ff-body);
	font-size: 1rem;
}
.eqx-footer__signup-form input[type="email"]::placeholder { color: rgba(255, 255, 255, 0.55); }
.eqx-footer__signup-form input[type="email"]:focus {
	outline: 2px solid var(--eqx-brand-accent);
	outline-offset: 1px;
	border-color: transparent;
}
.eqx-footer__signup-form .eqx-button { flex-shrink: 0; }
@media (max-width: 640px) {
	.eqx-footer__signup-inner { flex-direction: column; align-items: flex-start; }
	/* `flex: 1 1 320px` from the base rule sets flex-basis, which the stacked
	   parent reads as a *height* — the form held a 320px box and left ~220px
	   of empty navy under the Sign up button. Size to content once stacked. */
	.eqx-footer__signup-form { flex: 0 0 auto; flex-direction: column; max-width: none; width: 100%; }
	.eqx-footer__signup-form .eqx-button { width: 100%; }
	/* Once the form stacks, `flex: 1 1 auto` on the input grows along the
	   *vertical* main axis and the 48px height is treated as a floor to grow
	   from, not a cap — the field stretched to 254px. Pin it once stacked. */
	.eqx-footer__signup-form input[type="email"] { flex: 0 0 auto; width: 100%; }
}

.eqx-footer__nav { padding-block: var(--spacing-2xl); }
.eqx-footer__nav-inner {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: var(--spacing-xl);
}

.eqx-footer__col--brand .eqx-footer__logo { display: inline-block; max-width: 180px; margin-bottom: var(--spacing-sm); }
.eqx-footer__logo--inverted img { filter: brightness(0) invert(1); }
.eqx-footer__logo--text { font-family: var(--ff-display); font-size: 1.5rem; font-weight: 700; }
.eqx-footer__tagline { color: rgba(255,255,255,0.72); margin-bottom: var(--spacing-md); max-width: 32ch; }

.eqx-footer__list { list-style: none; margin: 0; padding: 0; }
.eqx-footer__list li { margin-bottom: 8px; }
.eqx-footer__list a { font-size: 0.95rem; }

.eqx-footer__address { font-style: normal; line-height: 1.6; color: rgba(255,255,255,0.85); margin-bottom: var(--spacing-sm); }
.eqx-footer__contact-line { margin: 0 0 6px; }

.eqx-footer__legal-text { color: rgba(255,255,255,0.65); font-size: 0.875rem; line-height: 1.7; }
.eqx-footer__support { font-size: 0.875rem; color: rgba(255,255,255,0.65); margin-top: var(--spacing-sm); }

/* Social row ------------------------------------------------------ */

.eqx-social {
	list-style: none; margin: 0; padding: 0;
	display: inline-flex;
	gap: var(--spacing-xs);
}
.eqx-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px; height: 36px;
	border: 1px solid var(--eqx-border-dark);
	border-radius: var(--radius-pill);
	color: var(--eqx-warm-white);
	transition: background var(--transition-base), border-color var(--transition-base), color var(--transition-base);
}
.eqx-social__link:hover {
	background: var(--eqx-brand-accent);
	border-color: var(--eqx-brand-accent);
	color: var(--eqx-brand-dark);
	text-decoration: none;
}

/* Sub-bar --------------------------------------------------------- */

.eqx-footer__base {
	border-top: 1px solid var(--eqx-border-dark);
	padding-block: var(--spacing-md);
}
.eqx-footer__base-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--spacing-md);
	flex-wrap: wrap;
	font-size: var(--font-small);
	color: rgba(255,255,255,0.72);
}
.eqx-footer__copyright { margin: 0; }
.eqx-footer__policies {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: var(--spacing-md);
	flex-wrap: wrap;
}

/* Sub-bar right-side group: policies menu + build credit. ---------- */

.eqx-footer__base-right {
	display: flex;
	align-items: center;
	gap: var(--spacing-md);
	flex-wrap: wrap;
}
.eqx-footer__credit {
	margin: 0;
	color: rgba(255, 255, 255, 0.55);
}
.eqx-footer__credit a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--transition-base);
}
.eqx-footer__credit a:hover,
.eqx-footer__credit a:focus {
	color: var(--eqx-brand-accent);
}

/* Responsive ------------------------------------------------------ */

@media (max-width: 900px) {
	.eqx-footer__nav-inner { grid-template-columns: 1fr 1fr; gap: var(--spacing-lg); }
}
@media (max-width: 560px) {
	.eqx-footer__nav-inner { grid-template-columns: 1fr; }
	.eqx-footer__base-inner { flex-direction: column; align-items: flex-start; }
}