.preview{
    position: relative;
    padding: 20px;
}

.preview img{
    border-radius: 28px;
}

.project {
    height: auto;
}

.info span {
    font-size: 14px;
}

.details {
    margin-top: 10px;
    color: #a4a8c1;
    line-height: 1.3;
}

.info h3{
    margin-bottom: 0;
}

.info a{
    display: block;
    width: fit-content;
    color: #6f67ff;
    text-decoration: none;
    transition: .35s;
    margin-top: 10px;
}

.projects{
    padding:120px 0;
}

.projects-grid{

    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(360px,1fr));
    gap:28px;

}

.project-card{

    background:#0d121d;
    border:1px solid rgba(255,255,255,.06);

    border-radius:26px;

    overflow:hidden;

    transition:.35s;

}

.project-card:hover{

    transform:translateY(-8px);

    border-color:#725cff;

    box-shadow:0 30px 80px rgba(114,92,255,.18);

}

.stats .stat{
    background: #05060de8;
}


.project-image{

    height:240px;
    overflow:hidden;

}

.project-image img{

    width:100%;
    height:100%;
    object-fit:cover;

    transition:.7s;

}

.project-card:hover img{

    transform:scale(1.06);

}

.project-content{

    padding:26px;

}

.project-stack{

    display:inline-flex;

    padding:8px 14px;

    border-radius:100px;

    background:rgba(114,92,255,.12);

    color:#8e7cff;

    font-size:13px;

    margin-bottom:16px;

}

.project-content h3{

    color:#fff;

    font-size:28px;

    margin-bottom:14px;

}

.project-content p{

    color:rgba(255,255,255,.72);

    line-height:1.7;

}

.projects-more{

    margin-top:70px;

    display:flex;

    justify-content:center;

}

.btn-projects{

    cursor:pointer;

    padding:18px 38px;

    border-radius:100px;

    border:none;

    font-size:16px;

    background:linear-gradient(135deg,#725cff,#3f8cff);

    color:#fff;

    transition:.3s;

}

.btn-projects:hover{

    transform:translateY(-3px);

}

@media (max-width: 900px) {
    .projects-single{
        background-color: #05060db8 !important;
    }
}

@media (max-width: 768px) {
    .projects {
        padding: 70px 0;
    }
}