@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
:root {
    --orange: #F36138;
    --font-manrope: "Manrope", sans-serif;
    --fon-jost: "Jost", sans-serif;
}

body{padding: 0;margin: 0;background-color: #000;}
h1, h2, h3, h4, h5, h6, p{margin-bottom: 0;}
ul{list-style: none;padding-left: 0;margin-bottom: 0;}
a{text-decoration: none;}
p{color: #FFF;text-align: center;font-family: var(--fon-jost);font-size: 30px;font-style: normal;font-weight: 400;line-height: normal;}
.txt-white{color: #fff!important;}
.txt-blue{color: var(--orange)!important;}
.o-gradiant-txt{background: linear-gradient(180deg, #F36339 26.03%, #F9A13E 54.75%, #F36138 22.99%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.g-60{gap: 60px;}
.g-10{gap: 10px;}
.g-20{gap: 20px;}
.g-30{gap: 30px;}
.form-control:focus{box-shadow: unset;border: 1px solid var(--blue)!important;}
.btn-orange{color: #0D1432; border-radius: 80px;background: #F36138;padding: 12px 27px;font-family: var(--fon-jost);font-size: 18px;font-style: normal;font-weight: 400;line-height: normal;}
.sub-heading{color: #FFF;text-align: center;font-family: var(--font-manrope);font-size: 80px;font-style: normal;font-weight: 600;line-height: normal;}
.p-top{padding-top: 76px;}
.m-top{margin-top: 100px;}
.m-bot{margin-bottom: 100px;}




/* HEADER */
header{background-color: #000;padding-top: 12px;padding-bottom: 12px;}
header .container{border-bottom: 1px solid #1D1E20;}
header .navbar .nav-link{padding-left: 20px !important;padding-right: 20px !important;color: #959595;font-family: var(--fon-jost);font-size: 20px;font-style: normal;font-weight: 500;line-height: normal;}
header .navbar .nav-link:hover{color: var(--orange);}
header .nav-link.active{color: var(--orange)!important;}
 header .phoneROw{margin-left: 20px;}
header .navbar-toggler{box-shadow: unset;outline: o;border: 0;}
header .navbar-toggler:focus{outline: 0;box-shadow: unset;}
header .offcanvas .nav-link{color: #000;font-family: var(--fon-arial);font-size: 18px;font-style: normal;font-weight: 400;line-height: normal;}
header .offcanvas .phoneROwMobile{margin-top: 32px;}
header .top-header a{display: flex;align-items: center;gap: 5px;color: #959595;font-family: var(--fon-jost);font-size: 14px;font-style: normal;font-weight: 500;line-height: normal;}
header .top-header a:hover{color: var(--orange);}
.page-header.is-sticky {position: fixed;box-shadow: 0 5px 16px rgba(0, 0, 0, 0.1);padding: 0;animation: slideDown 0.35s ease-out;width: 100%;z-index: 9999;padding: 8px 0px;top: 0;}
.page-header.is-sticky .top-header{display: none;}
@keyframes slideDown {
    from {
      transform: translateY(-100%);
    }
    to {
      transform: translateY(0);
    }
}




/* HERO SECTION */
.heroSec{padding-top: 71px;position: relative;background: url(../img/hero-bg.png) no-repeat center center / cover;}
.heroSec h1{position: relative;z-index: 99; color: #FFF;text-align: center;font-family: var(--font-manrope);font-size: 80px;font-style: normal;font-weight: 400;line-height: 90px;max-width: 916px;margin: auto;}
.heroSec p{margin-top: 13px; position: relative;z-index: 99; color: #DDD;text-align: center;}
.heroSec .glow{position: absolute;top: 0;right: 0;left: 0;right: 0;margin: auto;}
.heroSec .circle{position: absolute;top: 0;right: 0;left: 0;right: 0;margin: auto;}
.heroSec .mob-hand{position: absolute;left: 0;right: 0;bottom: 0;margin: auto;z-index: 999;}
.heroSec .banner-vector{position: relative; z-index: 99;}
.heroSec .app-store{position: relative;z-index: 999;margin-top: 75px;}


/* TOP SECTION  */
.topSec .w-box{border: 1px solid #000;border-radius: 30px;padding: 30px;}
.topSec .w-box:hover{border: 1px solid var(--orange)}
.topSec .w-box h6{margin-top: 24px;margin-bottom: 24px;color: #A8A8A8;text-align: center;font-family: var(--font-manrope);font-size: 30px;font-style: normal;font-weight: 600;line-height: 27px;}
.topSec .w-box p{color: #A8A8A8;text-align: center;font-size: 20px;line-height: 27px;}
.topSec .w-box p span{font-weight: 600;}


/* FEATURED SECTION */
.featuredSec{position: relative;}
.featuredSec .left-w-mrk{position: absolute;left: 0;bottom: 0;}
.featuredSec .container{position: relative;z-index: 99;}
.featuredSec p{max-width: 542px;width: 100%;margin: auto;}
.featuredSec .tag{color: #D9D9D9;font-family: var(--fon-jost);font-size: 16px;font-style: normal;font-weight: 700;line-height: 16px;text-transform: uppercase;}
.featuredSec h3{color: #fff;font-family: var(--font-manrope);font-size: 48px;font-style: normal;font-weight: 700;line-height: 56px;letter-spacing: -0.96px;}
.featuredSec .mob-vector{position: relative;z-index: 999;}
.featuredSec .glow{position: absolute;top: 0;right: 0;left: 0;right: 0;margin: auto;}
.accordion-button{padding: 0;background-color: unset!important;color: #D9D9D9;font-family: var(--font-manrope);font-size: 22px;font-style: normal;font-weight: 500;line-height: 24px;display: flex;align-items: center;gap: 23px;}
.accordion-item{padding: 32px 26px; background-color: unset;border: 1px solid transparent;border-radius: 20px;border-top-left-radius: 20px!important;border-top-right-radius: 20px!important;}
.accordion{margin-top: 36px;}
.accordion-button:not(.collapsed){box-shadow: unset;color: #F99F3E;}
.accordion-item:not(:has(.collapsed)) {border: 1px solid var(--orange);}
.accordion-button:focus{box-shadow: unset!important;}
.accordion-body{padding: 0;padding-left: 60px;}
.accordion-body p{font-size: 18px;color: #D9D9D9;text-align: left;}


/* BENEFITS SECTION  */
.benefitSec{position: relative;}
.benefitSec .glow-w{position: absolute;z-index: 9;top: 0;width: 100%;height: 100%;}
.benefitSec .box{border-radius: 48px;background: #1B1D23;padding: 54px 54px 0px 54px;position: relative;z-index: 99;}
.benefitSec .w-mark{-webkit-text-stroke-width: 1;-webkit-text-stroke-color: rgba(61, 61, 61, 0.20);font-family: var(--font-manrope);font-size: 150px;font-style: normal;font-weight: 800;line-height: 56px;letter-spacing: -0.96px;position: absolute;}
.benefitSec .box .tag{color: #D9D9D9;font-family: var(--fon-jost);font-size: 16px;font-style: normal;font-weight: 700;line-height: 16px;text-transform: uppercase;position: relative;z-index: 99;margin-bottom: 20px;}
.benefitSec .box h2{color: #E6E8EC;font-family: var(--font-manrope);font-size: 35px;font-style: normal;font-weight: 700;line-height: 47px;letter-spacing: -0.96px;position: relative;z-index: 99;}
.benefitSec .box ul li{display: flex;gap: 20px;margin-bottom: 25px;align-items: start;position: relative;z-index: 99;}
.benefitSec .box ul li h6{color: #F99F3E;font-family: var(--font-manrope);font-size: 18px;font-style: normal;font-weight: 700;line-height: 24px;margin-bottom: 8px;position: relative;z-index: 99;}
.benefitSec .box ul li p{color: #D9D9D9;font-family: var(--fon-jost);font-size: 18px;font-style: normal;font-weight: 400;line-height: 20px;text-align: left;position: relative;z-index: 99;}
.benefitSec .t-card{border-radius: 32px; background: #141416;box-shadow: 0px 40px 32px -24px rgba(15, 15, 15, 0.12);padding: 48px;}
.benefitSec .t-card .description{color: #E6E8EC;font-family: var(--fon-jost);font-size: 24px;font-style: normal;font-weight: 400;line-height: 32px;letter-spacing: -0.24px;margin-bottom: 43px;}
.benefitSec .t-card .name{color: #E6E8EC;font-family: var(--font-manrope);font-size: 14px;font-style: normal;font-weight: 700;line-height: 24px;}
.benefitSec .t-card .name span{color: #3772FF;}
.benefitSec .t-card .designation{color: #777E90;font-family: var(--fon-jost);font-size: 12px;font-style: normal;font-weight: 400;line-height: 20px;}
.benefitSec .t-card .avatar{width: auto;}
.benefitSec .t-card .quote{ color: #E6E8EC;font-family: var(--font-manrope);font-size: 24px;font-style: normal;font-weight: 600;line-height: 32px;margin-bottom: 39px;display: block;}



/* MOBILE CAROOUSEL  */
.mobileCarouselSec #mobileCarousel{margin-top: 110px;}
.mobileCarouselSec #mobileCarousel img{width: 391px;border-radius: 54px;border: 5px solid #fff;height: 760px;object-fit: cover;}
.mobileCarouselSec .owl-nav {position: absolute;top: 45%;width: 100%;display: flex;justify-content: space-between;transform: translateY(-50%);}
.mobileCarouselSec .owl-nav button.owl-prev, .mobileCarouselSec .owl-nav button.owl-next {color: #D9D9D9 !important;border: 2px solid #D9D9D9 !important;width: 38px;height: 38px;border-radius: 50px !important;font-size: 26px !important;display: flex !important;justify-content: center;align-items: center;line-height: 20px !important;}
.mobileCarouselSec .owl-nav button.owl-prev:hover, .mobileCarouselSec .owl-nav button.owl-next:hover{background: var(--orange)!important;} 
.mobileCarouselSec .owl-theme .owl-dots .owl-dot span{background: #D0E5F599!important;}
.mobileCarouselSec .owl-theme .owl-dots .owl-dot.active span{background: #F99F3E!important;}
.mobileCarouselSec .owl-nav button.owl-prev span, .mobileCarouselSec .owl-nav button.owl-next span{margin-top: -7px;}
.mobileCarouselSec .owl-nav button.owl-prev {left: -50px;position: absolute;}
.mobileCarouselSec .owl-nav button.owl-next {right: -50px;position: absolute;}
.mobileCarouselSec .owl-dots{margin-top: 54px;}
.mobileCarouselSec .owl-item{opacity: 0.3;}
.mobileCarouselSec .owl-item.active.center{opacity: 1;}


/* BOTTOM BANNER SECTION */
.btmBannerSec{margin-top: 180px;}
.btmBannerSec .orangeBox{padding: 77px 34px; max-width: 1230px;margin: auto; border-radius: 60px;background: linear-gradient(180deg, #F36339 -26.03%, #F9A13E 54.75%, #F36138 122.99%);box-shadow: 0px 3px 20px 0px rgba(137, 137, 137, 0.20);}
.btmBannerSec h2{font-family: var(--font-manrope);font-size: 48px;font-style: normal;font-weight: 700;line-height: 56px;letter-spacing: -0.96px;background: linear-gradient(180deg, #0D1432 0%, #0B0C19 100%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.btmBannerSec p{margin-top: 24px;margin-bottom: 24px; font-family: var(--fon-jost);font-size: 22px;font-style: normal;font-weight: 400;line-height: 24px;text-align: left;background: var(--BG, linear-gradient(180deg, #0D1432 0%, #0B0C19 100%));background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.btmBannerSec .btm-banner-img{margin-top: -140px;}


/* FOOTER  */
footer{background: #000;position: relative;}
footer .container{position: relative;z-index: 99;}
footer .ft-menu{display: flex;align-items: center;justify-content: center; flex-wrap: wrap;gap: 30px;margin-top: 54px;}
footer .ft-menu li a, footer .ft-menu li span{display: flex;align-items: center;gap: 8px;color: #717171;font-family: var(--fon-jost);font-size: 22px;font-style: normal;font-weight: 500;line-height: 24px;}
footer .ft-menu li a:hover, footer .ft-menu li span:hover{color: var(--orange);}
footer .socialMenu{display: flex;align-items: center;justify-content: center; flex-wrap: wrap;gap: 30px;margin-top: 32px;}
footer .socialMenu li a{display: flex;justify-content: center;align-items: center;border-radius: 32px;width: 40px;height: 40px;padding: 12px;background: #141416;}
footer .socialMenu li a:hover{background: var(--orange);}
footer hr{opacity: 1;margin: 0;margin-top: 43px;border-color: #262626;}
footer .ft-copyRight p{color: #B1B4BC;opacity: 0.4;font-size: 18px;line-height: 20px;}
footer .ft-left-w{position: absolute;left: 0;top: 0;}
footer .ft-right-w{position: absolute;right: 0;bottom: 0;}


/* CONTENT SECTION  */
.contentSec{margin-top: 64px;margin-bottom: 120px;}
.contentSec p{font-size: 24px;text-align: left;}
.contentSec h3{color: #fff;margin-top: 30px;margin-bottom: 18px;}
.contentSec ul li{color: #fff;}

/* POPUP CSS */
.lightbox {
  background-color: #00000099;  
  overflow-y: scroll;
  position: fixed;
  display: none;
  z-index: 1;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  z-index:9999;
}  
.lightbox-container {
    position: relative;
    max-width: 960px;
    margin: 7% auto;
    display: block;    
    padding: 0 3%;
    height: auto;
    z-index: 10;
}    
    
@media screen and (max-width: 768px) { .lightbox-container{margin-top: 10%;}}
@media screen and (max-width: 414px) { .lightbox-container{margin-top: 13%;}}
  
    
.lightbox-content {
    box-shadow: 0 1px 6px fade(black, 70%);
}
  
.lightbox-close {
    text-transform: uppercase;    
    background: transparent;
    position: absolute; 
    font-weight: 300;      
    font-size: 12px;
    display: block;
    border: none;
    color: white;
    top: -22px;
    right: 3%;
}


.video-container {  
    padding-bottom: 56.25%;
    position: relative;  
    padding-top: 30px; 
    overflow: hidden;
    height: 0; 
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    height: 100%;  
    width: 100%;  
    left: 0;  
    top: 0;
}

#playme{
	z-index: 999;
    position: absolute;
    background: unset;
    border: 0;
    left: 0;
    right: 0;
    bottom: 40px;
    margin: auto;
    width: max-content;
    display: flex;
    justify-content: center;
    height: 100%;
    align-items: center;
}


::placeholder{
    color: #808080!important;
    opacity: 1!important;
}

