* { 
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.home{
    color: #F8971F;
}
.ti{
    color: #383E54;
    font-size: 18px;
}
.logo{
    display: flex;
    position: relative;
    left:35px;
    gap: 5px;
}
.link{
    display: flex;
    gap: 32px;
}
.but{
    display: flex;
    margin-right: 35px;
    gap: 8px;
}
nav {
    padding: 20px 30px;
    display: flex;
    align-items: center; 
    gap: 32px;
    border-bottom: 1px solid #EBEBEB;
    justify-content: space-between;
    font-family: 'Poppins',sans-serif;
}

nav a {
    color: Black;
    line-height: 22px;
    font-size: 16px;
    text-decoration: none;
}
.link :hover{
    color: #F8971F;
}
.log{
    color: #5978FF;
    background-color:white ;
    border:1px solid #5978FF;
    border-radius: 10px;
    padding: 10px 20px;
    gap: 8px;
}
.st{
    color: white;
    background-color: #5978FF;
    border:1px solid #5978FF;
    border-radius: 10px;
    padding: 10px 20px;
    gap: 8px;
}
.image{
    display: flex;
    width: 500px;
    height: auto;
    margin-right: 165px;
    margin-top: 100px;
}
.top{
    font-family: 'Gilroy-Bold', sans-serif;
    font-size: 38px;
    flex-direction: column;
    margin-left: 100px;
}
.vector{
    position: absolute;
    left: 480px;
    top: 310px;
}
.but1{
    color: white;
    font-family: 'Gilroy-Medium', sans-serif;
    font-size: 18px;
    background-color: #5978FF;
    border:1px solid #5978FF;
    border-radius: 10px;
    padding: 17px 36px;
    margin: 58px 100px;
}
.sec1{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px;
    background-color:#F7F9FF;
    padding-bottom: 120px;
}
.div1{
    flex-direction: column;margin-left: 80px;
}
.image2{
    position: absolute;left: 148px;top: 140px;
}
.ver{
    color: #555555;font-family: 'Gilroy-Medium', sans-serif;font-size: 18px;font-weight: 400;
}
.para{
    font-family: 'Gilroy-Medium', sans-serif;color: #121214;font-size: 18px;line-height: 1.6;margin: 50px auto;margin-left: 100px;
}
.div2{
    margin-left: 100px;display: flex;gap: 20px;
}
.img3{
    width: 24px;height:24px;
}  
.sec2{
    display: flex;justify-content:center;align-items: center;gap: 50px;flex-direction: column;margin-bottom: 105px;
}
.act{
    color: #121214;font-size: 28px;font-family: 'Gilroy-Bold', sans-serif;margin-top:100px;
}
.div3{
    display: flex;gap: 20px;margin-top: 10px;
}
.vid{
    color: white;background-color: #0D1226;font-family: 'Gilroy-Medium', sans-serif;padding: 20px;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;font-size: 20px;
}
.yt{
    position: relative;width: 50px;height: 50px;margin-top: -125px;
}
.img4{
    display: flex;justify-content: center;
}

.sec3{
    display: flex;justify-content:center;align-items: center;gap: 50px;flex-direction: column;
    background-color:#F7F9FF;padding-bottom: 130px;
}
.sol{
    color: #121214;font-size: 28px;font-family: 'Gilroy-Bold', sans-serif;margin-top:110px;
}
.div4{
    display: grid;
    gap: 80px 50px;
    grid-template-columns: 350px 300px 350px;
}
.head2{
    color: #121214;font-family: 'Gilroy-Medium', sans-serif;font-size: 20px;padding-top:15px ;
}
.para2{
    color: #555555;font-family: 'Gilroy-Medium', sans-serif;font-size: 16px;padding-top:15px;line-height: 24px; 
}
.sec4{
    display: flex;justify-content:center;align-items: center;gap: 50px;flex-direction: column;background-image: url('./Light\ Mode\ -\ 1.png');background-color:#F7F9FF;padding-bottom: 60px;
}
.card {
    background: white;
    border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;
    font-family:'Gilroy-Medium', sans-serif ;
    flex-direction: column;
    padding-bottom: 35px;
}
.grad{
    background-color: #F8971F1F ;height: 32px;font-size: 12px;border-radius: 10px;line-height: 16px;
    background-image: linear-gradient(to right,#F8971F1F , #F8F8F83D);display: flex;
    align-items: center;gap: 10px;margin:15px auto;
}
.name{
    font-size: 17px;font-family: 'Gilroy-Medium', sans-serif;color: #121214;
    justify-content: space-between;font-weight: 100;line-height: 22px;position: relative;left: 10px;
}
.img5{
    margin-left: 240px;margin-top: -50px;
}
.chip{
    color: white;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 14px;
    display: inline-block;
    margin: 8px 0;
    }
.but2{
    color: white;font-family: 'Gilroy-Medium', sans-serif;font-size: 14px;background-color: #5978FF;
    border:1px solid #5978FF;border-radius: 10px;padding: 10px 20px;            
}
.div5{
    display: flex;align-items: center;gap: 5px;font-size: 14px;justify-content: space-between;padding: 10px;border-radius: 10px;
    background: #f5f7ff;position: relative;left: 10px;top: 25px;
}
.yrs {
    display: flex;align-items: center;gap: 5px;font-size: 14px;color: gray;margin-top: -10px;
    font-family: 'Gilroy-Medium', sans-serif;font-weight: 400;border-radius: 10px;position: relative;left: 10px;
}
.sc{
    color: #555555;font-size: 12px;font-family: 'Poppins', sans-serif;
}
.bc{
    color: #0D1226;font-size: 15px;font-family: 'Poppins', sans-serif;margin-top: 50px;line-height: 22px;font-weight: 5000;
}
.card1{
    padding:5px;background-color: white;border-radius: 10px;
}
.fin{
    position: relative;left: 20px;
}
.fin img{
    position: relative;left: 10px;
}
.more{
    color: #5978FF;font-size: 16px;font-family: 'Gilroy-Medium', sans-serif;
}
.more img{
    position: relative;top: 6px;left: 5px;
}