@charset "utf-8";
/* CSS Document */

/*==================================================
PROJECTS HOME
==================================================*/


.projects-home
{

    padding:100px 0;

    background:#fff;

}



/* GRID */

.projects-grid
{

    display:grid;

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

    gap:30px;

}



/* CARD */

.project-card
{

    position:relative;

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    box-shadow:

    0 15px 40px rgba(0,0,0,.08);

    transition:.45s ease;

}



.project-card:hover
{

    transform:translateY(-12px);

    box-shadow:

    0 30px 70px rgba(0,0,0,.15);

}





/* IMAGE */


.project-image
{

    height:300px;

    overflow:hidden;

    position:relative;

}



.project-image img
{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:

    transform .8s ease;

}



.project-card:hover .project-image img
{

    transform:scale(1.12);

}





/* OVERLAY */


.project-image::after
{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        180deg,
        transparent 40%,
        rgba(0,0,0,.45)
    );


}





/* STATUS */


.project-status
{

    position:absolute;

    top:20px;

    left:20px;

    z-index:2;

    padding:.45rem 1rem;

    border-radius:50px;

    background:#c89b3c;

    color:#fff;

    font-size:.80rem;

    font-weight:700;

}





/* CONTENT */


.project-content
{

    padding:1.8rem;

}



.project-location
{

    display:flex;

    align-items:center;

    gap:.5rem;

    color:#c89b3c;

    font-size:.90rem;

    font-weight:600;

}



.project-content h3
{

    margin:1rem 0 .7rem;

    font-size:1.45rem;

    color:#12483c;

}



.project-content p
{

    color:#64748b;

    font-size:.95rem;

    line-height:1.7;

}





/* LINK */


.project-content a
{

    display:inline-flex;

    align-items:center;

    gap:.6rem;

    margin-top:1rem;

    color:#12483c;

    font-weight:700;

    transition:.3s;

}



.project-content a:hover
{

    color:#c89b3c;

    gap:1rem;

}





/* BUTTON ALL */


.projects-more
{

    text-align:center;

    margin-top:4rem;

}


@media(max-width:992px)
{

    .projects-grid
    {

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

    }


}



@media(max-width:768px)
{


    .projects-grid
    {

        grid-template-columns:1fr;

    }


    .project-image
    {

        height:260px;

    }


}