/*********************************** Team Hero Section Start Here **************************************/

.td-team-hero-wrapper{
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    margin-top: -110px;
    padding-top: 0px;
    min-height: 484px;
}

/* ====================================
   GRID IMAGE
==================================== */

.td-grid-bg{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);

    width: 100%;
    height: 484px;

    z-index: 1;
    pointer-events: none;
}

.td-grid-bg img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.td-grid-dark{
    display: none !important;
}

html[data-theme="dark"] .td-grid-light{
    display: none !important;
}

html[data-theme="dark"] .td-grid-dark{
    display: block !important;
}

/* ====================================
   HERO CONTENT AREA
==================================== */

.td-team-hero{
    position: relative;
    z-index: 5;

    width: min(1200px, calc(100% - 60px));
    margin: 0 auto;

    height: 484px;

    display: flex;
    justify-content: center;

    padding-top: 174px;
    box-sizing: border-box;
}

/* ====================================
   CONTENT WRAPPER
==================================== */

.td-team-content{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 20px;
}

/* ====================================
   LABEL
==================================== */

.td-about-label{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    font-family: "JetBrains Mono", monospace;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;

    color: var(--td-text);
}

.td-dot{
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff0000;
}

/* ====================================
   HEADING
==================================== */

.td-team-content h1{
    margin: 0;

    font-family: "Tomorrow", sans-serif;
    font-size: 56px;
    font-weight: 700;
    line-height: 67px;
    letter-spacing: .2px;
    text-align: center;

    color: var(--td-text);
}

.td-team-content h1 span{
    color: var(--td-accent);
}

/* ====================================
   DESCRIPTION
==================================== */

.td-team-content p{
    max-width: 507px;
    margin: 0;

    font-family: "Nunito", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    letter-spacing: .2px;
    text-align: center;

    color: var(--td-muted);
}

/* ====================================
   TABLET
==================================== */

@media (max-width:1024px){

    .td-team-hero{
        height: 301px;
        padding-top: 140px;
    }

    .td-team-hero-wrapper{
        min-height: 400px;
    }

    .td-team-content{
        max-width: 700px;
    }

    .td-team-content h1{
        font-size: 48px;
        line-height: 58px;
    }

    .td-team-content p{
        max-width: 500px;
        font-size: 14px;
        line-height: 19px;
    }

    .td-grid-bg{
        width: 100%;
    }
}

/* ====================================
   MOBILE
==================================== */

@media (max-width:767px){

    .td-team-hero-wrapper{
        min-height: 270px;
        margin-top: -110px;
        overflow: hidden;
    }

    .td-team-hero{
        width: calc(100% - 40px);
        height: 220px;

        padding-top: 76px;

        display: flex;
        justify-content: center;
        align-items: flex-start;
    }

    .td-team-content{
        padding-top: 40px;
        width: 100%;
        gap: 15px;
    }

    .td-about-label{
        gap: 5px;
        font-size: 8px;
        line-height: 11px;
    }

    .td-dot{
        width: 6px;
        height: 6px;
    }

    .td-team-content h1{
        max-width: 294px;

        margin: 0 auto;

        font-size: 18px;
        font-weight: 700;
        line-height: 22px;
        letter-spacing: 0.2px;
        text-align: center;
    }

    .td-team-content p{
        max-width: 210px;

        margin: 0 auto;

        font-size: 8px;
        font-weight: 400;
        line-height: 11px;
        letter-spacing: 0.2px;
        text-align: center;
    }

    .td-grid-bg{
        width: 100%;
        height: 270px;
    }

    .td-grid-bg img{
        object-fit: cover;
        object-position: center top;
    }
}

/*********************************** Team Hero Section End Here **************************************/

/********************************** FOUNDER TEAM SECTION START ***********************************/

.td-founder-section{
    width:100%;
    padding-top: 90px;
}

.td-founder-container{
    width:min(1200px, calc(100% - 60px));
    margin:auto;
    display:flex;
    flex-direction:column;
    gap:60px;
}

.td-founder-member{
    display:flex;
    align-items:center;
    gap:50px;
}

/* IMAGE */
.td-founder-image{
    width:414px;
    height:351px;
    flex-shrink:0;
}

.td-founder-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:24px;
}

/* CONTENT */

.td-founder-content{
    width:637px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
    gap:32px;
}

.td-founder-content h2{
    margin:0;
    font-family:"Tomorrow",sans-serif;
    font-size:32px;
    line-height:38px;
    font-weight:700;
    color:var(--td-text);
}

.td-founder-content h2 span{
    color:var(--td-accent);
}

.td-founder-content p{
    margin:0;
    font-family:"Nunito",sans-serif;
    font-size:16px;
    line-height:22px;
    letter-spacing:.4px;
    color:var(--td-muted);
}

/* NAME */

.td-founder-name{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.td-founder-name strong{
    font-family:"Nunito",sans-serif;
    font-size:16px;
    line-height:22px;
    font-weight:700;
     color:var(--td-text);
}

.td-founder-name span{
    font-family:"Nunito",sans-serif;
    font-size:14px;
    line-height:19px;
     color:var(--td-muted);
}


/* =============================== TABLET
768px - 1024px
================================ */

@media (min-width:768px) and (max-width:1024px){

    .td-founder-section{
        width:929px;
        max-width:calc(100% - 40px);
        margin:0 auto;
        display:flex;
        flex-direction:column;
        gap:40px;
    }

    .td-founder-row{
        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:61px;
    }

    .td-founder-row.reverse{
        flex-direction:row;
    }

    .td-founder-image{
        width:310px;
        height:262px;
        object-fit:cover;
        border-radius:18px;
        filter:drop-shadow(
        0 0 21px rgba(255,255,255,.25)
        );
    }

    .td-founder-content{
        width:558px;
        display:flex;
        flex-direction:column;
    }

    .td-founder-content h2{
        margin:0 0 15px;
        font-family:"Tomorrow",sans-serif;
        font-size:32px;
        line-height:38px;
        color:var(--td-text);
    }

    .td-founder-content h2 span{
        color:#ff0000;
    }

    .td-founder-content p{
        margin:0;
        font-family:"Nunito",sans-serif;
        font-size:14px;
        line-height:19px;
        color:var(--td-text);
    }
    .td-founder-name{
        margin-top:26px;
    }

    .td-founder-name strong{
        display:block;
        font-family:"Nunito";
        font-size:16px;
        line-height:22px;
    }

    .td-founder-name span{
        display:block;
        font-family:"Nunito";
        font-size:14px;
        line-height:19px;
    }
}

/* MOBILE */

@media(max-width:767px){

    .td-founder-container{
        width:350px;
        max-width:calc(100% - 40px);
        margin:0 auto;
        display:flex;
        flex-direction:column;
        gap:40px;
    }

    .td-founder-member{
        width:100%;
        flex-direction:column;
        align-items:flex-start;
        gap:25px;
    }
    
    .td-founder-reverse{
        width:100%;
        flex-direction:column-reverse;
        align-items:flex-start;
        gap:25px;
    }

    /* IMAGE */
    .td-founder-image{
        width:350px;
        height:280px;
        max-width:100%;
        aspect-ratio:auto;
        object-fit:cover;
        border-radius:18.4px;
    }

    /* CONTENT */

    .td-founder-content{
        width:350px;
        max-width:100%;
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
    }

    .td-founder-content h2{
        width:100%;
        margin:0;
        font-family:"Tomorrow",sans-serif;
        font-size:16px;
        font-weight:700;
        line-height:19px;
        letter-spacing:.2px;
        color:var(--td-text);
    }

    .td-founder-content h2 span{
        color:#ff0000;
    }

    .td-founder-content p{
        width:100%;
        margin:0;
        font-family:"Nunito",sans-serif;
        font-size:10px;
        font-weight:400;
        line-height:14px;
        letter-spacing:.4px;
        color:var(--td-text);
    }

    /* NAME BLOCK */
    .td-founder-name{
        display:flex;
        flex-direction:column;
        gap:3px;
        margin-top:0;
    }

    .td-founder-name strong{

        font-family:"Nunito",sans-serif;
        font-size:12px;
        font-weight:700;
        line-height:16px;
        letter-spacing:.2px;
    }

    .td-founder-name span{

        font-family:"Nunito",sans-serif;
        font-size:12px;
        font-weight:400;
        line-height:16px;
        letter-spacing:.2px;
    }

    /*
    DARK THEME
    */

    html[data-theme="dark"] 
    .td-founder-content h2,

    html[data-theme="dark"] 
    .td-founder-content p,

    html[data-theme="dark"] 
    .td-founder-name strong,

    html[data-theme="dark"] 
    .td-founder-name span{


        color:#fff;


    }

}

/********************************** FOUNDER TEAM SECTION END ***********************************/

/********************************** OUR TEAM CAROUSEL SECTION START ***********************************/

.td-team-carousel-section{
    width:100%;
    overflow:hidden;
    padding:100px 0;
}
/* =========================
SECTION HEADING
========================= */
.td-team-carousel-heading{
    width:min(1200px, calc(100% - 60px));
    margin:0 auto 30px;
    text-align:center;
}

.td-team-carousel-heading h2{
    margin:0;
    font-family:"Tomorrow",sans-serif;
    font-size:32px;
    font-weight:700;
    line-height:38px;
    letter-spacing:.2px;
    color:var(--td-text);
}
.td-team-carousel-heading h2 span {
     color:var(--td-accent);
}



/* =========================
CAROUSEL
========================= */
.td-team-carousel-wrapper{
    width:100%;
    overflow:hidden;
    position:relative;
}
.td-team-carousel-track{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    gap:25px;
    width:max-content;
    will-change:transform;
    transform:translate3d(0,0,0);
}

.td-team-carousel-card{
    position:relative;
    flex:0 0 auto;
    width:282px;
    height:365px;
    border-radius:6px;
    overflow:hidden;
    display:flex;
    align-items:flex-end;
    padding:20px;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    transition:.35s;
}

.td-team-carousel-card:hover{
    transform:translateY(-6px);
}

/* =========================
TEAM CARD
========================= */
.td-team-carousel-card{
    position:relative;
    width:282px;
    height:365px;
    flex:0 0 282px;
    border-radius:6px;
    overflow:hidden;
    display:flex;
    align-items:flex-end;
    padding:20px;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    transition:.35s ease;
}

.td-team-carousel-card:hover{
    transform:translateY(-6px);
}

/* =========================
CARD INFO
========================= */
.td-team-carousel-info{
    display:flex;
    flex-direction:column;
    gap:2px;
    z-index:2;
}

.td-team-carousel-info h3{
    margin:0;
    width:156px;
    font-family:"Nunito",sans-serif;
    font-size:14px;
    font-weight:700;
    line-height:19px;
    letter-spacing:.2px;
    color:#fff;
}

.td-team-carousel-info p{
    margin:0;
    width:156px;
    font-family:"Nunito",sans-serif;
    font-size:10px;
    font-weight:400;
    line-height:14px;
    letter-spacing:.2px;
    color:#D9D9D9;
}

/***********************************
TABLET RESPONSIVE (768px - 1024px)
***********************************/
@media (min-width:768px) and (max-width:1024px){

    .td-team-carousel-section{
        padding:80px 0;
    }

    .td-team-carousel-heading{
        width:100%;
        margin-bottom:40px;
    }

    .td-team-carousel-heading h2{
        font-size:28px;
        line-height:34px;
    }

    .td-team-carousel-track{
        gap:20px;
    }

    .td-team-carousel-card{
        width:210px;
        height:272px;
        flex:0 0 210px;
        border-radius:4px;
        padding:20px;
    }

    .td-team-carousel-info{
        gap:2px;
    }

    .td-team-carousel-info h3{
        width:116px;
        font-size:10px;
        line-height:14px;
        letter-spacing:.15px;
    }

    .td-team-carousel-info p{
        width:116px;
        font-size:7px;
        line-height:10px;
        letter-spacing:.15px;
    }

}

/***********************************
MOBILE RESPONSIVE (MAX 767px)
************************************/
@media(max-width:767px){
    .td-team-carousel-section{
        padding:60px 0;
    }

    .td-team-carousel-heading{
        width:100%;
        margin-bottom:20px;
    }

    .td-team-carousel-heading h2{
        font-size:16px;
        line-height:19px;
    }

    .td-team-carousel-wrapper{
        width:100%;
    }

    .td-team-carousel-track{
        gap:8px;
    }

    .td-team-carousel-card{
       width:145px;
        height:188px;
        flex:0 0 145px;

        background-size: cover;
        background-position: center top;
    }

    .td-team-carousel-info{
        gap:1px;
    }

    .td-team-carousel-info h3{
        width:64px;
        font-size:6px;
        line-height:8px;
        letter-spacing:.08px;
    }
    .td-team-carousel-info p{
        width:64px;
        font-size:4px;
        line-height:6px;
        letter-spacing:.08px;
    }

}

/********************************** OUR TEAM CAROUSEL SECTION END ***********************************/