
body.blog-loading {
    height: 100%;
    overflow: hidden
}

.banner-title{
    font-size: 90px !important;
    font-weight: bold;
}

.blog-banner {
    background: linear-gradient(180deg, #e7f1f7 0, rgba(231, 241, 247, 0) 100%);
    padding: 147px 0 146px
}

@media (min-width:744px) {
    .blog-banner {
        padding: 200px 0 40px
    }
}

@media (min-width:1024px) {
    .blog-banner {
        padding: 174px 0 160px
    }
}

.blog-banner-main {
    position: relative
}

@media (min-width:1024px) {
    .blog-banner-main {
        margin-left: -1rem;
        margin-right: -1rem;
        display: flex;
        flex-direction: row-reverse;
        align-items: flex-end;
        justify-content: space-between
    }
}

.blog-banner-left {
    position: relative
}

@media (min-width:1024px) {
    .blog-banner-left {
        width: 59%;
        padding-left: 1rem;
        padding-right: 1rem
    }
}

@media (max-width:1023px) {
    .blog-banner-left {
        margin-bottom: 1.25rem;
        text-align: center
    }
    .blog-banner-left img {
        display: inline-block
    }
}

.blog-banner-left .b-path-anim-2 {
    position: absolute;
    right: 0;
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    bottom: -28px
}

@media (min-width:744px) {
    .blog-banner h1 {
        font-size: 6.25rem
    }
}

@media (min-width:1280px) {
    .blog-banner h1 {
        font-size: 7.5rem
    }
}

.blog-banner-right {
    text-align: center
}

@media (min-width:1024px) {
    .blog-banner-right {
        width: 41%;
        padding-left: 1rem;
        padding-right: 1rem
    }
}

@media (max-width:1023px) {
    .blog-banner-right {
        margin-top: 1.25rem;
        display: flex;
        flex-direction: column-reverse
    }
}

.blog-banner-right img {
    display: inline-block
}

.blog-banner h1 {
    margin-bottom: 1.5rem
}

.blog-banner p {
    --tw-text-opacity: 1;
    color: rgb(79 79 79 / var(--tw-text-opacity))
}

@media (min-width:744px) {
    .blog-banner p {
        font-size: 1.375rem;
        line-height: 1.54
    }
}

@media (min-width:1024px) {
    .blog-banner p {
        max-width: 521px
    }
}

.blog-banner .scroll-svg {
    right: 0;
    bottom: -170px
}



@media (min-width:1024px) {
    .featured-blogs {
        padding-bottom: 82px
    }
    .featured-blogs-items {
        margin-left: -1.25rem;
        margin-right: -1.25rem;
        display: flex;
        flex-wrap: wrap
    }
    .featured-blogs-item:first-child {
        width: 45.85%;
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }
    .featured-blogs-item:last-child {
        width: 100%;
        margin-left: -.75rem;
        margin-right: -.75rem;
        display: flex;
        flex-wrap: wrap;
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }
    .featured-blogs-item:last-child .featured-blogs-item-in {
        width: 50%;
        padding-left: .75rem;
        padding-right: .75rem
    }
}

.featured-blogs-item-in {
    margin-bottom: 1.25rem
}

.featured-blogs-item-in a {
    display: block;
    text-decoration: none;
}

.featured-blogs-item-in a:focus h3,
.featured-blogs-item-in a:hover h3 {
    --tw-text-opacity: 1;
    color: rgb(243 109 69 / var(--tw-text-opacity))
}

.featured-blogs-item-in p {
    --tw-text-opacity: 1;
    color: rgb(79 79 79 / var(--tw-text-opacity));
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical
}

@media (min-width:744px) {
    .featured-blogs-item-in p {
        font-size: 1.125rem
    }
}


@media (max-width:743px) {
    .featured-blogs-card-content {
        margin-top: 7px
    }
}

@media (min-width:744px) {
    .featured-blogs-card-content {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        padding: 1.5rem;
        border-radius: 10px
    }
    .featured-blogs-card-content::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        opacity: .8;
        background: linear-gradient(180deg, rgba(255, 255, 255, .01) 0, rgba(255, 255, 255, .01) 100%);
        -webkit-backdrop-filter: blur(20px);
        backdrop-filter: blur(20px)
    }
    .featured-blogs-card-content h3,
    .featured-blogs-card-content span {
        position: relative
    }
}


.blog-meta {
    display: block;
    font-family: Rift, sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: #6a6d78;
    line-height: 1.8
}

@media (max-width:743px) {
    .blog-meta {
        font-size: .75rem
    }
}

.blog-title {
    margin-bottom: 1.25rem;
    font-family: Outfit, sans-serif;
    font-size: 1.375rem;
    font-weight: 700;
    --tw-text-opacity: 1;
    color: rgb(40 42 55 / var(--tw-text-opacity));
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .3s;
    line-height: 1.2
}

@media (min-width:744px) {
    .blog-title {
        margin-bottom: 1rem;
        font-size: 1.75rem
    }
}

@media (min-width:1024px) {
    .blog-title {
        font-size: 1.5rem
    }
}

.blog-title:last-child {
    margin-bottom: 0
}




.featured-blogs-item-in {
    margin-bottom: 1.25rem
}

.featured-blogs-item-in a {
    display: block
}

.featured-blogs-item-in a:focus h3,
.featured-blogs-item-in a:hover h3 {
    --tw-text-opacity: 1;
    color: rgb(243 109 69 / var(--tw-text-opacity))
}

.featured-blogs-item-in p {
    --tw-text-opacity: 1;
    color: rgb(79 79 79 / var(--tw-text-opacity));
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical
}

@media (min-width:744px) {
    .featured-blogs-item-in p {
        font-size: 1.125rem
    }
}



[data-aos=fade-up] {
    transform: translate3d(0, 100px, 0)
}

[data-aos=fade-up-s] {
    transform: translate3d(0, 30px, 0)
}







/* */ 

