/*
 * V2.5.4
 * Khắc phục trang Giới thiệu, trang CMS và bài viết bị ẩn nội dung trên mobile.
 */

.content-page-section,
.article-section,
.article-related,
.cms-content-section,
.cms-related-section,
.content-page-section[data-reveal],
.article-section[data-reveal],
.article-related[data-reveal] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
}

.cms-content-section,
.cms-content-layout,
.cms-article-body,
.cms-article-body > *,
.article-detail-layout,
.article-contact-box {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

.cms-content-section {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
}

.cms-content-layout {
    display: grid !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

.cms-article-body {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    color: #2d2722 !important;
    background: #fff !important;
    line-height: 1.76 !important;
}

.cms-article-body p,
.cms-article-body div,
.cms-article-body section,
.cms-article-body h2,
.cms-article-body h3,
.cms-article-body h4,
.cms-article-body li,
.cms-article-body span {
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
}

.cms-article-body img,
.cms-featured-image img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 760px !important;
    margin: 16px auto !important;
    object-fit: contain !important;
    border-radius: 12px !important;
}

.cms-featured-image {
    margin: 0 0 20px !important;
}

@media (max-width: 700px) {
    .cms-mobile-hero,
    .content-page-hero,
    .article-detail-hero {
        min-height: 0 !important;
        height: auto !important;
        padding: 42px 0 !important;
    }

    .cms-mobile-hero h1,
    .content-page-hero h1,
    .article-detail-hero h1 {
        max-width: 100% !important;
        margin: 12px 0 !important;
        font-size: 38px !important;
        line-height: 1.12 !important;
        overflow-wrap: anywhere !important;
    }

    .cms-hero-excerpt {
        display: -webkit-box !important;
        max-width: 100% !important;
        margin: 14px 0 0 !important;
        overflow: hidden !important;
        color: rgba(255,255,255,.77) !important;
        font-size: 15px !important;
        line-height: 1.65 !important;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
    }

    .cms-content-section,
    .content-page-section,
    .article-section {
        padding: 22px 0 30px !important;
    }

    .cms-content-section .wrap,
    .content-page-section .wrap,
    .article-section .wrap {
        padding-left: 17px !important;
        padding-right: 17px !important;
    }

    .cms-content-layout,
    .content-page-layout,
    .article-detail-layout {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .cms-article-body {
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 1.78 !important;
    }

    .cms-article-body p {
        display: block !important;
        margin: 0 0 15px !important;
    }

    .cms-article-body h2 {
        margin: 25px 0 11px !important;
        font-size: 25px !important;
    }

    .cms-article-body h3 {
        margin: 22px 0 10px !important;
        font-size: 21px !important;
    }

    .cms-article-body h4 {
        margin: 19px 0 8px !important;
        font-size: 18px !important;
    }

    .cms-article-body img,
    .cms-featured-image img,
    .article-detail-image {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        margin: 14px auto !important;
    }

    .cms-article-body iframe,
    .cms-article-body video {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        aspect-ratio: 16/9 !important;
        margin: 15px auto !important;
    }

    .cms-article-body table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        font-size: 12px !important;
    }

    .article-contact-box {
        display: block !important;
        width: 100% !important;
        margin-top: 22px !important;
        padding: 18px !important;
    }

    .cms-related-section {
        padding: 25px 0 !important;
    }

    body {
        padding-bottom: 72px !important;
    }
}