/* header  */

 /* =========================================================================
           3. MEDIA QUERIES SO KHỚP CHUYỂN ĐỔI THIẾT BỊ
           ========================================================================= */
        @media (max-width: 1199.98px) {
            .navbar-custom {
                display: none !important;
            }

            .mobile-header-bar {
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .about-banner-title { font-size: 44px; }
        .about-card-box { padding: 35px 30px; }
        }


        /* =========================================================================
           THÊM MỚI: TỰ ĐỘNG THU NHỎ CHỮ ĐỂ KHÔNG BỊ TRÀN TRÊN LAPTOP CỠ TRUNG [1]
           ========================================================================= */
        @media (min-width: 1200px) and (max-width: 1399.98px) {
            .nav-link-custom {
                font-size: 11px !important;
                /* Thu nhỏ cỡ chữ menu một chút */
                padding-left: 4px !important;
                padding-right: 4px !important;
            }

            .navbar-custom img {
                height: 35px !important;
                /* Thu nhỏ logo một chút */
            }

            .btn-action-primary {
                padding: 8px 14px !important;
                /* Thu nhỏ nút đặt lịch */
                font-size: 12px !important;
            }

            .navbar-custom form input {
                width: 120px !important;
                /* Thu hẹp ô tìm kiếm nhanh */
            }
        }


         @media (max-width: 991.98px) {
        .about-hero-banner { padding: 100px 0 70px 0; }
        .about-banner-title { font-size: 38px; }
        .medical-section-title { font-size: 28px; }
        .pyramid-section-box { padding: 30px; }
        .dont-do-card { padding: 30px; }
        .principles-dark-card { padding: 30px; }


          .mobile-services-swipe-container {
                display: flex !important;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                gap: 16px;
                padding-bottom: 20px;
                scrollbar-width: none;
            }

            .mobile-services-swipe-container::-webkit-scrollbar {
                display: none;
            }

            .mobile-service-item {
                flex: 0 0 160px;
                scroll-snap-align: start;
            }

            .mobile-why-choose-list {
                display: flex;
                flex-direction: column;
                gap: 12px;
            }

              .feat-blog-card {
                flex-direction: column;
                height: auto;
            }

            .feat-blog-img-area {
                width: 100%;
                height: 200px;
                min-height: auto;
            }

            .feat-blog-content-area {
                width: 100%;
                padding: 20px;
            }

            .mobile-topics-swipe {
                display: flex !important;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                gap: 12px;
                padding-bottom: 15px;
                scrollbar-width: none;
            }

            .mobile-topics-swipe::-webkit-scrollbar {
                display: none;
            }

            .mobile-topic-col {
                flex: 0 0 130px;
                scroll-snap-align: start;
            }

            .mobile-video-swipe {
                display: flex !important;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                gap: 15px;
                padding-bottom: 15px;
                scrollbar-width: none;
            }
            .mobile-video-swipe::-webkit-scrollbar {
                display: none;
            }
            .mobile-video-col {
                flex: 0 0 200px;
                scroll-snap-align: start;
            }
                 .mobile-sections-row-swipe {
                display: flex !important;
                flex-direction: column;
                /* Chuyển thành danh sách cuộn dọc gọn gàng */
                gap: 25px;
            }

            .mobile-section-col {
                width: 100%;
            }

            /* Giao diện Ebook trượt trên di động */
            .mobile-ebook-card {
                flex-direction: column-reverse;
                /* Đưa ảnh bìa lên trên trên di động */
                text-align: center;
                padding: 20px;
            }

            .mobile-ebook-card .ebook-form-area,
            .mobile-ebook-card .ebook-image-area {
                width: 100%;
            }

            .mobile-ebook-card .ebook-image-area {
                margin-bottom: 15px;
            }

            .mobile-ebook-card .ebook-cover-img {
                max-height: 180px !important;
            }



              .mobile-testimonials-swipe {
                display: flex !important;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                gap: 15px;
                padding-bottom: 15px;
                scrollbar-width: none;
            }

            .mobile-testimonials-swipe::-webkit-scrollbar {
                display: none;
            }

            /* THAY THẾ BẰNG LỚP CSS MỚI NÀY: */
            .mobile-testimonial-col {
                flex: 0 0 85% !important;
                /* Mở rộng rộng rãi 85% để lộ thẻ kế tiếp giống hệt phần trên [1] */
                max-width: 320px;
                scroll-snap-align: start;
            }


             .mobile-product-swipe {
                flex-wrap: nowrap !important;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                padding-bottom: 20px;
                scrollbar-width: none;
            }

            .mobile-product-swipe::-webkit-scrollbar {
                display: none;
            }

            .mobile-product-col {
                flex: 0 0 65% !important;
                max-width: 240px;
                scroll-snap-align: start;
            }

            .product-img-container {
                height: 160px;
                padding: 10px;
            }

            .product-info-area {
                padding: 15px;
            }

            .product-name-title {
                font-size: 14px;
                height: 40px;
            }
    }

    @media (max-width: 767.98px) {
        .about-hero-banner { padding: 80px 0 50px 0; }
        .about-banner-title { font-size: 32px; }
        .about-banner-desc { font-size: 14px; letter-spacing: 0.5px; }
        .philosophy-quote-box { padding: 30px 24px; font-size: 16px; }
        .pyramid-img-frame { max-height: 300px; }
        .value-item-row { gap: 14px; }
        .table-medical-head th, .table-medical-body td { padding: 14px 16px !important; font-size: 14px; }

            .hero-section {
            display: none !important;
        }

        /* Định dạng tệp tin ảnh Mobile co dãn 100% không bị méo và hở viền */
        .mobile-banner-img {
            width: 100% !important;
            height: 250px;
            display: block !important;
        }

        /* Ẩn các nút điều hướng chuyển slide trên di động để giữ thẩm mỹ */
        .carousel-control-prev,
        .carousel-control-next {
            display: none !important;
        }

        .carousel-indicators {
            bottom: 8px !important;
            margin-bottom: 0 !important;
        }


         .marquee-section-heading { margin-bottom: 25px; }
            .marquee-heading-text { font-size: 12px; padding: 0 10px; }
            .marquee-logo-item { height: 79px !important; } /* Tăng chiều cao logo trên Mobile lên 48px */
            .marquee-slide-track { gap: 35px; }
            .marquee-static-track { gap: 35px; }
    }

    @media (max-width: 575.98px) {
       .about-banner-title { font-size: 24px; }
        .medical-section-title { font-size: 22px; }
        .about-card-box { padding: 25px 20px; }
        .pyramid-section-box { padding: 20px; }
        .dont-do-card { padding: 20px; }
        .principles-dark-card { padding: 20px; }
        
        /* THÊM ĐOẠN NÀY ĐỂ CHỮ TRONG BẢNG TRÊN MOBILE GỌN ĐẸP */
        .table-medical-head th, .table-medical-body td { 
            padding: 10px 12px !important; 
            font-size: 13px !important; 
        }
    }


      @media (max-width: 480px) {
            .buynow {
                font-size: 8px;
                padding-top: .5rem !important
            }

            .addcat {
                font-size: 9px
            }

              .home-donghanh{
                font-size: 15px;
             }
        }