*{
	transition: .4s ease;
	font-family: "Golos Text", serif;
	font-optical-sizing: auto;
	font-style: normal;
}
body{
	margin: 0;
	padding: 0;
}

#master{
	display: flex;
	flex-direction: column;
	position: relative;
	background: white;
	padding-bottom: 5vw;
}
#master button{
	background: #1D7382;
	color: white;
	border: none;
	border-radius: 0.5vw;
	padding: 0.8vw 1.5vw;
	font-size: 0.8vw;
	cursor: pointer;
}
#master button:hover{
	background: #2BB5D2;
}
#master button:disabled{
	opacity: .6;
}
#master .section-title{
	width: fit-content;
	font-size: 0.9vw;
	font-weight: 500;
	color: #020105;
}
#master .section-title:after{
	content: '';
	display: block;
	width: 100%;
	height: 0.2vw;
	background: #2BB5D2;
}

#master #modal{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	visibility: hidden;
	opacity: 0;
}
#master .modal-visible{
	visibility: visible !important;
	opacity: 1 !important;
}
#master #modal .modal-cover{
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: black;
	opacity: .5;
}
#master #modal form{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.6vw;
	min-width: 20vw;
	max-width: 20vw;
	background: white;
	padding: 1vw;
	border-radius: 0.5vw;
	text-align: center;
}
#master #modal form .status-icon{
	font-size: 2vw;
	color: green;
}
#master #modal form .status-icon-fail{
	color: darkred;
}
#master #modal form span{
	font-size: 0.8vw;
	line-height: 1.25vw;
}

#master #home-section{
	display: flex;
	flex-direction: column;
	position: relative;
	margin: 1vw;
	width: 98vw;
	background: #EEEEEE;
	border-radius: 1vw;
	overflow: hidden;
}
#master #home-section .pattern{
	position: absolute;
	top: 0;
	right: 0;
	z-index: 9;
}
#master #home-section nav{
	position: relative;
	z-index: 99;
	display: flex;
	align-items: center;
	width: 70vw;
	margin: 0 auto;
	padding: 1.5vw;
}
#master #home-section nav img{
	height: 3.5vw;
}
#master #home-section nav .menu-list{
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 1.8vw;
}
#master #home-section nav .menu-list a{
	font-size: 0.8vw;
	color: black;
	text-decoration: none;
	opacity: .5;
	font-weight: 500;
}
#master #home-section nav .menu-list a:hover{
	opacity: 1;
	color: #2BB5D2;
}
#master #home-section nav button{
	margin-left: auto;
}
#master #home-section .home-section-hero{
	position: relative;
	z-index: 99;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align-last: center;
	width: fit-content;
	margin: 6.6vw auto;
	margin-bottom: 0;
}
#master #home-section .home-section-hero h1{
	font-size: 3.3vw;
	margin: 0;
	font-weight: 500;
	margin-bottom: 1.5vw;
}
#master #home-section .home-section-hero small{
	font-size: 0.8vw;
	color: grey;
}
#master #home-section .home-section-hero button{
	width: fit-content;
	margin-top: 1.5vw;
}
#master #home-section .home-section-demo{
	position: relative;
	z-index: 99;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 3vw;
}
#master #home-section .home-section-demo img{
	width: 70vw;
	border-top: 2px solid #CCC;
	border-left: 2px solid #CCC;
	border-right: 2px solid #CCC;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
}

#master #about-section{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 5vw;
	width: 70vw;
	margin: 0 auto;
	margin-top: 6.25vw;
}
#master #about-section img{
	width: 25vw;
}
#master #about-section .about-section-meta{
	width: 35vw;
	display: flex;
	flex-direction: column;
	gap: 1vw;
}
#master #about-section .about-section-meta h1{
	margin: 0;
	font-weight: 500;
	font-size: 1.25vw;
	line-height: 1.8vw;
}
#master #about-section .about-section-meta small{
	font-size: 0.8vw;
	line-height: 1.5vw;
	color: #5D5D5F;
	text-align: justify;
}

#master #about-cards{
	margin: 0 auto;
	margin-top: 6.25vw;
	width: 98vw;
	display: flex;
	flex-direction: column;
	background: #020105;
	border-radius: 1vw;
	overflow: hidden;
}
#master #about-cards .about-cards-wrapper{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 4vw 15vw;
}
#master #about-cards .about-cards-wrapper img{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
#master #about-cards .about-cards-wrapper h1{
	font-size: 1.5vw;
	font-weight: 500;
	color: white;
	margin: 0;
	position: relative;
}
#master #about-cards .about-cards-wrapper .cards-container{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-column-gap: 1vw;
	margin-top: 3vw;
	position: relative;
}
#master #about-cards .about-cards-wrapper .cards-container .feature-card{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 0.8vw;
	padding: 1vw;
	padding-top: 3vw;
	color: white;
	background: #1A191E;
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 0.5vw;
}
#master #about-cards .about-cards-wrapper .cards-container .feature-card i{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1vw;
	color: #2BB5D2;
}
#master #about-cards .about-cards-wrapper .cards-container .feature-card span{
	font-size: 1vw;
	font-weight: 500;
	line-height: 1.5vw;
}
#master #about-cards .about-cards-wrapper .cards-container .feature-card small{
	font-size: 0.8vw;
	line-height: 1.25vw;
	opacity: 0.6;
}

#master #how-it-works-section{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 5vw;
	margin: 0 auto;
	margin-top: 6.25vw;
	width: 70vw;
}
#master #how-it-works-section .how-it-works-section-meta{
	display: flex;
	flex-direction: column;
	gap: 1vw;
}
#master #how-it-works-section .how-it-works-section-meta h1{
	margin: 0;
	font-weight: 500;
	font-size: 2vw;
	line-height: 2.5vw;
}
#master #how-it-works-section .how-it-works-section-meta small{
	font-size: 0.8vw;
	line-height: 1.25vw;
	color: #5D5D5F;
}
#master #how-it-works-section .how-it-works-section-meta .feature-card{
	display: flex;
	gap: 1vw;
	background: #EEEEEE;
	border-left: 0.4vw solid #1D7382;
	padding: 1.25vw;
	border-radius: 1vw;
}
#master #how-it-works-section .how-it-works-section-meta .feature-card span{
	width: 2vw;
	height: 2vw;
	aspect-ratio: 1/1;
	background: white;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px;
	color: #1D7382;
}
#master #how-it-works-section .how-it-works-section-meta .feature-card .feature-card-details{
	display: flex;
	flex-direction: column;
	gap: 0.5vw;
}
#master #how-it-works-section .how-it-works-section-meta .feature-card .feature-card-details strong{
	font-weight: 500;
	font-size: 0.9vw;
}
#master #how-it-works-section .how-it-works-section-image{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30vw;
}
#master #how-it-works-section .how-it-works-section-image img{
	width: 100%;
}

#master #section-separator{
	margin-top: 6.25vw;
	background: #EEEEEE;
	width: 100vw;
	height: 10vw;
	box-shadow:
		inset 0px 0px 10px rgba(0, 0, 0, 0.005),
		inset 0px 0px 80px rgba(0, 0, 0, 0.01);
}

#master #contact-section{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 5vw;
	width: 70vw;
	margin: 0 auto;
	margin-top: 6.25vw;

}
#master #contact-section .contact-section-meta{
	display: flex;
	flex-direction: column;
	align-items: end;
	gap: 0.6vw;
}
#master #contact-section .contact-section-meta img{
	width: 2vw;
}
#master #contact-section .contact-section-meta h1{
	margin: 0;
	font-weight: 500;
	font-size: 2vw;
	line-height: 2.5vw;
}
#master #contact-section .contact-section-meta small{
	font-size: 0.8vw;
	line-height: 1.25vw;
	color: #5D5D5F;
}
#master #contact-section .contact-section-meta .contact-socials{
	display: flex;
	align-items: center;
	gap: 0.8vw;
}
#master #contact-section .contact-section-meta .contact-socials a{
	font-size: 1vw;
	color: black;
	text-decoration: none;
	opacity: .6;
}
#master #contact-section .contact-section-meta .contact-socials a:hover{
	opacity: 1;
	color: #2BB5D2;
}
#master #contact-section .contact-section-form{
	display: flex;
	flex-direction: column;
	gap: 0.6vw;
}
#master #contact-section .contact-section-form input{
	padding: 0.6vw 1vw;
	border: 2px solid #DDDDDD;
	border-radius: 0.4vw;
	font-size: 0.8vw;
}
#master #contact-section .contact-section-form input:focus{
	outline: none;
	border-color: #2BB5D2;
}
#master #contact-section .contact-section-form .agreement-group{
	display: flex;
	align-items: center;
	gap: 0.5vw;
}
#master #contact-section .contact-section-form .agreement-group input{
	accent-color: #2BB5D2;
}
#master #contact-section .contact-section-form .agreement-group label{
	font-size: 0.8vw;
	color: #020105;
}