body {
            background: #f7f7f7;
            
        }
        .fontset{
            font-family: var(--font-family);
        }

        /* HERO SECTION */
        .blog-hero {
            background: linear-gradient(to bottom, #f7f7f7, #efefef);
            padding: 80px 0 60px;
            position: relative;
            overflow: hidden;
        }
        .blog-hero h1 {
    font-size: 60px;
    font-weight: 800;
    color: #111;
    position: relative;
    display: inline-block;
    z-index: 2;
}

/* CURVE GREEN HIGHLIGHT DESIGN */
.blog-hero h1::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0px;
    transform: translateX(-50%) rotate(-1deg);
    width: 115%;
    height: 15px;
    background: #18c15e;
    border-radius: 50px;
    z-index: -1;

    /* CURVE EFFECT */
    clip-path: polygon(
        0% 65%,
        8% 55%,
        18% 60%,
        28% 48%,
        40% 58%,
        52% 45%,
        66% 57%,
        78% 50%,
        90% 60%,
        100% 52%,
        100% 100%,
        0% 100%
    );
}
        .blog-hero h1 {
            font-size: 60px;
            font-weight: 800;
            color: #111;
            position: relative;
            display: inline-block;
        }

        

        .blog-hero p {
            font-size: 22px;
            color: #666;
            max-width: 700px;
            margin: 25px auto 0;
            line-height: 1.7;
        }

        .hero-shape-left,
        .hero-shape-right {
            position: absolute;
            /*width: 120px;*/
            opacity: 1;
            width: 17%
        }

        .hero-shape-left {
            left: 5%;
            top: 25%;
        }

        .hero-shape-right {
            right: 5%;
            top: 12%;
        }