/* ==========================================================================
   CORPORATE FAQ — 500 questions in 44 sections
   A flat list of five hundred is unusable, so the page is a sticky section
   index beside collapsible questions, with a live filter over the top. Every
   answer stays in the HTML so it is indexable and still findable with the
   browser's own search when JavaScript is off.
   ========================================================================== */

.fq { --fq-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.fq-head {
	padding: clamp(46px, 7vw, 82px) 0 clamp(26px, 4vw, 40px);
	background: var(--bg-alt, #F4F7FB);
	border-bottom: 1px solid var(--line, rgba(15, 23, 42, .1));
}

[data-theme="dark"] .fq-head { background: rgba(255, 255, 255, .03); }

.fq-eyebrow {
	margin: 0 0 12px;
	font-family: var(--fq-mono);
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.fq-title {
	margin: 0 0 14px;
	max-width: 20ch;
	font-family: var(--font-display);
	font-size: clamp(1.7rem, 4vw, 2.7rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -.02em;
	color: var(--ink, #0b1f3a);
}

.fq-title__brand { display: block; color: var(--color-primary); }

.fq-lead { margin: 0 0 26px; max-width: 68ch; font-size: 1rem; line-height: 1.7; color: var(--muted, #64748b); }

.fq-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }

.fq-search {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1 1 380px;
	max-width: 560px;
	padding: 12px 16px;
	background: var(--card, #fff);
	border: 1px solid var(--line, rgba(15, 23, 42, .14));
	border-radius: var(--radius-full, 999px);
}

.fq-search:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb), .16); }
.fq-search svg { flex: none; color: var(--muted, #64748b); }

.fq-search input {
	flex: 1;
	min-width: 0;
	border: 0;
	background: none;
	font-family: var(--font-body);
	font-size: .93rem;
	color: var(--ink, #0b1f3a);
}

.fq-search input:focus { outline: none; }
.fq-count { margin: 0; font-family: var(--fq-mono); font-size: .8rem; color: var(--muted, #64748b); }

/* ---------------- layout ---------------- */

.fq-body { padding: clamp(34px, 5vw, 60px) 0 clamp(56px, 8vw, 92px); }

.fq-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 44px; align-items: start; }

.fq-toc { position: sticky; top: 90px; max-height: calc(100vh - 120px); overflow-y: auto; }

.fq-toc__h {
	margin: 0 0 12px;
	font-family: var(--fq-mono);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted, #64748b);
}

.fq-toc__list { margin: 0; padding: 0; list-style: none; counter-reset: fq; }

.fq-toc__list a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding: 7px 10px 7px 0;
	font-size: .84rem;
	line-height: 1.35;
	color: var(--ink-2, #475569);
	text-decoration: none;
	border-bottom: 1px solid var(--line-soft, rgba(15, 23, 42, .06));
}

.fq-toc__list a:hover { color: var(--color-primary); }
.fq-toc__list span { flex: none; font-family: var(--fq-mono); font-size: .72rem; color: var(--muted, #94a3b8); }

/* ---------------- sections ---------------- */

.fq-sec { margin-bottom: 40px; scroll-margin-top: 100px; }
.fq-sec[hidden] { display: none; }

.fq-sec__h {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin: 0 0 14px;
	font-family: var(--font-display);
	font-size: 1.18rem;
	font-weight: 700;
	color: var(--ink, #0b1f3a);
}

.fq-sec__n { font-family: var(--fq-mono); font-size: .86rem; color: var(--color-primary); }

.fq-list { border-top: 1px solid var(--line, rgba(15, 23, 42, .1)); }

.fq-item { border-bottom: 1px solid var(--line-soft, rgba(15, 23, 42, .07)); }
.fq-item[hidden] { display: none; }

.fq-item summary {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 0;
	cursor: pointer;
	list-style: none;
}

.fq-item summary::-webkit-details-marker { display: none; }

.fq-q { font-size: .95rem; font-weight: 600; line-height: 1.5; color: var(--ink, #0b1f3a); }
.fq-item summary:hover .fq-q { color: var(--color-primary); }

.fq-chev { flex: none; margin-top: 3px; color: var(--muted, #94a3b8); transition: transform .2s ease; }
.fq-item[open] .fq-chev { transform: rotate(180deg); color: var(--color-primary); }

.fq-a {
	margin: 0 0 16px;
	padding-left: 2px;
	max-width: 74ch;
	font-size: .92rem;
	line-height: 1.7;
	color: var(--ink-2, #475569);
}

.fq-empty { padding: 30px 0; font-size: .95rem; color: var(--muted, #64748b); }

/* ---------------- responsive ---------------- */

@media (max-width: 1000px) {
	.fq-grid { grid-template-columns: minmax(0, 1fr); gap: 26px; }

	.fq-toc {
		position: static;
		max-height: none;
		padding: 16px 18px;
		background: var(--card, #fff);
		border: 1px solid var(--line, rgba(15, 23, 42, .1));
		border-radius: 14px;
	}

	.fq-toc__list { columns: 2; column-gap: 24px; }
	.fq-toc__list li { break-inside: avoid; }
}

@media (max-width: 620px) {
	.fq-toc__list { columns: 1; }
	.fq-tools { flex-direction: column; align-items: stretch; }
	.fq-search { max-width: none; }
	.fq-q { font-size: .9rem; }
}

@media (prefers-reduced-motion: reduce) {
	.fq-chev { transition: none; }
}

/* ==========================================================================
   STRAPLINE, PROVISIONAL ANSWERS AND MASTER POSITIONING (v3.45.0)
   ========================================================================== */

.fq-strap {
	margin: 0 0 16px;
	font-family: var(--fq-mono);
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted, #64748b);
}

/*
 * Six answers state that the figure is still to be confirmed. They are
 * published as written, but marked so a reader can see at a glance that they
 * are provisional rather than settled — and so they are easy to find and
 * replace.
 */
.fq-a--pending {
	padding: 12px 14px;
	border-left: 3px solid #E8A33D;
	background: rgba(232, 163, 61, .08);
	border-radius: 0 8px 8px 0;
}

.fq-pos { margin: 54px 0 0; padding-top: 40px; border-top: 2px solid var(--line, rgba(15, 23, 42, .12)); }

.fq-pos__h {
	margin: 0 0 24px;
	font-family: var(--font-display);
	font-size: clamp(1.2rem, 2.6vw, 1.6rem);
	font-weight: 800;
	color: var(--ink, #0b1f3a);
}

.fq-pos__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

.fq-pos__card {
	padding: 22px 24px;
	background: var(--bg-alt, #f4f7fb);
	border-left: 3px solid var(--color-primary);
	border-radius: 0 12px 12px 0;
}

[data-theme="dark"] .fq-pos__card { background: rgba(255, 255, 255, .04); }

.fq-pos__card h3 {
	margin: 0 0 7px;
	font-family: var(--fq-mono);
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.fq-pos__card p { margin: 0; font-size: .93rem; line-height: 1.65; color: var(--ink-2, #475569); }

@media (max-width: 760px) { .fq-pos__grid { grid-template-columns: minmax(0, 1fr); } }
