.projects-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px;
}

.project-card{
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
    display:flex;
    flex-direction:column;
}

.project-card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.project-card h3{
    padding:24px 24px 12px;
}

.project-card p{
    padding:0 24px;
    flex:1;
}

.project-info{
    display:flex;
    gap:20px;
    padding:20px 24px;
    color:#777;
}

.project-card .btn-secondary{
    margin:24px;
}

.hero-actions{
    margin-top:32px;
}

.hero-actions .btn-primary{
    display:inline-flex;
}

/* =========================
   PROJECT DETAIL
========================= */

.project-content{
    padding:80px 0;
}

.project-image{
    width:100%;
    max-height:650px;
    object-fit:cover;
    border-radius:24px;
    margin-bottom:50px;
}

.project-description{
    max-width:900px;
    margin:0 auto;
    font-size:20px;
    line-height:1.9;
    color:#4f566b;
}

.project-description p{
    margin-bottom:24px;
}

/* =========================
   PROJECT STATS
========================= */

.project-info-section{
    padding:80px 0;
}

.project-info-section h2{
    text-align:center;
    margin-bottom:50px;
}

.project-stats{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.project-stat{

    background:#fff;

    border-radius:22px;

    padding:36px;

    text-align:center;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.project-stat-title{

    display:block;

    font-size:15px;

    color:#7b8593;

    margin-bottom:16px;

    text-transform:uppercase;

    letter-spacing:.08em;

}

.project-stat strong{

    font-size:32px;

    color:#111;

    font-weight:700;

}

/* =========================
   PROJECT WORKS
========================= */

.project-works{
    padding:80px 0;
}

.project-works h2{
    text-align:center;
    margin-bottom:50px;
}

.works-list{

    max-width:850px;

    margin:0 auto;

    display:flex;

    flex-direction:column;

    gap:18px;

}

.work-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:22px 28px;

    background:#fff;

    border-radius:18px;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

}

.work-icon{

    width:34px;

    height:34px;

    border-radius:50%;

    background:#1fa84f;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:700;

    flex-shrink:0;

}

.work-item span:last-child{

    font-size:18px;

    line-height:1.7;

    color:#444;

}