#landing-background {
	background: white;
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: 1fr;
	-ms-grid-columns: 1fr;
	    grid-template: 1fr / 1fr;
}

main#main:has(#landing-background) {
	min-height: calc(100vh - var(--ccp-header-height, 0px));
}

.section-bg {
	overflow: hidden;
}

@media (min-width: 768px) {
	.section-bg {
		height: calc(100vh - var(--ccp-header-height, 0px));
	}
}

:where(.section-bg, .section-fg) {
	grid-area: 1 / 1 / -1 / -1;
	position: relative;
	z-index: 1;
}

#background-content {
	max-width: 1650px;
	margin: auto;
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: auto 1fr;
	-ms-grid-columns: max-content auto 1fr auto;
	    grid-template: 'toggle toggle toggle toggle' auto  'filter . list .' 1fr  / max-content auto 1fr auto;
}

#background-content #toggle-row {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
	-ms-grid-column-span: 4;
	grid-area: toggle;
}

#background-content #filters {
	-ms-grid-row: 2;
	-ms-grid-column: 1;
	grid-area: filter;
}

#background-content #list {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
	grid-area: list;
}

@media (max-width: 1399.98px) {
	#background-content #list {
		-ms-grid-column: 1;
		    grid-column-start: 1;
		-ms-grid-column-align: center;
		    justify-self: center;
	}
	#background-content #filters {
		display: none;
	}
}

.section-fg {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr auto 1fr;
	    grid-template: 1fr auto 1fr /  1fr auto 1fr;
	    grid-template-areas: ". . ." ". modal ." ". . .";
	position: relative;
	z-index: 1;
	color: var(--bs-primary);
}

.section-fg:before {
	content: '';
	position: relative;
	grid-area: 1 / 1 / -1 / -1;
	z-index: 0;
	background-color: color-mix(in srgb, var(--bs-primary) 50%, transparent);
	cursor: no-drop;
}

.text-balance {
	text-wrap: balance;
}

.text-pretty {
	text-wrap: pretty;
}

.section-fg__modal {
	-ms-grid-row: 2;
	-ms-grid-column: 2;
	grid-area: modal;
	-ms-grid-row-align: center;
	-ms-grid-column-align: center;
	place-self: center;
	display: block;
	padding: 2rem;
	background: white;
	position: relative;
	z-index: 1;
	max-width: 1140px;
	width: calc(100% - 2rem);
	margin-block: 4rem;
	border-radius: 1rem;
}

@media (max-width: 767.98px) {
	.section-fg__modal {
		padding-inline: 1rem;
	}
}

.section-fg__modal .cta-split-layout {
	display: flex;
	align-items: stretch;
	flex-direction: column;
	--pipe-color: var(--bs-primary);
}

.section-fg__modal .cta-split-layout .content {
	padding-block: 2rem;
	flex: 1 1 30%;
	text-align: center;
	text-wrap: pretty;
}

.section-fg__modal .cta-split-layout .pipe {
	-ms-grid-row-align: stretch;
	    align-self: stretch;
	padding: 1px 1px 0 0;
	background-color: var(--pipe-color);
}

@media (min-width: 992px) {
	.section-fg__modal .cta-split-layout {
		flex-direction: row;
	}
}

.section-fg__modal .btn-outline-secondary:hover {
	color: white;
}