/* GLOBAL */ 
*{
	overscroll-behavior: none;
}

html,body{
	background-color:#111111;
	font-family:"Work Sans", sans-serif;
	font-weight:400;
	-webkit-overflow-scrolling:none;
	overscroll-behavior: none;
}

/*html, body {margin: 0; height: 100%; overflow: hidden}*/

/* COLORS */ 
.text-purple{color:#8A66FF !important;}

.site-container{
	min-height:100vh;
}

/* HEADER */ 

.site-logo{
	height:45px;
	left:16px;
	position:fixed;
	top:40px;
	width:127px;
	z-index:150000;
}
.site-logo > img{
	display:block;
	height:45px;
	width:127px;
}
@media only screen and (min-width: 45em) { /* 720px */
	.site-logo{
		height:45px;
		left:50%;
		top:24px;
		transform:translateX(-63px);
		width:127px;
	}
	.site-logo > img{
		height:45px;
		width:127px;
	}
}

.nav-icon{
	height:45px;
	right:16px;
	position:fixed;
	top:64px;
	width:36px;
	z-index:10001;
}

a.menu-open{
	background:url('../images/icon-menu-open.svg') center center no-repeat;
	background-size:36px 36px;
	height:40px;
	right:20px;
	position:fixed;
	text-decoration:none;
	top:42px;
	width:40px;
	z-index:10900;
}

@media only screen and (min-width: 45em) { /* 720px */
	a.menu-open{
		right:40px;
		top:28px;
	}
}

a.menu-back{
	background:url('../images/back-arrow.svg') center center no-repeat;
	background:url('../images/box-close-btn.svg') center center no-repeat;
	background-size:36px 36px;
	background-size:28px 28px;
	height:40px;
	left:auto;
	position:fixed;
	right:70px;
	text-decoration:none;
	top:42px;
	width:40px;
	z-index:10900;
}

@media only screen and (min-width: 45em) { /* 720px */
	a.menu-back{
		left:40px;
		right:auto;
		top:24px;
	}
}

.main-nav{
	background-color:#111111;
	bottom:0;
	display:none;
	left:0;
	opacity:0;
	overflow-y:scroll;
	position:fixed;
	right:-20px;
	top:0;
	transition:opacity 0.25s;
	z-index:12000;
}
.main-nav.open{
	display:block;
	opacity:1;
}
.main-nav > .inner{
	align-items: center;
	display:flex;
	height:101%;
	justify-content:center;
}
.main-nav ul{
	list-style-type:none;
	margin:0;
	padding:20px;
}
.main-nav ul li{
	color:#fff;
	margin:6px 0;
	padding:10px 0;
}
@media only screen and (min-width: 45em) { /* 720px */
	.main-nav ul li{
		margin:12px 0;
	}
}
.main-nav ul li a{
	color:#fff;
	display:block;
	font-size:40px;
	font-weight:400;
	letter-spacing:-0.02em;
	line-height:1.1em;
	text-align: center;
	text-decoration: none;
}

.main-nav a.close-btn{
	align-items: center;
	background:url('../images/icon-menu-close.svg') center center no-repeat;
	background-size:36px 36px;
	box-sizing:border-box;
	height:40px;
	position:absolute;
	right:24px;
	text-decoration:none;
    top:44px;
	width:40px;	
}

@media only screen and (min-width: 45em) { /* 720px */

	.main-nav a.close-btn{
		right:40px;
		top:28px;
	}

}

.main-nav .connect-button a{
	align-items: center;
	background:url('../images/connect-btn-border.svg') center center no-repeat;
	background-size:340px 95px;
	box-sizing:border-box;
	color:#8A66FF;
	display:flex;
	font-size:40px;
	height:104px;
	justify-content: center;
	margin: 0 0 0 auto;
	padding:12px 16px;
	text-align:center;
	text-decoration:none;
	transition: background-size 0.25s;
	width:340px;
}

.main-nav .connect-button a:hover{
	background-size:320px 103px;
}

@media only screen and (min-width: 45em) { /* 720px */

	.main-nav .connect-button a{
		background-size:399px 110px;
		font-size:40px;
		height:120px;
		padding:12px 16px;
		width:399px;
	}

	.main-nav .connect-button a:hover{
		background-size:380px 120px;
	}

}

a.nav-more-info-link span{
	background:url('../images/icon-new-tab.svg') center right no-repeat;
	background-size:20px auto;
	display:inline-block;
	padding-right:32px;
}

@media only screen and (min-width: 45em) { /* 720px */
		a.nav-more-info-link span{
		background:url('../images/icon-new-tab.svg') center right no-repeat;
		background-size:28px auto;
		padding-right:42px;
	}
}




.global-content{
	margin:0 auto;
	max-width:1240px;
	padding:136px 20px 24px 20px;
}

.global-content.max-800{
	max-width:846px;
}

.global-content hr{
	appearance:none;
	background-color:rgba(255,255,255,0.2);
	border:0;
	height:1px;
	margin:1.5rem 0;
	overflow:hidden;
}

.global-content h1{
	color:#fff;
	font-size:2rem;
	font-weight:900;
	line-height:1.2em;
	margin:0 0 1.5rem 0;
	text-align:center;
	text-transform:uppercase;
}

.global-content h2{
	color:#fff;
	font-size:1.5rem;
	font-weight:600;
	line-height:1.2em;
	margin:1rem 0;
	text-align:center;
}

.capabilities{
	display:flex;
	flex-wrap:wrap;
	gap:0 0;
	justify-content: center;
	margin:1.5rem 0;
}

.capabilities > span{
	background-color:#8A66FF;
	border-radius:12px;
	color:#ffffff;
	display:inline-block;
	font-size:16px;
	margin:2px 0;
	padding:4px 5px 3px 5px;
}
@media only screen and (min-width: 45em) { /* 720px */
	.capabilities > span{
		margin:3px 0;
		padding:4px 8px 3px 8px;
	}
}

.articles{
	display:block;
	margin:1rem auto;
	max-width:360px;

}

.articles > article{
	border-bottom:1px solid rgba(255,255,255,0.2);
	border-radius:6px;
	margin:1.5rem 0;
	overflow: hidden;
}

.articles > article a{
	display:block;
	text-decoration:none;
}

.articles > article a span.img{
	display:block;
	height:230px;
	overflow:hidden;
	width:100%;
}
.articles > article a span.img img{
	object-fit:cover;
}

.articles > article a span.heading{
	color:#fff;
	display:block;
	font-size:1.25rem;
	font-weight:600;
	line-height:1.2em;
	margin:0.875rem 0 0.5rem 0;
}

.articles > article a span.date{
	color:#fff;
	display:block;
	font-size:1rem;
	font-weight:300;
	line-height:1.2em;
	margin:0.5rem 0 0.875rem 0;
}

@media only screen and (min-width: 45em) { /* 720px */

	.articles{
		align-items: stretch;
		display:flex;
		flex-wrap: wrap;
		gap:1.2%;
		max-width:1200px;
	}

	.articles > article{
		border-bottom:0px;
		flex:0 1 auto;
		margin:0 0 1.5rem 0;
		width:24.1%;
	}

}

.contact-page-form{
	margin:0 auto;
	max-width:420px;
}

.contact-page-form .form-group{
	margin:1.5rem 0;
}

.contact-page-form .form-group label{
	color:#fff;
	display:block;
	font-size:1.25rem;
	font-weight:400;
	line-height:1.2em;
	margin:0rem 0 0.75rem 0;
	text-align:center;
}
.contact-page-form .form-group input{
	background-color:#111111;
	border:1px solid #fff;
	border-radius:6px;
	color:#fff;
	display:block;
	font-size:1rem;
	font-weight:400;
	padding:6px 12px;
	width:100%;
}
.contact-page-form textarea{
	background-color:#111111;
	border:1px solid #fff;
	border-radius:6px;
	color:#fff;
	display:block;
	font-size:1rem;
	font-weight:400;
	padding:6px 12px;
	width:100%;
}
.contact-page-form .form-group button{
	background-color:#111111;
	border:1px solid #fff;
	border-radius:6px;
	color:#fff;
	cursor:pointer;
	display:block;
	font-size:1rem;
	font-weight:700;
	margin:0 auto;
	padding:6px 12px;
	text-align:center;
	width:100px;
}

.contact-form-container .form-group button:hover{
	background-color:#fff;
	border:1px solid #fff;
	color:#111111;
}

.contact-form-container .alert{
	color:#fff;
	display:block;
	font-size:1.25rem;
	font-weight:700;
	line-height:1.2em;
	margin:1rem 0;
	text-align:center;
}

/* Thank You Container */

.thank-you-container{
	border:1px solid #8A66FF;
	border-radius:24px;
	margin:0 auto;
	max-width:320px;
	padding:20px;
	width:92%;
}

.thank-you-container h1{
	text-align: center;
}

.thank-you-container .thank-you-img{
	text-align: center;
}

.thank-you-container .thank-you-img img{
	margin:20px auto;
}

.thank-you-container p{
	color:#fff;
	font-size:1.5rem;
	letter-spacing:-0.02em;
	line-height:1.5em;
	text-align: center;
}

.thank-you-close-btn{
	text-align:right;
}

.thank-you-close-btn a{
	text-decoration:none;
}

.thank-you-close-btn a img{
	display:inline-block;
}

@media only screen and (min-width: 45em) { /* 720px */

	.desktop-center{
		align-items:center;
		display:flex;
		height:100vh;
		height:100dvh;
		justify-content:center;
	}

	.global-content.desktop-center{
		padding:64px 0;
	}

	.thank-you-container{
		max-width:494px;
	}

}