/*!
 * Brimco Assist: the launcher, its drawer, and the Terms library search.
 *
 * Brimco Design System V0. Tokens are declared here with literal fallbacks so
 * the panel survives a theme change: paper #ffffff, ink #231f20, text #5e5e5e,
 * accent #c0f0fe (hover and focus only, never a text colour), border #e8ebed,
 * surface #f4f5f6, link #316A7C. Square corners on buttons and inputs. No
 * shadows. One easing site-wide.
 *
 * The drawer is deliberately not the Brandesis pattern (a pair of footer
 * tiles). This is a right-edge drawer under a square launcher.
 */

.brimco-ask,
.brimco-ask__open,
.brimco-find {
	--bk-paper: #ffffff;
	--bk-ink: #231f20;
	--bk-text: #5e5e5e;
	--bk-accent: #c0f0fe;
	--bk-border: #e8ebed;
	--bk-surface: #f4f5f6;
	--bk-link: #316a7c;
	--bk-ease: cubic-bezier(0.455, 0.03, 0.515, 0.955);
	--bk-sans: Onest, system-ui, -apple-system, "Segoe UI", sans-serif;
	--bk-serif: Lora, Georgia, "Times New Roman", serif;
	--bk-label: Poppins, system-ui, sans-serif;
}

/* ---------- launcher ---------- */

.brimco-ask__open {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 90;
	min-height: 48px;
	padding: 5px 23px;
	border: 0;
	border-radius: 0;
	background: var(--bk-ink);
	color: var(--bk-paper);
	font: 600 12px/1 var(--bk-label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.16s var(--bk-ease), color 0.16s var(--bk-ease);
}

.brimco-ask__open:hover,
.brimco-ask__open:focus-visible {
	background: var(--bk-accent);
	color: var(--bk-ink);
}

.brimco-ask__open:focus-visible {
	outline: 2px solid var(--bk-ink);
	outline-offset: 2px;
}

.brimco-ask__open[aria-expanded="true"] {
	visibility: hidden;
}

/* ---------- drawer ---------- */

/* A sheet that rises from the bottom, not a full-height side drawer: the
   panel answers a question, it does not need the whole page. */
.brimco-ask {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 95;
	display: flex;
	flex-direction: column;
	width: min(460px, calc(100vw - 32px));
	height: clamp(320px, 40vh, 460px);
	background: var(--bk-paper);
	border: 1px solid var(--bk-border);
	font-family: var(--bk-sans);
	transform: translateY(calc(100% + 32px));
	transition: transform 0.24s var(--bk-ease);
}

.brimco-ask[hidden] {
	display: none;
}

.brimco-ask.is-open {
	transform: translateY(0);
}

.brimco-ask__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 24px;
	border-bottom: 1px solid var(--bk-border);
}

.brimco-ask__logo {
	display: block;
	width: auto;
	height: 30px;
	max-width: 160px;
}

.brimco-ask__wordmark {
	font: 700 22px/1 var(--bk-serif);
	color: var(--bk-ink);
}

.brimco-ask__close {
	border: 0;
	background: none;
	padding: 4px;
	font-size: 26px;
	line-height: 1;
	color: var(--bk-text);
	cursor: pointer;
	transition: color 0.16s var(--bk-ease);
}

.brimco-ask__close:hover {
	color: var(--bk-ink);
}

.brimco-ask__body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 24px;
}

.brimco-ask__eyebrow {
	margin: 0 0 8px;
	font: 600 11px/1 var(--bk-label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--bk-text);
}

.brimco-ask__title {
	margin: 0 0 18px;
	font: 600 22px/1.35 var(--bk-serif);
	color: var(--bk-ink);
	text-wrap: balance;
}

/* ---------- inputs, shared by both surfaces ---------- */

.brimco-ask__form,
.brimco-find__form {
	display: flex;
	gap: 8px;
}

/* An underline, never a box. */
.brimco-ask__input,
.brimco-find__input {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 48px;
	padding: 5px 2px;
	border: 0;
	border-bottom: 1px solid var(--bk-border);
	border-radius: 0;
	background: transparent;
	font: 400 15px/1.5 var(--bk-sans);
	color: var(--bk-ink);
	appearance: none;
}

.brimco-ask__input::placeholder,
.brimco-find__input::placeholder {
	color: #9aa1a8;
	opacity: 1;
}

.brimco-ask__input:focus,
.brimco-find__input:focus {
	outline: 0;
	border-bottom-color: var(--bk-ink);
	border-bottom-width: 2px;
}

/* The button is not there until the reader is. */
.brimco-ask__submit,
.brimco-find__submit {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.16s var(--bk-ease), background-color 0.16s var(--bk-ease), color 0.16s var(--bk-ease);
}

.brimco-ask__form:focus-within .brimco-ask__submit,
.brimco-find__form:focus-within .brimco-find__submit,
.brimco-ask__form.is-filled .brimco-ask__submit,
.brimco-find__form.is-filled .brimco-find__submit {
	opacity: 1;
	visibility: visible;
}

.brimco-ask__submit,
.brimco-find__submit {
	flex: 0 0 auto;
	min-height: 48px;
	padding: 5px 23px;
	border: 0;
	border-radius: 0;
	background: var(--bk-ink);
	color: var(--bk-paper);
	font: 600 12px/1 var(--bk-label);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.16s var(--bk-ease), color 0.16s var(--bk-ease);
}

.brimco-ask__submit:hover,
.brimco-find__submit:hover {
	background: var(--bk-accent);
	color: var(--bk-ink);
}

/* ---------- results, shared ---------- */

.brimco-ask__out,
.brimco-find__out {
	margin-top: 20px;
}

.bk-answer {
	padding: 18px;
	background: var(--bk-surface);
	border-left: 3px solid var(--bk-ink);
	font-size: 15px;
	line-height: 1.65;
	color: var(--bk-ink);
	text-wrap: pretty;
}

.bk-answer a,
.bk-list a {
	color: var(--bk-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.bk-answer a:hover,
.bk-list a:hover {
	color: #4098b2;
}

.bk-answer__more {
	display: inline-block;
	margin-top: 10px;
	font: 600 12px/1 var(--bk-label);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.bk-group {
	margin: 22px 0 0;
	font: 600 11px/1 var(--bk-label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--bk-text);
}

.bk-list {
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}

.bk-list li {
	padding: 12px 0;
	border-top: 1px solid var(--bk-border);
}

.bk-list li:first-child {
	border-top: 0;
}

.bk-list a {
	font-family: var(--bk-serif);
	font-size: 15.5px;
	line-height: 1.4;
	text-decoration: none;
	color: var(--bk-ink);
}

.bk-list a:hover {
	color: var(--bk-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.bk-type {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 7px;
	border: 1px solid var(--bk-border);
	font: 600 10px/1.6 var(--bk-label);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--bk-text);
	vertical-align: 2px;
}

.bk-empty,
.bk-state {
	margin: 16px 0 0;
	font-size: 14.5px;
	color: var(--bk-text);
}

/* This strip was unreadable: the site-wide rule paints every footer element
   black and the link ink sat on top of it. It is a div now, and both colours
   are stated outright so no global rule can reach them. */
.brimco-ask .brimco-ask__foot {
	flex: 0 0 auto;
	padding: 16px 24px;
	border-top: 1px solid var(--bk-border);
	background: var(--bk-surface) !important;
}

.brimco-ask .brimco-ask__foot a {
	font: 600 12px/1 var(--bk-label);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bk-ink) !important;
	text-decoration: none;
}

.brimco-ask .brimco-ask__foot a:hover {
	color: var(--bk-link) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ---------- Terms library search ---------- */

.brimco-find {
	max-width: 1296px;
	margin: 0 auto;
	padding: 32px 0 8px;
	font-family: var(--bk-sans);
}

.brimco-find__title {
	margin: 0 0 6px;
	font: 600 26px/1.3 var(--bk-serif);
	color: var(--bk-ink);
	text-wrap: balance;
}

.brimco-find__note {
	margin: 0 0 14px;
	font: 600 11px/1 var(--bk-label);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--bk-text);
}

.brimco-find__form {
	max-width: 620px;
}

.brimco-find__out:not(:empty) {
	max-width: 720px;
	margin-top: 22px;
	padding: 20px;
	border: 1px solid var(--bk-border);
	background: var(--bk-paper);
}

@media (max-width: 1023.98px) {
	.brimco-find {
		padding-left: 24px;
		padding-right: 24px;
	}
}

@media (max-width: 599.98px) {
	.brimco-ask__open {
		right: 16px;
		bottom: 16px;
	}

	.brimco-ask {
		right: 0;
		bottom: 0;
		width: 100vw;
		height: clamp(300px, 48vh, 440px);
		border-left: 0;
		border-right: 0;
		border-bottom: 0;
	}

	.brimco-find__form {
		flex-wrap: wrap;
	}

	.brimco-find__submit {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.brimco-ask,
	.brimco-ask__open,
	.brimco-ask__submit,
	.brimco-find__submit {
		transition: none;
	}
}


/* ---------- suggested questions, built from where the reader is ---------- */

.brimco-ask__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}

.brimco-ask__chip {
	padding: 7px 12px;
	border: 1px solid var(--bk-border);
	border-radius: 0;
	background: var(--bk-paper);
	font: 400 13px/1.3 var(--bk-sans);
	color: var(--bk-text);
	cursor: pointer;
	transition: border-color 0.16s var(--bk-ease), color 0.16s var(--bk-ease);
}

.brimco-ask__chip:hover,
.brimco-ask__chip:focus-visible {
	border-color: var(--bk-ink);
	color: var(--bk-ink);
}

/* Once an answer is showing, the suggestions have done their job. */
.brimco-ask.has-answer .brimco-ask__chips {
	display: none;
}

/* ---------- the search field sitting inside the black Terms hero ---------- */

.gspb_row .brimco-find {
	max-width: none;
	margin: 18px 0 0;
	padding: 0;
}

.gspb_row .brimco-find .brimco-find__title {
	display: none;
}

.gspb_row .brimco-find .brimco-find__note {
	color: rgba(255, 255, 255, 0.66);
	margin-bottom: 10px;
}

.gspb_row .brimco-find .brimco-find__form {
	max-width: 460px;
}

.gspb_row .brimco-find .brimco-find__input {
	color: #ffffff;
	border-bottom-color: rgba(255, 255, 255, 0.45);
}

.gspb_row .brimco-find .brimco-find__input::placeholder {
	color: rgba(255, 255, 255, 0.62);
}

.gspb_row .brimco-find .brimco-find__input:focus {
	border-bottom-color: #ffffff;
}

.gspb_row .brimco-find .brimco-find__submit {
	background: #ffffff;
	color: var(--bk-ink);
}

.gspb_row .brimco-find .brimco-find__submit:hover {
	background: var(--bk-accent);
}

/* Results land below the hero, so they sit on paper, not on black. */
.gspb_row .brimco-find .brimco-find__out:not(:empty) {
	max-width: 460px;
	background: var(--bk-paper);
	border-color: var(--bk-border);
}


/* ---------- brimco-ask-dock ----------
   The launcher used to sit on top of the footer links. It now lifts above the
   footer once the footer is in view, and inverts to white on ink so it stays
   legible over the black bands. */

.brimco-ask__open {
	transition: background-color 0.16s var(--bk-ease), color 0.16s var(--bk-ease), bottom 0.2s var(--bk-ease);
}

.brimco-ask__open.is-docked,
.brimco-ask.is-docked {
	bottom: var(--brimco-dock, 24px);
}

.brimco-ask__open.on-dark {
	background: #ffffff;
	color: #000000;
}

.brimco-ask__open.on-dark:hover,
.brimco-ask__open.on-dark:focus-visible {
	background: var(--bk-accent);
	color: #000000;
}


/* ================= brimco-article-round-three ================= */

/* ---- the breadcrumb and byline strip sat flush against the hero ---- */
main article > .entry-content > .wp-block-greenshift-blocks-row:first-of-type,
#gspb_row-id-gsbp-2bdf0e7 {
	padding-top: 22px !important;
	padding-bottom: 22px !important;
}

/* ---- the writer band ----
   It spanned the page with a 1440px box-shadow, but an ancestor carries
   overflow:clip and the body clips the x axis, so the bleed was cut and the
   band read as ragged. This is the ordinary full-width technique instead:
   the element is the width of the viewport, so there is nothing to clip
   away, and the padding keeps its content on the article's column. */
main .author-box[class] {
	box-shadow: none !important;
	clip-path: none !important;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-left: max(24px, calc((100vw - 1296px) / 2)) !important;
	padding-right: max(24px, calc((100vw - 1296px) / 2)) !important;
	background: #000000 !important;
}

/* ---- the writer portrait ----
   Blocksy positions this avatar absolute at top:-33px so it overhangs the box
   in their own layout. Inside our band that left it hanging above the black
   with a gap underneath, and took it out of the grid, so the band sized itself
   to the text alone. Put back in flow and centred, the band sizes to the
   portrait and the two sit level. */
main .author-box[class] .ct-media-container {
	position: static !important;
	top: auto !important;
	left: auto !important;
	align-self: center !important;
}

main .author-box[class] {
	align-items: center !important;
}


/* ================= brimco-assist-try =================
   The launcher had one job and no invitation. "Brimco Assist" names the
   thing; "Try" tells a reader it is theirs to press. The flag is the accent,
   which is the one place V0 allows it to carry a fill, and it disappears
   once the reader has opened the panel: a permanent nudge is an advert. */

.brimco-ask__open {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

/* The wordmark is the logo file itself, masked so it takes the button's own
   colour. That is why it inverts correctly when the launcher lands on a dark
   section, and why it needs no font: the SVG is outlined lettering. */
.brimco-ask__mark {
	display: inline-block;
	width: 62px;
	height: 14px;
	background-color: currentColor;
	-webkit-mask: var(--bk-wordmark) no-repeat center / contain;
	mask: var(--bk-wordmark) no-repeat center / contain;
	flex: none;
}

/* Where masking is unavailable the name is set in the display face instead. */
.brimco-ask__mark--text {
	width: auto;
	height: auto;
	background: none;
	-webkit-mask: none;
	mask: none;
	font: 600 15px/1 var(--bk-serif);
	letter-spacing: 0;
	text-transform: none;
}

@supports not (mask: url("")) {
	.brimco-ask__mark {
		width: auto;
		height: auto;
		background: none;
		font: 600 15px/1 var(--bk-serif);
		letter-spacing: 0;
		text-transform: none;
	}

	.brimco-ask__mark::before {
		content: "Brimco";
	}
}

/* No fill. The word reads as the button's own first word rather than a badge
   stuck to it, and taking its colour from the button means it inverts with
   the wordmark instead of needing a rule of its own. */
.brimco-ask__try {
	background: none;
	color: inherit;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 0;
	line-height: 1;
}

.brimco-ask--used .brimco-ask__try,
.brimco-ask__open.is-used .brimco-ask__try {
	display: none;
}