.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 - N3 SMILES CARE UPDATED THEME
========================================================= */

.Industry-blogbox01 {
    display: block;
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    cursor: pointer;
    border-radius: 28px;
    border: 1px solid rgba(74, 95, 116, 0.14);
    background:
        radial-gradient(
            circle at top left,
            rgba(255, 255, 255, 0.98),
            rgba(248, 251, 253, 0.96) 45%,
            rgba(238, 243, 247, 0.96) 100%
        );
    text-decoration: none;
    color: #263646;
    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
    box-shadow:
        0 16px 38px rgba(74, 95, 116, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    isolation: isolate;
}

/* IMAGE */

.Industry-blogbox01 .pic {
    display: none;
}

/* SOFT BACK CIRCLE */

.Industry-blogbox01::before {
    content: "";
    position: absolute;
    top: -95px;
    right: -95px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background:
        radial-gradient(
            circle,
            rgba(74, 95, 116, 0.12),
            rgba(171, 182, 200, 0.26) 45%,
            transparent 72%
        );
    opacity: 1;
    transition:
        transform 0.45s ease,
        opacity 0.45s ease;
    z-index: 0;
}

/* SOFT TOOTH WATERMARK */

.Industry-blogbox01 .content::after {
    content: "";
    position: absolute;
    right: -36px;
    bottom: -42px;
    width: 120px;
    height: 145px;
    opacity: 0.07;
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: 0.35s ease;
    z-index: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='240' height='300' viewBox='0 0 240 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M58 139C42 105 36 61 51 36C65 13 92 16 116 36C137 20 170 14 190 35C210 56 204 104 191 142C181 171 182 217 168 243C160 259 145 254 140 231C135 207 132 182 120 165C108 182 105 207 100 231C95 254 80 259 72 243C58 217 68 171 58 139Z' fill='none' stroke='%234a5f74' stroke-width='12' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M104 154C113 141 126 142 136 156' fill='none' stroke='%234a5f74' stroke-width='7' stroke-linecap='round' stroke-linejoin='round' opacity='.55'/%3E%3Cpath d='M82 35C93 43 103 47 115 45' fill='none' stroke='%234a5f74' stroke-width='6' stroke-linecap='round' stroke-linejoin='round' opacity='.50'/%3E%3C/svg%3E");
}

/* HOVER OVERLAY */

.Industry-blogbox01::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            135deg,
            rgba(38, 54, 70, 0.98) 0%,
            rgba(74, 95, 116, 0.96) 58%,
            rgba(120, 141, 162, 0.92) 100%
        );
    opacity: 0;
    transition: opacity 0.4s ease;
    border-radius: 28px;
    z-index: 0;
}

/* =========================================================
   CONTENT
========================================================= */

.Industry-blogbox01 .content {
    position: relative;
    padding: 42px 32px;
    background: transparent;
    display: flex;
    flex-direction: column;
    min-height: 370px;
    z-index: 2;
    border-radius: 28px;
    transition:
        background-color 0.4s ease,
        transform 0.4s ease;
}

/* TOP MINI LINE */

.Industry-blogbox01 .content::before {
    content: "";
    width: 58px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, #263646, #4a5f74, #abb6c8);
    margin-bottom: 22px;
    box-shadow: 0 8px 18px rgba(74, 95, 116, 0.18);
    transition: 0.35s ease;
}

/* =========================================================
   HEADER
========================================================= */

.Industry-blogbox01 .content-header {
    color: #4a5f74;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: 0.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: #788da2;
    font-weight: 750;
}

/* =========================================================
   TITLE
========================================================= */

.Industry-blogbox01 .content-body .title {
    color: #263646;
    font-size: 28px;
    line-height: 1.28;
    font-weight: 900;
    margin-bottom: 18px;
    letter-spacing: -0.8px;
}

.Industry-blogbox01 .title a {
    color: inherit;
    text-decoration: none;
}

/* =========================================================
   EXCERPT
========================================================= */

.Industry-blogbox01 .content-body .excerpt {
    color: rgba(31, 47, 62, 0.70);
    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: #4a5f74;
    font-size: 14px;
    font-weight: 850;
    transition: 0.35s ease;
}

/* =========================================================
   HOVER EFFECT
========================================================= */

.Industry-blogbox01:hover {
    transform: translateY(-10px);
    border-color: rgba(171, 182, 200, 0.72);
    box-shadow:
        0 28px 60px rgba(74, 95, 116, 0.24),
        0 0 28px rgba(171, 182, 200, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.Industry-blogbox01:hover::after {
    opacity: 1;
}

.Industry-blogbox01:hover::before {
    transform: scale(1.18);
    opacity: 0.65;
}

.Industry-blogbox01:hover .content::before {
    background: linear-gradient(90deg, #ffffff, #dfe6ee, #abb6c8);
    width: 78px;
}

.Industry-blogbox01:hover .content::after {
    opacity: 0.12;
    transform: scale(1.12) rotate(6deg);
    background-image: url("data:image/svg+xml,%3Csvg width='240' height='300' viewBox='0 0 240 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M58 139C42 105 36 61 51 36C65 13 92 16 116 36C137 20 170 14 190 35C210 56 204 104 191 142C181 171 182 217 168 243C160 259 145 254 140 231C135 207 132 182 120 165C108 182 105 207 100 231C95 254 80 259 72 243C58 217 68 171 58 139Z' fill='none' stroke='white' stroke-width='12' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M104 154C113 141 126 142 136 156' fill='none' stroke='white' stroke-width='7' stroke-linecap='round' stroke-linejoin='round' opacity='.55'/%3E%3Cpath d='M82 35C93 43 103 47 115 45' fill='none' stroke='white' stroke-width='6' stroke-linecap='round' stroke-linejoin='round' opacity='.50'/%3E%3C/svg%3E");
}

/* 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 0.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-posts-row {
        gap: 18px;
    }

    .latest-post-col {
        flex: 1 1 100%;
    }

    .Industry-blogbox01 {
        border-radius: 24px;
    }

    .Industry-blogbox01::after {
        border-radius: 24px;
    }

    .Industry-blogbox01 .content {
        padding: 30px 24px;
        min-height: 300px;
        border-radius: 24px;
    }

    .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;
    }

    .Industry-blogbox01 .content::after {
        width: 88px;
        height: 106px;
        right: -28px;
        bottom: -34px;
    }
}
