/* assets/style.css */

.infinite-scroll-wrapper{
    width:100%;
}


#category-filter{
    padding:12px;
    margin-bottom:20px;
}


#posts-container{

    display:grid;

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

    gap:20px;

}


.post-item{

    opacity:0;

    transform:translateY(40px);

    transition:
        opacity .6s ease,
        transform .6s ease;

}


.post-item.show{

    opacity:1;

    transform:translateY(0);

}


.post-item img{

    width:100%;

    height:auto;

    display:block;

    border-radius:12px;

}


.post-item h2{

    font-size:20px;

    margin-top:15px;

}


#load-trigger{
    height:20px;
}


/* loading */

.loading-posts::after{

    content:"";

    position:fixed;

    bottom:30px;
    left:50%;

    width:40px;
    height:40px;

    margin-left:-20px;

    border:4px solid #ddd;
    border-top:4px solid #000;

    border-radius:50%;

    animation:spin .7s linear infinite;

    z-index:99999;

}


@keyframes spin{

    to{
        transform:rotate(360deg);
    }

}



/* responsive */

@media(max-width:768px){

    #posts-container{
        grid-template-columns:1fr;
    }

}