:root {
	--content-max-width: 1080px;
}
@media(min-width:1079px) {
.content-max-width {
	max-width: var(--content-max-width);
	margin-left: auto;
	margin-right: auto;
}
}
hgroup + .mb-5:empty { display: none; }
#stats {
	h3 { margin-bottom: 0; font-weight: 600; font-size:100%; }
	h3 span { display: block;  }
	.text-big { font-size: 3.25em; margin: 0; line-height:1; }
	.text-big > sup { font-size: 2rem !important; opacity:1; color: #222 !important; margin:0 !important; line-height: 1; top: 0; }
	.text-big + * { font-size: 1.25em; margin: 0; }
}
section h2 {
	font-size: 2.2em;
	font-weight: 700;
	line-height: 1.1;;
}
section h2.gradient, .header-gradient {
	background-image: linear-gradient(to bottom, #000, var(--bs-blue));
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
  -webkit-text-fill-color: transparent;
}
.header-gradient {
	background-image: linear-gradient(to bottom, var(--bs-dark), var(--bs-blue) 66%);
}

ol.stages {
	margin: 0;
	padding: 0;
	list-style: none;
	list-style-image: unset;
	> li {
		position: relative !important;
		background-color: white;
		border-radius: var(--bs-border-radius);
		padding: 1.5rem 2rem;
		box-shadow: 1px 2px 0 rgba(0,0,0,0.15);
		overflow: hidden;
		ul.list { margin-bottom: 0;}
		p.index { position: relative; line-height: 1; font-size: 120%; margin-bottom: 0.75rem; }
		p.index > span { display: inline-block; text-align: center; color: #fff; transform: translateY(-2px); position: relative; font-size: 75%; font-weight: 800; z-index: 1; width: 1.3em; line-height: 1.3em; }
		p.index:before { content: ''; position: absolute; left: 0; top: 0; width: 1em; height: 1em; outline: solid 2px var(--bs-blue); border-radius: 0.5em; background: var(--bs-blue); z-index: 0; }
	}
	> li:after {
		content: '';
		position: absolute;
		z-index: 1;
		left: 0;
		top: 0;
		width: 6px;
		height: 0%;
		
		background: linear-gradient(to bottom, var(--bs-blue) 50%, white);
		transition: height 800ms;
	}
	> li.scrolled:after {
		height: 170%
	}
}

aside#customer-reviews {
	.row > div:last-child { padding-bottom: 1rem; border-bottom: solid 1px var(--bs-border-color)}
}
.carousel { margin-bottom: 2em; min-height: 220px; }
.carousel-indicators {
	top: calc(100% + 1px);
	bottom: auto;
button {
	background: radial-gradient(circle at center, lightgray 40%, white 40%);
	padding: 0 !important;
	width: 1em !important;
	height: 1em !important;
	display: block;
}
}
.carousel-item blockquote {
	margin: 0 auto !important;
	padding: 0 !important;
	border: none !important;
	text-align: center;
	max-width: 575px;
	> q { font-size: 130% !important; padding: 0 !important; }
	> cite { font-style: normal; font-weight: 300; padding-top: 1rem; }
	> cite:before { content: '~ ' }
}

section .dark-well {
	background-color: #333;
	color: #fff;
	height: 100%;
	min-height: 520px;
	border-radius: var(--bs-border-radius);
	position: relative;
	> .well-wrapper {
		min-height: 100%;
		padding: 1.5rem 1.25rem;
		position: relative;
		z-index: 1;
		display: flex;
		flex-direction: column;
		
		.svg-icon {
			mask-repeat: no-repeat;
			mask-size: cover; 
			margin-bottom: 0.75rem;
			width: 40px;
			height: 40px;
			background-color: white; 
		}
		h4 { font-weight: 500; font-size: 1.5em; }
		> .well-header { flex-grow: 1; max-height: 14em; }
		> .well-content { }
		> :not(.well-header) { font-weight: 300; font-size: 110%; }
	}
	.well-bg {
		position: absolute;
		z-index: 0;
		left: 0;
		top: 0;
		width: 100%; 
		height: 100%;
		mask-repeat: no-repeat;
		mask-size: 90%;
		mask-position: calc(100% + 40px) 98%;
		background-color: rgba(255,255,255,0.03);
		
	}
}

@media(min-width:1400px) {
	section .dark-well > .well-wrapper { padding: 2rem; }
}
@media(min-width:992px) {
	ol.stages > li > .d-flex > :first-child { max-width: 33%; }
}
@media(max-width:991px) {
	#stats {
		.text-big { font-size: 2.5em; font-weight: 800; margin: 0; line-height:1; }
		.text-big > sup { font-size: 2rem !important; opacity:1; color: #222 !important; margin:0 !important; line-height: 1; top: 0; }
		.text-big + * { font-size: 1.25em; margin: 0; }
	}
	section .dark-well { 
		min-height: 400px;
		.well-bg { mask-size: 66%; }
	}
}
@media(max-width:767px) {
	ol.stages > li {
		padding: 1.5rem;
		display: flex;
		column-gap: 1rem;
		> p { margin-top: 3px;}
	}
	ol.stages > li > .d-flex { display: block !important;}
	section .dark-well {
		min-height: 280px;
		.well-bg {
			mask-size: 33%;
			mask-position: 98% 98%
		}
	}
}
