body.view-article-page-body {
    background: linear-gradient(180deg, #f3f7fc 0%, #ffffff 42%, #ffffff 100%);
}

    body.view-article-page-body .site-header {
        background: rgba(7, 18, 29, 0.85);
        backdrop-filter: blur(14px);
    }

    body.view-article-page-body .category-hero-breadcrumbs {
        /* display: block !important; */
    }

    body.view-article-page-body .category-hero-content {
        max-width: 900px;
        margin: 0 auto;
    }

    body.view-article-page-body .view-article-hero-copy {
        /* max-width: 760px; */
        /* margin: 0 auto; */
    }

    body.view-article-page-body .view-article-page {
        padding-bottom: 50px;
    }

    body.view-article-page-body .view-article-layout {
        padding-top: 32px;
        padding-bottom: 0;
    }

    body.view-article-page-body .view-article-reading {
        max-width: 860px;
        margin: 0 auto;
    }

    body.view-article-page-body .view-article-content {
        color: #19334b;
        /* font-size: 1.04rem; */
        line-height: 1.6;
    }

        body.view-article-page-body .view-article-content p {
            margin: 0 0 20px;
            color: #2a4359;
        }

        body.view-article-page-body .view-article-content h2,
        body.view-article-page-body .view-article-content h3,
        body.view-article-page-body .view-article-content h4 {
            margin: 34px 0 14px;
            color: #0d273b;
            font-weight: 700;
            line-height: 1.35;
        }

        body.view-article-page-body .view-article-content h2 {
            font-size: clamp(1.45rem, 2vw, 1.85rem);
        }

        body.view-article-page-body .view-article-content h3 {
            font-size: clamp(1.25rem, 1.8vw, 1.55rem);
        }

        body.view-article-page-body .view-article-content h4 {
            font-size: clamp(1.1rem, 1.6vw, 1.3rem);
        }

        body.view-article-page-body .view-article-content ul,
        body.view-article-page-body .view-article-content ol {
            margin: 0 0 20px;
            padding-right: 22px;
        }

        body.view-article-page-body .view-article-content li {
            margin-bottom: 9px;
        }

        body.view-article-page-body .view-article-content blockquote {
            margin: 24px 0;
            padding: 16px 18px;
            border-right: 4px solid #2b8df2;
            background: #f3f8fe;
            border-radius: 10px;
            color: #163750;
        }

        body.view-article-page-body .view-article-content a {
            color: #0f76c6;
            text-decoration: underline;
            text-underline-offset: 2px;
        }

        body.view-article-page-body .view-article-content img {
            max-width: 100%;
            height: auto;
            border-radius: 16px;
            margin: 24px auto;
            display: block;
        }

        body.view-article-page-body .view-article-content table {
            width: 100%;
            margin: 24px 0;
            border-collapse: collapse;
            font-size: 0.96rem;
        }

            body.view-article-page-body .view-article-content table th,
            body.view-article-page-body .view-article-content table td {
                border: 1px solid #d6e4f0;
                padding: 10px 12px;
            }

            body.view-article-page-body .view-article-content table th {
                background: #f3f8fe;
                color: #173850;
                font-weight: 700;
            }

    body.view-article-page-body .viewarticle .view-article-gallery {
        margin-top: 46px;
    }

    body.view-article-page-body .view-article-gallery-title {
        margin: 0 0 18px;
        font-size: clamp(1.2rem, 1.7vw, 1.5rem);
        color: #102c43;
        font-weight: 700;
    }

    body.view-article-page-body .viewarticle .images {
        display: grid;
        gap: 16px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

        body.view-article-page-body .viewarticle .images .item {
            width: auto;
            float: none;
            margin: 0;
            padding: 0;
            border-radius: 18px;
            overflow: hidden;
            background: #ffffff;
            border: 1px solid rgba(18, 55, 90, 0.08);
            box-shadow: 0 10px 26px rgba(9, 29, 49, 0.08);
        }

        body.view-article-page-body .viewarticle .images a {
            display: block;
            width: 100%;
            position: relative;
            overflow: hidden;
        }

        body.view-article-page-body .viewarticle .images img {
            width: 100%;
            display: block;
            margin-bottom: 0;
            aspect-ratio: 16 / 10;
            object-fit: cover;
            transition: transform 0.42s ease;
        }

        body.view-article-page-body .viewarticle .images a:hover img {
            transform: scale(1.04);
        }

        body.view-article-page-body .viewarticle .images a .zoom {
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(7, 18, 29, 0) 20%, rgba(7, 18, 29, 0.42) 100%);
            transition: background 0.28s ease;
        }

        body.view-article-page-body .viewarticle .images a:hover .zoom {
            background: linear-gradient(180deg, rgba(7, 18, 29, 0.08) 20%, rgba(7, 18, 29, 0.58) 100%);
        }

        body.view-article-page-body .viewarticle .images .zoom i {
            font-size: 1.6rem;
            color: rgba(255, 255, 255, 0);
            width: 44px;
            height: 44px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            transition: color 0.28s ease;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        body.view-article-page-body .viewarticle .images a:hover .zoom i {
            color: #ffffff;
        }

        body.view-article-page-body .viewarticle .images h3,
        body.view-article-page-body .view-article-image-title {
            margin: 0;
            padding: 12px 14px;
            font-size: 1rem;
            line-height: 1.6;
            color: #1f3a52;
            border-top: 1px solid #edf3f8;
            text-align: right;
        }

@media (max-width: 991.98px) {
    body.view-article-page-body .view-article-layout {
        padding-top: 26px;
    }

    body.view-article-page-body .view-article-reading {
        max-width: 100%;
    }
}

@media (max-width: 767.98px) {
    body.view-article-page-body .view-article-content {
        font-size: 1.129rem;
        line-height: 1.82;
    }

        body.view-article-page-body .view-article-content p {
            margin-bottom: 16px;
        }

    body.view-article-page-body .viewarticle .images {
        grid-template-columns: 1fr;
        gap: 12px;
    }

        body.view-article-page-body .viewarticle .images .item {
            border-radius: 14px;
        }
}