.latest-posts-row{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
}

.latest-post-col{
    flex:1 1 calc(33.333% - 24px);
    box-sizing:border-box;
}

/* =========================================================
MAIN BLOG CARD
========================================================= */

.Industry-blogbox01{
    display:block;
    position:relative;

    margin-bottom:20px;

    overflow:hidden;
    cursor:pointer;

    border-radius:24px;

    border:1px solid rgba(240,126,1,.12);

    background-color:#ffffff;

    text-decoration:none;
    color:#151716;

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;

    box-shadow:
        0 12px 34px rgba(21,23,22,.08);

    isolation:isolate;
}

/* IMAGE */

.Industry-blogbox01 .pic{
    display:none;
}

/* GLOW EFFECT */

.Industry-blogbox01::before{
    content:'';
    position:absolute;

    top:-120px;
    right:-120px;

    width:240px;
    height:240px;

    border-radius:50%;

    background:
    radial-gradient(
        circle,
        rgba(240,126,1,.16),
        transparent 70%
    );

    opacity:0;

    transition:.45s ease;

    z-index:0;
}

/* HOVER OVERLAY */

.Industry-blogbox01::after{
    content:'';
    position:absolute;
    inset:0;

    background:
    linear-gradient(
        135deg,
        #151716 0%,
        #1f2120 40%,
        #f07e01 100%
    );

    opacity:0;

    transition:opacity .4s ease;

    border-radius:24px;

    z-index:0;
}

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

.Industry-blogbox01 .content{
    position:relative;

    padding:42px 32px;

    background-color:#ffffff;

    display:flex;
    flex-direction:column;

    min-height:370px;

    z-index:2;

    border-radius:24px;

    transition:
        background-color .4s ease,
        transform .4s ease;
}

/* =========================================================
HEADER
========================================================= */

.Industry-blogbox01 .content-header{
    color:#f07e01;

    font-size:13px;
    font-weight:800;

    letter-spacing:.4px;

    margin-bottom:18px;
}

/* DATE / CATEGORY */

.Industry-blogbox01 .content-header .date,
.Industry-blogbox01 .content-header .category,
.Industry-blogbox01 .content-header .sep,
.Industry-blogbox01 .content-header time{
    color:#c76902;
}

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

.Industry-blogbox01 .content-body .title{
    color:#151716;

    font-size:28px;
    line-height:1.28;
    font-weight:900;

    margin-bottom:18px;

    letter-spacing:-.8px;
}

.Industry-blogbox01 .title a{
    color:inherit;
    text-decoration:none;
}

/* =========================================================
EXCERPT
========================================================= */

.Industry-blogbox01 .content-body .excerpt{
    color:#5f6361;

    font-size:15px;
    line-height:1.9;

    margin-bottom:28px;
}

/* =========================================================
FOOTER LINK
========================================================= */

.Industry-blogbox01 .content-footer{
    margin-top:auto;
}

.Industry-blogbox01 .content-footer .link,
.Industry-blogbox01 .content-footer .link i{
    color:#f07e01;

    font-size:14px;
    font-weight:800;

    transition:.35s ease;
}

/* =========================================================
HOVER EFFECT
========================================================= */

.Industry-blogbox01:hover{
    transform:translateY(-10px);

    border-color:rgba(240,126,1,.30);

    box-shadow:
        0 24px 55px rgba(21,23,22,.16);
}

.Industry-blogbox01:hover::after{
    opacity:1;
}

.Industry-blogbox01:hover::before{
    opacity:1;
}

.Industry-blogbox01:hover .content{
    background-color:transparent;
}

/* TEXT COLORS ON HOVER */

.Industry-blogbox01:hover .content-header,
.Industry-blogbox01:hover .content-body .title,
.Industry-blogbox01:hover .content-body .title a,
.Industry-blogbox01:hover .content-body .excerpt,
.Industry-blogbox01:hover .content-footer .link,
.Industry-blogbox01:hover .content-footer .link i,
.Industry-blogbox01:hover .content-header .date,
.Industry-blogbox01:hover .content-header .category,
.Industry-blogbox01:hover .content-header .sep,
.Industry-blogbox01:hover .content-header time{
    color:#ffffff;
}

/* SOFT TRANSITIONS */

.Industry-blogbox01 .content-header,
.Industry-blogbox01 .content-body .title,
.Industry-blogbox01 .content-body .excerpt,
.Industry-blogbox01 .content-footer .link,
.Industry-blogbox01 .content-footer .link i,
.Industry-blogbox01 .content-header .date,
.Industry-blogbox01 .content-header .category,
.Industry-blogbox01 .content-header .sep,
.Industry-blogbox01 .content-header time{
    transition:color .35s ease;
}

/* =========================================================
TABLET
========================================================= */

@media(max-width:991px){

    .latest-post-col{
        flex:1 1 calc(50% - 24px);
    }

    .Industry-blogbox01 .content{
        min-height:340px;
    }

}

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

@media(max-width:600px){

    .latest-post-col{
        flex:1 1 100%;
    }

    .Industry-blogbox01{
        border-radius:22px;
    }

    .Industry-blogbox01::after{
        border-radius:22px;
    }

    .Industry-blogbox01 .content{
        padding:30px 24px;

        min-height:300px;

        border-radius:22px;
    }

    .Industry-blogbox01 .content-body .title{
        font-size:24px;
        line-height:1.32;
    }

    .Industry-blogbox01 .content-body .excerpt{
        font-size:14.5px;
        line-height:1.8;
    }

}