/* Keep Elementor's button defaults from squeezing fixed-size navigation icons. */
html body .navlinks .nsearch {
	padding: 0 !important;
	min-width: 38px;
	flex: 0 0 38px;
}

html body .navlinks .nsearch svg {
	width: 20px !important;
	height: 20px !important;
	flex: 0 0 20px;
}

html body .navlinks .nprof {
	padding: 0 !important;
	min-width: 38px;
	flex: 0 0 38px;
}

/* Elementor's global accent color must not leak into this brand system. */
html body a:not(.btn) {
	color: inherit;
}

html body button:not(.btn) {
	color: inherit;
}

/* Keep the floating assistant launcher square despite Elementor button defaults. */
html body .chatw .ping {
	display: block;
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	max-width: 22px !important;
	min-height: 22px !important;
	max-height: 22px !important;
	aspect-ratio: 1 / 1;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 0;
	background: var(--amber) !important;
}

html body .chatw .bub {
	width: 62px !important;
	height: 62px !important;
	min-width: 62px !important;
	max-width: 62px !important;
	min-height: 62px !important;
	max-height: 62px !important;
	aspect-ratio: 1 / 1;
	padding: 0 !important;
}

/* Homepage path cards: contain every track and block Elementor's pink hover. */
html body .pathsel,
html body .pathsel .ps-inner,
html body .pathsel .ps-chips {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

html body .pathsel .ps-chips {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

html body .pathsel .ps-chip,
html body .pathsel .ps-chip:hover,
html body .pathsel .ps-chip:focus {
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	white-space: normal;
	overflow-wrap: anywhere;
	background: #fff !important;
	color: var(--ink) !important;
	border-color: rgba(3, 49, 140, .16) !important;
}

html body .pathsel .ps-chip:hover,
html body .pathsel .ps-chip:focus {
	border-color: var(--cfblue) !important;
}

html body .pathsel .ps-chip[aria-pressed="true"],
html body .pathsel .ps-chip[aria-pressed="true"]:hover,
html body .pathsel .ps-chip[aria-pressed="true"]:focus {
	background: var(--ink) !important;
	color: #fff !important;
	border-color: var(--amber) !important;
}

@media (max-width: 1200px) {
	html body .pathsel .ps-chips {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	html body .pathsel .ps-chips {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Find page: prevent Elementor form defaults from consuming the search row. */
html body .orgsearch,
html body .orgsearch * {
	box-sizing: border-box;
}

html body .orgsearch .os-controls {
	display: flex;
	width: 100%;
	max-width: 100%;
}

html body .orgsearch .os-controls select {
	flex: 0 0 210px;
	width: 210px !important;
	max-width: 210px;
	margin: 0;
	background: #fff !important;
	color: var(--ink) !important;
}

html body .orgsearch .os-inputwrap {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
}

html body .orgsearch .os-inputwrap input {
	display: block;
	width: 100% !important;
	max-width: 100%;
	margin: 0;
	background: #fff !important;
	color: var(--ink) !important;
}

html body .orgsearch .os-drop button,
html body .orgsearch .os-drop button:focus {
	background: transparent !important;
	color: var(--ink) !important;
}

html body .orgsearch .os-drop button:hover,
html body .orgsearch .os-drop button.hl {
	background: rgba(30, 119, 245, .08) !important;
	color: var(--ink) !important;
}

@media (max-width: 760px) {
	html body .orgsearch .os-controls {
		flex-direction: column;
	}

	html body .orgsearch .os-controls select {
		flex-basis: auto;
		width: 100% !important;
		max-width: 100%;
	}
}

/* Keep the comparison table header legible and inside the Causefi palette. */
html body .cmp th {
	background: var(--mint) !important;
	color: var(--navy) !important;
	border-bottom: 2px solid var(--amber);
}

/* Signup roles: equal tracks, wrapping copy, and brand-safe interactions. */
html body .roles {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

html body .roles > .role,
html body .roles > .role:hover,
html body .roles > .role:focus {
	width: 100%;
	min-width: 0;
	white-space: normal !important;
	overflow-wrap: anywhere;
	color: var(--ink) !important;
	background: #fff !important;
	border-color: rgba(3, 49, 140, .12) !important;
}

html body .roles > .role.on,
html body .roles > .role.on:hover,
html body .roles > .role.on:focus {
	border-color: var(--amber) !important;
}

/* Preserve the edge-to-edge ticker and remove theme typography spacing. */
html body .marquee {
	width: 100% !important;
	margin: 0 !important;
}

html body .marquee .mtrack,
html body .marquee .mtrack span {
	margin: 0 !important;
	padding: 0 !important;
}

/* minmax(0, 1fr) prevents long content from widening individual grid tracks. */
html body .bento {
	grid-template-columns: repeat(12, minmax(0, 1fr));
}

html body .apps {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

html body .verts,
html body .stats,
html body .frow {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

html body .loop {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

html body .bento > *,
html body .apps > *,
html body .verts > *,
html body .stats > *,
html body .frow > *,
html body .loop > * {
	min-width: 0;
}

@media (max-width: 900px) {
	html body .roles {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	html body .loop,
	html body .frow,
	html body .apps,
	html body .verts {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 640px) {
	html body .loop,
	html body .frow,
	html body .apps,
	html body .verts {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* The source pages use several page-specific grid names and inline columns. */
@media (max-width: 700px) {
	html body a[href="#compare"],
	html body #compare {
		display: none !important;
	}

	html body .section [style*="grid-template-columns"],
	html body .phero [style*="grid-template-columns"],
	html body footer.site [style*="grid-template-columns"],
	html body .bento,
	html body .postgrid,
	html body .podgrid,
	html body .series,
	html body .proj,
	html body .proj-verdict,
	html body .gdtl,
	html body .plgrid,
	html body .vapps,
	html body .plan3,
	html body .inc,
	html body .ladder,
	html body .lockups,
	html body .numrows {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	html body .section *,
	html body .phero *,
	html body footer.site * {
		min-width: 0;
	}

	html body .section img,
	html body .phero img,
	html body footer.site img {
		max-width: 100%;
		height: auto;
	}

	html body .section table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	html body .bcard,
	html body .fcell,
	html body .appt,
	html body .vert,
	html body .plbox {
		overflow-wrap: anywhere;
	}

	/* Mobile menu: brand/close first, full-width auth actions beneath them. */
	html body .menuov .mo-top {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: 12px 16px;
	}

	html body .menuov .mo-topright {
		display: contents;
	}

	html body .menuov .mo-auth {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-column: 1 / -1;
		grid-row: 2;
		gap: 10px;
		width: 100%;
	}

	html body .menuov .mo-auth .btn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: 44px;
		padding: 10px 14px;
		white-space: nowrap;
	}

	html body .menuov .mo-vline {
		display: none;
	}

	html body .menuov .mo-x {
		grid-column: 2;
		grid-row: 1;
	}

	html body .menuov .mo-apps {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	html body .role {
		white-space: normal !important;
		overflow: hidden;
		overflow-wrap: anywhere;
	}
}

@media (max-width: 520px) {
	html body .roles {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Mobile assistant: keep its header/close control visible above the tab bar. */
@media (max-width: 700px) {
	html body .chatw .panel {
		position: fixed !important;
		top: calc(env(safe-area-inset-top) + 10px) !important;
		right: 10px !important;
		bottom: calc(78px + env(safe-area-inset-bottom)) !important;
		left: 10px !important;
		width: auto !important;
		max-width: none !important;
		max-height: none !important;
		display: flex;
		flex-direction: column;
	}

	html body .chatw .phead,
	html body .chatw .bchips,
	html body .chatw .brow {
		flex: 0 0 auto;
	}

	html body .chatw .bmsgs {
		flex: 1 1 auto;
		height: auto !important;
		min-height: 0;
	}

	html body .mtabbar button,
	html body .mtabbar button:hover,
	html body .mtabbar button:focus,
	html body .mtabbar button:focus-visible,
	html body .mtabbar button:active,
	html body .mtabbar button[aria-expanded="true"] {
		background: transparent !important;
		background-color: transparent !important;
		color: var(--gray) !important;
		box-shadow: none !important;
		outline: none !important;
	}

	html body .mtabbar button .msq,
	html body .mtabbar button:hover .msq,
	html body .mtabbar button:focus .msq,
	html body .mtabbar button:active .msq {
		background: var(--sky) !important;
	}
}

@media (min-width: 1081px) and (max-height: 820px) {
	html body #top-hero .hcalc {
		padding: 20px 24px !important;
	}
}

/* Use the full visible desktop height without requiring menu scrolling. */
@media (min-width: 961px) and (max-height: 900px) {
	html body .menuov {
		overflow: hidden;
	}

	html body .menuov .mo-top {
		height: 70px;
		box-sizing: border-box;
		padding-top: 12px;
		padding-bottom: 12px;
	}

	html body .menuov .mo-inner {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: calc(100vh - 70px);
		height: calc(100dvh - 70px);
		box-sizing: border-box;
		padding-top: clamp(16px, 2.4vh, 24px);
		padding-bottom: clamp(18px, 2.8vh, 28px);
	}

	html body .menuov .mo-grid {
		gap: 32px 44px;
	}

	html body .menuov h5 {
		margin-bottom: 10px;
	}

	html body .menuov h5 + h5,
	html body .menuov .mo-grid a + h5,
	html body .menuov .mo-grid button + h5,
	html body .menuov .mo-appswrap + h5 {
		margin-top: 18px;
	}

	html body .menuov .mo-grid a,
	html body .menuov .mo-appstoggle {
		padding-top: 4px;
		padding-bottom: 4px;
	}

	html body .menuov .mo-story {
		margin-top: 0;
		padding: 11px 18px;
		line-height: 1.55;
	}

	html body .menuov .mo-ctas {
		margin-top: 0;
		gap: 12px;
	}

	html body .menuov .mo-ctas .mo-cta {
		padding: 11px 15px;
	}

	html body .menuov .mo-div {
		margin: 0;
	}

	html body .menuov .mo-soc a,
	html body .menuov .mo-mail a {
		height: 42px;
	}

	html body .menuov .mo-soc a {
		width: 42px;
	}

	html body .menuov .mo-more {
		margin-top: 10px;
	}
}