@import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap');/* font-family:"Inter", serif;*/

:root{
	/* Theme Root */
	--theme-clr:#39cd48;
	
	/*Colors*/
	--clr-base:#ffffff;
	--clr-dark:#000000;
	--clr-action:var(--theme-clr);
	--clr-highlight:var(--theme-clr);
	
	/*Background Colors*/
	--bg-body:#000000;

	/*Fonts*/	
	--font-base:"Inter", serif;

	--main-bg:url(../landing_page_images/main-banner-bg.webp) no-repeat 0 0;
}


*{margin:0;padding:0;box-sizing:border-box;-webkit-box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-touch-callout:none;}
:focus{outline:none;}
html{height:100%;-webkit-text-size-adjust:none;overflow-x:hidden;}
body{height:100%;font-size:12px;font-family:var(--font-base);color:var(--clr-base);background:var(--bg-body);font-weight:normal;line-height:1.2;font-weight:normal;-webkit-font-smoothing:antialiased;}
a{text-decoration:none;outline:none;color:var(--clr-action);outline:none;cursor:pointer;transition:all 0.5s ease 0s;}
a:hover, a:focus{text-decoration:none;outline:none;}
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn.active.focus, .btn:hover, .btn:focus, .btn.focus{outline:none;box-shadow:none;}
img{margin:0;padding:0;max-width:100%;border:none;height:auto;}
p{font-size:14px;line-height:1.25em;color:var(--clr-base);font-weight:normal;}

/*HEADING CSS*/
h1, h2, h3, h4, h5, h6{margin:0;padding:0;display:block;color:var(--clr-dark);font-size:100%;}

/*LIST CSS*/
ul, ul li, ol, ol li{margin:0;padding:0;list-style:none;}

/*NORMAL CSS*/
::selection{background:var(--theme-clr);color:var(--clr-base);}
::-moz-selection{background:var(--theme-clr);color:var(--clr-base);}
.container{margin:0 auto;width:100%;max-width:137vmin;padding:0px 1.5vmin;}
.pull-left{float:left;}
.pull-right{float:right;}
.block{float:left;width:100%;}
.d-inline{display:inline-block;color:inherit!important;}
.event-none{pointer-events:none;}
.icon{display:inline-block;font-size:20px;vertical-align:middle;}
.hidden{display:none !important;}
.word-label{display:inline-block;}
.higlight-text{color:var(--clr-action);}
.hide-overflow{overflow:hidden;}
.disabled{pointer-events:none;opacity:0.6;filter:grayscale(0.7);}

.circle-figure{border-radius:50% !important;}
.circle-figure img{border-radius:50% !important;}

/*BUTTON CSS*/
.btn{padding:0 16px;font-size:20px;font-weight:600;text-align:center;min-height:60px;display:inline-flex;align-items:center;justify-content:center;background:#f8f8f8;color:#333;border:none;border-radius:6px;transition:all 0.5s ease 0s;grid-gap:8px;text-transform:uppercase;font-family:var(--font-base);cursor:pointer;}
.btn-base{background:var(--bg-action);color:var(--clr-base);}
.btn-base .btn-label{color:var(--clr-base);}


/*Perfect ScrollBar*/
*{scrollbar-color:var(--theme-clr) auto;}
*::-webkit-scrollbar{width:5px;border-radius:20px;height:5px;}
*::-webkit-scrollbar-track{background:transparent;}
*::-webkit-scrollbar-thumb{background-color:var(--theme-clr);border-radius:20px;width:5px;height:5px;}
/*Perfect ScrollBar*/

.main-section{float:left;width:100%;position:relative;}
.mid-wrapper{float:left;width:100%;}

/* ========================= Header CSS Start ========================= */
.header{float:left;width:100%;position:absolute;z-index:2;transition:all 0.3s ease 0s;top:0px;left:0;right:0;}
.header-outer{float:left;width:100%;padding:1.5vmin 0vmin;display:flex;align-items:center;background:#ffffff;transition:all 0.3s ease 0s;}
.header-inner{float:left;width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;}

.brand-logo{float:left;width:100%;max-width:25vmin;transition:all 0.3s ease 0s;padding:0px;}
.brand-figure{float:left;width:100%;}
.brand-figure img{float:left;width:100%;}
/* ========================= Header CSS End ========================= */

/*Home Banner CSS Start*/
.main-banner{float:left;width:100%;background:var(--main-bg);position:relative;overflow:hidden;z-index:1;background-size:cover;height:100dvh;padding:11dvh 0 0;background-position: center;}
.main-banner-inner{float:left;width:100%;position:relative;}
.banner-products{float:left;width:100%;margin-top:-6dvh;}
.banner-figures{float:right;width:90vmax;position:relative;max-width:90vmax;min-width:90vmax;}
.figure-item{position:absolute;top:0;z-index:0;float:right;width:100%;height:100%;}
.figure-item img{width:100%;}
.figure-item.item-1{position:static;}

.banner-content-inner{float:left;width:100%;max-width:73vmin;}
.banner-content{position:absolute;top:0;left:0;z-index:1;float:left;width:100%;padding-top:10vmin;}
.banner-cp-pre{float:left;width:100%;color:var(--clr-base);font-size:3vmin;line-height:1.2em;margin-top:2vmin;opacity:0.7;}
.banner-cp-title{float:left;width:100%;display:inline-flex;flex-direction:column;}
.cp-title-label{float:left;display:inline-flex;position:relative;font-size:7vmin;color:var(--clr-base);font-weight:800;line-height:1;}
.cp-title-text{position:relative;float:left;width:100%;color:var(--clr-base);}
.cp-title-head{position:relative;float:left;width:100%;text-align:left;}
.highlight{color:var(--clr-highlight);}

.banner-app-block{float:left;width:100%;padding-top:4vmin;}
.app-text{float:left;width:100%;font-size:2.4vmin;color:var(--clr-action);font-weight:500;padding-bottom:2vmin;}
.app-link-block{float:left;width:100%;}
.app-wrap{float:left;width:100%;display:flex;grid-gap:2vmin;}
.app-col{float:left;max-width:24vmin;width: 24vmin;}
.app-col-inner{float:left;width:100%;}
.app-link{float:left;width:100%;}
.app-icon-fig{float:left;width:100%;}
.app-icon-fig img{float:left;width:100%;}
.appstore-col{max-width:22vmin;width:22vmin;}

/* Copyright Start*/
.copyright-warp-inner{float:left;width:100%;padding:0px;position:fixed;bottom:0px;}
.copyright-warp{float:left;width:100%;padding:1.4vmin 0px;border-top:0.12vmin solid rgba(255, 255, 255, 0.2);}
.copyright-text{float:left;width:100%;font-size:1.6vmin;color:var(--clr-base);opacity:0.5;}
.copyright-text span{float:left;width:100%;text-align:center;}
/* CopyRight End*/
/* ========================= Footer CSS End ========================= */



/* ************************* RESPONSIVE CSS START ************************* */
@media (max-width:992px) and (orientation:landscape){
	.banner-content{padding-top: 15vmin;}
	.banner-products{margin-top:-10dvh;}
}

@media (min-width:768px) and (max-width:992px) and (orientation:portrait){
	/* Banner Section */	
	.banner-products{margin-top:-40px;}
	.figure-item.item-1{right:0vmin;}
	.figure-item{right:-10vmin;}
}

@media (max-width:767px) and (orientation:portrait){
	:root{	
		--main-bg:url(../landing_page_images/main-banner-mobile-bg.webp) no-repeat 0 0;
	}
	/* Header CSS*/
	.header-outer{padding:8px 0px;}
	.brand-logo{max-width:146px;}
	
	/* Main Banner CSS*/
	.banner-content-inner{max-width:100%;}
	.banner-figures{min-width:180%;width:100%;}
	.banner-products .figure-item.item-2{max-width:128%;width:128%;right:-5%;height:auto;}
	.banner-products .figure-item.item-1 {position:relative;width:118%;top:40px;right:-3%;}
	.main-banner-inner{min-height:calc(100dvh - 118px);display:flex;flex-direction:column;justify-content:space-evenly;}
	.banner-content{padding:0px 10px 6vmin;text-align:center;position:static;margin-top:50px;}
	.main-banner{padding:68px 0 0;;height:auto;}
	.banner-products{margin-top:-60px;}
	.banner-app-block{padding-top:16px;}
	.cp-title-label{font-size:10vmin;}
	.banner-cp-pre{font-size:4.3vmin;margin-top:6.3vmin;}
	.app-text{font-size:4.2vmin;padding-bottom:3.3vmin;}
	
	.app-wrap{justify-content:center;}
	.app-col{float:left;max-width:36.7vmin;width:36.7vmin;}
	.appstore-col{max-width:32.6vmin;width:32.6vmin;}
	.cp-title-cost,
	.cp-title-research,
	.cp-title-head{display:flex;justify-content:center;}
	.cp-title-research:before{right:0px;}
	
	.copyright-warp-inner{position:relative;}
	.copyright-warp{padding:12px 0px;border-top:1px solid rgba(255, 255, 255, 0.2);}
	.copyright-text{font-size:12px;}
}
/* ************************* RESPONSIVE CSS END ************************* */