.team-container__main-content{
    display: flex;
    flex-direction: column;
    gap: 50px;
    color: var(--brown);
}
.team-container__main-content h2{
    font-size: 64px;
}
.team-container__main-content p{
    line-height: 2;
    font-size: 24px;
}
.team-container__card-img img{
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1.3;
    border-radius: 50px 50px 0 0;
}
.team-container__main-card{
    flex: .6;
}
.team-container__main-content{
    flex: 1;
}
.team-container__main{
    display: flex;
    gap: 40px;
}
.team-container__card-text{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 0;
    background: var(--white);
    border-radius: 0 0 50px 50px;
}
.team-container__card-text p{
    color: var(--brown);
    font-size: 30px;
    text-align: center;
}
.team-container__row-header p{
    font-size: 48px;
    color: var(--brown);
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}
.team-container__row-card-img img{
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1.2;
    border-radius: 50px 50px 0 0;
}
.team-container__row-card-text{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: var(--white);
    border-radius: 0 0 50px 50px;
}
.team-container__row-card-text p{
    color: var(--brown);
    font-size: 30px;
    text-align: center;
}
.team-container__row-cards{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    width: 100%;
}
.team-container__row{
    position: relative;
    display: flex;
    gap: 50px;
    margin-bottom: 30px;
}
.team-container__row-header{
    position: sticky;
    top: 30px;
    height: fit-content;
}
.team-container__content{
    margin-top: 90px;
}
.team-container__content-header{
    display: flex;
    gap: 50px;
    margin-bottom: 35px;
}
.team-container__header-btn{
    border: solid 1px var(--brown);
    border-radius: 15px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.team-container__header-btn p{
    color: var(--brown);
    font-size: 36px;
}
.team-container__header-btn.active p{
    color: var(--white);
}
.team-container__header-btn.active{
    background: var(--brown);
}
@media (max-width: 1000px){
    .team-container__row-cards{
        grid-template-columns: repeat(2, 1fr);
    }
    .team-container__content-header{
        flex-direction: column;
        gap: 20px;
    }
    .team-container__main{
        flex-direction: column;
        gap: 30px;
    }
    .team-container__main-content {
        gap: 30px;
    }
}
@media (max-width: 750px){
    .team-container__row{
        flex-direction: column;
    }
    .team-container__row-header{
        position: unset;
        cursor: pointer;
    }
    .team-container__row-header p{
        writing-mode: unset;
        transform: unset;
        font-size: 30px;
    }
    .team-container__main-content h2 {
        font-size: 32px;
    }
    .team-container__main-content p {
        font-size: 18px;
    }
    .team-container__header-btn{
        padding: 5px;
    }
    .team-container__header-btn p {
        font-size: 24px;
    }
    .team-container__row-cards{
        grid-template-columns: repeat(1, 1fr);
    }
    .team-container__row-mobile-arrow{
        transition: .3s;
        width: 30px;
        height: 30px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url("data:image/svg+xml,%3Csvg width='27' height='12' viewBox='0 0 27 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M26.4631 9.55077L14.7963 0.420222C14.0804 -0.140074 12.9196 -0.140073 12.2037 0.420223L0.536947 9.55077C-0.178982 10.1111 -0.178982 11.0195 0.536947 11.5798C1.25288 12.1401 2.41363 12.1401 3.12956 11.5798L13.5 3.46374L23.8704 11.5798C24.5864 12.1401 25.7471 12.1401 26.4631 11.5798C27.179 11.0195 27.179 10.1111 26.4631 9.55077Z' fill='%23482712'/%3E%3C/svg%3E%0A");
    }
    .team-container__row-header{
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }
    .team-container__row-cards{
        max-height: 0;
        overflow: hidden;
        transition: .3s;
    }
    .team-container__row-cards.active{
        max-height: 19999px;
        transition: .3s;
    }
    .team-container__row-header.active .team-container__row-mobile-arrow{
        transition: .3s;
        transform: rotate(-180deg);
    }
}