 .team-section {
            padding: 0rem 1rem;
            text-align: center;
            margin-bottom: 100px;
        }

        /* Title Styling */
        .team-title {
            color: #fff; 
            font-size: 4rem;
            font-weight: 800;
            margin-top: 150px;
            margin-bottom: 3rem;
            
            /* Center the title and lines */
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1.5rem;
            
            /* Add padding/max-width to control line length */
            max-width: 900px; 
            margin-left: auto;
            margin-right: auto;
        }

        /* Decorative lines (Sticks) using pseudo-elements */
        .team-title::before,
        .team-title::after {
            content: '';
            flex-grow: 1; /* Allows the lines to stretch */
            height: 2px;
            background-color: #fff; /* Reddish line */
            max-width: 300px; /* Cap the max length of the lines */
        }

        .team-title span {
            /* The actual text part */
            color: #fff;
            white-space: nowrap;
        }

        /* Team Grid - CHANGED TO FLEXBOX FOR BETTER CENTERING ON WRAPPED ROWS */
        .team-grid {
            /* Default Flexbox properties for centering */
            display: flex;
            flex-wrap: wrap; /* Allow items to wrap to the next line */
            justify-content: center; /* **KEY FIX: Centers items horizontally, even if they wrap** */
            align-items: flex-start;
            
            max-width: 1200px;
            gap: 2rem;
            margin: 0 auto;
            padding: 0 1rem; /* Added some padding to prevent edge sticking */
        }

        /* Individual Team Member Card */
        .team-member {
            /* Added min/max width to control card size for responsive columns */
            width: 280px; 
            max-width: 100%;
            
            /* The image size is 250px, plus padding/margin should fit 4 wide */
            flex-shrink: 0; /* Prevents items from shrinking below 280px */

            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 1rem 0; /* Adjusted padding */
        }

        /* Image Container and Circular Styling */
        .member-image-container {
            width: 250px; 
            height: 250px; 
            border-radius: 50%;
            overflow: hidden;
            margin-bottom: 1rem;
            border: 3px solid #D42525; 
            box-shadow: 0 0 15px rgba(212, 37, 37, 0.4);
            transition: transform 0.3s ease;
        }

        .member-image-container:hover {
            transform: scale(1.05);
            box-shadow: 0 0 25px rgba(212, 37, 37, 0.7);
        }

        .member-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: grayscale(100%); 
            transition: filter 0.3s ease;
        }
        
        .member-image-container:hover .member-image {
            filter: grayscale(0%); 
        }

        /* Member Name Styling */
        .member-name {
            color: #D42525; 
            font-size: 1.15rem;
            font-weight: 700;
            margin-bottom: 0.25rem;
            text-transform: uppercase;
        }

        /* Member Designation Styling */
        .member-designation {
            color: #bdbdbb;
            font-size: 0.9rem;
            font-weight: 400;
            line-height: 1.3;
        }
  







@media (max-width: 768px) {
    /* Reduce padding and margins for mobile spacing */
    .team-section {
        padding: 0 1rem;
        margin-top: 130px;
        margin-bottom: 50px;
    }

    /* FIX: Ensure the title allows lines to sit beside it */
    .team-title {
        font-size: 2.5rem; /* Smaller font is required for lines to fit */
        margin-top: 60px;
        margin-bottom: 2rem;
        gap: 0.8rem; /* Tighter gap between lines and text */
        display: flex; /* Keeps the flex layout active */
        flex-wrap: nowrap; /* Prevents text from jumping below lines */
        width: 100%;
    }

    /* Adjust the lines for mobile */
    .team-title::before,
    .team-title::after {
        content: '';
        display: block; /* Ensures they render */
        min-width: 20px; /* Forces at least a small line to show */
        flex-grow: 1;
        max-width: 100px; /* Limits length so they don't squash the text */
    }

    /* Reduce image size so cards fit comfortably */
    .member-image-container {
        width: 180px;
        height: 180px;
    }

    .team-member {
        width: 100%; /* Stacks cards vertically on mobile */
    }
}