body.haay-blog-detail .blog-page-content > .page-title {
    padding: 34px 38px !important;
    background:
        radial-gradient(circle at 100% 0, rgba(32, 185, 131, .13), transparent 34%),
        radial-gradient(circle at 0 100%, rgba(20, 169, 255, .12), transparent 38%),
        linear-gradient(135deg, #fff, #f7fbff) !important;
}

body.haay-blog-detail .blog-page-content > .page-title h1 {
    max-width: 860px !important;
    margin: 0 0 16px !important;
    color: #152238 !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    font-weight: 900 !important;
    line-height: 1.14 !important;
    letter-spacing: -.7px !important;
}

body.haay-blog-detail .blog-posts,
body.haay-blog-detail .blog-posts .post,
body.haay-blog-detail .blog-posts .post-content,
body.haay-blog-detail .blog-posts .post-inner {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.haay-blog-detail .article-container {
    position: relative !important;
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 52px 58px 62px !important;
    border: 1px solid rgba(125, 175, 220, .38) !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: 0 22px 58px rgba(15, 35, 60, .1) !important;
    color: #40556b !important;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 16.5px !important;
    font-weight: 500 !important;
    line-height: 1.9 !important;
}

body.haay-blog-detail .article-container::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    border-radius: 22px 22px 0 0;
    background: linear-gradient(90deg, #14a9ff, #20c997 55%, #9bd500);
}

body.haay-blog-detail .article-container p,
body.haay-blog-detail .article-container div,
body.haay-blog-detail .article-container td,
body.haay-blog-detail .article-container li {
    color: #40556b !important;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 16.5px !important;
    line-height: 1.9 !important;
}

body.haay-blog-detail .article-container p {
    margin: 0 0 24px !important;
}

body.haay-blog-detail .article-container > p:first-of-type {
    color: #2c465f !important;
    font-size: 18px !important;
    font-weight: 620 !important;
    line-height: 1.85 !important;
}

body.haay-blog-detail .article-container h1,
body.haay-blog-detail .article-container h2,
body.haay-blog-detail .article-container h3,
body.haay-blog-detail .article-container h4,
body.haay-blog-detail .article-container h5,
body.haay-blog-detail .article-container h6 {
    position: relative !important;
    clear: both !important;
    margin: 42px 0 18px !important;
    color: #172033 !important;
    font-family: Inter, Arial, sans-serif !important;
    font-weight: 900 !important;
    line-height: 1.3 !important;
    letter-spacing: -.25px !important;
}

body.haay-blog-detail .article-container h1,
body.haay-blog-detail .article-container h2 {
    padding: 0 0 13px 18px !important;
    border-bottom: 1px solid #dfeaf3 !important;
}

body.haay-blog-detail .article-container h1::before,
body.haay-blog-detail .article-container h2::before {
    content: "";
    position: absolute;
    top: .2em;
    bottom: .48em;
    left: 0;
    width: 5px;
    border-radius: 999px;
    background: linear-gradient(180deg, #14a9ff, #20c997);
}

body.haay-blog-detail .article-container h1 {
    font-size: 29px !important;
}

body.haay-blog-detail .article-container h2 {
    font-size: 25px !important;
}

body.haay-blog-detail .article-container h3 {
    font-size: 21px !important;
}

body.haay-blog-detail .article-container h4,
body.haay-blog-detail .article-container h5,
body.haay-blog-detail .article-container h6 {
    font-size: 18px !important;
}

body.haay-blog-detail .article-container strong,
body.haay-blog-detail .article-container b {
    color: #233b52 !important;
    font-weight: 850 !important;
}

body.haay-blog-detail .article-container a {
    display: inline !important;
    padding: 0 2px 2px !important;
    border: 0 !important;
    border-bottom: 2px solid rgba(20, 169, 255, .32) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #087fca !important;
    font-size: inherit !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body.haay-blog-detail .article-container a:hover {
    border-bottom-color: #087fca !important;
    background: rgba(20, 169, 255, .07) !important;
}

body.haay-blog-detail .article-container ul,
body.haay-blog-detail .article-container ol {
    margin: 28px 0 32px !important;
    padding: 22px 24px 22px 48px !important;
    border: 1px solid #dbe9f4 !important;
    border-radius: 16px !important;
    background: linear-gradient(145deg, #f6fbff, #fbfefd) !important;
    box-shadow: 0 10px 28px rgba(15, 35, 60, .045) !important;
}

body.haay-blog-detail .article-container li {
    margin: 8px 0 !important;
    padding-left: 4px !important;
}

body.haay-blog-detail .article-container li::marker {
    color: #14a9ff !important;
    font-weight: 900 !important;
}

body.haay-blog-detail .article-container blockquote {
    position: relative !important;
    margin: 32px 0 !important;
    padding: 26px 28px 26px 68px !important;
    border: 1px solid #cfe5f6 !important;
    border-left: 5px solid #14a9ff !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #eff8ff, #f8fcff) !important;
    color: #3f5870 !important;
    font-style: normal !important;
    box-shadow: 0 12px 32px rgba(15, 35, 60, .06) !important;
}

body.haay-blog-detail .article-container blockquote::before {
    content: "\201C";
    position: absolute;
    top: 13px;
    left: 24px;
    color: rgba(20, 169, 255, .35);
    font-family: Georgia, serif;
    font-size: 62px;
    font-weight: 900;
    line-height: 1;
}

body.haay-blog-detail .article-container img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 32px auto !important;
    border: 1px solid #d9e7f2 !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(15, 35, 60, .13) !important;
}

body.haay-blog-detail .article-container table {
    width: 100% !important;
    margin: 30px 0 !important;
    border: 1px solid #d6e5f1 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: 0 10px 28px rgba(15, 35, 60, .06) !important;
}

body.haay-blog-detail .article-container th,
body.haay-blog-detail .article-container td {
    padding: 13px 15px !important;
    border: 0 !important;
    border-bottom: 1px solid #e4edf5 !important;
    text-align: left !important;
    vertical-align: top !important;
}

body.haay-blog-detail .article-container th {
    background: #edf7ff !important;
    color: #203a52 !important;
    font-weight: 900 !important;
}

@media (max-width: 767px) {
    body.haay-blog-detail .page-body,
    body.haay-blog-detail .blog-page-content,
    body.haay-blog-detail .blog-posts,
    body.haay-blog-detail .post,
    body.haay-blog-detail .post-content,
    body.haay-blog-detail .post-inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.haay-blog-detail .blog-page-content > .page-title {
        padding: 23px 20px !important;
    }

    body.haay-blog-detail .blog-page-content > .page-title h1 {
        font-size: 27px !important;
        letter-spacing: -.35px !important;
    }

    body.haay-blog-detail .article-container {
        max-width: 100% !important;
        padding: 32px 20px 38px !important;
        border-radius: 16px !important;
        font-size: 15px !important;
        line-height: 1.82 !important;
        overflow-wrap: anywhere;
    }

    body.haay-blog-detail .article-container p,
    body.haay-blog-detail .article-container div,
    body.haay-blog-detail .article-container td,
    body.haay-blog-detail .article-container li {
        font-size: 15px !important;
        line-height: 1.82 !important;
    }

    body.haay-blog-detail .article-container > p:first-of-type {
        font-size: 16px !important;
    }

    body.haay-blog-detail .article-container h1 {
        font-size: 23px !important;
    }

    body.haay-blog-detail .article-container h2 {
        font-size: 21px !important;
    }

    body.haay-blog-detail .article-container h3 {
        font-size: 18px !important;
    }

    body.haay-blog-detail .article-container ul,
    body.haay-blog-detail .article-container ol {
        padding: 17px 17px 17px 38px !important;
    }
}