@charset "UTF-8";
/* CSS Document */

:root {
/* colors */
	--white:#fff;
	--mbGreyLight:#F7F7F7;
	--mbGreyMiddle:#4D4D4D;

	--mbMain:#234575;
	--mbAqua:#36BFD1;
	--mbBlue:rgba(44, 100, 231, 1);
	--mbLightBlue:#F2F6FF;
	--mbSky:#ABF3FD;

/* radii */
	--smRadii: 6px;
	--mdRadii: 12px;
	--lgRadii: 30px;


/* typography */
	--wghtMed: 500;
	--wghtSemi: 600;
	--wghtBold: 700;
	--uprCase: .02em;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.fade-in {
	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: .15s;
}

.mbAqua {
	color: var(--mbAqua);
}

.mbBlue {
	color: var(--mbBlue);
}

.white {
	color: var(--white);
}

body {
	font-family: "rubik", Helvetica, Arial, san-serif;
	font-weight: normal;
  -webkit-font-smoothing: antialiased;
}

header {
  margin-left: auto;
  margin-right: auto;
	max-width: 1400px;
  padding-left: 3rem;
  padding-right: 3rem;
  position: relative;
}

.mainNav {
	background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 100%);;
	min-height: 6rem;
	padding-top: 4rem;
	position: absolute;
	z-index: 2;
	width: 100%;
}

.nav-link {
	font-weight: var(--wghtMed);
	position: relative;
	text-transform: uppercase;
}

.nav-pills .nav-link.active::after {
	background: #fff;
  border-radius: 2px;
  content: "";
  height: 4px;
  left: calc(50% - 20px);
  position: absolute;
  top: 40px;
  width: 40px;
}

.menuBtn {
	display: none;
}

.menuBtn a {
	background: rgba(255,255,255,0.85);
  border: 1px solid var(--mbGreyLight);
  border-radius: var(--smRadii);
  color: var(--mbGreyMiddle);
  display: table-cell;
  font-size: .675rem;
  font-weight: var(--wghtMed);
  letter-spacing: .08em;
  padding: .5rem 1rem;
  text-decoration: none;
  text-transform: uppercase;
}

.contactUs {
	background: #fff;
}

footer {
	background-color:var(--mbMain) ;
}

footer ul {
	list-style-type: none;
	justify-content: inherit;
	padding: 0;
}

footer ul a  {
	color: #fff;
	margin-left: .75rem;
	margin-right: .75rem;
	text-decoration: none;
}

footer .mb-logo {
	width: 150px;
}

footer .mb-logo img {
  width: 100%;
}

.copyright {
	color: #5988C9;
	font-size: .875rem;
}

.standardButton {
  display: inline-block;
  text-decoration: none;
  background: var(--mbBlue);
  padding: 1rem;
  border-radius: var(--smRadii);
  color: #fff;
  font-weight: var(--wghtSemi);
  font-size: 1.125rem;
}

.homeLanding {
	background: url('../img/bg/home-first.webp') no-repeat;
	background-size: cover;
}

.mb-logo {
	display: block;
	width: 190px;
}

.primeStatement {
	color: var(--mbSky);
	font-size: 3.75rem;
	margin-bottom: 17rem;
	margin-top: 17rem;
	text-align: center;
}

.sectionHead {
	color: var(--mbAqua);
	font-size: 3.25rem;
	font-weight: 500;
	letter-spacing: var(--uprCase);
	text-transform: uppercase;
}

.sectionIntro {
	color: var(--mbGreyMiddle);
	font-weight: normal;
	line-height: 1.8;
}

.sectionBody {
	font-weight: normal;
	line-height: 1.6;
}

.latestNews {
	background:var(--mbBlue);
	border-radius:0 0 var(--mdRadii) var(--mdRadii);
	color:#fff;
}

.latestNews a {
	color:#fff;
	font-weight:normal;
	text-decoration:none;
	line-height:1.375;
}

.ourMission {
	background: url('../img/bg/our-mission-bg.jpg') no-repeat;
	background-position: center -100px;
	padding-bottom: 5rem;
}

.ourApproach, .impact {
  background-repeat: no-repeat;
	min-height: 520px;
}

.ourApproach {
	background-image: url('../img/bg/our-approach-bg.webp') ;
	background-position: 0 0;
  background-size: cover;
}

.impact {
	background-image: url('../img/bg/impact-bg.webp') ;
	background-size: 100%;
}

.approachOverlay {
	background-color: rgba(255, 255, 255, .92);
	background-repeat: no-repeat;
	border-radius: 0px 0px 30px 30px;
	box-shadow: 0px 4px 36px 0px rgba(0, 0, 0, 0.05);
	margin-left: auto;
  margin-right: auto;
	max-width: 1320px;
	position: relative;
}

.spiral {
  left: 0;
	max-width: 360px;
	opacity: 0.4;
	position: absolute;
  top: 0;
}

.spiral img {
	width: 100%;
}

.approachPoints h5 {
	color: var(--mbAqua);
}

.approachPoints p {
	line-height: 1.7;
	padding-top: 1rem;
}

.ourProjects ul {
	list-style-type: none;
	padding: 0;
}

.ourProjects ul h6 {
	font-weight: 500;
	margin-bottom: 1rem;
}

.ourProjects ul p {
	color: var(--mbGreyMiddle);
	font-size: 1.125rem;
	line-height: 1.75em;
	margin-bottom: 1.5rem;
}

.ourProjects ul li {
	margin-top: 2rem;
	padding-right: 1rem;
}

.howItWorks li {
	border-bottom: 10px solid var(--mbGreyLight);
}

.howItWorks li:last-child {
	border-bottom: none;
}

.whyCapture {
	border:10px solid;
	border-radius: var(--smRadii);
	border-color:var(--mbLightBlue);
}

.whyCapture h2 {
	font-size: 1.75rem;
}

.whyCapture ul li {
	line-height: 1.75em;
	position: relative;
}

.bullet {
	background: #fff;
	border-radius: 50px;
	display: block;
	left: -5rem;
	padding: .5rem;
	position: absolute;
}

.bullet .interior {
	border:8px solid var(--mbBlue);
	border-radius: 50px;
	height: 39px;
	width: 39px;
}

.ourValues {
	margin-bottom: 5rem;
}

.ourValues ul,.impactPoints {
	list-style-type: none;
	padding: 0;
}

.ourValues li {
	margin-right: 50px;
	position: relative;
	width: 160px;
}

.values {
}

.valuesArt {
	background: #fff;
  height: 150px;
	left: 25px;
	position: absolute;
	width: 100px;
	z-index: 2;
}

.valuesArt img {
	margin-top: 25px;
}

.valueRing {
  border: 10px solid var(--mbGreyLight);
  border-radius: 50%;
	height: 150px;
	position: relative;
  width: 150px;
}

.valueRing::after {
	background-color: var(--mbGreyLight);
	content: "";
	display: block;
	height: 10px;
	left: calc(100% + 20px);
  position: absolute;
  top: calc(50% - 5px);
	width: 40px;
}

.ourValues li:last-child {
	margin-right: 0;
}

.ourValues li:last-child .valueRing::after {
display: none;
}

.valueTitle h6 {
	font-weight: var(--wghtMed);
	letter-spacing: var(--uprCase);
	padding-top: .5rem;
	text-transform: uppercase;
}

/* About us */

.aboutLanding {
	background: url('../img/bg/about-us-main.webp') no-repeat;
	background-position-y: center;
	background-size: cover;
}

.aboutLanding h1 {
	color:var(--white);
	font-size: 3rem;
	line-height: 1.4;
	margin-bottom: 7rem;
	margin-top: 17rem;
}

.catalyst {
	background: url('../img/bg/catalyst-bg.webp') no-repeat;
  background-position: top right;
	background-size: 600px;
}

.catalyst .catDetail {
	padding-right: 5rem;
}

.catalyst .latestNews {
	border-radius:var(--mdRadii);
}


.catDetail p {
	font-size: 1.125rem;
	line-height: 1.75;
}

.sideBox {
	background-image: url('../img/bg/terrain-bg.webp');
	background-color: var(--mbLightBlue);
	background-size: 100%;
	border-radius: 12px;
}

.sideBox h5 {
	font-weight: normal;
	line-height: 1.65;
}

.industryLdr .sideBox {
	max-width: 30rem;
}

.sectors .sectorCol {
}

.sectors .sectorCol:first-child .sectorCard {
	margin-top:-120px;
}

.sectorCard {
	border: 6px solid;
	border-color: var(--mbGreyLight);
	border-radius: var(--mdRadii);
	min-height: 320px;
	padding: 2rem 8rem 1.5rem 1.75rem;
	position: relative;
}

.sectorCard h2 {
	font-size: 1.75rem;
	margin-bottom: 1.25rem;
}

.sectorCard ul {
	list-style-type: none;
	padding-left: 1.5rem;
}

.sectorCard li {
	color: var(--mbGreyMiddle);
	line-height: 1.7;
	margin-bottom: 1rem;
	position: relative;
}

.sectorCard li::before {
	background-color: var(--mbAqua);
	border-radius: 50%;
	content: "";
	height: 4px;
	left: -14px;
	position: absolute;
	top:12px;
	width: 4px;
}

.sectorCard span, .sectorCard h2 {
	color:var(--mbAqua);
}

.sectorCard span{
	font-weight: var(--wghtSemi);	
}

.cardArt {
  overflow: hidden;
  opacity: .5;
  position: absolute;
  right: 0;
  top: 20%;
  width: 20%;
}

.cardArt img {
	width: 150%;
}

.memberOf {
  align-items: flex-start;
  display: flex;
	gap: 20px;
  justify-content: center;
  list-style-type: none;
}
/* Our approach */

.approachLanding {
	background: url('../img/bg/our-approach-pg-bg.webp') no-repeat;
	background-size: cover;
}

.approachLanding h1 {
	font-size: 3.75rem;
  margin-bottom: 10rem;
  margin-top: 26rem;
}

.fourPoints h4 {
	color: var(--mbAqua);
	margin-bottom: 1rem;
}

.fourPoints p {
	font-size: 1.125rem;
	line-height: 1.75;
}

.cycleSet {
	margin-bottom: 3rem;
	position: relative;
}

.headSet h6 {
	font-size: 1.125rem;
	font-weight: var(--wghtMed);
	letter-spacing: var(--uprCase);
	line-height: 2.75rem;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}

.headSet {
	margin: 0 auto 0 auto;
  position: relative;
	text-align: center;
	width:140px;
	z-index: 2;
}


.step1 .lifeBar,.step1 path {background-color:#C0E3A0;fill:#C0E3A0;}
.step2 .lifeBar,.step2 path {background-color:#96CA2F;fill:#96CA2F;}
.step3 .lifeBar,.step3 path {background-color:#AACCF7;fill:#AACCF7;}
.step4 .lifeBar,.step4 path {background-color:#0083FA;fill:#0083FA;}
.step5 .lifeBar,.step5 path {background-color:#00427E;fill:#00427E;}

.lifeBar {
	height: 10px;
	margin-top: -27px;
	width: 100%;
}

.setContent {
	display: flex;
	padding-top: 2.5rem;
}

.setContent h2 {
	color:var(--mbMain);
	line-height: 1.4;
	margin-bottom: 0;
  width: 40%;
}

.setContent ul {
	display: flex;
  flex-flow: column wrap;
  max-height: 100px;
	padding-left: 1.25rem;
  width: 60%;
}

.setContent li {
	line-height: 2;
	width: 50%;
}

.impactPoints .artwork {
  align-items: center;
	background-image: url('../img/bg/circle-left.svg'),url('../img/bg/circle-right.svg');
	background-position: center left, center right;
	background-repeat: no-repeat,no-repeat;
	background-size: 25px;
	display: flex;
  flex-direction: column;
	height: 164px;
  justify-content: center;
	text-align: center;
	width: 164px;
}

.impactPoints li {
	text-align: center;
	width: 25%;
}

.impactPoints h5 {
	font-size: 1.125rem;
	font-weight: normal;
	line-height: 1.5;
	margin-top: 1rem;
	padding: 0 2rem;
	text-align: center;
}

.impactPoints span {
	font-weight: bold;
	color: var(--mbAqua);
}

.contactPg {
	min-height: 30rem;
}

.formWrap {
	background-color: var(--mbMain);
	background-image: url('../img/bg/blue-bg-texture.webp');
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: var(--lgRadii);
	margin-top: -10rem;
}

.formWrap label {
	color:#fff;
	font-weight: var(--wghtMed);
}

.formWrap button {
	background: #fff;
  text-transform: uppercase;
  font-weight: 600;
}

.formWrap button:hover {
	background: var(--mbAqua);
}

.formTitle {
	background:var(--mbAqua);
	border-radius: 0 0 var(--mdRadii) var(--mdRadii);
	color: #fff;
	letter-spacing: var(--uprCase);
	margin-bottom: 3rem;
	padding: 1.75rem 3rem;
	text-align: center;
	text-transform: uppercase;
  width: fit-content;
}

.formSubtitle {
	color:#fff;
	font-weight: normal;
	line-height: 1.5;
	text-align: center;
}

.address {
	margin-bottom: 4rem;
}

.address h5 {
	font-weight: normal;
	line-height: 1.5;
}







