/* =========================================================
   DIETMOIDANANG.VN - ARTICLE.CSS
   ---------------------------------------------------------
   CSS chuẩn dùng chung cho:
   - Trang dịch vụ
   - Bài viết SEO
   - Tin tức / kiến thức
   - Nội dung Gutenberg WordPress

   Theme hiện tại:
   Hostinger AI Theme
   Content wrapper:
   .entry-content.wp-block-post-content

   Màu thương hiệu:
   Xanh chính: #0e5739
   Xanh link:  #006308
   Đỏ CTA:     #c90000
   ========================================================= */


/* =========================================================
   1. BIẾN MÀU VÀ THÔNG SỐ CHUNG
   ========================================================= */

:root {
    --dm-green: #0e5739;
    --dm-green-dark: #084f2d;
    --dm-green-link: #006308;
    --dm-green-light: #f2f8f4;

    --dm-red: #c90000;
    --dm-red-dark: #a90000;

    --dm-text: #292929;
    --dm-text-light: #606760;
    --dm-border: #dce6df;

    --dm-bg-light: #f7faf8;
    --dm-bg-green: #f1f8f3;
    --dm-bg-yellow: #fff9e8;
    --dm-bg-red: #fff4f4;

    --dm-radius: 8px;
}


/* =========================================================
   2. PHẠM VI NỘI DUNG BÀI VIẾT
   ---------------------------------------------------------
   Không áp dụng vào WooCommerce.
   Tăng độ rộng content mặc định WordPress từ 700px lên 900px.
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content {
    --wp--style--global--content-size: 900px;
    --wp--style--global--wide-size: 1100px;

    color: var(--dm-text);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.8;

    word-wrap: break-word;
    overflow-wrap: break-word;
}


/* =========================================================
   3. TITLE H1 DO THEME HOSTINGER TẠO
   ---------------------------------------------------------
   Đây chính là H1 nằm ngoài .entry-content trong source.
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.hostinger-ai-page-title.wp-block-post-title {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;

    padding-top: 38px !important;
    padding-bottom: 32px !important;

    color: var(--dm-green-dark);
    font-family: DMSans, sans-serif;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.25;
}


/* =========================================================
   4. PARAGRAPH
   ---------------------------------------------------------
   Override khoảng cách block 40px mặc định của Gutenberg.
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content > p,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .wp-block-paragraph {
    margin-top: 0;
    margin-bottom: 18px;

    color: var(--dm-text);
    font-size: 17px;
    line-height: 1.8;
}


/* Paragraph rỗng cuối bài */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content p:empty {
    display: none;
}


/* =========================================================
   5. H1 / H2 / H3 / H4 TRONG NỘI DUNG
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h1,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h2,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h3,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h4,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h5,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h6 {
    font-family: DMSans, sans-serif;
    font-style: normal;
    font-weight: 700;

    line-height: 1.35;
    letter-spacing: normal;

    scroll-margin-top: 100px;
}


/* H1 nằm trong bài.
   Thực tế nên tránh vì theme đã có H1 bên ngoài. */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h1 {
    margin-top: 10px;
    margin-bottom: 22px;

    color: var(--dm-green-dark);
    font-size: 34px;
}


/* H2 */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h2 {
    margin-top: 40px;
    margin-bottom: 17px;

    padding-bottom: 9px;

    color: var(--dm-green-dark);
    font-size: 27px;

    border-bottom: 2px solid #e3ece6;
}


/* H3 */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h3 {
    margin-top: 29px;
    margin-bottom: 12px;

    color: var(--dm-green);
    font-size: 21px;
}


/* H4 */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h4 {
    margin-top: 25px;
    margin-bottom: 10px;

    color: #164b35;
    font-size: 19px;
}


/* H5 */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content h5 {
    margin-top: 22px;
    margin-bottom: 10px;

    color: var(--dm-text);
    font-size: 18px;
}


/* =========================================================
   6. STRONG / EM
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content strong,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content b {
    font-weight: 700;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content em,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content i {
    font-style: italic;
}


/* =========================================================
   7. LINK TRONG BÀI VIẾT
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content a:not(.wp-element-button) {
    color: var(--dm-green-link);
    font-weight: 500;
    text-decoration: none;

    text-decoration-thickness: 1px;
    text-underline-offset: 3px;

    transition:
        color 0.2s ease,
        text-decoration-color 0.2s ease;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content a:not(.wp-element-button):hover {
    color: var(--dm-red);
    text-decoration: underline;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content a:not(.wp-element-button):focus-visible {
    outline: 2px solid var(--dm-green);
    outline-offset: 3px;
}


/* Link số điện thoại */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content a[href^="tel:"] {
    color: var(--dm-red);
    font-weight: 700;
}


/* =========================================================
   8. UL / OL
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ul.wp-block-list,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ol.wp-block-list,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ul,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ol {
    margin-top: 5px;
    margin-bottom: 22px;

    padding-left: 30px;

    color: var(--dm-text);
}


/* Tránh tác động danh sách bên trong navigation/component */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content li {
    margin-bottom: 8px;

    line-height: 1.7;
}


/* Bullet UL */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ul li::marker {
    color: var(--dm-green-link);
}


/* Số OL */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content ol li::marker {
    color: var(--dm-red);
    font-weight: 700;
}


/* Danh sách lồng nhau */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content li ul,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content li ol {
    margin-top: 8px;
    margin-bottom: 8px;
}


/* =========================================================
   9. ẢNH WORDPRESS / GUTENBERG
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
figure.wp-block-image {
    margin-top: 26px;
    margin-bottom: 28px;
}


/* Ảnh đầu tiên của bài */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
> figure.wp-block-image:first-child {
    margin-top: 0;
    margin-bottom: 28px;
}


/* Image */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-image img,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
img {
    max-width: 100%;
    height: auto;

    border-radius: 7px;
}


/* Ảnh căn giữa */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-image.aligncenter {
    margin-left: auto;
    margin-right: auto;
}


/* Caption */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-image figcaption,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content figcaption {
    margin-top: 9px;
    margin-bottom: 0;

    color: var(--dm-text-light);
    font-size: 14px;
    font-style: italic;
    line-height: 1.55;
    text-align: center;
}


/* =========================================================
   10. VIDEO / YOUTUBE / EMBED
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-embed,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-video {
    margin-top: 28px;
    margin-bottom: 30px;
}


/* Gutenberg responsive embed */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-embed__wrapper {
    position: relative;
}


/* Iframe */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content iframe,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content video {
    max-width: 100%;
}


/* Class video tự chèn */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .video-responsive {
    position: relative;

    width: 100%;
    height: 0;

    margin: 28px 0;

    padding-bottom: 56.25%;

    overflow: hidden;

    border-radius: var(--dm-radius);
    background: #000;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.video-responsive iframe {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    border: 0;
}


/* =========================================================
   11. BLOCKQUOTE
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content blockquote,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .wp-block-quote {
    margin: 26px 0;
    padding: 18px 22px;

    color: #37463d;
    background: var(--dm-bg-light);

    border: 0;
    border-left: 5px solid var(--dm-green);

    border-radius: 0 var(--dm-radius) var(--dm-radius) 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content blockquote p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   12. TABLE WORDPRESS
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
figure.wp-block-table {
    width: 100%;

    margin-top: 26px;
    margin-bottom: 30px;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;
}


/* Table */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content table {
    width: 100%;

    margin: 0;

    border-collapse: collapse;
    border-spacing: 0;

    color: var(--dm-text);
    background: #fff;

    font-size: 16px;
    line-height: 1.6;
}


/* Caption */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content table caption,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-table figcaption {
    margin-bottom: 10px;

    color: var(--dm-green-dark);

    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
}


/* Cell */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content th,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content td {
    padding: 12px 14px;

    border: 1px solid #d7ded9;

    vertical-align: top;
    text-align: left;
}


/* Header */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content th {
    color: #fff;
    background: var(--dm-green);

    font-weight: 700;
}


/* Zebra */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content tbody tr:nth-child(even) {
    background: #f7f9f8;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content tbody tr:hover {
    background: #f0f7f3;
}


/* =========================================================
   13. HR
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content hr,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .wp-block-separator {
    height: 1px;

    margin-top: 34px;
    margin-bottom: 34px;

    border: 0;

    background: #dfe6e1;
}


/* =========================================================
   14. MỤC LỤC - CLASS CHUẨN KHUYẾN NGHỊ
   ---------------------------------------------------------
   HTML:
   <nav class="article-toc" aria-label="Mục lục bài viết">
      ...
   </nav>
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-toc {
    margin: 25px 0 35px;

    padding: 22px 25px;

    background: #f3f9f5;

    border: 1px solid #d4e5da;
    border-left: 5px solid var(--dm-green);

    border-radius: var(--dm-radius);
}


/* H2 mục lục */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc h2 {
    margin: 0 0 14px;

    padding: 0 0 10px;

    color: var(--dm-green-dark);

    font-size: 22px;

    border-bottom: 1px solid #d5e3da;
}


/* Danh sách mục lục */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc ol,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc ul {
    margin: 0;
    padding-left: 25px;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc li {
    margin-bottom: 7px;
}


/* Link mục lục */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc a {
    color: var(--dm-green-dark);
    font-weight: 500;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-toc a:hover {
    color: var(--dm-red);
}


/* =========================================================
   15. BOX DÙNG CHUNG
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-box {
    margin: 26px 0;

    padding: 20px 22px;

    background: var(--dm-bg-light);

    border: 1px solid var(--dm-border);

    border-radius: var(--dm-radius);
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-box > :first-child {
    margin-top: 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-box > :last-child {
    margin-bottom: 0;
}


/* =========================================================
   16. BOX NOTE
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-note {
    margin: 26px 0;

    padding: 18px 20px;

    background: var(--dm-bg-yellow);

    border-left: 5px solid #d79b00;

    border-radius: 5px;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-note > :last-child {
    margin-bottom: 0;
}


/* =========================================================
   17. BOX QUAN TRỌNG
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-important {
    margin: 26px 0;

    padding: 18px 20px;

    background: var(--dm-bg-red);

    border-left: 5px solid var(--dm-red);

    border-radius: 5px;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-important > :last-child {
    margin-bottom: 0;
}


/* =========================================================
   18. BOX HIGHLIGHT XANH
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-highlight {
    margin: 26px 0;

    padding: 18px 20px;

    background: var(--dm-bg-green);

    border-left: 5px solid var(--dm-green-link);

    border-radius: 5px;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-highlight > :last-child {
    margin-bottom: 0;
}


/* =========================================================
   19. BOX LIÊN HỆ
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-contact {
    margin: 30px 0;

    padding: 23px 24px;

    color: var(--dm-text);

    background: #f1f8f3;

    border: 1px solid #ccdfd2;
    border-left: 5px solid var(--dm-green);

    border-radius: var(--dm-radius);
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-contact h2,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-contact h3 {
    margin-top: 0;

    padding-bottom: 0;

    border-bottom: 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-contact p:last-child {
    margin-bottom: 0;
}


/* Hotline trong contact box */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-contact a[href^="tel:"] {
    color: var(--dm-red);
    font-size: 18px;
    font-weight: 700;
}


/* =========================================================
   20. CTA
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-cta {
    margin: 32px 0;

    padding: 26px;

    text-align: center;

    background: #f0f8f3;

    border: 1px solid #cfe2d5;

    border-radius: 10px;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-cta h2,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-cta h3 {
    margin-top: 0;

    padding-bottom: 0;

    border-bottom: 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-cta p {
    margin-bottom: 14px;
}


/* Nút gọi */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-btn-call {
    display: inline-block;

    margin: 7px 4px;

    padding: 12px 24px;

    color: #fff !important;
    background: var(--dm-red);

    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;

    text-decoration: none !important;

    border-radius: 6px;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-btn-call:hover {
    color: #fff !important;
    background: var(--dm-red-dark);

    text-decoration: none !important;

    transform: translateY(-1px);
}


/* Nút xanh */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-btn-green {
    display: inline-block;

    margin: 7px 4px;

    padding: 12px 24px;

    color: #fff !important;
    background: var(--dm-green-link);

    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;

    text-decoration: none !important;

    border-radius: 6px;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-btn-green:hover {
    color: #fff !important;
    background: var(--dm-green-dark);

    text-decoration: none !important;

    transform: translateY(-1px);
}


/* =========================================================
   21. FAQ
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .faq-list {
    margin: 25px 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .faq-item {
    margin-bottom: 15px;

    padding: 18px 20px;

    background: #fff;

    border: 1px solid #dce5df;

    border-radius: var(--dm-radius);
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.faq-item h3 {
    margin: 0 0 9px;

    color: var(--dm-green-dark);

    font-size: 19px;
    line-height: 1.45;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.faq-item p {
    margin: 0;

    font-size: 16px;
    line-height: 1.75;
}


/* =========================================================
   22. STEP / QUY TRÌNH
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-step {
    position: relative;

    margin: 18px 0;

    padding: 18px 20px 18px 22px;

    background: #f8faf9;

    border-left: 4px solid var(--dm-green);

    border-radius: 0 7px 7px 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-step h3 {
    margin-top: 0;
}

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.article-step p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   23. LEAD - ĐOẠN MỞ ĐẦU
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content .article-lead {
    margin-bottom: 22px;

    color: #34473b;

    font-size: 19px;
    line-height: 1.75;
}


/* =========================================================
   24. WP COLUMNS TRONG BÀI VIẾT
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-columns {
    margin-top: 25px;
    margin-bottom: 28px;

    gap: 25px;
}


/* =========================================================
   25. GROUP BLOCK TRONG BÀI
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.wp-block-group {
    box-sizing: border-box;
}


/* =========================================================
   26. ALIGN WIDE / FULL
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content
.alignwide {
    max-width: 1100px;
}


/* =========================================================
   27. KHÔNG ĐỂ TEXT / LINK LÀM VỠ MOBILE
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content p,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content li,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content td,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content th,
body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content a {
    overflow-wrap: break-word;
    word-break: normal;
}


/* =========================================================
   28. ANCHOR
   ---------------------------------------------------------
   Khi click mục lục, tiêu đề không bị header che.
   ========================================================= */

body.wp-singular:not(.woocommerce-page)
.entry-content.wp-block-post-content [id] {
    scroll-margin-top: 100px;
}


/* =========================================================
   29. TABLET <= 991px
   ========================================================= */

@media (max-width: 991px) {

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content {
        --wp--style--global--content-size: 100%;

        font-size: 16px;
        line-height: 1.75;
    }


    body.wp-singular:not(.woocommerce-page)
    .hostinger-ai-page-title.wp-block-post-title {
        font-size: 32px;

        padding-top: 32px !important;
        padding-bottom: 27px !important;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h1 {
        font-size: 30px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h2 {
        font-size: 24px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h3 {
        font-size: 20px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content p,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content .wp-block-paragraph {
        font-size: 16px;
    }
}


/* =========================================================
   30. MOBILE <= 767px
   ========================================================= */

@media (max-width: 767px) {

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content {
        font-size: 16px;
        line-height: 1.72;
    }


    /* H1 của Page */

    body.wp-singular:not(.woocommerce-page)
    .hostinger-ai-page-title.wp-block-post-title {
        padding-top: 25px !important;
        padding-bottom: 22px !important;

        font-size: 27px;
        line-height: 1.3;
    }


    /* Heading */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h1 {
        margin-bottom: 18px;

        font-size: 27px;
        line-height: 1.3;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h2 {
        margin-top: 32px;
        margin-bottom: 14px;

        padding-bottom: 8px;

        font-size: 22px;
        line-height: 1.4;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h3 {
        margin-top: 25px;
        margin-bottom: 10px;

        font-size: 19px;
        line-height: 1.45;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h4 {
        font-size: 18px;
    }


    /* Paragraph */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content > p,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content .wp-block-paragraph {
        margin-bottom: 16px;

        font-size: 16px;
        line-height: 1.72;
    }


    /* List */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content ul.wp-block-list,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content ol.wp-block-list,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content ul,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content ol {
        padding-left: 24px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content li {
        margin-bottom: 7px;

        line-height: 1.65;
    }


    /* Ảnh */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    figure.wp-block-image {
        margin-top: 22px;
        margin-bottom: 24px;
    }


    /* TOC */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-toc {
        margin: 22px 0 30px;

        padding: 18px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-toc h2 {
        font-size: 21px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-toc ol,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-toc ul {
        padding-left: 22px;
    }


    /* Box */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-box,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-note,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-important,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-highlight,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-contact,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-cta {
        padding: 18px;
    }


    /* Table */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    figure.wp-block-table {
        width: 100%;
        max-width: 100%;

        overflow-x: auto;

        -webkit-overflow-scrolling: touch;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    figure.wp-block-table table {
        min-width: 650px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content th,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content td {
        padding: 10px 12px;

        font-size: 15px;
    }


    /* Raw table không có wp-block-table */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    > table {
        display: block;

        width: 100%;
        max-width: 100%;

        overflow-x: auto;

        -webkit-overflow-scrolling: touch;
    }


    /* CTA */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-call,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-green {
        padding: 11px 18px;

        font-size: 16px;
    }
}


/* =========================================================
   31. MOBILE NHỎ <= 480px
   ========================================================= */

@media (max-width: 480px) {

    body.wp-singular:not(.woocommerce-page)
    .hostinger-ai-page-title.wp-block-post-title {
        font-size: 25px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h1 {
        font-size: 25px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h2 {
        font-size: 21px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content h3 {
        font-size: 18px;
    }


    /* CTA button full width */

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-call,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-green {
        display: block;

        width: 100%;

        margin: 9px 0;

        box-sizing: border-box;

        text-align: center;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-cta {
        padding: 17px;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-contact {
        padding: 17px;
    }
}


/* =========================================================
   32. PRINT
   ========================================================= */

@media print {

    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content {
        color: #000;

        font-size: 12pt;
        line-height: 1.6;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-call,
    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content
    .article-btn-green {
        display: none;
    }


    body.wp-singular:not(.woocommerce-page)
    .entry-content.wp-block-post-content a {
        color: #000 !important;
        text-decoration: none;
    }
}