.mf-projects{

    padding:5rem 0;

}

.mf-projects__header{

    max-width:700px;

    margin:0 auto 3rem;

    text-align:center;

}

.mf-projects__title{

    margin:0 0 1rem;

    font-size:clamp(
        2rem,
        4vw,
        3rem
    );

}

.mf-projects__description{

    margin:0;

    color:var(--mf-gray);

}

.mf-projects__grid{

    display:grid;

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

    gap:2rem;

}

.mf-project-card{

    overflow:hidden;

    border-radius:var(--mf-radius);

    background:var(--mf-light);

    box-shadow:var(--mf-shadow);

}

.mf-project-card__thumbnail{

    display:block;

    overflow:hidden;

}

.mf-project-card__thumbnail img{

    width:100%;

    aspect-ratio:4 / 3;

    object-fit:cover;

    transition:transform .3s ease;

}

.mf-project-card:hover .mf-project-card__thumbnail img{

    transform:scale(1.05);

}

.mf-project-card__content{

    padding:1.5rem;

}

.mf-project-card__categories{

    display:flex;

    flex-wrap:wrap;

    gap:.5rem;

    margin-bottom:.75rem;

}

.mf-project-card__category{

    color:var(--mf-primary);

    font-size:.75rem;

    font-weight:600;

}

.mf-project-card__title{

    margin:0 0 1rem;

    font-size:1.35rem;

}

.mf-project-card__excerpt{

    margin-bottom:1.5rem;

    color:var(--mf-gray);

}

.mf-project-card__link{

    font-weight:600;

    color:var(--mf-primary);

}

.mf-projects__footer{

    margin-top:3rem;

    text-align:center;

}

@media (
    max-width:900px
){

    .mf-projects__grid{

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

    }

}

@media (
    max-width:600px
){

    .mf-projects{

        padding:3.5rem 0;

    }

    .mf-projects__grid{

        grid-template-columns:1fr;

        gap:1.5rem;

    }

}