@import url(../CCS/fonts.css);
:root{
    --ff-1:"SpaceMono";
    --ff-2:"LexendDeca";
    --txt-clr:#939CAA;
    --txt-ttl:#495567;
    --main-clr:#FCB72B;


}
*{
    padding: 0;
    margin: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;

}
/* HEADER START */
.header{
    max-width: 1440px;
    width: 100%;

}
.header__container{
    max-width: 1200px;
    width: 100%;
    margin: auto;

}
.container  {
    max-width: 1200px;
    width: 100%;
    margin: auto;
}
.header__nav{
    display: flex;
    width: 100%;
    
   
}
.header__list{
    display: flex;
    column-gap: 32px;
    align-items: center;
    margin-top: 36px;
    
}
.header__item{
    color: var(--txt-clr);
    font-family: var(--ff-1);
    font-size: 15px;
    line-height: 25px;
    
    

}
.header__link{
    transition: .5s ease-in-out;
}
.header__link:hover{
    color: var(--main-clr);
}

.header__logo{
    width: 107px;
    height: 28.5px;
    color: var(--txt-ttl);
    margin-right: 58px;
    margin-top: 34px;

}
.all-btn{

    background: var(--main-clr);
    color: #FFFF;
    width: 180px;
    border: 1px solid #FCB72B;
    border-radius: 2px;
    height: 53px;
    font-family: var(--ff-1);
    font-weight: 700;
    font-size: 15px;
    line-height: 25px;

}
.header__btn{
    background: var(--main-clr);
    color: #FFFF;
    width: 180px;
    border: 1px solid #FCB72B;
    border-radius: 2px;
    height: 53px;
    font-family: var(--ff-1);
    font-weight: 700;
    font-size: 15px;
    line-height: 25px;
    margin-left: 511px;
    margin-top: 22px;
    transition: .5s ease-in-out;

}
.header__btn:hover{
    background-color: #FFFFFF;
    color: var(--main-clr);
}
.header__bg{
    margin-top: 21px;
    max-width: 100%;
    height: 650px;
    background: url(../img/Bitmap.jpg) no-repeat center center / cover;
    /* position: relative; */
}
.header__bg-ttl{
    font-family: var(--ff-1);
    font-size: 56px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 56px;
    letter-spacing: -2.5px;
    font-weight: 700;
    margin-left: 165px;
    margin-top:153px;
    position: absolute;
    width: 500px;
    height: 112px;
}
.header__bg-p{
    font-family: var(--ff-2);
    font-size: 15px;
    line-height: 25px;
    margin-top: 40px;
    position: absolute;
    margin-top: 305px;
    font-weight: 400;
    width: 405px;
    height: 100px;
    color: #FFFFFF;
    margin-left: 260px;


   

}
.header__bg-path1{
    position: absolute;
    margin-top: 353px;
    margin-left: 0.5px;

}
.header__bg-path2{
    position: absolute;
    margin-top: 339px;
    margin-left: 692px;
    

}
.header__bg-btn{
    margin-top: 460px;
    margin-left: 260px;
    position: absolute;
    transition: .3s ease-in-out;

}
.header__bg-btn:hover{
    background-color: var(--txt-ttl);
    color: var(--main-clr);
}
/* HEADER END */
/* SECTION START */






.menu{
   margin-top: 160px;
}
.menu__cards{
    display: flex;
    justify-content: space-between;


}


.menu__card-ttl{
    font-family: var(--ff-1);
    font-size: 24px;
    font-weight: 700;
    line-height: 28px;
    margin-top: 40px;
    color: var(--txt-ttl);
}
.menu__card-p{
    width: 350px;
    height: 100px;
    font-family: var(--ff-2);
    font-size: 15px;
    font-weight: 400;
    line-height: 25px;
    margin-top: 27px;
    color: var(--txt-clr);
}
/* SECTION END */


/* MENU START */
.about{
    margin-top: 200px;
}
.about__gg{
    display: flex;
    column-gap: 50px;
    margin: 50px;

}
.about__ttl{
     /* width: 445px;
    height: 96px;  */
    font-family: var(--ff-1);
    font-size: 48px;
    font-weight: 700;
    line-height: 48px;
    color: var(--txt-ttl);
    margin-bottom: 24px;
     
}
.about__p{
    width: 445px;
    height: 100px;
    font-family: var(--ff-2);
    font-weight: 400;
    font-size: 15px;
    line-height: 25px;
    color: var(--txt-clr);
    margin-bottom: 40px;
    text-align: justify;
}
.about__img2{
    margin-left: -50px;
    margin-right: 60px;
}
.about__btn{
    transition: .5s ease-in-out;
}
.about__btn:hover{
    background: #FFFFFF;
    color: var(--main-clr);
}
.about__img3{
    margin-left: 150px;
}

/* FOOTER START */
.footer{
    width: 1440px;
   
}

.footer__img-sect{
    background-image: url(../img/Mask.png);
    display: flex;
    height: 300px;
    column-gap: 335px;
    padding: 0 165px;
    max-width: 1400px;
    width: 100%;
}
.footer__ttl{
    width: 415px;
    height: 96px;
    font-family: var(--ff-1);
    font-weight: 700;
    font-size: 48px;
    line-height: 48px;
    color: #FFFFFF;
    margin-top: 102px;
    

}
.footer__apps{
    display: flex;
    column-gap: 20px;
    margin-top: 122px;

}
.app__img{
    width: 160px;
    height: 55px;
}
.footer__cont{
    width: 1440px;
    background: #333A44;
    padding: 35px 0 ;
}


.footer__cont-exp{
    display: flex;
    column-gap: 571px;
}
.footer__link{
    color: #939CAA;
}
.footer__logo{
   color:  #FFFFFF;
   margin-left: 168px;
}
