/**
 * Scale Fix - Per-element font-size reduction for Windows scaled displays
 * Detects DPR via min-resolution, targets desktop only (hover + pointer: fine)
 * 125% (DPR 1.25) → ×0.8  |  150% (DPR 1.5) → ×0.667  |  175% (DPR 1.75) → ×0.571
 *
 * Lj Kenji - Fix: 25-FEB-2026
 */

/* ==========================================================================
   1. Scale Factor Detection — Desktop only (min-width: 960px excludes mobile)
   ========================================================================== */

/* 125% Windows Scaling (DPR 1.25, viewport ~1536px) */
@media only screen and (min-resolution: 1.25dppx) and (min-width: 960px) {
    :root { --sf: 0.8; }
}

/* 150% Windows Scaling (DPR 1.5, viewport ~1280px) */
@media only screen and (min-resolution: 1.5dppx) and (min-width: 960px) {
    :root { --sf: 0.667; }
}

/* 175% Windows Scaling (DPR 1.75, viewport ~1097px) */
@media only screen and (min-resolution: 1.75dppx) and (min-width: 960px) {
    :root { --sf: 0.571; }
}

/* ==========================================================================
   2. Per-Element Font-Size Overrides
      Active only when DPR ≥ 1.25 on desktop devices.
      Uses CSS custom property --sf so the 3 scale levels work automatically.
      Base values taken from desktop (non-responsive) declarations.
   ========================================================================== */

@media only screen and (min-resolution: 1.25dppx) and (min-width: 960px) {

    /* ------------------------------------------------------------------
       Header / Navigation
       ------------------------------------------------------------------ */
    .header-main-site .menu-main a { font-size: calc(20px * var(--sf)) !important; }
    .header-main-site .popup-form .content .close { font-size: calc(14px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Footer
       ------------------------------------------------------------------ */
    .footer-main { font-size: calc(14px * var(--sf)) !important; }
    .footer-main .content .frm-mes { font-size: calc(12px * var(--sf)) !important; }
    .footer-main .content .left ._form_group ._error_msg { font-size: calc(12px * var(--sf)) !important; }
    .footer-main .content .left ._form_group:last-child select { font-size: calc(14px * var(--sf)) !important; }
    .footer-main .content .left ._form_group input { font-size: calc(14px * var(--sf)) !important; }
    .footer-main .content .left ._form_group input::placeholder { font-size: calc(14px * var(--sf)) !important; }
    .footer-main .content .left .cm-see-more { font-size: calc(15px * var(--sf)) !important; }
    .footer-main .content .label { font-size: calc(22px * var(--sf)) !important; }
    .footer-main .coppy { font-size: calc(12px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Popup Form
       ------------------------------------------------------------------ */
    .popup-form .frm-mes { font-size: calc(12px * var(--sf)) !important; }
    .popup-form .content .close { font-size: calc(14px * var(--sf)) !important; }
    .popup-form .content .label { font-size: calc(34px * var(--sf)) !important; }
    .popup-form .content ._form_group ._error_msg { font-size: calc(12px * var(--sf)) !important; }
    .popup-form .content ._form_group:last-child select { font-size: calc(18px * var(--sf)) !important; }
    .popup-form .content ._form_group label { font-size: calc(18px * var(--sf)) !important; }
    .popup-form .content ._form_group input { font-size: calc(18px * var(--sf)) !important; }
    .popup-form .content .cm-see-more { font-size: calc(18px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Components: Banner, Button, Title, Pagination
       ------------------------------------------------------------------ */
    .cm-banner .title { font-size: calc(68px * var(--sf)) !important; }
    .cm-see-more { font-size: calc(24px * var(--sf)) !important; }
    .pagination_list_def .paginate_links a,
    .pagination_list_def .paginate_links span { font-size: calc(20px * var(--sf)) !important; }
    .cm-title { font-size: calc(42px * var(--sf)) !important; }
    .cm-title-under { font-size: calc(42px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Home Page — Hero (.h_ss1)
       ------------------------------------------------------------------ */
    .h_ss1 .abs .top .left h2:nth-child(1) { font-size: calc(46px * var(--sf)) !important; }
    .h_ss1 .abs .top .left h2:nth-child(2) { font-size: calc(80px * var(--sf)) !important; }
    .h_ss1 .abs .top .left h2:nth-child(2) p { font-size: calc(112.6px * var(--sf)) !important; }
    .h_ss1 .abs .top .right h2 { font-size: calc(80px * var(--sf)) !important; }
    .h_ss1 .abs .contact { font-size: calc(26px * var(--sf)) !important; }

    /* Home Page — Slider (.h_ss2) */
    .h_ss2 .swiper .swiper-slide .abs .title { font-size: calc(22px * var(--sf)) !important; }
    .h_ss2 .swiper .swiper-slide .abs .exp { font-size: calc(13px * var(--sf)) !important; }

    /* Home Page — Map (.h_ss3) */
    .h_ss3 .map .content .row .item { font-size: calc(18px * var(--sf)) !important; }

    /* Home Page — News (.h_ss5) */
    .h_ss5 .swiper-slide .desc h3 { font-size: calc(28px * var(--sf)) !important; }
    .h_ss5 .swiper-slide .desc p { font-size: calc(14px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Vị Trí Page — Hero (.h_ss1)
       ------------------------------------------------------------------ */
    .vitri_page .h_ss1 .abs .bot_abs { margin-top: -35px !important; }
    .vitri_page .h_ss1 .abs .top_abs p:nth-child(1) { font-size: calc(40px * var(--sf)) !important; }
    .vitri_page .h_ss1 .abs .top_abs p:nth-child(2) { font-size: calc(80px * var(--sf)) !important; }
    .vitri_page .h_ss1 .abs .bot_abs p:nth-child(1) { font-size: calc(90px * var(--sf)) !important; }
    .vitri_page .h_ss1 .abs .bot_abs p:nth-child(2) { font-size: calc(40px * var(--sf)) !important; }

    /* Vị Trí Page — Section 3 (.ss3) */
    .vitri_page .ss3 .left .title { font-size: calc(20px * var(--sf)) !important; }

    /* Vị Trí Page — Section 4 (.ss4) */
    .vitri_page .ss4 .title .up { font-size: calc(38px * var(--sf)) !important; }
    .vitri_page .ss4 .title > p.up:last-child { margin-top: 10px !important; }
    .vitri_page .ss4 .title .mid .left { font-size: calc(30px * var(--sf)) !important; }
    .vitri_page .ss4 .title .mid .right { font-size: calc(42px * var(--sf)) !important; }
    .vitri_page .ss4 .swiper1 .swiper-slide p { font-size: calc(28px * var(--sf)) !important; }
    .vitri_page .ss4 .content .swiper-slide p { font-size: calc(20px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Sản Phẩm Page
       ------------------------------------------------------------------ */
    .page-product .cm_option { font-size: calc(24px * var(--sf)) !important; }
    .page-product .cm_option .right .list li { font-size: calc(20px * var(--sf)) !important; }
    .page-product .cm_tab li { font-size: calc(14px * var(--sf)) !important; }
    .page-product .subdivision_content h3 { font-size: calc(80px * var(--sf)) !important; }
    .page-product .subdivision_content .subdivision_des { font-size: calc(20px * var(--sf)) !important; }
    .page-product .product_content .product_wrap .left .title { font-size: calc(34px * var(--sf)) !important; }
    .page-product .product_content .product_wrap .left .tab_content ul li { font-size: calc(15px * var(--sf)) !important; }
    .page-product .product_content .product_wrap .left .tab_content p { font-size: calc(14px * var(--sf)) !important; }
    .page-product .product_album .list .item h3 { font-size: calc(22px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Tiện Ích Page
       ------------------------------------------------------------------ */
    .page-utilities .cm-banner .title_other p:nth-of-type(1) { font-size: calc(52px * var(--sf)) !important; }
    .page-utilities .cm-banner .title_other p:nth-of-type(2) span:nth-of-type(1) { font-size: calc(150px * var(--sf)) !important; }
    .page-utilities .cm-banner .title_other p:nth-of-type(2) span:nth-of-type(2) { font-size: calc(70px * var(--sf)) !important; margin-top: -36px !important; margin-left: 28px !important; }
    .page-utilities .utilities_overview .right .title p:nth-of-type(1) { font-size: calc(22px * var(--sf)) !important; }
    .page-utilities .utilities_overview .right .title p:nth-of-type(2) span:nth-of-type(1) { font-size: calc(68px * var(--sf)) !important; }
    .page-utilities .utilities_overview .right .title p:nth-of-type(2) span:nth-of-type(2) { font-size: calc(34px * var(--sf)) !important; margin-top: -15px !important; margin-left: 13px !important; }
    .page-utilities .utilities_overview .right .list li { font-size: calc(14px * var(--sf)) !important; }
    .page-utilities .utilities_overview .right .list li span { font-size: calc(10px * var(--sf)) !important; }
    .page-utilities .utilities_content .utilities_slide .swiper-slide h3 { font-size: calc(22px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Tin Tức Page
       ------------------------------------------------------------------ */
    .page-new .cats .cat { font-size: calc(20px * var(--sf)) !important; }
    .page-new .latest_new .right .sub_title { font-size: calc(15px * var(--sf)) !important; }
    .page-new .latest_new .right .title { font-size: calc(40px * var(--sf)) !important; }
    .page-new .latest_new .right .excerpt { font-size: calc(14px * var(--sf)) !important; }
    .page-new .latest_new .right .cm-see-more { font-size: calc(22px * var(--sf)) !important; }
    .page-new .news_list .item .text h3 { font-size: calc(30px * var(--sf)) !important; }
    .page-new .news_list .item .text .date { font-size: calc(16px * var(--sf)) !important; }
    .page-new .news_list .item .text .excerpt { font-size: calc(14px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Chính Sách Page
       ------------------------------------------------------------------ */
    .page-policy .wrap .des { font-size: calc(20px * var(--sf)) !important; }
    .page-policy .wrap .content .left p:nth-of-type(1) { font-size: calc(220px * var(--sf)) !important; }
    .page-policy .wrap .content .left p:nth-of-type(2) { font-size: calc(100px * var(--sf)) !important; }
    .page-policy .wrap .content .right h3 { font-size: calc(36px * var(--sf)) !important; }

    /* ------------------------------------------------------------------
       Chi Tiết Bài Viết Page
       ------------------------------------------------------------------ */
    .detail_page .h_ss1 .abs .cm-title { font-size: calc(68px * var(--sf)) !important; }
    .detail_page .h_ss1 .abs p { font-size: calc(15px * var(--sf)) !important; }
    .detail_page .content_page .title > h2 { font-size: calc(25px * var(--sf)) !important; }
    .detail_page .content_page .the-content .wp-block-image p,
    .detail_page .content_page .the-content .wp-block-image figcaption,
    .detail_page .content_page .the-content .wp-caption p,
    .detail_page .content_page .the-content .wp-caption figcaption { font-size: calc(14px * var(--sf)) !important; }
    .detail_page .content_page .other .list .item .text h3 { font-size: calc(30px * var(--sf)) !important; }
    .detail_page .content_page .other .list .item .text .date { font-size: calc(16px * var(--sf)) !important; }
    .detail_page .content_page .other .list .item .text .excerpt { font-size: calc(14px * var(--sf)) !important; }

}

/* ==========================================================================
   3. Vị Trí .ss3 — Layout Fix (prevent tablet layout on scaled desktop)
      Original breakpoints preserved with specific viewport width ranges.
   ========================================================================== */

/* 125% scaling — viewport 1024–1280px */
@media only screen and (min-width: 1024px) and (max-width:1280px) and (min-resolution:1.25dppx) {
    .vitri_page .ss3 {
        flex-direction:row!important
    }

    .vitri_page .ss3 .left {
        width: 42.0139%!important;
        font-size: 70%!important
    }

    .vitri_page .ss3 .left ul li {
        padding-left: 49.42px!important
    }

    .vitri_page .ss3 .left ul li:nth-of-type(2n+1) {
        max-width: 50%!important
    }

    .vitri_page .ss3 .right {
        width: 57.9861%!important;
        border-left: #EDFCFB 1px solid!important;
        margin-top: 0!important;
        aspect-ratio: 5/4!important
    }
}

/* 125% scaling — viewport 1281–1536px */
@media only screen and (min-width: 1281px) and (max-width:1536px) and (min-resolution:1.25dppx) {
    .vitri_page .ss3 {
        flex-direction:row!important
    }

    .vitri_page .ss3 .left {
        width: 42.0139%!important;
        font-size: 70%!important
    }

    .vitri_page .ss3 .left ul li {
        padding-left: 49.42px!important
    }

    .vitri_page .ss3 .left ul li:nth-of-type(2n+1) {
        max-width: 50%!important
    }

    .vitri_page .ss3 .right {
        width: 57.9861%!important;
        border-left: #EDFCFB 1px solid!important;
        margin-top: 0!important;
        aspect-ratio: 5/4!important
    }
}

/* 150% scaling — viewport 960–1100px */
@media only screen and (min-width: 960px) and (max-width:1100px) and (min-resolution:1.5dppx) {
    .vitri_page .ss3 {
        flex-direction:row!important
    }

    .vitri_page .ss3 .left {
        width: 42.0139%!important;
        font-size: 70%!important
    }

    .vitri_page .ss3 .left ul li {
        padding-left: 30px!important
    }

    .vitri_page .ss3 .left ul li:nth-of-type(2n+1) {
        max-width: 50%!important
    }

    .vitri_page .ss3 .right {
        width: 57.9861%!important;
        border-left: #EDFCFB 1px solid!important;
        margin-top: 0!important;
        aspect-ratio: 5/4!important
    }
}