/* =========================================================
CURIOUS EXPLORER
OUR TEAM PAGE
========================================================= */

/* =========================================================
PAGE BASE
========================================================= */

.our-team-page {


position: relative;
overflow: hidden;
background: #ffffff;
color: #17221b;


}

.our-team-page img {


display: block;
max-width: 100%;


}

/* =========================================================
TEAM INTRO
========================================================= */

.team-intro {


position: relative;

padding: 170px 0 110px;

background:
    radial-gradient(
        circle at 10% 20%,
        rgba(76, 175, 80, .16),
        transparent 30%
    ),
    radial-gradient(
        circle at 90% 70%,
        rgba(255, 193, 7, .15),
        transparent 30%
    ),
    linear-gradient(
        135deg,
        #f4fff6 0%,
        #ffffff 48%,
        #fffaf0 100%
    );

overflow: hidden;


}

.team-intro::before {


content: "";

position: absolute;

width: 420px;
height: 420px;

border-radius: 50%;

background: rgba(76, 175, 80, .09);

filter: blur(80px);

top: -220px;
left: -150px;

animation: teamIntroGlow 9s ease-in-out infinite alternate;


}

.team-intro::after {


content: "";

position: absolute;

width: 360px;
height: 360px;

border-radius: 50%;

background: rgba(255, 193, 7, .10);

filter: blur(80px);

right: -140px;
bottom: -180px;

animation: teamIntroGlowTwo 10s ease-in-out infinite alternate;


}

@keyframes teamIntroGlow {


from {
    transform: translate(0, 0) scale(1);
}

to {
    transform: translate(120px, 90px) scale(1.15);
}


}

@keyframes teamIntroGlowTwo {


from {
    transform: translate(0, 0) scale(1);
}

to {
    transform: translate(-100px, -80px) scale(1.12);
}


}

.team-intro-content {


position: relative;

z-index: 2;

max-width: 850px;

margin: auto;

text-align: center;


}

.team-eyebrow {


display: inline-flex;

align-items: center;

gap: 10px;

padding: 9px 18px;

margin-bottom: 25px;

border-radius: 999px;

background: rgba(255, 255, 255, .8);

border: 1px solid rgba(76, 175, 80, .20);

color: #16823a;

font-size: .82rem;

font-weight: 800;

letter-spacing: 1.2px;

text-transform: uppercase;

box-shadow:
    0 10px 30px rgba(0, 0, 0, .06);


}

.team-eyebrow i {


font-size: 1rem;

color: #43a047;


}

.team-intro h1 {


margin: 0;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2.8rem, 6vw, 5.8rem);

line-height: 1.04;

font-weight: 800;

letter-spacing: -2px;

color: #15231a;


}

.team-intro h1 span {


display: block;

margin-top: 8px;

background:
    linear-gradient(
        90deg,
        #16823a,
        #43a047,
        #f4b400
    );

-webkit-background-clip: text;
background-clip: text;

-webkit-text-fill-color: transparent;


}

.team-intro p {


max-width: 700px;

margin: 30px auto 0;

color: #5f6d63;

font-size: 1.08rem;

line-height: 1.9;


}

/* =========================================================
TEAM MEMBERS
========================================================= */

.team-members {


position: relative;

padding: 110px 0 120px;

background: #ffffff;


}

.team-section-heading {


max-width: 750px;

margin: 0 auto 60px;

text-align: center;


}

.team-section-heading > span {


display: inline-block;

margin-bottom: 15px;

color: #16823a;

font-size: .82rem;

font-weight: 800;

letter-spacing: 2px;

text-transform: uppercase;


}

.team-section-heading h2 {


margin: 0;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2rem, 4vw, 3.5rem);

line-height: 1.15;

font-weight: 800;

color: #17221b;


}

.team-section-heading h2 strong {


color: #43a047;


}

.team-section-heading p {


margin: 20px auto 0;

max-width: 650px;

color: #68756c;

line-height: 1.8;


}

/* =========================================================
TEAM CARD
========================================================= */

.team-card {


height: 100%;

overflow: hidden;

background: #ffffff;

border-radius: 26px;

border: 1px solid rgba(20, 40, 25, .08);

box-shadow:
    0 15px 45px rgba(18, 40, 23, .08);

transition:
    transform .5s cubic-bezier(.22, 1, .36, 1),
    box-shadow .5s ease,
    border-color .4s ease;


}

.team-card:hover {


transform: translateY(-12px);

border-color: rgba(67, 160, 71, .25);

box-shadow:
    0 28px 65px rgba(18, 40, 23, .15);


}

/* =========================================================
TEAM IMAGE
========================================================= */

.team-image {


position: relative;

height: 390px;

overflow: hidden;

background: #dce9df;


}

.team-image img {


width: 100%;
height: 100%;

object-fit: cover;

transition:
    transform .8s cubic-bezier(.22, 1, .36, 1),
    filter .6s ease;


}

.team-card:hover .team-image img {


transform: scale(1.08);

filter: saturate(1.08);


}

.team-image-overlay {


position: absolute;

inset: 0;

background:
    linear-gradient(
        to top,
        rgba(5, 20, 10, .72) 0%,
        rgba(5, 20, 10, .12) 45%,
        transparent 70%
    );

opacity: .75;

transition: opacity .4s ease;


}

.team-card:hover .team-image-overlay {


opacity: .9;


}

/* =========================================================
SOCIAL ICONS
========================================================= */

.team-social {


position: absolute;

right: 20px;
bottom: 20px;

display: flex;

gap: 8px;

z-index: 3;

transform: translateY(15px);

opacity: 0;

transition:
    transform .45s ease,
    opacity .45s ease;


}

.team-card:hover .team-social {


transform: translateY(0);

opacity: 1;


}

.team-social a {


width: 40px;
height: 40px;

display: flex;

align-items: center;
justify-content: center;

border-radius: 50%;

color: #ffffff;

background: rgba(255, 255, 255, .18);

border: 1px solid rgba(255, 255, 255, .35);

backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);

text-decoration: none;

transition:
    transform .3s ease,
    background .3s ease,
    color .3s ease;


}

.team-social a:hover {


transform: translateY(-5px) rotate(8deg);

background: #ffffff;

color: #16823a;


}

/* =========================================================
TEAM CONTENT
========================================================= */

.team-content {


padding: 28px 28px 32px;


}

.team-role {


display: inline-block;

margin-bottom: 10px;

color: #16823a;

font-size: .75rem;

font-weight: 800;

letter-spacing: 1px;

text-transform: uppercase;


}

.team-content h3 {


margin: 0 0 12px;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: 1.35rem;

font-weight: 800;

color: #17221b;


}

.team-content p {


margin: 0;

color: #69756d;

font-size: .94rem;

line-height: 1.75;


}

/* =========================================================
BELIEFS
========================================================= */

.team-beliefs {


position: relative;

padding: 115px 0 125px;

background:
    radial-gradient(
        circle at 0% 100%,
        rgba(76, 175, 80, .14),
        transparent 30%
    ),
    radial-gradient(
        circle at 100% 0%,
        rgba(255, 193, 7, .13),
        transparent 30%
    ),
    #f5faf6;


}

.team-beliefs-heading {


text-align: center;

max-width: 760px;

margin: 0 auto 55px;


}

.team-beliefs-heading > span {


display: block;

margin-bottom: 14px;

color: #16823a;

font-size: .8rem;

font-weight: 800;

letter-spacing: 2px;

text-transform: uppercase;


}

.team-beliefs-heading h2 {


margin: 0;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2rem, 4vw, 3.4rem);

font-weight: 800;

line-height: 1.15;

color: #17221b;


}

.team-beliefs-heading strong {


color: #43a047;


}

/* =========================================================
BELIEF CARD
========================================================= */

.belief-card {


height: 100%;

padding: 40px 32px;

text-align: center;

background: rgba(255, 255, 255, .82);

border: 1px solid rgba(67, 160, 71, .10);

border-radius: 25px;

box-shadow:
    0 15px 45px rgba(20, 50, 25, .06);

transition:
    transform .45s cubic-bezier(.22, 1, .36, 1),
    box-shadow .45s ease,
    border-color .45s ease;


}

.belief-card:hover {


transform: translateY(-10px);

border-color: rgba(67, 160, 71, .25);

box-shadow:
    0 25px 60px rgba(20, 50, 25, .12);


}

.belief-icon {


width: 72px;
height: 72px;

display: flex;

align-items: center;
justify-content: center;

margin: 0 auto 24px;

border-radius: 22px;

background:
    linear-gradient(
        135deg,
        #e7f8e9,
        #fff8dc
    );

color: #16823a;

font-size: 1.65rem;

transition:
    transform .45s ease,
    border-radius .45s ease;


}

.belief-card:hover .belief-icon {


transform:
    translateY(-5px)
    rotate(5deg);

border-radius: 50%;


}

.belief-card h3 {


margin: 0 0 13px;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: 1.3rem;

font-weight: 800;

color: #17221b;


}

.belief-card p {


margin: 0;

color: #69756d;

line-height: 1.8;


}

/* =========================================================
CTA
========================================================= */

.team-cta {


position: relative;

overflow: hidden;

padding: 120px 0;

color: #ffffff;

background:
    radial-gradient(
        circle at 15% 30%,
        rgba(76, 175, 80, .38),
        transparent 28%
    ),
    radial-gradient(
        circle at 85% 70%,
        rgba(255, 193, 7, .30),
        transparent 28%
    ),
    radial-gradient(
        circle at 50% 0%,
        rgba(33, 150, 243, .20),
        transparent 35%
    ),
    linear-gradient(
        135deg,
        #173d28 0%,
        #155c39 45%,
        #0c3925 100%
    );


}

.team-cta::before {


content: "";

position: absolute;

inset: 0;

background:
    linear-gradient(
        120deg,
        transparent 30%,
        rgba(255, 255, 255, .06) 50%,
        transparent 70%
    );

background-size: 250% 100%;

animation: ctaShimmer 8s linear infinite;


}

@keyframes ctaShimmer {


0% {
    background-position: 200% 0;
}

100% {
    background-position: -200% 0;
}


}

.team-cta-glow {


position: absolute;

border-radius: 50%;

filter: blur(80px);

pointer-events: none;


}

.team-cta-glow-one {


width: 280px;
height: 280px;

top: -120px;
left: -80px;

background: rgba(255, 193, 7, .20);


}

.team-cta-glow-two {


width: 320px;
height: 320px;

right: -120px;
bottom: -150px;

background: rgba(33, 150, 243, .20);


}

.team-cta-content {


position: relative;

z-index: 2;

max-width: 800px;

margin: auto;

text-align: center;


}

.team-cta-content > span {


display: inline-flex;

align-items: center;

gap: 10px;

margin-bottom: 22px;

color: #ffe082;

font-size: .8rem;

font-weight: 800;

letter-spacing: 1.8px;

text-transform: uppercase;


}

.team-cta-content h2 {


margin: 0;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2.5rem, 5vw, 4.6rem);

line-height: 1.05;

font-weight: 800;

letter-spacing: -1.5px;


}


.team-cta-content h2 strong {


display: block;

color: #ffd54f;


}

.team-cta-content p {


max-width: 680px;

margin: 25px auto 35px;

color: rgba(255, 255, 255, .82);

font-size: 1.05rem;

line-height: 1.85;


}

.team-cta-buttons {


display: flex;

justify-content: center;

align-items: center;

gap: 15px;

flex-wrap: wrap;


}

.team-cta-buttons .btn {


border-radius: 999px;

padding: 13px 28px;

font-weight: 800;

transition:
    transform .35s ease,
    box-shadow .35s ease;


}

.team-cta-buttons .btn:hover {


transform: translateY(-5px);

box-shadow:
    0 15px 30px rgba(0, 0, 0, .20);


}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 991px) {


.team-intro {

    padding: 145px 0 90px;

}

.team-members {

    padding: 90px 0 100px;

}

.team-beliefs {

    padding: 90px 0 100px;

}

.team-cta {

    padding: 100px 0;

}

.team-image {

    height: 360px;

}


}

@media (max-width: 767px) {


.team-intro {

    padding: 125px 0 75px;

}

.team-intro h1 {

    letter-spacing: -1px;

}

.team-intro p {

    font-size: .98rem;

}

.team-members {

    padding: 75px 0 80px;

}

.team-section-heading {

    margin-bottom: 40px;

}

.team-image {

    height: 390px;

}

.team-social {

    opacity: 1;

    transform: translateY(0);

}

.team-content {

    padding: 25px;

}

.team-beliefs {

    padding: 75px 0 80px;

}

.belief-card {

    padding: 35px 25px;

}

.team-cta {

    padding: 85px 0;

}


}

@media (max-width: 480px) {


.team-eyebrow {

    font-size: .7rem;

    padding: 8px 13px;

}

.team-image {

    height: 350px;

}

.team-cta-buttons {

    flex-direction: column;

    width: 100%;

}

.team-cta-buttons .btn {

    width: 100%;

    max-width: 280px;

}


}