/*
 * dbi services · Neve Child Theme
 * assets/css/footer.css — the site footer, loaded on every page.
 *
 * Styles Neve's footer-builder markup; the layout itself and the
 * widgets/menus are DB-side, applied by
 * .agent/docs/footer/apply-footer.php (docs in .agent/docs/footer/).
 * Row roles: .footer-top = brand · Explore · Connect columns,
 * .footer-main = legal menu, .footer-bottom = copyright sub-footer
 * (the copyright hook only fires in Neve's bottom row).
 *
 * Consumes the tokens.css bridge via the dbi-scope class that
 * inc/footer.php adds to footer.site-footer.
 *
 * @package dbi-neve-child
 */

.site-footer.dbi-scope {
	font-family: var( --f-body );
	background: var( --bg );
	border-top: 1px solid var( --border );
	color: var( --muted );
}

/* ════════════════════════════════════════════════
   Columns row — brand · Explore · Connect
   ════════════════════════════════════════════════ */
.site-footer .footer-top .nv-footer-content {
	padding-top: 48px;
	padding-bottom: 40px;
}

/* Brand block (custom HTML widget) */
.site-footer .dbi-footer-brand {
	font-family: var( --f-display );
	font-size: 1.4rem;
	line-height: 1.2;
	color: var( --text );
	margin: 0 0 10px;
}
.site-footer .dbi-footer-blurb {
	font-size: .875rem;
	line-height: 1.6;
	max-width: 34ch;
	margin: 0;
}

/* Column titles ("Explore", "Connect") */
.site-footer .widget-title {
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var( --faint );
	margin: 0 0 14px;
}

/* Link lists (nav_menu widgets) */
.site-footer .widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.site-footer .widget ul li {
	margin: 0 0 8px;
	padding: 0;
}
.site-footer .widget ul a {
	font-size: .875rem;
	color: var( --muted );
	text-decoration: none;
	transition: color var( --t ) var( --ease );
}
/* Hover: text darkens, teal appears only as the underline — teal-dark
   as small link text would miss the ≥4.5:1 baseline on this background */
.site-footer .widget ul a:hover {
	color: var( --text );
	text-decoration: underline;
	text-decoration-color: var( --teal );
	text-underline-offset: 3px;
}

/* Explore holds All + 9 categories — split into two columns where the
   desktop row gives it a slot of its own (mobile stacks single-column).
   Slot mapping: free Neve renders the row's first three slots
   (left · c-left · center) as the three columns, see apply-footer.php. */
.site-footer .footer-top .hfg-slot.c-left .widget ul {
	columns: 2;
	column-gap: 32px;
}

/* Keyboard focus mirrors hover (a11y baseline, design-principles §6) */
.site-footer a:focus-visible {
	outline: 2px solid var( --teal );
	outline-offset: 2px;
	border-radius: 2px;
}

/* ════════════════════════════════════════════════
   Meta zone — legal menu row + copyright sub-footer
   One continuous dark band (Neve's palette default
   for the bottom row, extended to the legal row).
   Both rows collapse to a single centered column.
   ════════════════════════════════════════════════ */
/* Neve paints the row background on .footer--row-inner — override there,
   not (only) on the outer row div */
.site-footer .footer-main,
.site-footer .footer-main .footer--row-inner {
	background: var( --dark );
}
.site-footer .footer-main .hfg-grid,
.site-footer .footer-bottom .hfg-grid {
	grid-template-columns: 1fr;
}
/* Builder items wrap shrink-to-fit inners (.item--inner) that sit left —
   force the item flex-centered, then center wrapped text lines too */
.site-footer .footer-main .builder-item,
.site-footer .footer-bottom .builder-item,
.site-footer .footer-main .item--inner,
.site-footer .footer-bottom .item--inner {
	display: flex;
	justify-content: center;
}
.site-footer .footer-main .component-wrap,
.site-footer .footer-bottom .component-wrap {
	justify-content: center;
	text-align: center;
}
.site-footer .footer-main .footer-menu {
	justify-content: center;
	flex-wrap: wrap;
}
.site-footer .footer-main .nv-footer-content {
	padding-top: 20px;
	padding-bottom: 4px;
}
.site-footer .footer-bottom .nv-footer-content {
	padding-top: 4px;
	padding-bottom: 20px;
}
.site-footer .footer-main,
.site-footer .footer-main a {
	font-size: .8rem;
	color: var( --faint-on-dark );
}
/* Neve styles the copyright's inner div directly — match its depth */
.site-footer .footer-bottom,
.site-footer .footer-bottom .cr,
.site-footer .footer-bottom .cr div {
	font-size: .75rem;
	color: var( --faint-on-dark );
}
.site-footer .footer-bottom p { margin: 0; }
.site-footer .footer-main a {
	text-decoration: none;
	transition: color var( --t ) var( --ease );
}
/* On the dark band, hover lightens: teal (not teal-dark) keeps ≥4.5:1 */
.site-footer .footer-main a:hover {
	color: var( --teal );
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Mobile: the stacked columns row breathes a little less */
@media ( max-width: 768px ) {
	.site-footer .footer-top .nv-footer-content {
		padding-top: 36px;
		padding-bottom: 28px;
	}
	.site-footer .footer-top .builder-item {
		margin-bottom: 24px;
	}
}