@font-face {
  font-family: 'Nexa';
  src: url('assets/fonts/nexa/NexaText-ExtraBold.woff2') format('woff2'),
       url('assets/fonts/nexa/NexaText-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nexa';
  src: url('assets/fonts/nexa/NexaText-ExtraLight.woff2') format('woff2'),
       url('/assets/fonts/nexa/NexaText-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Open Sans';
  src: url('assets/fonts/open-sans/open-sans-latin-300-normal.woff2') format('woff2'),
       url('assets/fonts/open-sans/open-sans-latin-300-normal.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Open Sans';
  src: url('assets/fonts/open-sans/open-sans-latin-700-normal.woff2') format('woff2'),
       url('assets/fonts/open-sans/open-sans-latin-700-normal.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


body {
	background: #EBEBEB;
	color: #000;
	font-family: 'Open Sans', sans-serif;
	font-size: 20px;
	font-weight: 300;
	margin: 0;
	line-height: 1.3;
}
p, h1, h2, h3, h4, h5, h6 {
	margin: 0;
}
h1, h2, h3, h4, h5, h6 {
	line-height: 1.125;
}
ul {
	list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0;
}
b {
	font-weight: 700;
}
a {
	color: #000;
}
a:hover {
	text-decoration: none;
}
h1, h2 {
	font-family: 'Nexa', sans-serif;
	font-weight: 800;
	font-size: 30px;
	@media screen and (min-width: 600px) {
		font-size: 40px;
	}
	color: #003255;
}
a.btn {
	background: #003255;
	color: #fff;
	border-radius: 40px;
	padding: 22px 40px;
	text-decoration: none;
	display: inline-block;
	transition: all .2s ease-in-out;
}
a:hover.btn {
	background: #fff;
	color: #003255;
}


/* NAVBAR */

nav {
	padding: 30px;
	@media screen and (min-width: 600px) {
		padding: 27px 60px;
	}
	display: flex;
	justify-content: space-between;
	align-items: center;
		img {
			height: 20px;
			@media screen and (min-width: 600px) {
				height: 26px;
			}
		}
	a.logo {
		line-height: 0;
	}
}


/* CLAIM */

.claim {
	background: #64B42D;
	color: #fff;
	text-align: center;
	padding: 40px 30px;
	font-family: 'Nexa', sans-serif;
	font-weight: 800;
	font-size: 25px;
	border-bottom: 1px solid #fff;
	@media screen and (min-width: 600px) {
		padding: 80px 60px;
		font-size: 54px;
	}
	img {
		max-width: 80%;
		width: 620px;
		height: auto;
	}
}



/* FOOTER */

footer {
	background: #64B42D;
	padding: 40px 30px;
	@media screen and (min-width: 600px) {
		padding: 60px;
	}
		img {
			height: 20px;
			margin-bottom: 24px;
			@media screen and (min-width: 600px) {
				height: 26px;
			}
			@media screen and (min-width: 900px) {
				height: 35px;
			}
		}
		.row {
			@media screen and (min-width: 900px) {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
			}
			align-items: flex-start;
			gap: 24px;
			margin-bottom: 32px;
		}
		.footer-nav {
			ul {
				margin-bottom: 2em;
				@media screen and (min-width: 600px) {
					margin-bottom: 0;
				}
			}
			ul li {
				margin-bottom: 1em;
			}
			@media screen and (min-width: 900px) {
				width: 50%;
			}
			@media screen and (min-width: 600px) {
				display: flex;
				ul {
					width: 50%;
					max-width: 320px;
				}
			}
		}
}


/* WHAT WE DO */

section.whatwedo {
	background: #003255;
	color: #fff;
	h2 {
		color: #fff;
	}
	.inner {
		max-width: 1100px;
		margin: 0 auto;
		padding: 72px 30px;
	}
	.accordion {
		position: relative;
		margin-top: 20px;
		@media screen and (min-width: 600px) {
			margin-top: 60px;
		}
		input {
		  position: absolute;
		  opacity: 0;
		  z-index: -1;
		}
		label {
			cursor: pointer;
			font-family: 'Nexa', sans-serif;
			font-weight: 800;
			transition: all .2s;
			font-size: 40px;
			@media screen and (min-width: 600px) {
				font-size: 54px;
			}
		}
		label:hover {
			color: #64B42D;
		}
		.tab-content {
			height: 0;
			overflow: hidden;
			transition: all 0s;
			max-width: 560px;
			@media screen and (min-width: 900px) {
				position: absolute;
				top: 0;
				left: 360px;
				border-left: 4px solid #64B42D;
			}
		}
		input:checked ~ label {
			color: #64B42D;
		}
		input:checked ~ .tab-content {
			transition: all .2s;
			height: auto;
			padding: .5em 0 1em;
			@media screen and (min-width: 900px) {
				padding: 1em 0 1.2em 50px;
			}
		}
		.tab:not(:last-child)::after {
			display: block;
			content: ' ';
			background-image: url('assets/plus.svg');
			background-size: 36px 36px;
			height: 36px;
			width: 36px;
			margin: 10px 0;
		}
		p:not(:last-child) {
			margin-bottom: 1em;
		}
		p.highlight {
			font-family: 'Nexa', sans-serif;
			font-weight: 800;
			font-size: 23px;
			@media screen and (min-width: 900px) {
				font-size: 26px;
			}
		}
	}
}



/* TEAM */

section.team {
	.inner {
		max-width: 1100px;
		margin: 0 auto;
		padding: 72px 30px;
	}
	h2 {
		max-width: 760px;
	}
	ul {
		display: flex;
		flex-wrap: wrap;
		column-gap: 20px;
		row-gap: 40px;
		margin-top: 40px;
		li {
			@media screen and (min-width: 800px) {
				width: calc(50% - 10px);
			}
			img {
				width: 100%;
				height: auto;
			}
			img.image {
				border-bottom: 2px solid #64B42D;
				margin-bottom: .8em;
			}
			.logos img {
				width: 56px;
				height: 56px;
				@media screen and (min-width: 600px) {
					width: 70px;
					height: 70px;
				}
				@media screen and (min-width: 1100px) {
					width: 90px;
					height: 90px;
				}
			}
			h3 {
				font-weight: 700;
				color: #003255;
				font-size: 23px;
				@media screen and (min-width: 600px) {
					font-size: 26px;
				}
			}
			p.title {
				color: #003255;
			}
			p {
				margin-bottom: 1em;
				@media screen and (min-width: 800px) {
					width: 90%;
				}
			}
		}
	}
}


/* QUOTE */

section.quote {
	color: #fff;
	background-image: url("assets/images/Quote_c.jpg");
	background-size: cover;
	background-position: center center;
	.inner {
		max-width: 1220px;
		margin: 0 auto;
		display: flex;
		row-gap: 20px;
		flex-direction: column;
		div {
			background: rgba(0,25,43,.5);
			padding: 72px 30px;
			@media screen and (min-width: 1000px) {
				padding: 72px 56px;
				width: 50%;
				margin-left: 50%;
				font-family: 'Nexa', sans-serif;
				font-weight: 200;
			}
			@media screen and (min-width: 800px) {
				font-size: 20px;
			}
			p:not(:last-child) {
				margin-bottom: 1em;
			}
		}


		.highlight {
			display: block;
			margin-bottom: 16px;
			font-size: 25px;
			line-height: 1;
			@media screen and (min-width: 800px) {
				font-size: 40px;
			}
		}
	}
}

/* QUOTE 

section.quote {
	color: #fff;
	background: linear-gradient(358deg, #434850 9.51%, #899DA3 89.8%);
	@media screen and (min-width: 900px) {
		background: linear-gradient(274deg, #434850 38.63%, #899DA3 85.77%);
	}
	blockquote {
	    margin-block-start: 0;
	    margin-block-end: 20px;
	    margin-inline-start: 0;
	    margin-inline-end: 0;
			font-family: 'Nexa', sans-serif;
			font-weight: 200;
		@media screen and (min-width: 800px) {
			font-size: 20px;
		}
		.highlight {
			display: block;
			margin-bottom: 16px;
			font-size: 25px;
			@media screen and (min-width: 800px) {
				font-size: 45px;
			}
		}
	}
	p {
		font-weight: 700;
	}
	.inner {
		max-width: 1220px;
		margin: 0 auto;
		padding: 72px 30px;
		display: flex;
		row-gap: 20px;
		flex-direction: column;
		@media screen and (min-width: 900px) {
			flex-direction: row;
			div {
				width: 50%;
			}
		}
	}
	.image-container {
		display: flex;
		align-items: flex-end;
		margin: -30px 0 10px;
		@media screen and (min-width: 900px) {
			padding-top: 30px;
			margin: -72px 0 -72px 0;
		}
		img {
			max-width: 100%;
			height: auto;
			@media screen and (min-width: 900px) {
				max-width: calc(100% + 72px);
				position: relative;
				left: -72px;
			}
		}
	}
}*/



/* TEASER */

section.teaser {
	.image-container {
		display: none;
		background-position: center center;
		background-size: cover;
	}
	.text-container {
		padding: 72px 30px;
	}
	p {
		margin: 1em 0 2em;
	}
	@media screen and (min-width: 800px) {
		display: flex;
		justify-content: flex-end;
		min-height: 440px;
		div {
			width: 50%;
		}
		.text-container {
			max-width: 550px;
			padding-right: 120px;
			box-sizing: border-box;
		}
		.image-container {
			display: block;
		}
	}
}



/* LEGAL PAGES */

section.header {
	background: #003255;
	color: #fff;
	h1 {
		color: #fff;
	}
	.inner {
		max-width: 1100px;
		margin: 0 auto;
		padding: 72px 30px;
	}
}

section.text {
	.heading {
		font-weight: 700;
		color: #003255;
		font-size: 23px;
		@media screen and (min-width: 600px) {
			font-size: 26px;
		}
		color: #003255;
	}
	p:not(:first-child) {
		padding-top: 16px;
	}
	p.heading:not(:first-child) {
		padding-top: 40px;
	}
	.inner {
		max-width: 1100px;
		margin: 0 auto;
		padding: 72px 30px;
	}
}


































