.latest-posts__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.latest-posts[data-current-variation="2"] .latest-posts__list {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(2, 1fr);
}

.latest-posts[data-current-variation="2"] .posts-item:first-child {
    grid-column: span 6;
    grid-row: span 2;
}

.latest-posts[data-current-variation="2"] .posts-item:nth-child(2),
.latest-posts[data-current-variation="2"] .posts-item:nth-child(3) {
    grid-column: span 4;
}

.latest-posts[data-current-variation="2"] .posts-item__image {
    aspect-ratio: 530/168;
}

.latest-posts[data-current-variation="2"] .posts-item:first-child .posts-item__image {
    aspect-ratio: 3/2;
}

.latest-posts[data-current-variation="2"] .posts-item__content {
    gap: 1rem;
    padding-block: 2rem;
}

.latest-posts[data-current-variation="2"] .posts-item__footer {
    padding-top: 1rem;
}

.latest-posts[data-current-variation="3"] .latest-posts__list {
    grid-template-columns: repeat(20, 1fr);
    grid-template-rows: repeat(2, 1fr);
}

.latest-posts[data-current-variation="3"] .posts-item:first-child {
    grid-column: span 11;
    grid-row: span 2;
}

.latest-posts[data-current-variation="3"] .posts-item:nth-child(2),
.latest-posts[data-current-variation="3"] .posts-item:nth-child(3) {
    flex-direction: row;
    grid-column: span 9;
}

.latest-posts[data-current-variation="3"] .posts-item__image {
    flex: 0 0 auto;
    width: 22rem;
    aspect-ratio: 22/21;
}

.latest-posts[data-current-variation="3"] .posts-item:first-child .posts-item__image {
    aspect-ratio: 710/248;
    width: 100%;
}

.latest-posts[data-current-variation="3"] .posts-item__content {
    gap: 1rem;
    padding-block: 2rem;
}

.latest-posts[data-current-variation="3"] .posts-item__footer {
    padding-top: 1rem;
}

@media screen and (max-width: 1024.9px) {
    .latest-posts__list {
        grid-template-columns: repeat(2, 1fr);
    }

    .latest-posts__btns {
        padding-top: 3rem;
    }

    .latest-posts[data-current-variation="3"] .latest-posts__list {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
    }
    
    .latest-posts[data-current-variation="3"] .posts-item:first-child {
        grid-column: span 2;
        grid-row: span 1;
    }
    
    .latest-posts[data-current-variation="3"] .posts-item:nth-child(2),
    .latest-posts[data-current-variation="3"] .posts-item:nth-child(3) {
        grid-column: span 1;
    }

    .latest-posts[data-current-variation="3"] .latest-posts__list {
        grid-template-columns: repeat(1, 1fr);
    }
    
    .latest-posts[data-current-variation="3"] .posts-item:nth-child(n) {
        flex-direction: column;
        grid-column: span 1;
        grid-row: span 1;
    }

    .latest-posts[data-current-variation="3"] .posts-item:nth-child(n) .posts-item__image {
        aspect-ratio: 530/168;
        width: 100%;
    }

    .latest-posts[data-current-variation="3"] .posts-item:nth-child(1) .posts-item__image {
        aspect-ratio: 1.5
    }
}

@media screen and (max-width: 767.9px) {
    .latest-posts__list {
        grid-template-columns: repeat(1, 1fr);
    }
}