/*
==========================================
PROJECT ARCHIVE LOOP
==========================================
*/

.archive-loop{

    margin:0 0 100px;

}

.archive-grid{

    display:grid;

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

    gap:70px 42px;

}

.archive-card{

    position:relative;

}

.archive-card a{

    display:block;

    color:inherit;

    text-decoration:none;

}

.archive-card-image{

    overflow:hidden;

    background:#f5f5f5;

}

.archive-card-image img{

    width:100%;

    aspect-ratio:0.85;

    object-fit:cover;

    display:block;

    transition:transform .8s ease;

}

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

    transform:scale(1.04);

}

.archive-card-content{

    text-align:center;

    padding-top:28px;

}

.archive-card-category{

    margin-bottom:14px;

    font-size:12px;

    letter-spacing:3px;

    text-transform:uppercase;

    color:#777;

}

.archive-card h2{

    margin:0 0 16px;

    font-size:34px;

    font-weight:300;

    line-height:1.25;

    color:#222;

}

.archive-card span{

    display:inline-block;

    font-size:12px;

    letter-spacing:3px;

    text-transform:uppercase;

    color:#555;

    transition:.3s;

}

.archive-card:hover span{

    color:#000;

    letter-spacing:4px;

}

@media(max-width:1200px){

    .archive-grid{

        gap:50px 30px;

    }

}

@media(max-width:991px){

    .archive-grid{

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

        gap:45px 24px;

    }

}

@media(max-width:767px){

    .archive-loop{

        margin-bottom:70px;

    }

    .archive-grid{

        grid-template-columns:1fr;

        gap:45px;

    }

    .archive-card h2{

        font-size:28px;

    }

}