


        body{ font-family:"Roboto";font-size:16px; }



        h1,h2{

            font-family:"Dosis";font-weight:700;

        }

        h3,h4{ font-family:"Dosis";font-size:24px;font-weight:700; }

     



        body{

            background-color: #fff;

        }

      

        .single-intro-text .count-number,

        .header-angle:after,

        .ts-header:after,

        .navbar-nav .nav-item .dropdown-menu li a:hover, .navbar-nav .nav-item .dropdown-menu li a.active,

        .copyright .back-btn,

      

        .owl-carousel.owl-loaded .owl-nav button,

        .title-section-area .section-title:before,

        .owl-carousel.owl-loaded .owl-nav .owl-next.disabled, .owl-carousel.owl-loaded .owl-nav .owl-prev.disabled,

        .service-content .service-icon,

        .owl-carousel .owl-dots button.active,

        .ts-latest-post .post-body .post-date,

        .ts-header-classic .header-angle .ts-navbar,

        .ts-header-classic .header-angle .navbar-light,

        .quote-btn-area .btn,

        .ts-team-standard .ts-team-info .team-content .team-name,

        .ts-tab.nav-tabs .nav-link.active,

        .column-title:before, .column-title-sm:before,

        .ts-top-bar-2.standard,

        .ts-header-transparent .navbar .nav-item .nav-link:after,

        .tag-lists a:hover, .tagcloud a:hover,

        .widget_search .input-group-btn, .search-forms .input-group-btn,

        .blog-post-comment .btn-comments,

        .footer-main .footer-social ul li a:hover,

        .post-content.post-single .post-body .post-footer .post-tags a:hover,

        .ts-pricing-table-standard .plan.plan-highlight .plan-price,

        .plan .plan-tag,

        .button-normal .btn,

        .service-menu li:hover,

        #preloader,

        .ts-header-standard .ts-logo-area .navbar .nav-item .nav-link.active:after,

        .woocommerce ul.products li.product .button,.woocommerce ul.products li.product .added_to_cart,

        .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current,

        .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,.sponsor-web-link a:hover i, .woocommerce .widget_price_filter .ui-slider .ui-slider-range,

        .woocommerce span.onsale

        {

            background-color: #024e90;

        }



        .ts-slider-area.owl-carousel .owl-nav button:hover{

            background-color: #024e90 !important;

        }

        .slider-content h1 span,

        .testimonial-body .quote-icon,

        .ts-latest-post:hover .post-body .post-title a,

        .ts-latest-post:hover .post-body .readmore,

        .ts-service-wrapper:hover .service-content h3, .ts-service-wrapper:hover .service-content h3 > a,

        .ts-service-wrapper:hover .readmore,

        .testimonial-item-single.with-bg .quote-item:before,

        .ts-header-standard .ts-logo-area .navbar-light .navbar-nav .nav-link:focus,

         .ts-header-standard .ts-logo-area .navbar-light .navbar-nav .nav-link:hover,

         .ts-feature-standard .feature-single.feature-single:hover h3 a,

         .ts-team-info:hover .team-content .team-name,

         .ts-team-info .team-content .team-details .team-rating,

         .ts-header-transparent .navbar-light .navbar-nav .nav-link:focus, 

         .ts-header-transparent .navbar-light .navbar-nav .nav-link:hover,

         .post .post-body .entry-title a:hover,

         .readmore,

         .sidebar .widget_archive ul li a:hover,

         .sidebar .widget_categories ul li a:hover,

         .recent-post-widget .media-body .entry-title a:hover,

         .post .post-quote-content .entry-header i,

         .breadcrumb li a,

         .post-content.post-single .post-body .entry-content blockquote p cite,

         blockquote:before,

         .testimonial-item-wrapper .quote-item i,

         .top-contact-info li span,

         .ts-header-transparent .navbar-light .navbar-nav .active>.nav-link,

          .ts-header-transparent .navbar-light .navbar-nav .nav-link.active, 

          .ts-header-transparent .navbar-light .navbar-nav .nav-link:hover:before,

           .ts-header-transparent .navbar-light .navbar-nav .nav-link.show, 

           .ts-header-standard .ts-logo-area .navbar-light .navbar-nav .active>.nav-link, 

           .ts-header-standard .ts-logo-area .navbar-light .navbar-nav .nav-link.active

         .ts-header-transparent .navbar-light .navbar-nav .show>.nav-link,

         .post-content .post-footer .readmore:hover,

         .post-navigation span:hover, .post-navigation h3:hover,

         .woocommerce ul.products li.product .price, 

         .woocommerce ul.products li.product .woocommerce-loop-product__title:hover

         {

            color: #024e90;

        }

        .ts-latest-post .post-body .post-date:before,

        .ts-latest-post:hover .post-body .post-date:before{

            border-top-color: #024e90;

        }

        .ts-latest-post:hover .post-body .readmore i,

        .ts-header-classic .header-angle .ts-navbar,

        .ts-service-wrapper:hover .readmore i,

        .readmore i,

        .footer-main .footer-social ul li a:hover{

            border-color: #024e90;

        }

        .header-angle:before,

        .ts-header-classic .header-angle .navbar-light:before{

            border-right-color: #024e90;

        }



        .ts-team-standard .ts-team-info .team-content .team-name:before,

        .ts-pricing-table-standard .plan.plan-highlight .plan-price:after{

            border-top-color: #024e90;

        }

        .ts-tab.nav-tabs .nav-link.active:after{

            border-left-color: #024e90;

        }



        

        .copyright{

         background: #dd9933;

       } 

       .ts-team-standard .ts-team-info:hover .team-content .team-name{

           color: #fff;

       }



       /* -- secondary color-- */

       .ts-top-bar:before,

       .top-bar-angle:after,

       .ts-top-bar-2.classic,

       .button-normal .btn:hover,

       .woocommerce ul.products li.product .added_to_cart:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,.woocommerce .widget_price_filter .ui-slider .ui-slider-handle{

           background-color:  #dd9933;

       }



       .feature-single .feature-icon,

       .woocommerce ul.products li.product .woocommerce-loop-product__title{

           color: #dd9933;

       }



       .top-bar-angle:before{

        border-right-color: #dd9933;

        border-left-color: #dd9933;

       }

       .btn:after{

        background: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 180 50" preserveAspectRatio="none"><g><polygon fill-rule="evenodd" clip-rule="evenodd" fill="rgb(2, 78, 144)" points="0,0 0,50 166,50 180,37 180,0"/></g></svg>') no-repeat;

       }

       .btn:hover:after{

        background: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 180 50" preserveAspectRatio="none"><g><polygon fill-rule="evenodd" clip-rule="evenodd" fill="rgb(221, 153, 51)" points="0,0 0,50 166,50 180,37 180,0"/></g></svg>') no-repeat;

       }

       .btn-after:after{

            background: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 180 50" preserveAspectRatio="none"><g><polygon fill-rule="evenodd" clip-rule="evenodd" fill="rgb(2, 78, 144)" points="0,0 0,50 166,50 180,37 180,0"/></g></svg>') no-repeat;

       }

       .btn-after:hover:after{

            background: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 180 50" preserveAspectRatio="none"><g><polygon fill-rule="evenodd" clip-rule="evenodd" fill="rgb(221, 153, 51)" points="0,0 0,50 166,50 180,37 180,0"/></g></svg>') no-repeat;

       }

    

    



        

        .footer{

            background: #1a1831;

            padding-top: 0px;

        }

        .footer-main:before{

            background:url(//localhost/nhakhoaatdanang/wp-content/uploads/2024/01/footer_img-e1705059882449.png);

        }

        

        .copyright{

         background:;

      }

     



/* ==========================================================================
   NHA KHOA A&T - MEDICAL BLUE & GOLD THEME SYSTEM (#024e90 / #dd9933)
   ========================================================================== */

:root {
    --nkat-primary: #024e90;
    --nkat-primary-rgb: 2, 78, 144;
    --nkat-secondary: #dd9933;
    --nkat-secondary-rgb: 221, 153, 51;
    --nkat-dark: #1a1831;
}

/* 1. Header & Main Navbar Color Overrides */
.ts-header-classic .header-angle .ts-navbar,
.ts-header-classic .header-angle .navbar-light,
.header-angle:after,
.ts-header:after {
    background-color: #024e90 !important;
}

.header-angle:before,
.ts-header-classic .header-angle .navbar-light:before {
    border-right-color: #024e90 !important;
}

.navbar-nav .nav-item .nav-link {
    color: #ffffff !important;
    font-weight: 500;
}

.navbar-nav .nav-item:hover > .nav-link,
.navbar-nav .nav-item.active > .nav-link {
    color: #dd9933 !important;
}

.navbar-nav .nav-item .dropdown-menu li a:hover,
.navbar-nav .nav-item .dropdown-menu li a.active {
    background-color: #024e90 !important;
    color: #ffffff !important;
}

/* btn-login uses polygon svg */

/* 2. Slider Carousel Controls Positioning */
#carouselExampleControls {
    position: relative;
    overflow: hidden;
}

#carouselExampleControls .carousel-control-prev,
#carouselExampleControls .carousel-control-next {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 70px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
    opacity: 0.85 !important;
    background: transparent !important;
    border: none !important;
}

#carouselExampleControls .carousel-control-prev {
    left: 20px !important;
}

#carouselExampleControls .carousel-control-next {
    right: 20px !important;
}

#carouselExampleControls .carousel-control-circle {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 50px !important;
    height: 50px !important;
    background-color: rgba(2, 78, 144, 0.6) !important;
    border-radius: 50% !important;
    transition: background-color 0.3s ease;
}

#carouselExampleControls .carousel-control-prev:hover .carousel-control-circle,
#carouselExampleControls .carousel-control-next:hover .carousel-control-circle {
    background-color: rgba(2, 78, 144, 0.95) !important;
}

#carouselExampleControls .carousel-control-prev-icon,
#carouselExampleControls .carousel-control-next-icon {
    position: relative;
    z-index: 2;
    width: 20px;
    height: 20px;
}

/* 3. Slider Content CTA Button */
.overlay .btn-link {
    background-color: #024e90 !important;
    color: #ffffff !important;
    border: 2px solid #024e90 !important;
    transition: all 0.3s ease;
    border-radius: 4px;
}

.overlay .btn-link:hover {
    background-color: #dd9933 !important;
    border-color: #dd9933 !important;
    color: #ffffff !important;
}

/* 4. Dental Drill Image Fix (elementor-element-247e37d) */
.elementor-element.elementor-element-247e37d {
    position: absolute !important;
    top: 49px !important;
    right: -33px !important;
    width: 370px !important;
    max-width: 370px !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

.elementor-element.elementor-element-247e37d img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

@media (max-width: 991px) {
    .elementor-element.elementor-element-247e37d {
        display: none !important;
    }
}

/* 5. Fix Generic img-fluid Height */
.img-fluid {
    height: auto !important;
}

.ts-classic-service .service-img img {
    width: 100% !important;
    height: 230px !important;
    object-fit: cover !important;
}

/* 6. Buttons & Accents - #024e90 & #dd9933 */
.btn-classic,
.clicksubmit,
.quote-btn-area .btn,
.button-normal .btn,
.elementor-button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt {
    background-color: #024e90 !important;
    border-color: #024e90 !important;
    color: #ffffff !important;
}

.btn-classic:hover,
.clicksubmit:hover,
.quote-btn-area .btn:hover,
.button-normal .btn:hover,
.elementor-button:hover {
    background-color: #dd9933 !important;
    border-color: #dd9933 !important;
    color: #ffffff !important;
}

.readmore,
.readmore i,
.top-contact-info li span,
.breadcrumb li a,
.ts-service-wrapper:hover .service-content h3,
.ts-service-wrapper:hover .service-content h3 > a,
.ts-service-wrapper:hover .readmore,
.elementor-icon-box-title span,
.title-section-area .section-title span {
    color: #024e90 !important;
}

.title-section-area .section-title:before,
.column-title:before,
.column-title-sm:before,
.ts-latest-post .post-body .post-date {
    background-color: #024e90 !important;
}

/* copyright transparent */

.top-bar-angle:after,
.ts-top-bar:before {
    background-color: #dd9933 !important;
}

.top-bar-angle:before {
    border-right-color: #dd9933 !important;
    border-left-color: #dd9933 !important;
}

/* 7. Video Card Styling */
.elementor-element-8809729 .elementor-widget-container {
    padding: 15px;
}

.elementor-element-8809729 .elementor-video-iframe {
    width: 100%;
    min-height: 180px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* 8. Fix intro cards alignment */
.elementor-element-17517ee .elementor-icon-list-items {
    padding-left: 0;
    list-style: none;
}
.elementor-element-17517ee .elementor-icon-list-item {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}
.elementor-element-17517ee .elementor-icon-list-icon {
    margin-right: 10px;
    color: #dd9933 !important;
}

/* Intro Card Titles Contrast */
.elementor-element-8809729 .elementor-icon-box-title,
.elementor-element-8809729 .elementor-icon-box-title span,
.elementor-element-17517ee .elementor-icon-box-title,
.elementor-element-17517ee .elementor-icon-box-title span,
.elementor-element-13da93f .elementor-icon-box-title,
.elementor-element-13da93f .elementor-icon-box-title span,
.choose-us-classic .elementor-icon-box-title,
.choose-us-classic .elementor-icon-box-title span {
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin-top: 10px !important;
    margin-bottom: 12px !important;
}


/* Zalo Floating Button */
.zalo-floating-widget {
    position: fixed;
    bottom: 85px;
    right: 25px;
    z-index: 99999;
}
.zalo-floating-widget a {
    display: flex;
    align-items: center;
    text-decoration: none;
    background: #0068ff;
    padding: 5px 14px 5px 6px;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(0, 104, 255, 0.45);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation: zaloPulse 2s infinite;
}
.zalo-floating-widget a:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 20px rgba(0, 104, 255, 0.65);
    text-decoration: none;
}
.zalo-floating-widget .zalo-icon-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
}
.zalo-floating-widget .zalo-text {
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
@keyframes zaloPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 104, 255, 0.65);
    }
    70% {
        box-shadow: 0 0 0 14px rgba(0, 104, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(0, 104, 255, 0);
    }
}
@media (max-width: 767px) {
    .zalo-floating-widget {
        bottom: 75px;
        right: 15px;
    }
    .zalo-floating-widget .zalo-text {
        display: none;
    }
    .zalo-floating-widget a {
        padding: 4px;
        border-radius: 50%;
    }
    .zalo-floating-widget .zalo-icon-circle {
        margin-right: 0;
    }
}

/* Fix button Theo dõi điều trị in Xem Lịch Hẹn */
#btn-see.btn-classic,
.appoinment-form #btn-see {
    white-space: nowrap !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 48px !important;
    width: 100% !important;
    line-height: 1 !important;
    background-color: #024e90 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    border: none !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 4px 10px rgba(2, 78, 144, 0.25) !important;
}
#btn-see.btn-classic:hover {
    background-color: #dd9933 !important;
    color: #ffffff !important;
}
#btn-see.btn-classic i {
    margin-left: 5px !important;
}

/* Fix Login Button Clean Positioning */
.btn-login {
    position: relative !important;
    z-index: 10 !important;
    border: none !important;
    cursor: pointer !important;
}
.btn-login a {
    color: #ffffff !important;
    text-decoration: none !important;
    display: block !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

/* ========================================================
   Header Slant, Login Polygon, Footer & Zalo Positioning
   ======================================================== */

/* 1. Header: Remove horizontal line under logo */
.ts-header:after {
    display: none !important;
}

.header-angle {
    background-color: transparent !important;
    position: relative !important;
    z-index: 2 !important;
    margin-bottom: -15px !important;
}

/* Original Autrics Header Slant: 68% default desktop, 62.5% on >= 1600px */
.header-angle:after {
    background-color: #024e90 !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 68% !important;
    height: 100% !important;
    content: "" !important;
    z-index: -1 !important;
}
.header-angle:before {
    position: absolute !important;
    top: 0 !important;
    right: 68% !important;
    content: "" !important;
    border-right: 56px solid #024e90 !important;
    border-top: 58px solid transparent !important;
    z-index: 1 !important;
}

@media (min-width: 1600px) {
    .header-angle:after {
        width: 62.5% !important;
    }
    .header-angle:before {
        right: 62.5% !important;
    }
}
@media (min-width: 1200px) and (max-width: 1599px) {
    .header-angle:after {
        width: 68% !important;
    }
    .header-angle:before {
        right: 68% !important;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .header-angle:after {
        width: 72% !important;
    }
    .header-angle:before {
        right: 72% !important;
    }
}

/* 2. Desktop Navigation (>= 992px) */
@media (min-width: 992px) {
    .header-angle .navbar .navbar-nav {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
    }
    .header-angle .navbar .navbar-nav > li {
        margin-right: 24px !important;
    }
    .header-angle .navbar .navbar-nav > li > a,
    .header-angle .navbar .nav-item .nav-link,
    #primary-nav #main-menu > li > a {
        color: #ffffff !important;
        text-transform: uppercase !important;
        font-weight: 700 !important;
        font-size: 15px !important;
        font-family: 'Dosis', sans-serif !important;
        letter-spacing: 0.5px !important;
        padding: 17px 6px !important;
        display: block !important;
        white-space: nowrap !important;
        transition: color 0.2s ease !important;
    }
    .header-angle .navbar .navbar-nav > li.active > a,
    .header-angle .navbar .navbar-nav > li > a:hover,
    #primary-nav #main-menu > li > a:hover,
    #primary-nav #main-menu > li.active > a {
        color: #dd9933 !important;
    }

    #primary-nav {
        margin-right: -48px !important;
    }

    .btn-login {
        height: 48px !important;
        margin: 5px 0 5px 4px !important;
        padding: 0 32px !important;
        background: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 180 50" preserveAspectRatio="none"><g><polygon fill-rule="evenodd" clip-rule="evenodd" fill="rgb(221, 153, 51)" points="0,0 0,50 166,50 180,37 180,0"/></g></svg>') no-repeat !important;
        background-size: 100% 100% !important;
        background-color: transparent !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        vertical-align: middle !important;
    }
    .btn-login a {
        color: #ffffff !important;
        font-weight: 700 !important;
        font-size: 14px !important;
        font-family: 'Dosis', sans-serif !important;
        text-decoration: none !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        line-height: 48px !important;
        display: inline-block !important;
    }
    .btn-login:hover {
        opacity: 0.9 !important;
    }
}

.btn-login:before, .btn-login:after,
.btn-login a:before, .btn-login a:after,
.cart-link, .header-search-icon {
    display: none !important;
    content: none !important;
}

/* 3. Mobile & Tablet Navigation (< 992px) */
@media (max-width: 991.98px) {
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .ts-logo-area {
        padding: 15px 0 10px !important;
    }
    .ts-logo-area .col-md-4,
    .ts-logo-area .col-md-8 {
        text-align: center !important;
        float: none !important;
        width: 100% !important;
    }
    .ts-logo-area .ts-logo {
        margin-left: 0 !important;
        display: inline-block !important;
    }
    .ts-logo img {
        max-width: 280px !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    .top-contact-info {
        float: none !important;
        margin-top: 10px !important;
        margin-bottom: 5px !important;
        padding-left: 0 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 12px !important;
    }
    .top-contact-info li {
        margin: 0 8px !important;
        font-size: 13px !important;
    }

    .header-angle {
        margin-bottom: 0 !important;
        background-color: #024e90 !important;
    }
    .header-angle:after {
        width: 100% !important;
        right: 0 !important;
        background-color: #024e90 !important;
    }
    .header-angle:before {
        display: none !important;
    }

    .header-angle .navbar {
        padding: 6px 15px !important;
    }
    .header-angle .navbar-toggler {
        border-color: rgba(255, 255, 255, 0.4) !important;
        padding: 6px 10px !important;
        outline: none !important;
        margin: 6px 0 !important;
    }
    .header-angle .navbar-toggler .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.95)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
    }

    .header-default .header-angle .navbar-collapse,
    #navbarSupportedContent {
        background: #024e90 !important;
        position: absolute !important;
        width: 100% !important;
        left: 0 !important;
        right: 0 !important;
        top: 100% !important;
        z-index: 9999 !important;
        padding: 10px 0 20px !important;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
    }
    #primary-nav {
        margin-right: 0 !important;
        width: 100% !important;
    }
    .header-angle .navbar .navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .header-angle .navbar .navbar-nav > li {
        margin-right: 0 !important;
        width: 100% !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    }
    .header-angle .navbar .navbar-nav > li > a {
        padding: 12px 24px !important;
        font-size: 14.5px !important;
        color: #ffffff !important;
        display: block !important;
        text-align: left !important;
        font-weight: 700 !important;
        font-family: 'Dosis', sans-serif !important;
        text-transform: uppercase !important;
    }
    .header-angle .navbar .navbar-nav > li.active > a,
    .header-angle .navbar .navbar-nav > li > a:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
        color: #dd9933 !important;
    }

    .btn-login {
        display: block !important;
        width: calc(100% - 48px) !important;
        margin: 16px 24px !important;
        background: #dd9933 !important;
        background-image: none !important;
        border-radius: 4px !important;
        text-align: center !important;
        height: 44px !important;
        line-height: 44px !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    }
    .btn-login a {
        color: #ffffff !important;
        display: block !important;
        line-height: 44px !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
    }
}

/* 4. Slider Responsiveness */
@media (max-width: 768px) {
    .carousel-item,
    .carousel-item img {
        height: 460px !important;
        min-height: 460px !important;
    }
    .overlay {
        padding-left: 20px !important;
        padding-right: 20px !important;
        justify-content: center !important;
        align-items: flex-start !important;
    }
    .overlay > h1 {
        width: 100% !important;
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
    .overlay .btn-link {
        margin-top: 14px !important;
        padding: 9px 20px !important;
        font-size: 12px !important;
    }
    #carouselExampleControls .carousel-control-prev,
    #carouselExampleControls .carousel-control-next {
        width: 36px !important;
    }
    .carousel-control-circle {
        width: 36px !important;
        height: 36px !important;
    }
}

/* 5. Footer: Clean Transparent Copyright */
.footer-classic .copyright,
.copyright {
    background: transparent !important;
    background-color: transparent !important;
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
    padding: 25px 0 !important;
    color: #ffffff !important;
}
.copyright-info span {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 14px !important;
}

/* 6. Back to Top Button */
.back-to-top {
    position: fixed !important;
    bottom: 25px !important;
    right: 25px !important;
    z-index: 9999 !important;
}
.back-to-top .back-btn {
    background: #024e90 !important;
    color: #ffffff !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 4px !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}
.back-to-top .back-btn:hover {
    background: #dd9933 !important;
}

/* 7. Zalo Chat Widget positioning */
.zalo-chat-widget {
    left: auto !important;
    right: 25px !important;
    bottom: 80px !important;
    position: fixed !important;
    z-index: 999999 !important;
}

@media (max-width: 768px) {
    .back-to-top {
        bottom: 20px !important;
        right: 15px !important;
    }
    .back-to-top .back-btn {
        width: 36px !important;
        height: 36px !important;
        font-size: 13px !important;
    }
    .zalo-chat-widget {
        right: 15px !important;
        bottom: 65px !important;
    }
}

/* 8. Button Theo dõi điều trị in Xem Lịch Hẹn */
#btn-see.btn-classic,
.appoinment-form #btn-see {
    white-space: nowrap !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 48px !important;
    width: 100% !important;
    line-height: 1 !important;
    background-color: #024e90 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    border: none !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 4px 10px rgba(2, 78, 144, 0.25) !important;
}
#btn-see.btn-classic:hover {
    background-color: #dd9933 !important;
    color: #ffffff !important;
}

/* 9. Service Single Page Typography & Responsive Layout */
.service-article-body {
    font-size: 15.5px !important;
    line-height: 1.85 !important;
    color: #444444 !important;
}
.service-article-body h2,
.service-article-body h3,
.service-article-body h4 {
    color: #024e90 !important;
    font-weight: 700 !important;
    margin-top: 26px !important;
    margin-bottom: 14px !important;
    line-height: 1.4 !important;
}
.service-article-body h2 {
    font-size: 22px !important;
    border-bottom: 2px solid rgba(2, 78, 144, 0.12) !important;
    padding-bottom: 10px !important;
}
.service-article-body h3 {
    font-size: 18px !important;
}
.service-article-body h4 {
    font-size: 16px !important;
}
.service-article-body p {
    margin-bottom: 16px !important;
    color: #444444 !important;
}
.service-article-body p em {
    font-weight: 600 !important;
    color: #1a202c !important;
    font-style: normal !important;
}
.service-article-body strong {
    color: #024e90 !important;
}
.service-article-body img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
    margin: 18px auto !important;
    display: block !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06) !important;
}
.service-menu-list li a:hover {
    background: #eef4fa !important;
    color: #024e90 !important;
    padding-left: 20px !important;
}

@media (max-width: 768px) {
    .service-content-wrapper {
        padding: 24px 18px !important;
    }
    .service-article-body {
        font-size: 15px !important;
        line-height: 1.75 !important;
    }
    .service-article-body h2 {
        font-size: 20px !important;
    }
    .banner-title {
        font-size: 24px !important;
    }
    .banner-area {
        padding: 40px 0 !important;
    }
    .service-sidebar {
        position: static !important;
        margin-top: 25px !important;
    }
}

/* ========================================================
   10. Mobile Responsive Layout & Homepage Elementor Sections
   ======================================================== */

/* Tablet & Mobile: Ensure Elementor containers and inner sections expand full width */
@media (max-width: 991.98px) {
    .elementor-section,
    .elementor-inner-section,
    .elementor-top-section,
    .elementor-section .elementor-container,
    .elementor-widget-wrap {
        width: 100% !important;
        max-width: 100% !important;
    }
    .elementor-container {
        flex-wrap: wrap !important;
    }
    .elementor-row {
        flex-wrap: wrap !important;
    }
}

/* Mobile Devices (< 768px): Full-width stacked layout for all sections */
@media (max-width: 767.98px) {
    .elementor-section,
    .elementor-inner-section,
    .elementor-top-section,
    .elementor-widget-wrap {
        width: 100% !important;
        max-width: 100% !important;
    }

    .elementor-section .elementor-container,
    .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
    }

    .elementor-row {
        flex-wrap: wrap !important;
    }

    /* All columns stack to 100% full width */
    .elementor-column,
    .elementor-column.elementor-col-100,
    .elementor-column.elementor-col-50,
    .elementor-column.elementor-col-33,
    .elementor-column.elementor-col-25,
    .elementor-column.elementor-col-20,
    .elementor-column.elementor-col-16,
    .elementor-column[data-col="100"],
    .elementor-column[data-col="50"],
    .elementor-column[data-col="33"],
    .elementor-column[data-col="25"],
    .elementor-inner-column,
    .elementor-top-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    .elementor-widget-wrap {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
    }
}

/* ========================================================
   Specific Section Tuning on Mobile & Tablet (< 992px)
   ======================================================== */

/* 1. Intro Cards (Section 20a3207: Về chúng tôi, Video, Chỉ có tại nha khoa) */
@media (max-width: 991.98px) {
    .elementor-6 .elementor-element.elementor-element-20a3207,
    .elementor-element-20a3207 {
        margin-top: 15px !important;
        margin-bottom: 25px !important;
        padding: 0 !important;
        width: 100% !important;
    }
    .elementor-element-20a3207 .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
        gap: 20px !important;
    }
    .elementor-6 .elementor-element.elementor-element-45ebe28,
    .elementor-6 .elementor-element.elementor-element-8809729,
    .elementor-6 .elementor-element.elementor-element-17517ee,
    .elementor-element-45ebe28,
    .elementor-element-8809729,
    .elementor-element-17517ee {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 0 20px 0 !important;
        border-radius: 12px !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
        overflow: hidden !important;
    }
    .elementor-6 .elementor-element.elementor-element-45ebe28 > .elementor-element-populated,
    .elementor-element-45ebe28 > .elementor-element-populated {
        background-color: #2F3967 !important;
        padding: 35px 24px 30px !important;
        margin: 0 !important;
        border-radius: 12px !important;
    }
    .elementor-6 .elementor-element.elementor-element-8809729 > .elementor-element-populated,
    .elementor-element-8809729 > .elementor-element-populated {
        background-color: #2750A4 !important;
        padding: 35px 24px 30px !important;
        margin: 0 !important;
        border-radius: 12px !important;
    }
    .elementor-6 .elementor-element.elementor-element-17517ee > .elementor-element-populated,
    .elementor-element-17517ee > .elementor-element-populated {
        background-color: #2F3967 !important;
        padding: 35px 24px 30px !important;
        margin: 0 !important;
        border-radius: 12px !important;
    }

    /* Card 1: Về chúng tôi */
    .elementor-element-45ebe28 .elementor-icon-box-icon {
        text-align: center !important;
        margin-bottom: 12px !important;
    }
    .elementor-element-45ebe28 .elementor-icon-box-icon .elementor-icon {
        color: #dd9933 !important;
        font-size: 42px !important;
        display: inline-block !important;
    }
    .elementor-element-45ebe28 .elementor-icon-box-title {
        text-align: center !important;
        margin-bottom: 14px !important;
    }
    .elementor-element-45ebe28 .elementor-icon-box-title span {
        font-family: 'Dosis', sans-serif !important;
        font-weight: 700 !important;
        font-size: 24px !important;
        color: #ffffff !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }
    .elementor-element-45ebe28 .elementor-icon-box-description {
        font-size: 15px !important;
        line-height: 1.75 !important;
        color: rgba(255, 255, 255, 0.92) !important;
        text-align: justify !important;
        text-justify: inter-word !important;
        margin: 0 !important;
    }

    /* Card 2: Video */
    .elementor-element-8809729 .elementor-icon-box-icon {
        text-align: center !important;
        margin-bottom: 12px !important;
    }
    .elementor-element-8809729 .elementor-icon-box-icon .elementor-icon {
        color: #dd9933 !important;
        font-size: 42px !important;
        display: inline-block !important;
    }
    .elementor-element-8809729 .elementor-icon-box-title {
        text-align: center !important;
        margin-bottom: 18px !important;
    }
    .elementor-element-8809729 .elementor-icon-box-title span {
        font-family: 'Dosis', sans-serif !important;
        font-weight: 700 !important;
        font-size: 24px !important;
        color: #ffffff !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }
    .elementor-element-8809729 .elementor-wrapper,
    .elementor-element-8809729 .elementor-video {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 8px !important;
        overflow: hidden !important;
    }
    .elementor-element-8809729 iframe,
    .elementor-element-8809729 .elementor-video-iframe {
        width: 100% !important;
        height: 240px !important;
        min-height: 220px !important;
        border-radius: 8px !important;
        display: block !important;
    }

    /* Card 3: Chỉ có tại nha khoa */
    .elementor-element-17517ee .elementor-icon-box-icon {
        text-align: center !important;
        margin-bottom: 12px !important;
    }
    .elementor-element-17517ee .elementor-icon-box-icon .elementor-icon {
        color: #dd9933 !important;
        font-size: 42px !important;
        display: inline-block !important;
    }
    .elementor-element-17517ee .elementor-icon-box-title {
        text-align: center !important;
        margin-bottom: 20px !important;
    }
    .elementor-element-17517ee .elementor-icon-box-title span {
        font-family: 'Dosis', sans-serif !important;
        font-weight: 700 !important;
        font-size: 24px !important;
        color: #ffffff !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }
    .elementor-element-17517ee .elementor-icon-list-items {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
    }
    .elementor-element-17517ee .elementor-icon-list-item {
        display: flex !important;
        align-items: center !important;
        padding: 6px 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    }
    .elementor-element-17517ee .elementor-icon-list-item:last-child {
        border-bottom: none !important;
    }
    .elementor-element-17517ee .elementor-icon-list-icon {
        color: #dd9933 !important;
        font-size: 15px !important;
        margin-right: 14px !important;
        width: 24px !important;
        height: 24px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: rgba(221, 153, 51, 0.18) !important;
        border-radius: 50% !important;
        flex-shrink: 0 !important;
    }
    .elementor-element-17517ee .elementor-icon-list-text {
        color: #ffffff !important;
        font-size: 15.5px !important;
        font-weight: 500 !important;
        letter-spacing: 0.2px !important;
    }
}

/* 2. Quy Trình Làm Việc (Section 1072950) on Mobile */
@media (max-width: 767.98px) {
    .elementor-element-1072950 .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
        width: 100% !important;
    }
    .elementor-6 .elementor-element.elementor-element-e7997ca,
    .elementor-6 .elementor-element.elementor-element-ff65749,
    .elementor-6 .elementor-element.elementor-element-f016d1c,
    .elementor-element-e7997ca,
    .elementor-element-ff65749,
    .elementor-element-f016d1c {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 20px !important;
        background: #ffffff !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
        border: 1px solid rgba(0, 0, 0, 0.05) !important;
        overflow: hidden !important;
    }
    .elementor-element-e7997ca > .elementor-element-populated,
    .elementor-element-ff65749 > .elementor-element-populated,
    .elementor-element-f016d1c > .elementor-element-populated {
        padding: 30px 24px !important;
        text-align: center !important;
        margin: 0 !important;
    }
    .elementor-element-1072950 .elementor-icon-box-icon {
        margin-bottom: 12px !important;
        text-align: center !important;
    }
    .elementor-element-1072950 .elementor-icon-box-icon .elementor-icon {
        font-size: 52px !important;
        display: inline-block !important;
    }
    .elementor-element-1072950 .elementor-icon-box-title {
        font-size: 21px !important;
        font-family: 'Dosis', sans-serif !important;
        font-weight: 700 !important;
        color: #024e90 !important;
        margin: 10px 0 12px !important;
        text-align: center !important;
    }
    .elementor-element-1072950 .elementor-icon-box-description {
        font-size: 15px !important;
        line-height: 1.7 !important;
        color: #555555 !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        text-align: center !important;
    }
}

/* ==========================================================================
   GLOBAL FIX: Neutralize permanently tilted .animated-skew
   (prevents slanted cards and weird skewed polygons on desktop & mobile)
   ========================================================================== */
.animated-skew,
.elementor-column.animated-skew,
.elementor-widget.animated-skew,
.elementor-element.animated-skew {
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-transition: none !important;
    transition: none !important;
}

/* ==========================================================================
   GLOBAL FIX: Smooth Card Hover & Flicker Prevention (.ts-service-classic-wrapper)
   Completely prevents layout height collapse, flickering loop, and solid blue block
   ========================================================================== */
.ts-service-classic-wrapper {
    position: relative !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border-bottom: 3px solid #024e90 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
}

/* Disarm intrusive full-card solid blue takeover that creates the blue skewed slab & flickers */
.ts-service-classic-wrapper:before,
.ts-service-classic-wrapper:after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.ts-service-classic-wrapper:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 14px 28px rgba(2, 78, 144, 0.16) !important;
    border-bottom-color: #dd9933 !important;
}

/* Service Image Container & Subtle Zoom */
.ts-service-classic-wrapper .service-img,
.ts-classic-service .service-img {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
    background: #f4f6f9 !important;
}

.ts-service-classic-wrapper .service-img img,
.ts-classic-service .service-img img {
    width: 100% !important;
    height: 220px !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.4s ease !important;
}

.ts-service-classic-wrapper:hover .service-img img,
.ts-classic-service:hover .service-img img {
    transform: scale(1.05) !important;
}

/* CRITICAL: Keep .service-content in normal document flow on hover!
   Do NOT allow switch to position: absolute; top: 70% which causes container collapse & flicker! */
.ts-service-classic-wrapper .service-content,
.ts-service-classic-wrapper:hover .service-content {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    background: #ffffff !important;
    padding: 22px 20px 24px 20px !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    display: block !important;
    z-index: 10 !important;
}

/* Category Link */
.ts-service-classic-wrapper .service-content .service-category a,
.ts-service-classic-wrapper:hover .service-content .service-category a {
    color: #888888 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-weight: 600 !important;
    transition: color 0.3s ease !important;
}

/* Title Link */
.ts-service-classic-wrapper .service-content .ts-service-title,
.ts-service-classic-wrapper:hover .service-content .ts-service-title {
    margin: 8px 0 12px 0 !important;
    padding: 0 !important;
}

.ts-service-classic-wrapper .service-content .ts-service-title a,
.ts-service-classic-wrapper:hover .service-content .ts-service-title a {
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-family: 'Dosis', sans-serif !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-transform: uppercase !important;
    transition: color 0.3s ease !important;
}

.ts-service-classic-wrapper:hover .service-content .ts-service-title a {
    color: #024e90 !important;
}

/* Hide description paragraph cleanly like original state */
.ts-service-classic-wrapper .service-content p,
.ts-service-classic-wrapper:hover .service-content p {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Read More Button with Smooth Arrow Slide */
.ts-service-classic-wrapper .service-content a.readmore,
.ts-service-classic-wrapper:hover .service-content a.readmore {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #024e90 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: color 0.3s ease, gap 0.3s ease !important;
}

.ts-service-classic-wrapper:hover .service-content a.readmore {
    color: #dd9933 !important;
    gap: 10px !important;
}

.ts-service-classic-wrapper .service-content a.readmore i,
.ts-service-classic-wrapper:hover .service-content a.readmore i {
    color: inherit !important;
    font-size: 13px !important;
    transition: transform 0.3s ease !important;
}

.ts-service-classic-wrapper:hover .service-content a.readmore i {
    transform: translateX(4px) !important;
}

/* ==========================================================================
   MOBILE & TABLET RESPONSIVE FIX: "Dịch Vụ Của Chúng Tôi", Library & News Grids
   Ensures 100% full-width cards on mobile (< 992px), centered with clean gutters
   ========================================================================== */
@media (max-width: 991.98px) {
    /* Section Containers */
    .elementor-element-bbc26f9 .elementor-container,
    .elementor-element-c56c94c,
    .elementor-element-c56c94c > .elementor-widget-wrap,
    .elementor-element-134454a,
    .elementor-element-6352c92,
    .elementor-element-645d5f2,
    .elementor-element-38642c7,
    .elementor-element-c856485,
    .elementor-element-75d0fa5 {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .elementor-element-134454a .elementor-container,
    .elementor-element-6352c92 .elementor-container,
    .elementor-element-645d5f2 .elementor-container,
    .elementor-element-38642c7 .elementor-container,
    .elementor-element-c856485 .elementor-container,
    .elementor-element-75d0fa5 .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: wrap !important;
        gap: 24px !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    /* All Service & Grid Columns Stack to 100% Width */
    .elementor-column,
    .elementor-column.elementor-col-33,
    .elementor-column.elementor-inner-column,
    .elementor-column.elementor-inner-column.elementor-col-33,
    .elementor-column.elementor-col-50,
    .elementor-column.elementor-inner-column.elementor-col-50,
    .elementor-element-134454a .elementor-column,
    .elementor-element-6352c92 .elementor-column,
    .elementor-element-645d5f2 .elementor-column,
    .elementor-element-38642c7 .elementor-column,
    .elementor-element-c856485 .elementor-column,
    .elementor-element-75d0fa5 .elementor-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    /* Inner Column Populated Wraps */
    .elementor-column > .elementor-element-populated,
    .elementor-column > .elementor-widget-wrap {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Widget & Card Full Width */
    .elementor-widget-autrics-service,
    .elementor-widget-container,
    .ts-service-wrapper,
    .ts-service-classic-wrapper,
    .ts-classic-service {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        transform: none !important;
    }

    /* Card Image Responsive Height on Mobile */
    .ts-service-classic-wrapper .service-img,
    .ts-classic-service .service-img {
        width: 100% !important;
        height: 220px !important;
        border-radius: 8px 8px 0 0 !important;
        overflow: hidden !important;
    }

    .ts-service-classic-wrapper .service-img img,
    .ts-classic-service .service-img img,
    .elementor-image-box-wrapper .elementor-image-box-img img {
        width: 100% !important;
        height: 100% !important;
        max-height: 220px !important;
        object-fit: cover !important;
        display: block !important;
    }

    /* Card Content on Mobile */
    .ts-service-classic-wrapper .service-content {
        padding: 18px 16px 20px 16px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .ts-service-classic-wrapper .service-content .ts-service-title a,
    .elementor-image-box-title {
        font-size: 17px !important;
        font-family: 'Dosis', sans-serif !important;
        font-weight: 700 !important;
        line-height: 1.4 !important;
    }
}
