﻿
    @media (max-width: 768px) {
        .logo {
            display: none;
        }

        #banner {
            height: 50vh;
        }

        .header-banner-home h1 {
            position: relative;
            z-index: 2;
            font-size: 22px; /* Adjust as needed */
            margin: 0;
        }
       /*Buttons- LAb tests start*/
     
        #tests .test-button {
            flex-direction: column;
            align-items: center;
            justify-content:center;
           
        }
        .test-sections,
        .chkups-sections {
          min-width:80% !important;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 12px;
           
        }

            .test-sections a,
            .chkups-sections a {
                width: 100%; /* Ensures anchor fills the button */
                display: flex;
                justify-content: center;
                align-items: center;
                font-size: 16px;
                text-decoration: none;
                color: #fff;
                
            }

            .test-sections img,
            .chkups-sections img {
                width: 24px;
                height: 24px;
                margin-left: 10px;
            }
        /*Buttons- LAb tests End*/
        /*Who we are start*/
        .who-we-are {
            flex-direction: column-reverse; /* Show image first, then text */
            text-align: center;
        }

        .image-container img {
            width: 100%; /* Full width */
            max-width: 100%;
            border-radius: 20px;
        }

        .info-box {
            width: 90%; /* Take most of the screen */
            max-width: 500px; /* Prevent stretching */
            position: relative; /* Reset overlapping */
            left: 0;
            margin: 10px auto 20px auto;
        }

            .info-box h2 {
                font-size: 28px !important;
            }
   


        /*Who we are End*/
        .steps-container {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 20px;
        }
        .content-section, .image-section {
            padding: 15px;
        }

        .organ-img-container img {
            width: 60px;
            height: 60px;
        }

        .organ-label {
            font-size: 12px;
        }

        .data-item img {
            display: none;
        }

        .pack-box {
            padding: 15px;
        }

        .package-title {
            font-size: 1.4rem; /* Adjust font size for mobile */
        }

        .price {
            font-size: 1.1rem; /* Adjust font size for mobile */
        }

        .view-details {
            width: 100%; /* Make the button full width */
            text-align: center;
        }

        .data-item {
            flex-direction: column; /* Stack elements vertically */
            align-items: flex-start; /* Align text to the left */
        }

        .text-content {
            text-align: center;
        }

    }
/* Responsive Adjustments */
@media (max-width: 992px) { /* Tablets */
    .organ-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 columns */
    }
    
}

/* Mobile: Ensures 2 Columns */
@media (max-width: 576px) {
    .organ-grid {
        grid-template-columns: repeat(2, minmax(120px, 1fr)); /* Ensures two images per row */
        gap: 15px; /* Slightly reduced gap */
    }

    .checkup-btn {
        max-width: 100%;
    }
    .organ-grid {
        grid-template-columns: repeat(2, 1fr); /* 1 column */
    }

    .checkup-btn {
        max-width: 100%;
    }
}
/* Extra Small Devices: 1 Column */
@media (max-width: 400px) {
    .organ-grid {
        grid-template-columns: repeat(2, 1fr); /* Stacks images */
    }

    .checkup-btn {
        max-width: 100%;
    }
}
/******news*/
/* 🔹 Responsive Design 🔹 */
@media (max-width: 992px) {
    .news-container {
        flex-direction: column;
        height: auto;
    }

    .news-left {
        position: relative;
        width: 100%;
        max-height: none;
    }

    .news-right {
        height: auto;
        overflow-y: visible;
        padding-right: 0;
    }

    .news-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* Two-column layout */
        gap: 15px;
    }

    .news-item {
        flex-direction: column;
        text-align: center;
        padding: 15px;
    }

        .news-item img {
            width: 100%;
            height: auto;
            margin-bottom: 10px;
        }

    .news-content {
        padding: 0;
        text-align: left;
    }

        .news-content .read-more {
            text-align: right;
            display: block;
        }
}

@media (max-width: 768px) {
    .news-list {
        grid-template-columns: repeat(1, 1fr); /* One column on small devices */
    }

    .news-item {
        flex-direction: column;
        text-align: center;
        padding: 15px;
    }

        .news-item img {
            width: 100%;
            height: auto;
            margin-bottom: 10px;
        }

    .news-content {
        padding: 0;
        text-align: left;
    }

        .news-content .read-more {
            text-align: right;
            display: block;
        }
}
/*Contact*/
@media (max-width: 768px) {
    .row {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .contact-form {
        width: 100%;
    }
}
/*achievements*/
@media (max-width: 768px) {
    .achievement-card {
        flex-direction: column;
        text-align: center;
    }

    .achievement-image {
        max-width: 100%;
        height: 200px;
    }

    .achievement-details {
        padding-left: 0;
        margin-top: 10px;
    }
}
/*Health tips start*/
/* Responsive for Tablets (992px and below) */
@media (max-width: 992px) {
    .health-tips-col {
        flex: 1 1 45%;
        max-width: 45%;
    }

    .health-tips-card {
        max-width: 20rem;
    }

    .health-tips-title {
        font-size: 1.1rem;
    }

    .health-tips-text {
        font-size: 0.95rem;
    }
}

/* Responsive for Mobile Devices (768px and below) */
@media (max-width: 768px) {
    .health-tips-col {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .health-tips-card {
        max-width: 90%;
    }

    .health-tips-img {
        height: 180px; /* Slightly smaller image for mobile */
    }

    .health-tips-body {
        padding: 12px;
    }

    .health-tips-title {
        font-size: 1rem;
    }

    .health-tips-text {
        font-size: 0.9rem;
    }
}

/* Small Mobile Screens (480px and below) */
@media (max-width: 480px) {
    .health-tips-card {
        max-width: 95%;
    }

    .health-tips-img {
        height: 160px;
    }

    .health-tips-body {
        padding: 10px;
    }

    .health-tips-title {
        font-size: 0.95rem;
    }

    .health-tips-text {
        font-size: 0.85rem;
    }
}
/*Health tips End*/
/*Steps to book test start*/
/* Default - Desktop Layout (No changes needed, keeping as it is) */

/* 📱 Tablets (992px and below) */
@media (max-width: 992px) {
    .booking-steps {
        padding: 30px;
    }

    .steps-container {
        gap: 12px;
    }

    .step {
        padding: 12px;
    }

    .step-icon {
        width: 35px;
        height: 35px;
        font-size: 16px;
    }

    .step-content p {
        font-size: 15px;
    }
}

/* 📱 Mobile Devices (768px and below) */
@media (max-width: 768px) {
    .booking-steps {
        padding: 25px;
    }

    .step {
        flex-direction: column;
        text-align: center;
        padding: 10px;
    }

    .step-icon {
        width: 30px;
        height: 30px;
        font-size: 14px;
        margin-bottom: 8px;
        margin-right: 0;
    }

    .step-content p {
        font-size: 14px;
    }
}

/* 📱 Small Mobile Screens (480px and below) */
@media (max-width: 480px) {
    .booking-steps {
        padding: 20px;
    }

    .steps-container {
        gap: 10px;
    }

    .step {
        padding: 8px;
    }

    .step-icon {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }

    .step-content p {
        font-size: 13px;
    }
}

/*Steps to book Ends*/