/* =========================================================
   ANWAR ELEMENTOR WIDGETS
   BLOG / NEWS POSTS
========================================================= */

.anwar-blog-widget,
.anwar-blog-widget * {
    box-sizing: border-box;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.anwar-blog-main-title {
    margin:
        0 0 45px;

    color:
        #0e1f3d;

    font-size:
        38px;

    font-weight:
        700;

    line-height:
        1.15;

    text-align:
        center;
}


/* =========================================================
   GRID
========================================================= */

.anwar-blog-grid {
    --anwar-blog-columns: 3;

    display: grid;

    grid-template-columns:
        repeat(
            var(--anwar-blog-columns),
            minmax(0, 1fr)
        );

    gap:
        28px;
}


/* =========================================================
   POST CARD
========================================================= */

.anwar-blog-card {
    min-width:
        0;

    overflow:
        hidden;

    display:
        flex;

    flex-direction:
        column;

    border:
        1px solid transparent;

    background:
        #ffffff;
}


/* =========================================================
   IMAGE
========================================================= */

.anwar-blog-image-link {
    display:
        block;

    text-decoration:
        none !important;
}


.anwar-blog-image {
    width:
        100%;

    height:
        280px;

    overflow:
        hidden;

    background:
        #f5f8ff;
}


.anwar-blog-image img {
    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        cover;

    object-position:
        center;
}


.anwar-blog-image-placeholder {
    width:
        100%;

    height:
        100%;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #2654b1;

    background:
        #f5f8ff;

    font-size:
        16px;

    font-weight:
        600;
}


/* =========================================================
   CONTENT
========================================================= */

.anwar-blog-content {
    flex:
        1;

    padding:
        24px 0 0;

    display:
        flex;

    flex-direction:
        column;
}


/* =========================================================
   POST TITLE
========================================================= */

.anwar-blog-post-title {
    margin:
        0 0 14px;

    color:
        #0e1f3d;

    font-size:
        24px;

    font-weight:
        700;

    line-height:
        1.25;
}


.anwar-blog-post-title a {
    color:
        inherit !important;

    text-decoration:
        none !important;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.anwar-blog-excerpt {
    margin-bottom:
        20px;

    color:
        #4f5d73;

    font-size:
        14px;

    line-height:
        1.6;
}


/* =========================================================
   META ROW
========================================================= */

.anwar-blog-meta {
    margin-top:
        auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;
}


.anwar-blog-read-more {
    color:
        #0e1f3d;

    font-size:
        13px;

    font-weight:
        700;

    text-decoration:
        underline !important;

    text-underline-offset:
        3px;
}


.anwar-blog-date {
    color:
        #8b94a5;

    font-size:
        12px;

    white-space:
        nowrap;
}


/* =========================================================
   VIEW ALL
========================================================= */

.anwar-blog-view-all-wrap {
    margin-top:
        48px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;
}


.anwar-blog-view-all {
    min-height:
        48px;

    padding:
        12px 24px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        12px;

    border:
        1px solid #2654b1;

    border-radius:
        999px;

    background:
        transparent;

    color:
        #2654b1;

    font-size:
        13px;

    font-weight:
        700;

    line-height:
        1;

    text-decoration:
        none !important;

    transition:
        background-color .25s ease,
        color .25s ease;
}


.anwar-blog-view-all-arrow {
    transition:
        transform .25s ease;
}


@media (hover: hover) and (pointer: fine) {

    .anwar-blog-read-more:hover {
        color:
            #2654b1;
    }


    .anwar-blog-view-all:hover {
        background:
            #2654b1;

        color:
            #ffffff;
    }


    .anwar-blog-view-all:hover
    .anwar-blog-view-all-arrow {
        transform:
            translateX(3px);
    }

}


/* =========================================================
   EMPTY STATE
========================================================= */

.anwar-blog-empty {
    padding:
        24px;

    border:
        1px dashed #dce4ef;

    border-radius:
        10px;

    color:
        #667085;

    background:
        #fafcff;

    text-align:
        center;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .anwar-blog-main-title {
        margin-bottom:
            28px;

        font-size:
            30px;
    }


    .anwar-blog-image {
        height:
            230px;
    }


    .anwar-blog-content {
        padding-top:
            18px;
    }


    .anwar-blog-post-title {
        font-size:
            21px;
    }


    .anwar-blog-view-all-wrap {
        margin-top:
            32px;
    }

}