/* EIGHTH SECTION */

.team_section {
    background: center/cover;
    padding-top: 131px;
    padding-bottom: 42px;
    position: relative;
    overflow: hidden;
}

.team_heading-row {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 8px;
}

.team_heading-box {
    margin-bottom: 49px;
}

.team_member-card {
    width: 347px;
    height: 314px;
    padding: 36px 26px;
    background-color: var(--black);
    position: relative;
    z-index: 2;
    box-shadow: 0px 3.02px 94.03px rgba(0, 0, 0, 0.81);
    backdrop-filter: blur(25px);
}

.team_member-heading {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    position: relative;
    z-index: 3;
}

.team_member-name {
    font-family: 'Impact Cyr';
    font-weight: normal;
    font-size: 36px;
    line-height: 100%;
    color: var(--white);
    text-transform: uppercase;
}

.team_member-position {
    font-family: 'Helvetica Neue';
    font-size: 16px;
    line-height: 23px;
    color: var(--primary-yellow);
    text-align: right;
}

.team_member-quote {
    font-family: 'Helvetica Neue';
    font-size: 16px;
    line-height: 23px;
    color: var(--white);
    margin-top: 20px;
    position: relative;
    z-index: 3;
}

.team_member-card:nth-child(1) .team_member-quote {
    max-width: 252px;
}

.team_member-card:nth-child(2) .team_member-quote {
    max-width: 283px;
}

.team_member-card.overlap .team_member-quote {
    max-width: unset;
}

.team_row {
    display: flex;
    justify-content: space-between;
}

.team_row:last-child {
    margin-top: 142px;
    justify-content: center;
    position: relative;
}

.team_section .nav_links {
    position: absolute;
    left: 0;
    bottom: -20px;
    z-index: 3;
}

.team_layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../../img/team-card-bg.png);
    z-index: 2;
}

.divider.co-founder {
    background-color: var(--black);
}

.team-img {
    position: absolute;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 1700px;
    z-index: 2;
}

.team_member-card.overlap {
    z-index: 3;
}

.team_heading-row .heading_element {
    font-size: 36px;
}

.team_member-img,
.team_member.natalia,
.team_member.vladyslav,
.team_section .overlay_rectangle,
.natalia .team_member-quote.mobile,
.natalia .team_member-img.mobile  {
    display: none;
}

/* ADAPTIVE */
@media (max-width: 1919px) {
   .team_member-card {
        width: 264px;
        height: 236px;
        padding: 20px 11px;
   }

   .team_member-name {
        font-size: 24px;
        line-height: 27px;
   }

   .team_member-position {
        font-size: 12px;
        line-height: 17px;
   }

   .team_member-quote {
        font-size: 12px;
        line-height: 17px;
   }

   .team_section {
      padding-top: 102px;
      padding-bottom: 20px;
   }

   .team_heading-box {
        margin-bottom: 71px;
   }

   .team-img {
        max-width: 1250px;
        bottom: -75px;
   }

   .team_member-card:nth-child(1) .team_member-quote {
        max-width: 190px;
    }

    .team_member-card:nth-child(2) .team_member-quote {
        max-width: unset;
    }
}

@media (max-width: 1280px) {
    .team_section {
        padding-top: 73px;
        padding-bottom: 0px;
    }

    .team_heading-row {
        margin-bottom: 0px;
    }

    .team_member-card .team_member-heading{
        position: absolute;
        flex-direction: column;
        gap: 25px;
        max-width: 142px;
    }

    .team_member-card {
        width: 258px;
        height: auto;
        padding: 24px;
        background-color: rgba(0, 0, 0, 0.57);
        box-shadow: none;
        backdrop-filter: none;
    }
    
    .team_layer {
        opacity: 0.3;
    }

    .team_member-quote {
        font-size: 14px;
        line-height: 18px;
        margin-top: 0px;
    }

    .team-img {
        display: none;
    }

    .team_member-img {
        display: block;
    }

    .team_member {
        position: relative;
    }

    .andriy .team_member-img {
        max-width: 460px;
        margin-top: -60px;
    }

    .andriy .team_member-card {
        bottom: 20px;
        left: 0;
    }

    .andriy .team_member-heading {
        left: 0;
        bottom: 300px;
        align-items: flex-start;
    }

    .andriy .team_member-position {
        text-align: left;
    }

    .natalia.team_member {
        display: block;
    }

    .natalia .team_member-img {
        max-width: 422px;
        margin-top: -80px;
        margin-left: -200px;
    }

    .natalia .team_member-card {
        bottom: 20px;
        right: 0;
    }

    .natalia .team_member-heading {
        right: 0;
        bottom: 310px;
        align-items: flex-end;
    }

    .natalia .team_member-name {
        text-align: right;
    }

    .vladyslav.team_member {
        display: block;
    }

    .vladyslav .team_member-img {
        max-width: 342px;
        margin-top: -200px;
        margin-left: 100px;
    }

    .vladyslav .team_member-card {
        bottom: 50px;
        left: 0;
    }

    .vladyslav .team_member-heading {
        left: 0;
        bottom: 176px;
        align-items: flex-start;
    }

    .vladyslav .team_member-position {
        text-align: left;
    }

    .team_member-card {
        position: absolute;
    }

    .team_member-card.overlap,
    .team_member-card.hidden {
        display: none;
    }

    .team_row {
        position: relative;
    }

    .team_section .overlay_rectangle {
        display: block;
        position: absolute;
        bottom: -20px;
        left: 50%;
        transform: translateX(-50%);
        background-color: #060606;
        filter: blur(20px);
        height: 72px;
        width: 80%;
    }
}

@media (max-width: 767px) {
    .team_section {
        padding-top: 101px;
    }

    .team_section .heading_element {
        font-size: 32px;
    }

    .team_row {
        flex-direction: column;
        align-items: center;
        gap: 82px;
    }

    .team_member {
        background: url(../../img/team-member-bg.png) no-repeat  center/cover; 
        width: 100%;
        height: 100%;
        aspect-ratio: 1/1;
    }

    .team_member-img {
        position: absolute;
    }

    .team_layer {
        opacity: 1;
        background-image: url(../../img/team-card-bg-mobile.png);
    }

    .tem_member-quote {
        letter-spacing: -0.01em;
    }

    .team_heading-box {
        margin-bottom: 88px;
    }

    .natalia .team_member-name,
    .natalia .team_member-position {
        text-align: left;
    }

    .natalia .team_member-img {
        display: none;
    }

    .natalia .team_member-img.mobile {
        display: block;
        max-width: 272px;
        margin-left: 0;
        right: -80px;
        bottom: 0px; 
    }

    .natalia .team_member-heading {
        left: 0;
        align-items: flex-start;
        bottom: 271px;
        max-width: 100px;
    }

    .natalia .team_member-quote {
        display: none;
    }

    .natalia .team_member-quote.mobile {
        display: block;
    }

    .natalia .team_member-card {
        left: 0;
        bottom: -80px;
    }

    .andriy .team_member-position {
        color: var(--white);
        max-width: 110px;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .andriy .team_member-position span {
        color: var(--primary-yellow);
    }

    .andriy .team_member-quote span {
        font-family: 'Helvetica Neue Bold';
    }

    .andriy .team_member-heading {
        bottom: 166px;
    }

    .andriy .team_member-img {
        max-width: 420px;
        right: -145px;
        bottom: -40px;
        margin-top: 0px;
    }

    .andriy .team_member-card {
        bottom: 0px;
    }

    .vladyslav.team_member {
        margin-bottom: 55px;
    }

    .vladyslav .team_member-img {
        bottom: -58px;
        max-width: 330px;
        margin-left: 0px;
        right: -105px;
    }

    .vladyslav .team_member-card {
        bottom: 0px;
    }

    .vladyslav .team_member-heading {
        bottom: 165px;
    }
}

@media (max-width: 359px) {
    .natalia .team_member-quote {
        display: block;
    }

    .natalia .team_member-quote.mobile {
        display: none;
    }

    .team_member {
        width: 348px;
        margin-right: -60px;
    }

    .andriy .team_member-img {
        right: -100px;
    }

    .natalia .team_member-img.mobile {
        right: -25px;
    }

    .vladyslav .team_member-img {
        right: -70px;
    }
}