.blog-posts {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}
body.blog .header,
body.archive.category .header {
    background: #FFF;
}

.blog-article__meta {
    padding-top: 20px;
    display: flex;
    gap: 10px;
    align-items: center;
    position: relative;
}

.blog-article__meta-wrapper {
    display: flex;
    flex-direction: column;
}

.blog-article__meta-inner-wrapper {
    display: flex;
    align-items: center;
    row-gap: 0;
    column-gap: 10px;
    flex-wrap: wrap;
}


.blog-article__author-photo-img {
    border-radius: 100% !important;
    width: 44px!important;
    height: 44px!important;
    object-fit: cover;
}

.blog-article__author {
    font-weight: 350;
    font-size: 14px;
    line-height: 1.5;
    color: #1e2731;
}

.blog-article__reading-time,
.blog-article__date {
    font-weight: 350;
    font-size: 12px;
    line-height: 1.5;
    color: #646b72;
}

.blog-article__meta-inner-wrapper {
    display: flex;
    align-items: center;
    row-gap: 0;
    column-gap: 10px;
    flex-wrap: wrap;
}

.blog-article__meta::after {
    content: '';
    bottom: 0;
    height: 1px;
    background: #DADFF6!important;
    border-radius: 50px;
    width: 100%;
    top: 0;
    position: absolute;
}

body .gooten-pagination {
    margin-top: 100px;
}

body .gooten-pagination .navigation .page-numbers.current {
    background: #083db4;
    color: #FFF;
}

body .gooten-pagination .navigation .page-numbers:hover {
    background: #083db4;
    color: #FFF;
}

body .gooten-pagination .navigation .page-numbers {
    border-radius: 24px;
    width: 44px;
    height: 44px;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
    color: #373F49;
    background: #FFF;
    transition: all 0.3s ease;
    padding: 0;
}

body .gooten-pagination .navigation .page-numbers.prev,
body .gooten-pagination .navigation .page-numbers.next {
    background: none;
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
}

body .gooten-pagination .navigation .page-numbers.prev:hover,
body .gooten-pagination .navigation .page-numbers.next:hover {
    background: none;
}

body .gooten-pagination .navigation .page-numbers.next::after,
body .gooten-pagination .navigation .page-numbers.prev::before {
    content: '';
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    display: inline-block;
    text-indent: -9999px; /* Прибирає текст */
    width: 8px;
    height: 12px;
}

body .gooten-pagination .navigation .page-numbers.prev::before {
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 1L1.5 6L6.5 11' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

body .gooten-pagination .navigation .page-numbers.next::after {
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 1L6.5 6L1.5 11' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

body .nav-links {
    display: flex;
    gap: 8px;
    align-items: center;
}

@media screen and (min-width: 1024px) {
    .blog-posts__article.first-article {
        flex-basis: 100%;
        flex-direction: row;
        gap: 0;
    }

    .blog-posts__article.first-article .blog-article__img-link-wrapper {
        flex-basis: 450px;
    }

    .blog-posts__article.first-article .blog-article__first-article-content-wrap {
        flex-basis: 690px;
        display: flex;
        flex-direction: column;
    }

    .blog-posts__article.first-article .blog-article__img-link-wrapper {
        padding: 10px 0 10px 10px;
    }

    .blog-posts__article.first-article .blog-article__image img {
        height: 440px;
    }

    .blog-posts__article.first-article .blog-article__content-link-wrapper {
        padding: 30px 40px 40px 40px;
    }

    .blog-posts__article.first-article .blog-article__categories {
        padding: 40px 40px 0 40px;
    }

    .blog-posts__article.first-article .blog-article__heading {
        font-size: 32px;
        line-height: 1.25;
    }

    .blog-posts__article.first-article .blog-article__excerpt *  {
        font-size: 16px;
        line-height: 1.75;
    }

    .first-article__bottom-wrapper {
        display: flex;
        justify-content: space-between;
        gap: 50px;
        align-items: flex-end;
        padding-top: 20px;
        border-top: 1px solid #DADFF6;
        margin-top: auto;
    }

    .blog-posts__article.first-article .blog-article__custom-btn {
        font-weight: 900;
        font-size: 13px;
        line-height: 1.85;
        background: #083DB4;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        font-family: 'Avenir', sans-serif;
        padding: 8px!important;
        min-width: 128px;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .blog-posts__article.first-article .blog-article__meta {
        border-top: 0;
        padding-top: 0;
    }
    .first-article__bottom-wrapper .blog-article__meta::after {
        display: none;
    }
}
/* End first article desktop styles */

.blog-posts__article {
    flex-basis: calc((100% - 60px) / 3);
    background: #FFF;
    border-radius: 20px;
    overflow: hidden;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.blog-article__img-link-wrapper {
    padding: 10px 10px 26px 10px;
}

.blog-article__image img{
    border-radius: 10px;
    height: 230px;
    object-fit: cover;
}

.blog-article__image {
    display: flex;
}

.blog-article__categories {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    padding: 0 26px 0 26px;
}

.blog-article__category {
    border-radius: 38px;
    padding: 6px 14px;
    background: rgba(8, 61, 180, 0.06);
    font-weight: 900;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #083db4;
    font-family: 'Avenir', sans-serif;
}

.blog-article__content-link-wrapper {
    padding: 20px 26px 26px 26px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.blog-article__heading {
    margin-bottom: 10px;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.3;
    color: #1e2731;
}

.blog-article__excerpt {
    margin-bottom: 20px;
    flex-grow: 1;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
    color: #373f49;
    font-family: "Neue Haas Grotesk Display Pro", sans-serif;
}


.article-first__short-excerpt {
    display: none;
}



@media screen and (max-width: 1023.98px) {
    .blog-posts {
        flex-direction: column;
        gap: 10px;
    }
    .blog-article__meta {
        padding-top: 16px;
    }


    .blog-posts__article.first-article {
        flex-direction: column;
    }

    .blog-posts__article.first-article .blog-article__img-link-wrapper,
    .blog-posts__article.first-article .blog-article__first-article-content-wrap {
        flex-basis: 100%;
    }

    .blog-posts__article {
        flex-basis: 100%;
    }

    .blog-article__image img {
        height: 400px;
    }

    .blog-article__img-link-wrapper {
        padding: 10px 10px 20px 10px;
    }

    .blog-article__categories {
        gap: 6px;
        padding: 0 20px 0 20px;
    }

    .blog-article__category {
        font-size: 11px;
        line-height: 1.5;
    }

    .blog-article__heading {
        font-size: 20px;
        line-height: 1.5;
    }

    .article-first__big-excerpt {
        display: none;
    }

    .article-first__short-excerpt {
        display: flex;
    }

    .blog-article__custom-btn {
        display: none;
    }

    .blog-article__meta {
        padding-top: 16px;
    }

    .blog-article__author-photo-img {
        width: 38px!important;
        height: 38px!important;
    }

    .blog-article__content-link-wrapper {
        padding: 10px 20px 20px 20px;
    }

    .blog-article__excerpt {
        margin-bottom: 16px;
    }

    body .gooten-pagination .navigation .page-numbers {
       font-size: 13px;
    }

    body .gooten-pagination .navigation .page-numbers.next::after,
    body .gooten-pagination .navigation .page-numbers.prev::before {
        width: 6px;
        height: 10px;
    }

    body .gooten-pagination {
        margin-top: 30px;
    }
}

@media screen and (max-width: 599.98px) {
    .blog-article__image img {
        height: 219px;
    }
}