/* Desktop styles for expandable text */
@media screen and (min-width: 768px) and (max-width: 1024px){
    .promo-content h1 {
        font-size: 36px;
    }
    
    .promo-content h2 {
        font-size: 28px;
    }
    
    .promo-badge img {
        max-width: 90%;
    }
    
    /* Booking Ways Tablet Styles */
    .booking-card {
        padding: 30px 15px;
    }
    
    .booking-title {
        font-size: 1.1rem;
    }
}

@media screen and (min-width: 768px){
   
}

@media screen and (max-width: 767px) {
    /* Header Mobile Styles */
    .logo img{
        max-height: 40px;
    }

    .header-buttons .btn {
        background-color: #130632;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 600;
        padding: 6px 16px;
    }
    .header-buttons .btn:hover{
        transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
        background-color: var(--text-orange);
        border-color: var(--text-orange);
        color: #fff;
    }
    
    /* Health Promo Mobile Styles */
    .health-promo {
        padding: 30px 40px;
        text-align: center;
        border-radius: 0 0 16px 16px;
        min-height: 440px;
    }
    
    .promo-content {
        padding-right: 0;
        margin-bottom: 0px;
    }
    
    .promo-content h1 {
        font-size: 28px;
        margin-top: 1rem;
        margin-bottom: 0.5rem;
    }
    
    .promo-content h2 {
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 24px;
    }
    .promo-content p{
        font-size: 12px;
        font-weight: 500;
        margin-bottom: 8px;
    }
    .promo-badge img {
        max-width: 70%;
        margin: 0 auto;
    }
    
    /* Booking Ways Mobile Styles */
    .booking-ways {
        padding: 0;
    }
    
    .section-title {
        font-size: 1.25rem;
        margin-bottom: 1rem;
        font-weight: 700;
    }
    
    .booking-card {
        padding: 10px;
        min-height: 118px;
        margin-bottom: 20px;
        margin: 0 12px;
        gap: 10px;
        border-radius: 20px;
        border: 1px solid #fedec4;
        margin: 0;
        min-width: 101px;
    }
    .section-margin-top{
        margin-top: 1.5rem;
    }
    .section-margin-bottom{
        margin-bottom: 1.5rem;
    }

    .booking-icon{
        height: 36px;
        width: 36px;
        margin-bottom: 4px;
    }

    .booking-title{
        font-size: 11px;
        line-height: 14px;
        margin-bottom: 12px;
    }
    .booking-btn{
        width: 32px;
        height: 18px;
        bottom: 0;
    }
    .booking-btn img{
        width: 16px;
        height: 16px;
    }

    .challenge-section{
        padding: 24px;
    }
    .challenge-card{
        padding:0 16px 8px;
    }
    .challenge-title{
        font-size: 16px;
        margin-top: 16px;
    }
    .challenge-age{
        font-size: 16px;
    }
    .section-subtitle{
        font-size: 1rem;
        color: #4B4A48 !important;
        font-weight: 500;
        margin-bottom: 1rem;
    }
    .health-check-section {
        .section-title, p{

            max-width: 70%;
        }
    }
    .health-check-icon{
        height: 42px;
        margin-bottom: 1rem;
    }
    .health-check-icon img{
        max-width: 42px;
        max-height: 42px;
    }
    .health-check-title{
        font-size: 16px;
    }
    .health-check-card{
        padding: 0;
    }
    .health-check-carousel .item{
        padding: 0 10px 0 0;
    }
    .health-check-carousel .owl-item:not(:last-child) .item::after{
        width: 1px;
        height: 90%;
    }
    .parameter-range-section{
        padding: 24px 10px;
    }
    .section-description{
        font-size: 16px;
        margin-bottom: 1rem;
    }
    .parameter-card {
        margin-bottom: 0;
        display: flex;
        gap: 12px;
        margin: 0;
    }
    .parameter-card-text{
        font-size: 12px;
    }
    .parameter-card-image {
        align-items: flex-end;
        height: 60px;
        padding: 0 4px;
        border-radius: 8px;
        min-width: 90px;
    }

    .parameter-card-content {
        min-height:auto;
        padding: 0;
    }
    .circle-info{
        font-size: 15px;
        margin-top: 1rem;
    }
    .circle-logo{
        height: 16px;
    }
    .circle-info p{
        margin: 0;
    }

    .test-packages-section{

        .section-description{
            color: #4B4A48;
        }
        .section-title, .section-description{
            max-width: 75%;
        }
    }
    .package-card h5{
        font-size: 15px;
    }
    .package-card .text-muted{
        font-size: 12px;
    }
    .package-card .text-success{
        font-size: 10px;
        margin-bottom: 0;
    }
    .package-card .package-badge {
        p {
            font-size: 10px;
        }
    }
    .package-card .package-badge {
        img{
            width: 32px;
            height: 32px;
        }
    }

    .package-card .price-amount{
        font-size: 17px;
    }
    .price-info .text-muted{
        font-size: 10px;
    }
    .package-price .text-success{
        font-size: 12px ;
    }
    .package-card .add-btn .btn{
        font-size: 12px;
        padding: 5px 24px;
    }
    .package-card .text-warning{
        font-size: 10px;
        margin-bottom: 0;
    }
    .package-card .package-footer{
        margin-top: 0;
    }
    .package-card .package-header{
        margin-bottom: 0;
    }
    .card-body{
        justify-content: space-between;
    }
    .package-card .card-body{
        padding: 14px;
    }
.package-card .card{
    min-height: 177px;
    margin: 16px;
}
    .benefits-section .section-title{
        max-width: 75%;
    }
    .benefit-card{
        padding: 10px;
        border-radius: 16px;
    }
    .benefit-image{
        height: 88px;
        border-radius: 8px;
    }
    .benefit-title{
        font-size: 12px;
    }
    .benefit-content{
        padding: 0.5rem 0 0;
    }
    .lab-test-content{
        padding: 12px;
    }
    .lab-test-title{
        font-size: 12px;
    }
    .lab-test-image{
        border-radius: 12px;
    }
    .lab-test-content{
        border-radius: 0 0 12px 12px;
    }
    .lab-test-card{
        border-radius: 12px;
    }
    .lab-icon{
        top: 12px;
        left: 12px;
        width: 24px !important;
    }
    .term-title{
        font-size: 12px;
        font-weight: 600;
    }
    .term-item{
        padding-top: 0;
    }
    .term-content p{
        font-size: 12px;
        color: #4B4A48;
        font-weight: 400;
        line-height: 16px;
    }
    .why-book-with-us-section{
        padding: 1.5rem 0 0.5rem;
    }
    .why-book-icon{
        width: 42px;
        height: 42px;
    }
    .why-book-title{
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
    }
    .why-book-text{
        font-size: 10px;
        line-height: 14px;
    }
    .why-book-grid{
        gap: 0;
    }
    .why-book-with-us-section .section-title{
        margin-bottom: 1rem;
    }
    .why-book-card{
        padding-top: 0;
    }
    
    /* Test Packages Carousel Mobile Styles */
    .test-packages-carousel {
        width: 100%;
        padding: 0;
        margin: 0;
    }
    
    .test-packages-carousel .owl-stage-outer {
        padding: 10px 0;
        overflow: hidden !important;
    }
    
    .test-packages-carousel .owl-stage {
        display: flex;
        align-items: center;
    }
    
    .test-packages-carousel .owl-item {
        float: none;
        display: flex;
        justify-content: center;
        width: 100% !important;
    }
    
    .test-packages-carousel .package-card {
        width: 100%;
        margin: 0 auto;
    }
    
    .test-packages-carousel .card {
        width: 100%;
        margin-bottom: 0;
    }
    
    .package-card .card {
        margin-bottom: 0;
        height: auto !important;
        /* box-shadow: 0 4px 8px rgba(0,0,0,0.1); */
    }
    
    /* Only show active items on mobile */
    .test-packages-carousel .owl-item:not(.active) {
        opacity: 0 !important;
        visibility: hidden !important;
    }
    
    .test-packages-carousel .owl-item.active {
        opacity: 1 !important;
        visibility: visible !important;
    }
}