﻿.our-team-section {
    background-color: black;
    color: white;
    min-height: 100vh; /* ✅ allows section to grow */
    height: auto; /* ✅ remove hard cap */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 80px 20px 60px; /* top + side + bottom */
    overflow: hidden;
}


.wave-row {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 50px; /* ✅ wider spacing */
    flex-wrap: nowrap;
    overflow: visible; /* ✅ prevent horizontal scroll */
}
.team-member {
    flex: 0 0 auto;
    width: 150px; /* ✅ wider */
    height: 280px; /* ✅ taller */
    border-radius: 75px; /* ✅ keep oval */
    overflow: hidden;
    transition: transform 0.3s ease;
}

    .team-member img {
        
        width: 100%;
        height: 100%;
        object-fit: fill;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        border-radius: inherit;
    }
    .team-member.up {
        transform: translateY(-25px);
    }


    .team-member.down {
        transform: translateY(25px);
    }

.our-team-section h2 {
    margin-bottom: 10px;
    margin-top: -40px; /* ⬅️ this pulls the heading up */
    color:green !important;
}

.our-team-section p {
    margin-bottom: 30px;
    color:white;
}

@media (max-width: 992px) {
    .team-member {
        width: 130px;
        height: 240px;
        border-radius: 65px;
    }

    .wave-row {
        gap: 40px;
    }

    .team-member.up {
        transform: translateY(-20px);
    }

    .team-member.down {
        transform: translateY(20px);
    }

    .our-team-section h2 {
        font-size: 28px;
    }

    .our-team-section p {
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .team-member {
        width: 110px;
        height: 200px;
        border-radius: 55px;
    }

    .wave-row {
        gap: 30px;
        flex-wrap: wrap; /* optional: wrap to next line on tablets */
    }

    .team-member.up {
        transform: translateY(-15px);
    }

    .team-member.down {
        transform: translateY(15px);
    }

    .our-team-section {
        padding: 60px 16px;
    }
}

@media (max-width: 480px) {
    .team-member {
        width: 90px;
        height: 180px;
        border-radius: 45px;
    }

    .wave-row {
        gap: 24px;
        flex-wrap: wrap;
    }

    .team-member.up {
        transform: translateY(-10px);
    }

    .team-member.down {
        transform: translateY(10px);
    }

    .our-team-section h2 {
        font-size: 22px;
        margin-top: -20px;
    }

    .our-team-section p {
        font-size: 13px;
    }
}