/* Global footer. Spec: vault 12 BPOAI Clone Spec/global-layout.md §3 and global-motion.md §3. Agent G.
   POEA has 4 link columns (bpoai 3), so the brand column spans 4 of 12 instead of 5. */

.c-footer {
	position: relative;
	border-top: 1px solid var(--border-subtle);
	background: transparent;
}
.c-footer__in { padding-top: 40px; padding-bottom: 40px; }
@media (min-width: 640px) { .c-footer__in { padding-top: 56px; padding-bottom: 56px; } }

.c-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px;
}
/* 640-1023: brand full width, then the 4 link columns in one row (12 cols was too dense at 768-820). */
@media (min-width: 640px) {
	.c-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
	.c-footer__brand { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
	.c-footer__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
	/* 1024-1279: 32px gaps so "For Job Seekers" stays on one line (126px column at 40px). */
	@media (max-width: 1279.98px) { .c-footer__grid { column-gap: 32px; } }
	.c-footer__brand { grid-column: span 4; }
	.c-footer__col { grid-column: span 2; }
}

.c-footer__logo { display: inline-block; margin-bottom: 20px; border-radius: 8px; }
.c-footer__blurb {
	max-width: 448px;
	font-size: 14px;
	line-height: 22.75px;
	color: var(--text-secondary);
}

.c-footer__h {
	margin-bottom: 16px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--primary-light);
}
.c-footer__h--tight { margin-bottom: 8px; }
/* 640-767: 4 columns of ~118px; keep every heading on one line so the link lists start level. */
/* QA R3-1/R3-2: the same rule also covers 1024-1139 (133px column) and uses .04em, so the wider Inter fallback face
   (first cold visit, font-display: optional) still fits. */
@media (min-width: 640px) and (max-width: 767.98px), (min-width: 1024px) and (max-width: 1139.98px) {
	.c-footer__h { font-size: 11px; letter-spacing: .04em; white-space: nowrap; }
}

.c-footer__links { display: flex; flex-direction: column; gap: 12px; }
.c-footer__links,
.c-footer__plinks { font-size: 14px; line-height: 20px; }
.c-footer__links a,
.c-footer__plinks a {
	font-size: 14px;
	line-height: 20px;
	color: var(--text-secondary);
	border-radius: 4px;
	transition: color .15s var(--ease);
}

/* Job alerts (bpoai newsletter block) */
.c-footer__alerts { margin-top: 24px; }
.c-footer__form { display: flex; gap: 8px; }
.c-footer__input {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 16rem;
	height: 38px;
	padding: 8px 12px;
	border-radius: 16px;
	font-size: 14px;
	line-height: 20px;
	background: var(--input-bg);
	border: 1px solid var(--input-border);
	color: var(--input-text);
	outline: none;
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.c-footer__input::placeholder { color: var(--input-placeholder); }
/* POEA fix: bpoai's input has no focus indicator (GM §3). */
.c-footer__input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-100); }
.c-footer__btn {
	flex-shrink: 0;
	height: 38px;
	padding: 8px 14px;
	border-radius: 16px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	background: var(--primary);
	color: #fff;
	transition: all .15s var(--ease);
}
.c-footer__btn:disabled { opacity: .6; }
/* AA nudge (GL §8.4): white on #7091ff is 2.92:1 in dark. */
[data-theme="dark"] .c-footer__btn { color: var(--background); }

/* Popular block */
.c-footer__popular {
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid var(--border-subtle);
	text-align: center;
}
.c-footer__ptitle {
	margin-bottom: 16px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--text-muted);
}
.c-footer__plinks {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 24px;
}

/* Bottom bar */
.c-footer__bottom {
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--border-subtle);
	text-align: center;
	font-size: 14px;
	line-height: 20px;
	color: var(--text-faint);
}
.c-footer__bottom a { color: var(--text-faint); border-radius: 4px; transition: color .15s var(--ease); }
/* Each "· link" pair stays on one line; the spaces between items are the only break points. */
.c-footer__item { white-space: nowrap; }
.c-footer__sep { margin: 0 8px 0 4px; } /* + the 4px word space = 8px each side */

@media (hover: hover) {
	.c-footer__links a:hover,
	.c-footer__plinks a:hover { color: var(--primary-light); }
	.c-footer__bottom a:hover { color: var(--text-secondary); }
}

.c-footer__copy { margin: 0; font: inherit; color: inherit; letter-spacing: inherit; text-transform: none; }

.c-footer__logo .custom-logo { width: auto; max-width: none; height: 40px; }

/* QA R3: footer links reach 24px targets without changing the layout. */
.c-footer__links a, .c-footer__plinks a { display: inline-flex; align-items: center; min-height: 24px; }
.c-footer__bottom a { display: inline-flex; align-items: center; min-height: 24px; }

/* Mobile fold: link columns and "Popular" are details (links stay in the DOM); always open from 640px (global.js sets [open]). */
.c-footer__sum { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; cursor: pointer; list-style: none; border-bottom: 1px solid var(--border-subtle); }
.c-footer__sum::-webkit-details-marker { display: none; }
.c-footer__sum::after { content: ""; flex: none; width: 8px; height: 8px; border: solid var(--text-muted); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .15s var(--ease); }
details[open] > .c-footer__sum::after { transform: rotate(-135deg); }
.c-footer__sum > h2 { margin: 0; }
.c-footer__sum:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 4px; }
.c-footer__links, .c-footer__plinks { padding-top: 12px; }
@media (max-width: 639.98px) {
	.c-footer__grid { gap: 0; }
	.c-footer__brand { margin-bottom: 20px; }
	.c-footer__in { padding-top: 28px; padding-bottom: 24px; }
	.c-footer__popular { margin-top: 0; padding-top: 0; border-top: 0; text-align: left; }
	.c-footer__plinks { justify-content: flex-start; padding-bottom: 8px; }
	.c-footer__bottom { margin-top: 16px; padding-top: 16px; }
	.c-footer__links { padding-bottom: 8px; }
}
@media (min-width: 640px) {
	.c-footer__sum { min-height: 0; cursor: default; pointer-events: none; border-bottom: 0; }
	.c-footer__sum::after { display: none; }
	.c-footer__col::details-content, .c-footer__popular::details-content { content-visibility: visible; }
	.c-footer__links, .c-footer__plinks { padding-top: 0; }
	.c-footer__sum .c-footer__h { margin-bottom: 16px; }
	.c-footer__sum .c-footer__ptitle { margin-bottom: 16px; }
}
@media (max-width: 639.98px) { .c-footer__sum .c-footer__h, .c-footer__sum .c-footer__ptitle { margin-bottom: 0; } }

/* Round 18: heading weights 600 (type scale), Set up button 44px tap target */
.c-footer :is(h2, h3, .c-footer__ptitle, .c-footer__h) { font-weight: 600; }
.c-footer__btn { height: 44px; }
/* Job alerts: a link to /job-alerts/ (no email in the URL), same button look, 44px target. */
.c-footer__alerts-link { display: inline-flex; align-items: center; justify-content: center; height: auto; min-height: 44px; text-decoration: none; }
.c-footer__alerts-link:hover { filter: brightness(1.08); }
.c-footer__alerts-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }