/* =========================================================
   TEEM GLOBAL
========================================================= */


:root {
    --teem-primary: #173f35;
    --teem-primary-dark: #0e2c25;
    --teem-secondary: #c49a52;
    --teem-text: #1b2723;
    --teem-muted: #6b756f;
    --teem-white: #ffffff;
    --teem-border: rgba(23, 63, 53, 0.10);
    --teem-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    --teem-transition: all 0.3s ease;
}


/* =========================================================
   SITE HEADER
========================================================= */

.teem-site-header {
    position: relative;
    top: 0;
    z-index: 1030;
   
}


/* =========================================================
   NAVBAR
========================================================= */

.teem-main-navbar {
     background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid var(--teem-border);
    transition: box-shadow 0.3s ease, background 0.3s ease;
}

.teem-navbar-container {
    min-height: 50px;
}


/* =========================================================
   TEEM NAVBAR LOGO
========================================================= */

.teem-navbar-brand {
    padding: 0;
    margin-right: 2rem;
    text-decoration: none;
}

.teem-brand-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.teem-brand-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    overflow: hidden;
    flex-shrink: 0;
    
}

.teem-navbar-logo {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}


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

@media (max-width: 1199.98px) {

    .teem-brand-logo {
        width: 64px;
        height: 64px;
    }

}


@media (max-width: 767.98px) {

    .teem-brand-logo {
        width: 58px;
        height: 58px;
    }

}


@media (max-width: 380px) {

    .teem-brand-logo {
        width: 52px;
        height: 52px;
    }

}



/* =========================================================
   NAVIGATION
========================================================= */

.teem-navbar-nav {
    gap: 0.15rem;
}

.teem-nav-item {
    position: relative;
}

.teem-nav-link {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0.65rem 0.7rem !important;
    color: var(--teem-text) !important;
    font-size: 0.88rem;
    font-weight: 600;

    text-decoration: none;

    transition: var(--teem-transition);
}

.teem-nav-link:hover {
    color: var(--teem-primary) !important;
}

.teem-nav-link::after {
    transition: var(--teem-transition);
}

.teem-nav-link.active {
    color: var(--teem-primary) !important;
}

.teem-nav-link.active::before {
    content: "";
    position: absolute;
    left: 0.7rem;
    right: 0.7rem;
    bottom: 0.15rem;

    height: 2px;

    background: var(--teem-secondary);
    border-radius: 20px;
}


/* =========================================================
   DROPDOWN
========================================================= */

.teem-dropdown-menu {
    min-width: 230px;

    margin-top: 0.75rem !important;
    padding: 0.6rem;

    border: 1px solid var(--teem-border);
    border-radius: 14px;

    background: var(--teem-white);

    box-shadow: var(--teem-shadow);
}

.teem-dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;

    padding: 0.7rem 0.8rem;

    color: var(--teem-text);

    font-size: 0.85rem;
    font-weight: 600;

    border-radius: 9px;

    transition: var(--teem-transition);
}

.teem-dropdown-item i {
    width: 20px;
    color: var(--teem-primary);
    font-size: 1rem;
}

.teem-dropdown-item:hover {
    color: var(--teem-primary);
    background: rgba(23, 63, 53, 0.06);
}

.teem-dropdown-divider {
    border-color: var(--teem-border);
}


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

.teem-navbar-actions {
    display: flex;
    align-items: center;
    margin-left: 1rem;
}

.teem-navbar-give {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;

    min-height: 44px;
    padding: 0.65rem 1.15rem;

    color: var(--teem-white);
    background: var(--teem-primary);

    border-radius: 8px;

    font-size: 0.85rem;
    font-weight: 700;

    text-decoration: none;

    transition: var(--teem-transition);
}

.teem-navbar-give i {
    font-size: 0.8rem;
}

.teem-navbar-give:hover {
    color: var(--teem-white);
    background: var(--teem-primary-dark);
    transform: translateY(-1px);
}

/* =========================================================
   TEEM MOBILE NAVBAR TOGGLER
   ========================================================= */

.teem-navbar-toggler {
    width: 48px;
    height: 48px;
    padding: 0;

    border: 1px solid rgba(11, 61, 50, 0.15);
    border-radius: 14px;

    background: rgba(255, 255, 255, 0.96);
    color: var(--teem-green, #0b3d32);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-shadow: 0 4px 14px rgba(11, 61, 50, 0.08);

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* Remove Bootstrap default focus styling */
.teem-navbar-toggler:focus {
    outline: none;
    box-shadow:
        0 0 0 3px rgba(201, 162, 39, 0.15),
        0 4px 14px rgba(11, 61, 50, 0.08);
}


/* Icon wrapper */
.teem-toggler-icon {
    position: relative;

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}


/* Both icons occupy the same position */
.teem-toggler-icon i {
    position: absolute;

    font-size: 1.45rem;
    line-height: 1;

    transition:
        opacity 0.25s ease,
        transform 0.3s ease;
}


/* =========================================================
   CLOSED STATE
   ========================================================= */

.teem-menu-icon {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

.teem-close-icon {
    opacity: 0;
    transform: rotate(-90deg) scale(0.7);
}


/* =========================================================
   OPEN STATE
   ========================================================= */

.teem-navbar-toggler[aria-expanded="true"] {
    background: var(--teem-green, #0b3d32);
    border-color: var(--teem-green, #0b3d32);
    color: #ffffff;

    box-shadow: 0 6px 18px rgba(11, 61, 50, 0.18);
}


.teem-navbar-toggler[aria-expanded="true"] .teem-menu-icon {
    opacity: 0;
    transform: rotate(90deg) scale(0.7);
}


.teem-navbar-toggler[aria-expanded="true"] .teem-close-icon {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}


/* =========================================================
   HOVER
   ========================================================= */

.teem-navbar-toggler:hover {
    background: var(--teem-green, #0b3d32);
    border-color: var(--teem-green, #0b3d32);
    color: #ffffff;

    transform: translateY(-1px);

    box-shadow: 0 7px 20px rgba(11, 61, 50, 0.16);
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 575.98px) {

    .teem-navbar-toggler {
        width: 44px;
        height: 44px;
        border-radius: 12px;
    }

    .teem-toggler-icon i {
        font-size: 1.35rem;
    }
}

/* =========================================================
   TEEM HERO
========================================================= */

.teem-hero-section {
    position: relative;

    min-height: 760px;

    display: flex;
    align-items: center;

    overflow: hidden;

    background: #081f19;
}


/* =========================================================
   HERO BACKGROUND IMAGE
========================================================= */

.teem-hero-background {
    position: absolute;

    inset: 0;

    z-index: 0;

    overflow: hidden;
}

.teem-hero-background-image {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: 72% center;

    filter:
        saturate(0.9)
        contrast(1.05);

    transform: scale(1.02);
}


/* =========================================================
   HERO GRADIENT OVERLAY
========================================================= */

.teem-hero-overlay {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(5, 25, 20, 0.98) 0%,
            rgba(5, 25, 20, 0.92) 32%,
            rgba(5, 25, 20, 0.68) 58%,
            rgba(5, 25, 20, 0.34) 78%,
            rgba(5, 25, 20, 0.18) 100%
        );
}


/* =========================================================
   GOLD ATMOSPHERIC GLOW
========================================================= */

.teem-hero-glow {
    position: absolute;

    width: 500px;
    height: 500px;

    right: 4%;
    top: 50%;

    z-index: 2;

    transform: translateY(-50%);

    border-radius: 50%;

    background: rgba(196, 154, 82, 0.08);

    filter: blur(100px);

    pointer-events: none;
}


/* =========================================================
   HERO CONTENT
========================================================= */

.teem-hero-container {
    position: relative;

    z-index: 3;

    width: 100%;

    padding-top: 0;
    padding-bottom: 7rem;
}


.teem-hero-content {
    max-width: 760px;
}


/* =========================================================
   EYEBROW
========================================================= */

.teem-hero-eyebrow {
    display: inline-block;

    margin-bottom: 1.35rem;

    color: #d4a957;

    font-size: 0.76rem;

    font-weight: 800;

    letter-spacing: 0.14em;

    line-height: 1.6;

    text-transform: uppercase;
}


/* =========================================================
   HERO TITLE
========================================================= */

.teem-hero-title {
    margin: 0 0 1.5rem;

    color: #ffffff;

    font-size: clamp(3.4rem, 5.7vw, 5.8rem);

    font-weight: 800;

    line-height: 0.96;

    letter-spacing: -0.055em;
}


.teem-hero-title span {
    display: block;

    color: #dfb969;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.teem-hero-description {
    max-width: 650px;

    margin: 0 0 2rem;

    color: rgba(255, 255, 255, 0.76);

    font-size: 1rem;

    line-height: 1.8;
}


/* =========================================================
   HERO ACTIONS
========================================================= */

.teem-hero-actions {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 0.8rem;
}


.teem-primary-button,
.teem-secondary-button {
    display: inline-flex;

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

    gap: 0.6rem;

    min-height: 52px;

    padding: 0.8rem 1.35rem;

    border-radius: 8px;

    font-size: 0.88rem;

    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


/* Primary */

.teem-primary-button {
    color: #ffffff;

    background: #c49a52;

    box-shadow: 0 10px 25px rgba(196, 154, 82, 0.18);
}


.teem-primary-button:hover {
    color: #ffffff;

    background: #d4aa5d;

    transform: translateY(-2px);

    box-shadow: 0 14px 30px rgba(196, 154, 82, 0.25);
}


/* Secondary */

.teem-secondary-button {
    color: #ffffff;

    background: rgba(255, 255, 255, 0.06);

    border: 1px solid rgba(255, 255, 255, 0.25);

    backdrop-filter: blur(10px);
}


.teem-secondary-button:hover {
    color: #ffffff;

    background: rgba(255, 255, 255, 0.12);

    border-color: rgba(255, 255, 255, 0.42);

    transform: translateY(-2px);
}


/* =========================================================
   HERO META
========================================================= */

.teem-hero-meta {
    display: flex;

    align-items: center;

    gap: 0.8rem;

    margin-top: 2rem;

    color: rgba(255, 255, 255, 0.48);

    font-size: 0.68rem;

    font-weight: 700;

    letter-spacing: 0.13em;

    text-transform: uppercase;
}


.teem-hero-meta-line {
    width: 38px;

    height: 1px;

    background: #c49a52;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1400px) {

    .teem-hero-section {
        min-height: 820px;
    }

    .teem-hero-background-image {
        object-position: 70% center;
    }

    .teem-hero-content {
        max-width: 800px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-hero-section {
        min-height: 720px;
    }

    .teem-hero-background-image {
        object-position: 68% center;
    }

    .teem-hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(5, 25, 20, 0.96) 0%,
                rgba(5, 25, 20, 0.83) 50%,
                rgba(5, 25, 20, 0.48) 100%
            );
    }

    .teem-hero-container {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

     .teem-hero-background {
        overflow: hidden;
    }

    .teem-hero-section {
        min-height: 760px;

        align-items: center;
    }

    .teem-hero-background-image {
        width: 100%;
        height: 100%;
        object-fit: cover;
         object-position: 80% center;

        transform: none;
    }

    .teem-hero-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(5, 25, 20, 0.88) 0%,
                rgba(5, 25, 20, 0.78) 35%,
                rgba(5, 25, 20, 0.91) 72%,
                rgba(5, 25, 20, 0.98) 100%
            );
    }

    .teem-hero-glow {
        width: 300px;
        height: 300px;

        right: -100px;
    }

    .teem-hero-container {
        padding-top: 0;
        padding-bottom: 2rem;
    }

    .teem-hero-content {
        max-width: 100%;

        text-align: center;
    }

    .teem-hero-eyebrow {
        max-width: 340px;

        margin-right: auto;
        margin-left: auto;

        font-size: 0.67rem;
    }

    .teem-hero-title {
        font-size: clamp(2.9rem, 13vw, 4.2rem);

        letter-spacing: -0.06em;
    }

    .teem-hero-description {
        max-width: 500px;

        margin-right: auto;
        margin-left: auto;

        font-size: 0.93rem;
    }

    .teem-hero-actions {
        justify-content: center;

        width: 100%;
    }

    .teem-primary-button,
    .teem-secondary-button {
        min-width: 190px;
    }

    .teem-hero-meta {
        justify-content: center;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-hero-section {
        min-height: 720px;
    }

    .teem-hero-background-image {
        object-position: 65% center;
    }

    .teem-hero-title {
        font-size: clamp(2.55rem, 13vw, 3.5rem);
    }

    .teem-hero-description {
        font-size: 0.88rem;

        line-height: 1.7;
    }

    .teem-hero-actions {
        flex-direction: column;
    }

    .teem-primary-button,
    .teem-secondary-button {
        width: 100%;
    }

}


/* =========================================================
   MOBILE / TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .teem-navbar-container {
        min-height: 76px;
    }

    .teem-navbar-collapse {
        padding: 1rem 0 1.25rem;
    }

    .teem-navbar-nav {
        align-items: stretch !important;
        gap: 0;
    }

    .teem-nav-link {
        min-height: 48px;
        padding: 0.75rem 0.25rem !important;
    }

    .teem-nav-link.active::before {
        display: none;
    }

    .teem-nav-link.active {
        background: rgba(23, 63, 53, 0.06);
        border-radius: 8px;
    }

    .teem-dropdown-menu {
        margin-top: 0 !important;
        padding: 0.35rem;

        border: 0;
        border-radius: 8px;

        box-shadow: none;
        background: rgba(23, 63, 53, 0.035);
    }

    .teem-navbar-actions {
        margin: 0.75rem 0 0;
    }

    .teem-navbar-give {
        width: 100%;
    }

}


@media (max-width: 767.98px) {

    .teem-navbar-container {
        min-height: 70px;
    }

    .teem-navbar-brand {
        margin-right: 0;
    }

    .teem-brand-logo {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .teem-brand-name {
        font-size: 1rem;
    }

    .teem-brand-location {
        font-size: 0.6rem;
    }

    .teem-hero-section {
        min-height: 650px;
        padding: 5rem 0;
    }

    .teem-hero-title {
        font-size: clamp(2.35rem, 12vw, 3.5rem);
    }

    .teem-hero-description {
        font-size: 0.95rem;
    }

    .teem-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .teem-primary-button,
    .teem-secondary-button {
        width: 100%;
    }

}


@media (max-width: 380px) {

    .teem-brand-text {
        display: none;
    }

    .teem-brand-logo {
        width: 40px;
        height: 40px;
    }

}


/* =========================================================
   TEEM ABOUT / MINISTRY INTRODUCTION
========================================================= */

.teem-about-section {
    position: relative;

    padding: 7rem 0;

    overflow: hidden;

    background: #ffffff;
}


/* =========================================================
   ABOUT ROW
========================================================= */

.teem-about-row {
    --bs-gutter-x: 5rem;
}


/* =========================================================
   SECTION EYEBROW
========================================================= */

.teem-section-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    margin-bottom: 1rem;

    color: #b8893f;

    font-size: 0.72rem;

    font-weight: 800;

    letter-spacing: 0.15em;

    line-height: 1.5;

    text-transform: uppercase;
}


.teem-section-eyebrow::before {
    content: "";

    width: 30px;

    height: 2px;

    background: #c49a52;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.teem-about-image-wrapper {
    position: relative;

    padding: 0 1rem 1rem 0;
}


.teem-about-image-frame {
    position: relative;

    height: 570px;

    overflow: hidden;

    border-radius: 14px;

    background: #0b2821;

    box-shadow:
        0 25px 60px rgba(8, 31, 25, 0.14);
}


.teem-about-image {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transition:
        transform 0.8s ease;
}


.teem-about-image-frame:hover .teem-about-image {
    transform: scale(1.04);
}


/* =========================================================
   IMAGE ACCENT
========================================================= */

.teem-about-image-accent {
    position: absolute;

    left: 0;
    bottom: 0;

    width: 120px;
    height: 120px;

    z-index: -1;

    border-radius: 12px;

    background: #c49a52;

    transform: translate(-12px, 12px);
}


/* =========================================================
   IMAGE BADGE
========================================================= */

.teem-about-badge {
    position: absolute;

    right: 0;
    bottom: 45px;

    display: flex;

    align-items: center;

    gap: 0.8rem;

    max-width: 250px;

    padding: 1rem 1.15rem;

    border-radius: 10px;

    background: rgba(255, 255, 255, 0.96);

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.16);

    backdrop-filter: blur(10px);
}


.teem-about-badge-icon {
    display: flex;

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

    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    border-radius: 50%;

    color: #ffffff;

    background: #c49a52;

    font-size: 0.9rem;
}


.teem-about-badge-content {
    display: flex;

    flex-direction: column;

    gap: 0.15rem;
}


.teem-about-badge-content strong {
    color: #0b2821;

    font-size: 0.85rem;

    font-weight: 800;
}


.teem-about-badge-content span {
    color: #737b77;

    font-size: 0.68rem;

    font-weight: 500;
}


/* =========================================================
   ABOUT CONTENT
========================================================= */

.teem-about-content {
    max-width: 620px;

    padding-left: 1rem;
}


/* =========================================================
   ABOUT TITLE
========================================================= */

.teem-about-title {
    margin: 0 0 1.5rem;

    color: #0b2821;

    font-size: clamp(2.6rem, 4vw, 4.25rem);

    font-weight: 800;

    line-height: 1.02;

    letter-spacing: -0.045em;
}


.teem-about-title span {
    display: block;

    color: #c49a52;
}


/* =========================================================
   ABOUT LEAD
========================================================= */

.teem-about-lead {
    margin: 0 0 1rem;

    color: #263b34;

    font-size: 1.12rem;

    font-weight: 600;

    line-height: 1.75;
}


/* =========================================================
   ABOUT BODY TEXT
========================================================= */

.teem-about-text {
    margin: 0;

    color: #68736e;

    font-size: 0.96rem;

    line-height: 1.85;
}


/* =========================================================
   MINISTRY PILLARS
========================================================= */

.teem-about-pillars {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1rem;

    margin-top: 2rem;
}


.teem-about-pillar {
    display: flex;

    flex-direction: column;

    gap: 0.75rem;

    padding: 1rem;

    border: 1px solid #e7ebe8;

    border-radius: 10px;

    background: #fafbfa;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}


.teem-about-pillar:hover {
    transform: translateY(-4px);

    border-color: rgba(196, 154, 82, 0.4);

    box-shadow:
        0 15px 35px rgba(8, 31, 25, 0.08);
}


/* =========================================================
   PILLAR ICON
========================================================= */

.teem-about-pillar-icon {
    display: flex;

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

    width: 38px;
    height: 38px;

    border-radius: 8px;

    color: #b8893f;

    background: rgba(196, 154, 82, 0.12);

    font-size: 0.95rem;
}


.teem-about-pillar h3 {
    margin: 0;

    color: #0b2821;

    font-size: 0.82rem;

    font-weight: 800;
}


.teem-about-pillar p {
    margin: 0;

    color: #7b8580;

    font-size: 0.68rem;

    line-height: 1.5;
}


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

.teem-about-action {
    margin-top: 2rem;
}


.teem-about-button {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    min-height: 50px;

    padding: 0.75rem 1.3rem;

    border-radius: 7px;

    color: #ffffff;

    background: #0b2821;

    font-size: 0.82rem;

    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-about-button:hover {
    color: #ffffff;

    background: #143c31;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(8, 31, 25, 0.18);
}


.teem-about-button i {
    transition: transform 0.3s ease;
}


.teem-about-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-about-section {
        padding: 5.5rem 0;
    }

    .teem-about-row {
        --bs-gutter-x: 2rem;
    }

    .teem-about-image-frame {
        height: 500px;
    }

    .teem-about-content {
        padding-left: 0;
    }

    .teem-about-title {
        font-size: clamp(2.5rem, 5vw, 3.5rem);
    }

    .teem-about-pillars {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-about-section {
        padding: 4.5rem 0;
    }

    .teem-about-row {
        --bs-gutter-x: 0;
    }


    /*
       Content comes BEFORE image on mobile.
       This keeps the ministry message immediately
       after the hero.
    */

    .teem-about-content {
        order: 1;

        max-width: 100%;

        padding: 0;

        margin-bottom: 2.75rem;

        text-align: center;
    }


    .teem-about-image-wrapper {
        order: 2;

        padding: 0 0.5rem 0.5rem 0;
    }


    .teem-about-image-frame {
        height: 430px;

        border-radius: 12px;
    }


    .teem-about-image-accent {
        width: 80px;
        height: 80px;

        transform: translate(-8px, 8px);
    }


    .teem-about-badge {
        right: -4px;

        bottom: 25px;

        padding: 0.75rem 0.9rem;
    }


    .teem-about-badge-icon {
        width: 34px;
        height: 34px;

        flex-basis: 34px;
    }


    .teem-about-title {
        font-size: clamp(2.45rem, 11vw, 3.5rem);

        line-height: 1.02;
    }


    .teem-about-lead {
        font-size: 0.98rem;

        line-height: 1.7;
    }


    .teem-about-text {
        font-size: 0.88rem;

        line-height: 1.75;
    }


    .teem-about-pillars {
        grid-template-columns: 1fr;

        text-align: left;
    }


    .teem-about-pillar {
        flex-direction: row;

        align-items: center;

        gap: 0.8rem;
    }


    .teem-about-pillar-icon {
        flex: 0 0 38px;
    }


    .teem-about-action {
        display: flex;

        justify-content: center;

        margin-top: 1.75rem;
    }


    .teem-about-button {
        width: 100%;

        justify-content: center;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-about-section {
        padding: 4rem 0;
    }


    .teem-about-image-frame {
        height: 380px;
    }


    .teem-about-title {
        font-size: 2.5rem;
    }


    .teem-about-badge {
        right: -2px;

        max-width: 220px;
    }

}



/* =========================================================
   TEEM — LIFE TOGETHER WORSHIP CAROUSEL
========================================================= */

.teem-about-worship {
    position: relative;

    margin-top: 6rem;
}


/* =========================================================
   CAROUSEL
========================================================= */

.teem-worship-carousel {
    position: relative;

    min-height: 560px;

    overflow: hidden;

    border-radius: 16px;

    background: #071f18;

    isolation: isolate;
}


/* =========================================================
   CAROUSEL IMAGES
========================================================= */

.teem-worship-carousel .carousel-inner,
.teem-worship-carousel .carousel-item {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;
}


.teem-worship-photo {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transform: scale(1.01);

    transition:
        transform 6s ease;
}


/*
   Very subtle cinematic movement
*/

.teem-worship-carousel
.carousel-item.active
.teem-worship-photo {
    transform: scale(1.04);
}


/* =========================================================
   DARK OVERLAY
========================================================= */

.teem-worship-overlay {
    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(4, 24, 18, 0.94) 0%,
            rgba(4, 24, 18, 0.78) 32%,
            rgba(4, 24, 18, 0.40) 68%,
            rgba(4, 24, 18, 0.22) 100%
        );
}


/* =========================================================
   FIXED TEXT
========================================================= */

.teem-worship-content {
    position: absolute;

    top: 50%;
    left: 0;

    z-index: 5;

    width: min(680px, 65%);

    padding: 3rem;

    transform: translateY(-50%);
}


.teem-worship-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    margin-bottom: 1rem;

    color: #dfb969;

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 0.15em;

    text-transform: uppercase;
}


.teem-worship-eyebrow::before {
    content: "";

    width: 30px;
    height: 2px;

    background: #c49a52;
}


.teem-worship-content h2 {
    margin: 0 0 1.2rem;

    color: #ffffff;

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

    font-weight: 800;

    line-height: 1.02;

    letter-spacing: -0.045em;
}


.teem-worship-content h2 span {
    display: block;

    color: #dfb969;
}


.teem-worship-content p {
    max-width: 510px;

    margin: 0;

    color: rgba(255, 255, 255, 0.80);

    font-size: 0.98rem;

    line-height: 1.8;
}


/* =========================================================
   NAVIGATION ARROWS
========================================================= */

.teem-worship-control {
    position: absolute;

    top: auto;
    bottom: 2rem;

    z-index: 10;

    width: auto;

    opacity: 1;

    transform: none;
}


.teem-worship-prev {
    left: auto;
    right: 6.5rem;
}


.teem-worship-next {
    right: 2rem;
}


.teem-worship-arrow {
    display: flex;

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

    width: 48px;
    height: 48px;

    border: 1px solid rgba(255, 255, 255, 0.35);

    border-radius: 50%;

    color: #ffffff;

    background: rgba(255, 255, 255, 0.08);

    backdrop-filter: blur(8px);

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}


.teem-worship-control:hover .teem-worship-arrow {
    border-color: #dfb969;

    background: #c49a52;

    transform: translateY(-2px);
}


/* =========================================================
   SLIDE COUNTER
========================================================= */

.teem-worship-indicators {
    position: absolute;

    right: 13rem;
    bottom: 2.35rem;

    z-index: 10;

    display: flex;

    align-items: center;

    gap: 0.65rem;

    color: rgba(255, 255, 255, 0.65);

    font-size: 0.65rem;

    font-weight: 700;

    letter-spacing: 0.08em;
}


.teem-worship-current {
    color: #dfb969;
}


.teem-worship-indicator-line {
    width: 35px;

    height: 1px;

    background: rgba(255, 255, 255, 0.4);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-about-worship {
        margin-top: 1rem;
    }

    .teem-worship-carousel {
        min-height: 500px;
    }

    .teem-worship-content {
        width: 75%;

        padding: 2.5rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-about-worship {
        margin-top: 0;
    }

    .teem-worship-carousel {
        min-height: 500px;

        border-radius: 12px;
    }


    .teem-worship-photo {
        object-position: center;
    }


    .teem-worship-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(4, 24, 18, 0.18) 0%,
                rgba(4, 24, 18, 0.42) 38%,
                rgba(4, 24, 18, 0.95) 100%
            );
    }


    .teem-worship-content {
        top: auto;
        bottom: 0;
        left: 0;

        width: 100%;

        padding:
            2rem
            1.35rem
            5.5rem;

        transform: none;

        text-align: center;
    }


    .teem-worship-eyebrow {
        justify-content: center;
    }


    .teem-worship-content h2 {
        font-size: clamp(2.2rem, 10vw, 3rem);

        line-height: 1.03;
    }


    .teem-worship-content p {
        font-size: 0.86rem;

        line-height: 1.7;
    }


    /* Arrows */

    .teem-worship-control {
        bottom: 1.25rem;
    }


    .teem-worship-prev {
        left: 1.25rem;
        right: auto;
    }


    .teem-worship-next {
        right: 1.25rem;
    }


    .teem-worship-arrow {
        width: 42px;
        height: 42px;

        font-size: 0.8rem;
    }


    /* Counter */

    .teem-worship-indicators {
        right: 50%;

        bottom: 1.55rem;

        transform: translateX(50%);
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-worship-carousel {
        min-height: 470px;
    }


    .teem-worship-content {
        padding:
            1.75rem
            1rem
            5.25rem;
    }


    .teem-worship-content h2 {
        font-size: 2.2rem;
    }

}




/* =========================================================
   TEEM — OUR MANDATE
========================================================= */

.teem-mandate-section {
    position: relative;
    margin-top: -3rem;
    

    padding: 6rem 0;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(196, 154, 82, 0.12),
            transparent 32%
        ),
        #081f19;
}


/* =========================================================
   SUBTLE BACKGROUND DETAIL
========================================================= */

.teem-mandate-section::before {
    content: "";

    position: absolute;

    top: -180px;
    right: -180px;

    width: 420px;
    height: 420px;

    border: 1px solid rgba(223, 185, 105, 0.10);

    border-radius: 50%;

    pointer-events: none;
}


.teem-mandate-section::after {
    content: "";

    position: absolute;

    bottom: -220px;
    left: -220px;

    width: 500px;
    height: 500px;

    border: 1px solid rgba(223, 185, 105, 0.06);

    border-radius: 50%;

    pointer-events: none;
}


/* =========================================================
   HEADER
========================================================= */

.teem-mandate-header {
    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 4.5rem;

    text-align: center;
}


.teem-mandate-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.7rem;

    margin-bottom: 1.2rem;

    color: #dfb969;

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 0.17em;

    text-transform: uppercase;
}


.teem-mandate-eyebrow::before,
.teem-mandate-eyebrow::after {
    content: "";

    width: 28px;

    height: 1px;

    background: #c49a52;
}


.teem-mandate-title {
    margin: 0;

    color: #ffffff;

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

    font-weight: 800;

    line-height: 1;

    letter-spacing: -0.05em;
}


.teem-mandate-title span {
    display: block;

    color: #dfb969;
}


.teem-mandate-intro {
    max-width: 650px;

    margin: 1.7rem auto 0;

    color: rgba(255, 255, 255, 0.68);

    font-size: 0.98rem;

    line-height: 1.85;
}


/* =========================================================
   GRID
========================================================= */

.teem-mandate-grid {
    position: relative;

    z-index: 2;
}


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

.teem-mandate-card {
    position: relative;

    height: 100%;

    min-height: 350px;

    padding: 2rem;

    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, 0.11);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.075),
            rgba(255, 255, 255, 0.025)
        );

    backdrop-filter: blur(10px);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        background 0.35s ease,
        box-shadow 0.35s ease;
}


.teem-mandate-card:hover {
    transform: translateY(-8px);

    border-color: rgba(223, 185, 105, 0.45);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.10),
            rgba(255, 255, 255, 0.035)
        );

    box-shadow:
        0 25px 55px rgba(0, 0, 0, 0.20);
}


/* =========================================================
   FEATURED CARD
========================================================= */

.teem-mandate-card-featured {
    border-color: rgba(196, 154, 82, 0.45);

    background:
        linear-gradient(
            145deg,
            rgba(196, 154, 82, 0.15),
            rgba(255, 255, 255, 0.035)
        );
}


.teem-mandate-card-featured::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background: #c49a52;
}


/* =========================================================
   CARD TOP
========================================================= */

.teem-mandate-card-top {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 3.5rem;
}


.teem-mandate-number {
    color: rgba(255, 255, 255, 0.35);

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 0.12em;
}


/* =========================================================
   ICON
========================================================= */

.teem-mandate-icon {
    display: flex;

    align-items: center;

    justify-content: center;

    width: 52px;
    height: 52px;

    border: 1px solid rgba(223, 185, 105, 0.28);

    border-radius: 50%;

    color: #dfb969;

    background: rgba(196, 154, 82, 0.09);

    font-size: 1.15rem;

    transition:
        transform 0.35s ease,
        background 0.35s ease;
}


.teem-mandate-card:hover .teem-mandate-icon {
    transform: rotate(-8deg) scale(1.05);

    background: rgba(196, 154, 82, 0.18);
}


/* =========================================================
   CARD TITLE
========================================================= */

.teem-mandate-card h3 {
    margin: 0 0 1rem;

    color: #ffffff;

    font-size: 2rem;

    font-weight: 800;

    line-height: 1;
}


.teem-mandate-card p {
    max-width: 380px;

    margin: 0;

    color: rgba(255, 255, 255, 0.65);

    font-size: 0.88rem;

    line-height: 1.8;
}


/* =========================================================
   CARD BOTTOM
========================================================= */

.teem-mandate-card-line {
    width: 42px;

    height: 2px;

    margin-top: 2rem;

    background: #c49a52;
}


.teem-mandate-card-label {
    display: block;

    margin-top: 0.7rem;

    color: #dfb969;

    font-size: 0.65rem;

    font-weight: 800;

    letter-spacing: 0.1em;

    text-transform: uppercase;
}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.teem-mandate-bottom {
    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 2rem;

    max-width: 950px;

    margin: 5rem auto 0;
}


.teem-mandate-bottom-line {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(223, 185, 105, 0.35),
            transparent
        );
}


.teem-mandate-bottom p {
    max-width: 600px;

    margin: 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 0.86rem;

    font-style: italic;

    line-height: 1.7;

    text-align: center;
}


.teem-mandate-bottom p i {
    margin-right: 0.35rem;

    color: #dfb969;

    font-size: 0.8rem;
}


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

.teem-mandate-action {
    position: relative;

    z-index: 2;

    display: flex;

    justify-content: center;

    margin-top: 2.5rem;
}


.teem-mandate-button {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 0.7rem;

    min-height: 50px;

    padding: 0.75rem 1.5rem;

    border: 1px solid #c49a52;

    border-radius: 7px;

    color: #081f19;

    background: #dfb969;

    font-size: 0.8rem;

    font-weight: 800;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-mandate-button:hover {
    color: #081f19;

    background: #f0cf87;

    transform: translateY(-3px);

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.22);
}


.teem-mandate-button i {
    transition:
        transform 0.3s ease;
}


.teem-mandate-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-mandate-section {
        padding: 6rem 0;
    }

    .teem-mandate-header {
        margin-bottom: 3.5rem;
    }

    .teem-mandate-card {
        min-height: 320px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-mandate-section {
        padding: 5rem 0;
    }


    .teem-mandate-header {
        margin-bottom: 2.75rem;

        padding: 0 0.5rem;
    }


    .teem-mandate-title {
        font-size: clamp(2.65rem, 12vw, 3.5rem);

        line-height: 1.02;
    }


    .teem-mandate-intro {
        font-size: 0.88rem;

        line-height: 1.75;
    }


    .teem-mandate-card {
        min-height: auto;

        padding: 1.6rem;

        border-radius: 12px;
    }


    .teem-mandate-card-top {
        margin-bottom: 2.5rem;
    }


    .teem-mandate-card h3 {
        font-size: 1.8rem;
    }


    .teem-mandate-card p {
        font-size: 0.84rem;
    }


    .teem-mandate-bottom {
        flex-direction: column;

        gap: 1rem;

        margin-top: 3.5rem;
    }


    .teem-mandate-bottom-line {
        width: 60px;

        flex: none;
    }


    .teem-mandate-bottom p {
        font-size: 0.8rem;

        padding: 0 0.75rem;
    }


    .teem-mandate-action {
        margin-top: 2rem;
    }


    .teem-mandate-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-mandate-section {
        padding: 4.5rem 0;
    }


    .teem-mandate-title {
        font-size: 2.7rem;
    }


    .teem-mandate-eyebrow {
        font-size: 0.62rem;
    }


    .teem-mandate-card {
        padding: 1.4rem;
    }

}



/* =========================================================
   TEEM — MEDIA & MOMENTS
========================================================= */

.teem-media-section {
    position: relative;

    padding: 8rem 0;

    overflow: hidden;

    background: #ffffff;
}


/* =========================================================
   HEADER
========================================================= */

.teem-media-header {
    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 3rem;

    margin-bottom: 3.5rem;
}


.teem-media-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    margin-bottom: 1rem;

    color: #b8893f;

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 0.16em;

    text-transform: uppercase;
}


.teem-media-eyebrow::before {
    content: "";

    width: 30px;

    height: 2px;

    background: #c49a52;
}


.teem-media-title {
    margin: 0;

    color: #0b2821;

    font-size: clamp(2.8rem, 5vw, 4.8rem);

    font-weight: 800;

    line-height: 0.98;

    letter-spacing: -0.05em;
}


.teem-media-title span {
    display: block;

    color: #c49a52;
}


.teem-media-header-copy {
    max-width: 370px;
}


.teem-media-header-copy p {
    margin: 0;

    color: #6d7873;

    font-size: 0.9rem;

    line-height: 1.8;
}


/* =========================================================
   MEDIA GRID
========================================================= */

.teem-media-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    grid-auto-rows: 250px;

    gap: 1rem;
}


/* =========================================================
   MEDIA ITEM
========================================================= */

.teem-media-item {
    position: relative;

    display: block;

    min-height: 0;

    overflow: hidden;

    border-radius: 12px;

    background: #0b2821;

    text-decoration: none;

    isolation: isolate;
}


/* =========================================================
   GRID POSITIONS
========================================================= */

.teem-media-item-large {
    grid-column: span 2;

    grid-row: span 2;
}


.teem-media-item-wide {
    grid-column: span 2;
}


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

.teem-media-image {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}


.teem-media-item:hover .teem-media-image {
    transform: scale(1.07);
}


/* =========================================================
   OVERLAY
========================================================= */

.teem-media-item-overlay {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(5, 25, 20, 0.05) 15%,
            rgba(5, 25, 20, 0.28) 45%,
            rgba(5, 25, 20, 0.92) 100%
        );

    transition:
        background 0.4s ease;
}


.teem-media-item:hover
.teem-media-item-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(5, 25, 20, 0.08) 10%,
            rgba(5, 25, 20, 0.36) 45%,
            rgba(5, 25, 20, 0.96) 100%
        );
}


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

.teem-media-item-content {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    z-index: 2;

    padding: 1.5rem;
}


.teem-media-category {
    display: block;

    margin-bottom: 0.45rem;

    color: #dfb969;

    font-size: 0.62rem;

    font-weight: 800;

    letter-spacing: 0.13em;

    text-transform: uppercase;
}


.teem-media-item-content h3 {
    margin: 0;

    color: #ffffff;

    font-size: 1.15rem;

    font-weight: 800;

    line-height: 1.15;
}


.teem-media-item-large
.teem-media-item-content h3 {
    max-width: 420px;

    font-size: clamp(1.5rem, 2.5vw, 2.2rem);

    line-height: 1.08;
}


/* =========================================================
   VIEW LINK
========================================================= */

.teem-media-view {
    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    margin-top: 0.9rem;

    color: rgba(255, 255, 255, 0.68);

    font-size: 0.68rem;

    font-weight: 700;

    transition:
        color 0.3s ease;
}


.teem-media-item:hover .teem-media-view {
    color: #dfb969;
}


.teem-media-view i {
    transition:
        transform 0.3s ease;
}


.teem-media-item:hover .teem-media-view i {
    transform: translate(3px, -3px);
}


/* =========================================================
   BUTTON
========================================================= */

.teem-media-action {
    display: flex;

    justify-content: center;

    margin-top: 2.75rem;
}


.teem-media-button {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    min-height: 50px;

    padding: 0.75rem 1.4rem;

    border: 1px solid #0b2821;

    border-radius: 7px;

    color: #0b2821;

    background: transparent;

    font-size: 0.78rem;

    font-weight: 800;

    text-decoration: none;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-media-button:hover {
    color: #ffffff;

    background: #0b2821;

    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(8, 31, 25, 0.14);
}


.teem-media-button i {
    transition:
        transform 0.3s ease;
}


.teem-media-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-media-section {
        padding: 6rem 0;
    }


    .teem-media-header {
        align-items: flex-start;

        flex-direction: column;

        gap: 1.25rem;

        margin-bottom: 2.75rem;
    }


    .teem-media-header-copy {
        max-width: 600px;
    }


    .teem-media-grid {
        grid-template-columns:
            repeat(2, 1fr);

        grid-auto-rows: 240px;
    }


    .teem-media-item-large {
        grid-column: span 2;

        grid-row: span 2;
    }


    .teem-media-item-wide {
        grid-column: span 2;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-media-section {
        padding: 4.75rem 0;
    }


    .teem-media-header {
        margin-bottom: 2.25rem;
    }


    .teem-media-title {
        font-size: clamp(2.6rem, 12vw, 3.5rem);

        line-height: 1;
    }


    .teem-media-header-copy p {
        font-size: 0.84rem;

        line-height: 1.75;
    }


    .teem-media-grid {
        display: grid;

        grid-template-columns: 1fr;

        grid-auto-rows: 270px;

        gap: 0.85rem;
    }


    .teem-media-item-large,
    .teem-media-item-wide {
        grid-column: span 1;

        grid-row: span 1;
    }


    .teem-media-item-large {
        min-height: 350px;
    }


    .teem-media-item-content {
        padding: 1.25rem;
    }


    .teem-media-item-large
    .teem-media-item-content h3 {
        font-size: 1.6rem;
    }


    .teem-media-button {
        width: 100%;

        justify-content: center;
    }
    

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-media-section {
        padding: 4.25rem 0;
    }


    .teem-media-grid {
        grid-auto-rows: 245px;
    }


    .teem-media-item-large {
        min-height: 320px;
    }

}



/* =========================================================
   TEEM — FIND US / LOCATION
========================================================= */

.teem-location-section {
    position: relative;
    margin-top: -3rem;

    padding: 7rem 0;

    overflow: hidden;

    background: #f4f1ea;
}


/* =========================================================
   MAIN WRAPPER
========================================================= */

.teem-location-wrapper {
    display: grid;

    grid-template-columns:
        minmax(0, 0.85fr)
        minmax(0, 1.15fr);

    align-items: stretch;

    gap: 4rem;
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.teem-location-content {
    display: flex;

    flex-direction: column;

    justify-content: center;

    padding: 2rem 0;
}


.teem-location-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    margin-bottom: 1rem;

    color: #b8893f;

    font-size: 0.68rem;

    font-weight: 800;

    letter-spacing: 0.16em;

    text-transform: uppercase;
}


.teem-location-eyebrow::before {
    content: "";

    width: 30px;

    height: 2px;

    background: #c49a52;
}


.teem-location-title {
    max-width: 550px;

    margin: 0 0 1.5rem;

    color: #0b2821;

    font-size: clamp(2.8rem, 5vw, 4.8rem);

    font-weight: 800;

    line-height: 0.98;

    letter-spacing: -0.05em;
}


.teem-location-title span {
    display: block;

    color: #c49a52;
}


.teem-location-intro {
    max-width: 500px;

    margin: 0 0 2.25rem;

    color: #65716c;

    font-size: 0.94rem;

    line-height: 1.85;
}


/* =========================================================
   ADDRESS
========================================================= */

.teem-location-address {
    display: flex;

    align-items: flex-start;

    gap: 1rem;

    margin-bottom: 2rem;
}


.teem-location-icon {
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color: #ffffff;

    background: #0b2821;

    box-shadow:
        0 10px 25px rgba(11, 40, 33, 0.12);
}


.teem-location-icon i {
    font-size: 1rem;
}


.teem-location-label {
    display: block;

    margin-bottom: 0.35rem;

    color: #9a763b;

    font-size: 0.63rem;

    font-weight: 800;

    letter-spacing: 0.13em;

    text-transform: uppercase;
}


.teem-location-address address {
    margin: 0;

    color: #172b25;

    font-size: 0.92rem;

    font-style: normal;

    font-weight: 600;

    line-height: 1.7;
}


/* =========================================================
   DIRECTIONS BUTTON
========================================================= */

.teem-location-button {
    width: fit-content;

    display: inline-flex;

    align-items: center;

    gap: 0.65rem;

    min-height: 50px;

    padding: 0.75rem 1.35rem;

    border-radius: 7px;

    color: #ffffff;

    background: #0b2821;

    font-size: 0.76rem;

    font-weight: 800;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-location-button:hover {
    color: #ffffff;

    background: #153d32;

    transform: translateY(-3px);

    box-shadow:
        0 14px 30px rgba(11, 40, 33, 0.16);
}


.teem-location-button i {
    font-size: 0.8rem;
}


/* =========================================================
   STYLISED MAP
========================================================= */

.teem-location-map {
    position: relative;

    min-height: 500px;

    overflow: hidden;

    border-radius: 18px;

    background:
        #dfe4dc;

    box-shadow:
        0 25px 60px rgba(11, 40, 33, 0.10);

    isolation: isolate;
}


/* =========================================================
   MAP GRID
========================================================= */

.teem-location-map-grid {
    position: absolute;

    inset: 0;

    opacity: 0.45;

    background-image:
        linear-gradient(
            rgba(11, 40, 33, 0.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(11, 40, 33, 0.08) 1px,
            transparent 1px
        );

    background-size:
        45px 45px;

    transform:
        rotate(-4deg)
        scale(1.15);
}


/* =========================================================
   DECORATIVE ROADS
========================================================= */

.teem-location-road {
    position: absolute;

    height: 13px;

    border-radius: 100px;

    background:
        rgba(255, 255, 255, 0.8);

    box-shadow:
        0 0 0 1px rgba(11, 40, 33, 0.05);

    z-index: 1;
}


.teem-location-road-one {
    width: 130%;

    top: 48%;

    left: -10%;

    transform: rotate(-18deg);
}


.teem-location-road-two {
    width: 110%;

    top: 22%;

    left: -5%;

    transform: rotate(28deg);
}


.teem-location-road-three {
    width: 95%;

    top: 70%;

    left: 10%;

    transform: rotate(8deg);
}


/* =========================================================
   DECORATIVE BLOCKS
========================================================= */

.teem-location-block {
    position: absolute;

    z-index: 0;

    border-radius: 4px;

    background:
        rgba(11, 40, 33, 0.07);
}


.block-one {
    width: 100px;
    height: 65px;

    top: 12%;
    left: 12%;

    transform: rotate(-8deg);
}


.block-two {
    width: 130px;
    height: 80px;

    top: 32%;
    right: 8%;

    transform: rotate(12deg);
}


.block-three {
    width: 90px;
    height: 110px;

    bottom: 12%;
    left: 18%;

    transform: rotate(18deg);
}


.block-four {
    width: 120px;
    height: 60px;

    right: 15%;
    bottom: 18%;

    transform: rotate(-10deg);
}


/* =========================================================
   LOCATION MARKER
========================================================= */

.teem-location-marker {
    position: absolute;

    top: 48%;
    left: 52%;

    z-index: 5;

    width: 90px;
    height: 90px;

    transform:
        translate(-50%, -50%);
}


.teem-location-marker-pulse {
    position: absolute;

    inset: 5px;

    border-radius: 50%;

    background:
        rgba(196, 154, 82, 0.20);

    animation:
        teem-location-pulse 2.5s ease-out infinite;
}


.teem-location-marker-pin {
    position: absolute;

    top: 50%;
    left: 50%;

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 5px solid #ffffff;

    border-radius: 50%;

    color: #ffffff;

    background: #c49a52;

    box-shadow:
        0 12px 30px rgba(11, 40, 33, 0.20);

    transform:
        translate(-50%, -50%);
}


.teem-location-marker-pin i {
    font-size: 1.15rem;
}


@keyframes teem-location-pulse {

    0% {
        transform: scale(0.7);

        opacity: 0.8;
    }

    70% {
        transform: scale(1.35);

        opacity: 0;
    }

    100% {
        transform: scale(1.35);

        opacity: 0;
    }

}


/* =========================================================
   MAP LABEL
========================================================= */

.teem-location-map-label {
    position: absolute;

    top: 8%;

    left: 8%;

    z-index: 4;

    display: flex;

    flex-direction: column;

    gap: 0.15rem;

    padding: 1rem 1.15rem;

    border: 1px solid rgba(255, 255, 255, 0.65);

    border-radius: 8px;

    background:
        rgba(255, 255, 255, 0.72);

    backdrop-filter: blur(10px);

    box-shadow:
        0 12px 30px rgba(11, 40, 33, 0.08);
}


.teem-location-map-label span {
    color: #7c6947;

    font-size: 0.55rem;

    font-weight: 800;

    letter-spacing: 0.1em;
}


.teem-location-map-label strong {
    color: #0b2821;

    font-size: 0.75rem;

    font-weight: 900;
}


.teem-location-map-label small {
    color: #7b8580;

    font-size: 0.65rem;

    font-weight: 600;
}


/* =========================================================
   MAP FOOTER
========================================================= */

.teem-location-map-footer {
    position: absolute;

    right: 1.25rem;
    bottom: 1.25rem;
    left: 1.25rem;

    z-index: 4;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 1rem;

    padding: 0.85rem 1rem;

    border: 1px solid rgba(255, 255, 255, 0.55);

    border-radius: 8px;

    background:
        rgba(255, 255, 255, 0.72);

    backdrop-filter: blur(10px);
}


.teem-location-map-footer span {
    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    color: #40534c;

    font-size: 0.65rem;

    font-weight: 700;
}


.teem-location-map-footer i {
    color: #b8893f;

    font-size: 0.75rem;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-location-section {
        padding: 6rem 0;
    }


    .teem-location-wrapper {
        grid-template-columns: 1fr;

        gap: 3rem;
    }


    .teem-location-content {
        padding: 0;
    }


    .teem-location-map {
        min-height: 430px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-location-section {
        padding: 4.75rem 0;
    }


    .teem-location-wrapper {
        gap: 2.5rem;
    }


    .teem-location-title {
        font-size: clamp(2.6rem, 12vw, 3.5rem);
    }


    .teem-location-intro {
        font-size: 0.84rem;

        line-height: 1.75;
    }


    .teem-location-address {
        gap: 0.85rem;
    }


    .teem-location-icon {
        flex-basis: 44px;

        width: 44px;
        height: 44px;
    }


    .teem-location-address address {
        font-size: 0.84rem;
    }


    .teem-location-button {
        width: 100%;

        justify-content: center;
    }


    .teem-location-map {
        min-height: 380px;

        border-radius: 14px;
    }


    .teem-location-marker {
        top: 48%;

        left: 50%;
    }


    .teem-location-map-label {
        top: 6%;
        left: 5%;

        max-width: 230px;
    }


    .teem-location-map-footer {
        right: 0.75rem;
        bottom: 0.75rem;
        left: 0.75rem;

        padding: 0.7rem 0.75rem;
    }


    .teem-location-map-footer span {
        font-size: 0.58rem;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .teem-location-map {
        min-height: 330px;
    }


    .teem-location-map-footer span:last-child {
        display: none;
    }

}



/* =========================================================
   TEEM — FOOTER
========================================================= */

.teem-footer {
    position: relative;

    padding: 5.5rem 0 1.5rem;

    overflow: hidden;

    color: rgba(255, 255, 255, 0.78);

    background: #071c17;
}


/* =========================================================
   SUBTLE BACKGROUND DETAIL
========================================================= */

.teem-footer::before {
    content: "";

    position: absolute;

    top: -180px;
    right: -180px;

    width: 450px;
    height: 450px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(196, 154, 82, 0.10) 0%,
            rgba(196, 154, 82, 0) 70%
        );

    pointer-events: none;
}


.teem-footer::after {
    content: "";

    position: absolute;

    bottom: -200px;
    left: -200px;

    width: 450px;
    height: 450px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(33, 91, 75, 0.18) 0%,
            rgba(33, 91, 75, 0) 70%
        );

    pointer-events: none;
}


/* =========================================================
   MAIN FOOTER GRID
========================================================= */

.teem-footer-main {
    position: relative;

    z-index: 1;

    display: grid;

    grid-template-columns:
        1.6fr
        0.8fr
        0.9fr
        1.25fr;

    gap: 4rem;
}


/* =========================================================
   BRAND
========================================================= */

.teem-footer-brand {
    max-width: 340px;
}


.teem-footer-logo {
    display: inline-flex;

    align-items: center;

    text-decoration: none;
}


.teem-footer-logo img {
    width: auto;

    max-width: 190px;

    height: 65px;

    display: block;

    object-fit: contain;
}


.teem-footer-description {
    max-width: 320px;

    margin: 1.5rem 0 1.4rem;

    color: rgba(255, 255, 255, 0.58);

    font-size: 0.84rem;

    line-height: 1.85;
}


/* =========================================================
   MOTTO
========================================================= */

.teem-footer-motto {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 0.45rem;

    margin-bottom: 1.7rem;
}


.teem-footer-motto span {
    color: #d4ae69;

    font-size: 0.65rem;

    font-weight: 800;

    letter-spacing: 0.12em;

    text-transform: uppercase;
}


.teem-footer-motto span:not(:last-child)::after {
    content: "•";

    margin-left: 0.45rem;

    color: rgba(255, 255, 255, 0.25);
}


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

.teem-footer-socials {
    display: flex;

    align-items: center;

    gap: 0.55rem;
}


.teem-footer-social {
    width: 39px;
    height: 39px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border: 1px solid rgba(255, 255, 255, 0.14);

    border-radius: 50%;

    color: rgba(255, 255, 255, 0.72);

    background: rgba(255, 255, 255, 0.025);

    font-size: 0.85rem;

    text-decoration: none;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}


.teem-footer-social:hover {
    color: #071c17;

    border-color: #d4ae69;

    background: #d4ae69;

    transform: translateY(-3px);
}


/* =========================================================
   LINK COLUMNS
========================================================= */

.teem-footer-links h3,
.teem-footer-contact h3 {
    margin: 0 0 1.35rem;

    color: #ffffff;

    font-size: 0.72rem;

    font-weight: 800;

    letter-spacing: 0.13em;

    text-transform: uppercase;
}


.teem-footer-links ul {
    display: flex;

    flex-direction: column;

    gap: 0.7rem;

    margin: 0;

    padding: 0;

    list-style: none;
}


.teem-footer-links a {
    position: relative;

    display: inline-flex;

    width: fit-content;

    color: rgba(255, 255, 255, 0.58);

    font-size: 0.78rem;

    line-height: 1.5;

    text-decoration: none;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.teem-footer-links a::before {
    content: "";

    width: 0;

    height: 1px;

    margin-right: 0;

    align-self: center;

    background: #d4ae69;

    transition:
        width 0.25s ease,
        margin-right 0.25s ease;
}


.teem-footer-links a:hover {
    color: #ffffff;

    transform: translateX(3px);
}


.teem-footer-links a:hover::before {
    width: 13px;

    margin-right: 7px;
}


/* =========================================================
   CONTACT
========================================================= */

.teem-footer-contact {
    min-width: 0;
}


.teem-footer-contact-item {
    display: flex;

    align-items: flex-start;

    gap: 0.8rem;

    margin-bottom: 1rem;

    color: rgba(255, 255, 255, 0.68);

    font-size: 0.72rem;

    line-height: 1.55;

    text-decoration: none;

    transition:
        color 0.25s ease;
}


.teem-footer-contact-item:hover {
    color: #ffffff;
}


.teem-footer-contact-icon {
    flex: 0 0 32px;

    width: 32px;
    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid rgba(212, 174, 105, 0.18);

    border-radius: 7px;

    color: #d4ae69;

    background: rgba(212, 174, 105, 0.06);

    font-size: 0.72rem;
}


.teem-footer-contact-item > span:last-child {
    min-width: 0;
}


.teem-footer-contact-item small {
    display: block;

    margin-bottom: 0.15rem;

    color: rgba(255, 255, 255, 0.35);

    font-size: 0.56rem;

    font-weight: 800;

    letter-spacing: 0.1em;

    text-transform: uppercase;
}


/* =========================================================
   DIVIDER
========================================================= */

.teem-footer-divider {
    position: relative;

    z-index: 1;

    height: 1px;

    margin-top: 4.5rem;

    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0),
            rgba(255, 255, 255, 0.12),
            rgba(255, 255, 255, 0)
        );
}


/* =========================================================
   BOTTOM
========================================================= */

.teem-footer-bottom {
    position: relative;

    z-index: 1;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 2rem;

    padding-top: 1.4rem;
}


.teem-footer-bottom p {
    margin: 0;

    color: rgba(255, 255, 255, 0.34);

    font-size: 0.62rem;

    line-height: 1.6;
}


.teem-footer-bottom-links {
    display: flex;

    align-items: center;

    gap: 1.3rem;
}


.teem-footer-bottom-links a {
    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    color: rgba(255, 255, 255, 0.4);

    font-size: 0.62rem;

    text-decoration: none;

    transition:
        color 0.25s ease;
}


.teem-footer-bottom-links a:hover {
    color: #d4ae69;
}


/* =========================================================
   BACK TO TOP
========================================================= */

.teem-footer-bottom-links a:last-child {
    color: #d4ae69;

    font-weight: 700;
}


.teem-footer-bottom-links a:last-child i {
    transition:
        transform 0.25s ease;
}


.teem-footer-bottom-links a:last-child:hover i {
    transform: translateY(-3px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .teem-footer-main {
        grid-template-columns:
            1.4fr
            0.8fr
            0.8fr;

        gap: 3rem;
    }


    .teem-footer-contact {
        grid-column: span 3;
    }

}


/* =========================================================
   TABLET / SMALL LAPTOP
========================================================= */

@media (max-width: 991.98px) {

    .teem-footer {
        padding-top: 4.5rem;
    }


    .teem-footer-main {
        grid-template-columns:
            1.4fr
            1fr;

        gap: 3rem 2.5rem;
    }


    .teem-footer-contact {
        grid-column: span 1;
    }


    .teem-footer-divider {
        margin-top: 3.5rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-footer {
        padding: 4rem 0 1.25rem;
    }


    .teem-footer-main {
        display: grid;

        grid-template-columns: 1fr;

        gap: 2.8rem;
    }


    .teem-footer-brand {
        max-width: 100%;
    }


    .teem-footer-logo img {
        max-width: 175px;

        height: 60px;
    }


    .teem-footer-description {
        max-width: 420px;

        margin-top: 1.25rem;
    }


    .teem-footer-links,
    .teem-footer-contact {
        grid-column: auto;
    }


    .teem-footer-links h3,
    .teem-footer-contact h3 {
        margin-bottom: 1rem;
    }


    .teem-footer-divider {
        margin-top: 3rem;
    }


    .teem-footer-bottom {
        align-items: flex-start;

        flex-direction: column;

        gap: 1rem;

        padding-top: 1.25rem;
    }


    .teem-footer-bottom-links {
        flex-wrap: wrap;

        gap: 0.8rem 1.1rem;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .teem-footer {
        padding-top: 3.5rem;
    }


    .teem-footer-motto {
        gap: 0.3rem;
    }


    .teem-footer-social {
        width: 37px;
        height: 37px;
    }


    .teem-footer-contact-item {
        font-size: 0.68rem;
    }

}


/* =========================================================
   TEEM — GIVE DROPDOWN
========================================================= */

.teem-navbar-give-wrapper {
    position: relative;
}


/* =========================================================
   DROPDOWN
========================================================= */

.teem-give-dropdown-menu {
    width: 310px;
    max-width: calc(100vw - 24px);

    margin-top: 0.75rem !important;

    padding: 0.55rem;

    border: 1px solid rgba(11, 40, 33, 0.08);

    border-radius: 14px;

    background: #ffffff;

    box-shadow:
        0 20px 50px rgba(7, 28, 23, 0.16);

    overflow: hidden;

    animation:
        teemGiveDropdownIn 0.2s ease-out;
}


@keyframes teemGiveDropdownIn {

    from {
        opacity: 0;

        transform:
            translateY(-7px)
            scale(0.98);
    }

    to {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);
    }

}


/* =========================================================
   DROPDOWN ITEM
========================================================= */

.teem-give-dropdown-item {
    display: flex;

    align-items: center;

    gap: 0.8rem;

    width: 100%;

    padding: 0.75rem;

    border-radius: 10px;

    color: #172b25;

    background: transparent;

    text-decoration: none;

    transition:
        background 0.25s ease,
        transform 0.25s ease;
}


.teem-give-dropdown-item:hover,
.teem-give-dropdown-item:focus {
    color: #172b25;

    background: #f4f1ea;

    transform: translateX(-2px);
}


/* =========================================================
   ICON
========================================================= */

.teem-give-dropdown-icon {
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    color: #b8893f;

    background: rgba(196, 154, 82, 0.10);

    font-size: 0.85rem;
}


/* =========================================================
   TEXT
========================================================= */

.teem-give-dropdown-text {
    display: flex;

    flex-direction: column;

    gap: 0.12rem;

    min-width: 0;
}


.teem-give-dropdown-text strong {
    color: #0b2821;

    font-size: 0.76rem;

    font-weight: 800;
}


.teem-give-dropdown-text small {
    color: #7b8580;

    font-size: 0.62rem;

    line-height: 1.4;
}

@media (max-width: 767.98px) {

    .teem-give-dropdown-menu {
        width: 290px;

        max-width: calc(100vw - 20px);

        margin-top: 0.5rem !important;
    }

}

/* =========================================================
   TEEM GIVE DROPDOWN — MOBILE POSITIONING
========================================================= */

@media (max-width: 991.98px) {

    .teem-navbar-give-wrapper {
        position: relative;
    }

    .teem-give-dropdown-menu {
        /*
         * On mobile, align the dropdown from
         * the LEFT edge of the Give button.
         */
        left: 0 !important;
        right: auto !important;

        /*
         * Prevent Bootstrap from applying
         * desktop positioning transforms.
         */
        transform: none !important;

        width: 290px;
        max-width: calc(100vw - 20px);

        margin-top: 0.5rem !important;

        z-index: 1055;
    }

}
@media (max-width: 991.98px) {

    .teem-navbar-actions {
        width: 100%;

        display: flex;

        align-items: flex-start;

        flex-direction: column;

        min-width: 0;
    }

    .teem-navbar-give-wrapper {
        width: auto;

        flex-shrink: 0;
    }

}




/* =========================================================
   TEEM — MODERN HOME PAGE PRELOADER
========================================================= */

.teem-preloader {
    position: fixed;

    inset: 0;

    z-index: 99999;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    height: 100vh;

    min-height: 100svh;

    overflow: hidden;

    background:
        radial-gradient(
            circle at center,
            rgba(196, 154, 82, 0.10) 0%,
            transparent 34%
        ),
        #071c17;

    opacity: 1;

    visibility: visible;

    transform: scale(1);

    transition:
        opacity 0.75s ease,
        visibility 0.75s ease,
        transform 0.85s cubic-bezier(.22, .61, .36, 1);
}


/* =========================================================
   FADE OUT STATE
========================================================= */

.teem-preloader.is-hidden {
    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    transform: scale(1.025);
}


/* =========================================================
   BACKGROUND ATMOSPHERE
========================================================= */

.teem-preloader::before {
    content: "";

    position: absolute;

    width: 480px;

    height: 480px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(196, 154, 82, 0.09),
            transparent 68%
        );

    filter: blur(20px);

    animation:
        teemPreloaderAtmosphere 4s ease-in-out infinite;
}


@keyframes teemPreloaderAtmosphere {

    0%,
    100% {
        transform:
            translate(-50%, -50%)
            scale(0.88);

        opacity: 0.45;
    }

    50% {
        transform:
            translate(-50%, -50%)
            scale(1.12);

        opacity: 0.9;
    }

}


/* =========================================================
   INNER CONTENT
========================================================= */

.teem-preloader-inner {
    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    width: min(90%, 500px);

    text-align: center;
}


/* =========================================================
   LOGO AREA
========================================================= */

.teem-preloader-logo-wrap {
    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 150px;

    height: 150px;

    margin-bottom: 2rem;
    
}


/* =========================================================
   LOGO
========================================================= */

.teem-preloader-logo {
    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 90px;

    height: 90px;
    border: none;
    overflow: hidden;

    animation:
        teemPreloaderLogoFloat 3s ease-in-out infinite;
}


.teem-preloader-logo img {
    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;
}


@keyframes teemPreloaderLogoFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }

}


/* =========================================================
   OUTER ANIMATED RINGS
========================================================= */

.teem-preloader-ring {
    position: absolute;

    top: 50%;

    left: 50%;

    border-radius: 50%;

    pointer-events: none;
}


/* Main rotating ring */

.teem-preloader-ring-one {
    width: 136px;

    height: 136px;

    transform:
        translate(-50%, -50%)
        rotate(0deg);

    border: 1px solid rgba(196, 154, 82, 0.25);

    border-top-color: #c49a52;

    border-right-color: #c49a52;

    animation:
        teemPreloaderSpin 2.5s linear infinite;
}


/* Outer subtle ring */

.teem-preloader-ring-two {
    width: 150px;

    height: 150px;

    transform: translate(-50%, -50%);

    border: 1px solid rgba(255, 255, 255, 0.08);

    animation:
        teemPreloaderPulse 2.5s ease-in-out infinite;
}


@keyframes teemPreloaderSpin {

    from {
        transform:
            translate(-50%, -50%)
            rotate(0deg);
    }

    to {
        transform:
            translate(-50%, -50%)
            rotate(360deg);
    }

}


@keyframes teemPreloaderPulse {

    0%,
    100% {
        transform:
            translate(-50%, -50%)
            scale(0.94);

        opacity: 0.45;
    }

    50% {
        transform:
            translate(-50%, -50%)
            scale(1.05);

        opacity: 1;
    }

}


/* =========================================================
   BRANDING
========================================================= */

.teem-preloader-brand {
    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 0.4rem;

    margin-bottom: 1.7rem;
}


.teem-preloader-brand-main {
    color: #ffffff;

    font-size: clamp(
        0.9rem,
        2vw,
        1.15rem
    );

    font-weight: 800;

    letter-spacing: 0;

    line-height: 1.3;
}


.teem-preloader-brand-sub {
    color: #c49a52;

    font-size: 0.62rem;

    font-weight: 700;

    letter-spacing: 0.16em;

    text-transform: uppercase;

    opacity: 0.9;
}


/* =========================================================
   LOADING AREA
========================================================= */

.teem-preloader-loading {
    width: min(100%, 320px);
}


.teem-preloader-loading-top {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 0.6rem;

    color: rgba(255, 255, 255, 0.55);

    font-size: 0.62rem;

    letter-spacing: 0.05em;
}


.teem-preloader-percentage {
    color: #c49a52;

    font-weight: 700;
}


/* =========================================================
   PROGRESS BAR
========================================================= */

.teem-preloader-progress {
    position: relative;

    width: 100%;

    height: 3px;

    overflow: hidden;

    border-radius: 100px;

    background: rgba(255, 255, 255, 0.10);
}


.teem-preloader-progress-bar {
    width: 0%;

    height: 100%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            #a97d38,
            #e2bd70,
            #c49a52
        );

    box-shadow:
        0 0 12px rgba(196, 154, 82, 0.45);

    transition: width 0.08s linear;
}


/* =========================================================
   BOTTOM MESSAGE
========================================================= */

.teem-preloader-message {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 0.7rem;

    margin-top: 2rem;

    color: rgba(255, 255, 255, 0.42);

    font-size: 0.55rem;

    font-weight: 600;

    letter-spacing: 0.12em;

    text-transform: uppercase;
}


.teem-preloader-message-line {
    width: 28px;

    height: 1px;

    background: rgba(196, 154, 82, 0.45);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    /*
     * Move the entire preloader content slightly upward.
     * This keeps everything centered relative to each other
     * while giving the composition a little more breathing room
     * toward the top.
     */
    .teem-preloader-inner {
        transform: translateY(-3vh);
    }

    .teem-preloader-logo-wrap {
        width: 130px;
        height: 130px;
        margin-bottom: 2rem;
    }

    .teem-preloader-logo {
        width: 75px;
        height: 75px;
    }

    .teem-preloader-ring-one {
        width: 118px;
        height: 118px;
    }

    .teem-preloader-ring-two {
        width: 130px;
        height: 130px;
    }

    .teem-preloader-brand {
        margin-top: 0;
        margin-bottom: 1.7rem;
    }

    .teem-preloader-brand-main {
        font-size: 0.82rem;
        letter-spacing: 0;
    }

    .teem-preloader-brand-sub {
        max-width: 260px;
        font-size: 0.52rem;
        line-height: 1.5;
    }

    .teem-preloader-loading {
        width: min(88vw, 300px);
    }

    .teem-preloader-message {
        max-width: 90vw;
        font-size: 0.48rem;
        letter-spacing: 0.08em;
    }

    .teem-preloader-message-line {
        width: 20px;
    }
}






/* =========================================================
   FEATURED TESTIMONY
========================================================= */

.teem-featured-testimony {
    position: relative;
    margin-top: 3.5rem;
    margin-bottom: 4.5rem;
    padding: 3rem;
    border-radius: 28px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(196, 154, 82, 0.10),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #071c17 0%,
            #0b2a22 100%
        );
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.12);
}


/* Content
--------------------------------------------------------- */

.teem-featured-testimony-content {
    position: relative;
    z-index: 2;
    padding-right: 1.5rem;
}

.teem-featured-testimony-eyebrow {
    display: inline-block;
    margin-bottom: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #c49a52;
}

.teem-featured-testimony-title {
    margin-bottom: 1.25rem;
    font-size: clamp(1.8rem, 3vw, 2.7rem);
    line-height: 1.15;
    font-weight: 700;
    color: #ffffff;
}

.teem-featured-testimony-text {
    margin-bottom: 1rem;
    max-width: 540px;
    font-size: 0.98rem;
    line-height: 1.85;
    color: rgba(255, 255, 255, 0.76);
}

.teem-featured-testimony-signature {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1.7rem;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #c49a52;
}

.teem-featured-testimony-line {
    display: inline-block;
    width: 35px;
    height: 1px;
    background: #c49a52;
}


/* Image Gallery
--------------------------------------------------------- */

.teem-featured-testimony-gallery {
    display: grid;
    grid-template-columns: 1.35fr 0.8fr;
    grid-template-rows: 210px 210px;
    gap: 0.85rem;
}

.teem-featured-testimony-image {
    position: relative;
    display: block;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: 18px;
    background: #102b24;
    cursor: zoom-in;
}

.teem-featured-testimony-image-large {
    grid-row: 1 / 3;
}

.teem-featured-testimony-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition:
        transform 0.6s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-featured-testimony-image:hover img {
    transform: scale(1.045);
    filter: brightness(0.78);
}


/* Image overlay
--------------------------------------------------------- */

.teem-featured-testimony-image-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.15);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.teem-featured-testimony-image-overlay i {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.94);
    color: #0b2a22;
    font-size: 1.05rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
}

.teem-featured-testimony-image:hover .teem-featured-testimony-image-overlay {
    opacity: 1;
}


/* Image captions
--------------------------------------------------------- */

.teem-featured-testimony-image-caption {
    position: absolute;
    left: 0.9rem;
    right: 0.9rem;
    bottom: 0.85rem;
    z-index: 3;

    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.04em;
    color: #ffffff;

    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
}


/* =========================================================
   TESTIMONY LIGHTBOX
========================================================= */

.teem-testimony-lightbox {
    overflow: hidden;
    border: 0;
    border-radius: 20px;
    background: #071c17;
    color: #ffffff;
}

.teem-testimony-lightbox .modal-header {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.teem-testimony-lightbox .btn-close {
    filter: invert(1);
    opacity: 0.8;
}

.teem-testimony-lightbox-eyebrow {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c49a52;
}

.teem-testimony-lightbox .modal-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: #ffffff;
}

.teem-testimony-lightbox .modal-body {
    padding: 1.25rem;
}

.teem-testimony-lightbox-image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 300px;
    border-radius: 14px;
    overflow: hidden;
    background: #020b08;
}

.teem-testimony-lightbox-image {
    display: block;
    max-width: 100%;
    max-height: 75vh;
    width: auto;
    height: auto;
    object-fit: contain;
}

.teem-testimony-lightbox-caption {
    margin: 1rem 0 0;
    text-align: center;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.7);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991.98px) {

    .teem-featured-testimony {
        padding: 2rem;
    }

    .teem-featured-testimony-content {
        padding-right: 0;
    }

    .teem-featured-testimony-gallery {
        grid-template-rows: 240px 180px;
    }
}


@media (max-width: 767.98px) {

    .teem-featured-testimony {
        margin-top: 2.5rem;
        margin-bottom: 3.5rem;
        padding: 1.35rem;
        border-radius: 20px;
    }

    .teem-featured-testimony-title {
        font-size: 1.7rem;
    }

    .teem-featured-testimony-text {
        font-size: 0.9rem;
        line-height: 1.75;
    }

    .teem-featured-testimony-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 250px 150px;
        gap: 0.6rem;
    }

    .teem-featured-testimony-image-large {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .teem-featured-testimony-image:nth-child(2),
    .teem-featured-testimony-image:nth-child(3) {
        grid-row: 2;
    }

    .teem-featured-testimony-image {
        border-radius: 13px;
    }

    .teem-featured-testimony-image-caption {
        left: 0.55rem;
        right: 0.55rem;
        bottom: 0.55rem;
        font-size: 0.56rem;
    }

    .teem-testimony-lightbox .modal-body {
        padding: 0.7rem;
    }

    .teem-testimony-lightbox-image-wrap {
        min-height: 220px;
    }

    .teem-testimony-lightbox-image {
        max-height: 70vh;
    }
}




/* =========================================================
   TEEM — TESTIMONIES SECTION
========================================================= */

.teem-testimony-section {
    position: relative;

    padding: 7rem 0;

    overflow: hidden;

    background: #f8f6f0;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.teem-testimony-heading {
    max-width: 720px;

    margin: 0 auto 3.5rem;

    text-align: center;
}


.teem-testimony-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    margin-bottom: 0.8rem;

    color: #b8893f;

    font-size: 0.68rem;

    font-weight: 800;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


.teem-testimony-eyebrow::before,
.teem-testimony-eyebrow::after {
    content: "";

    width: 25px;

    height: 1px;

    background: #c49a52;
}


.teem-testimony-title {
    margin: 0;

    color: #0b2821;

    font-size: clamp(
        2.2rem,
        5vw,
        4rem
    );

    font-weight: 800;

    line-height: 1.05;

    letter-spacing: -0.04em;
}


.teem-testimony-intro {
    max-width: 570px;

    margin: 1.2rem auto 0;

    color: #6d7873;

    font-size: 0.95rem;

    line-height: 1.8;
}


/* =========================================================
   CAROUSEL
========================================================= */

.teem-testimony-carousel {
    position: relative;

    max-width: 1120px;

    margin: 0 auto;
}


/* =========================================================
   TESTIMONY CARD
========================================================= */

.teem-testimony-card {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(350px, 0.78fr);

    min-height: 520px;

    overflow: hidden;

    border-radius: 28px;

    background: #0b2821;

    box-shadow:
        0 30px 70px rgba(7, 28, 23, 0.16);
}


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

.teem-testimony-content {
    position: relative;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding:
        4rem
        5rem
        4rem
        4.5rem;

    color: #ffffff;

    overflow: hidden;
}


.teem-testimony-content::before {
    content: "";

    position: absolute;

    width: 280px;

    height: 280px;

    right: -150px;

    bottom: -170px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(196, 154, 82, 0.12),
            transparent 70%
        );
}


/* =========================================================
   QUOTE ICON
========================================================= */

.teem-testimony-quote-icon {
    position: absolute;

    top: 2.2rem;

    left: 3.8rem;

    color: rgba(196, 154, 82, 0.16);

    font-size: 5rem;

    line-height: 1;

    pointer-events: none;
}


/* =========================================================
   META
========================================================= */

.teem-testimony-meta {
    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 1rem;

    margin-bottom: 2rem;
}


.teem-testimony-label {
    color: #d3a957;

    font-size: 0.65rem;

    font-weight: 800;

    letter-spacing: 0.16em;

    text-transform: uppercase;
}


.teem-testimony-number {
    color: rgba(255, 255, 255, 0.38);

    font-size: 0.62rem;

    font-weight: 700;

    letter-spacing: 0.08em;
}


/* =========================================================
   TESTIMONY TEXT
========================================================= */

.teem-testimony-text {
    position: relative;

    z-index: 2;

    max-width: 650px;

    margin: 0;

    color: #ffffff;

    font-size: clamp(
        1.25rem,
        2.2vw,
        1.8rem
    );

    font-weight: 500;

    line-height: 1.65;

    letter-spacing: -0.015em;
}


/* =========================================================
   PERSON
========================================================= */

.teem-testimony-person {
    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    gap: 0.3rem;

    margin-top: 2.2rem;

    padding-left: 1rem;

    border-left: 2px solid #c49a52;
}


.teem-testimony-person strong {
    color: #ffffff;

    font-size: 0.9rem;

    font-weight: 800;
}


.teem-testimony-person span {
    color: rgba(255, 255, 255, 0.55);

    font-size: 0.72rem;

    font-weight: 500;
}


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

.teem-testimony-image {
    position: relative;

    min-height: 520px;

    overflow: hidden;
}


.teem-testimony-image img {
    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

    transition:
        transform 0.8s ease;
}


.carousel-item.active
.teem-testimony-image img {
    transform: scale(1.01);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.teem-testimony-image-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(11, 40, 33, 0.22),
            transparent 45%
        );
}


/* =========================================================
   CONTROLS
========================================================= */

.teem-testimony-control {
    width: auto;

    height: auto;

    top: auto;

    bottom: -4.5rem;

    opacity: 1;
}


.teem-testimony-control-prev {
    left: auto;

    right: 4.2rem;
}


.teem-testimony-control-next {
    right: 0;
}


.teem-testimony-arrow {
    display: flex;

    align-items: center;

    justify-content: center;

    width: 42px;

    height: 42px;

    border: 1px solid rgba(11, 40, 33, 0.18);

    border-radius: 50%;

    color: #0b2821;

    background: transparent;

    font-size: 0.9rem;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease;
}


.teem-testimony-control:hover
.teem-testimony-arrow {
    color: #ffffff;

    background: #0b2821;

    transform: translateY(-2px);
}


/* =========================================================
   SEE MORE
========================================================= */

.teem-testimony-footer {
    display: flex;

    justify-content: center;

    margin-top: 6rem;
}


.teem-testimony-more {
    display: inline-flex;

    align-items: center;

    gap: 0.8rem;

    padding: 0.9rem 1.5rem;

    border: 1px solid rgba(11, 40, 33, 0.15);

    border-radius: 100px;

    color: #0b2821;

    background: transparent;

    font-size: 0.75rem;

    font-weight: 800;

    text-decoration: none;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease,
        border-color 0.25s ease;
}


.teem-testimony-more i {
    font-size: 0.85rem;

    transition:
        transform 0.25s ease;
}


.teem-testimony-more:hover {
    color: #ffffff;

    background: #0b2821;

    border-color: #0b2821;

    transform: translateY(-2px);
}


.teem-testimony-more:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-testimony-section {
        padding: 5.5rem 0;
    }


    .teem-testimony-card {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(280px, 0.75fr);

        min-height: 470px;
    }


    .teem-testimony-content {
        padding: 3rem;
    }


    .teem-testimony-image {
        min-height: 470px;
    }


    .teem-testimony-quote-icon {
        left: 2.8rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-testimony-section {
        padding: 4.5rem 0;
    }


    .teem-testimony-heading {
        margin-bottom: 2.5rem;

        padding: 0 0.5rem;
    }


    .teem-testimony-title {
        font-size: 2.35rem;
    }


    .teem-testimony-intro {
        font-size: 0.82rem;

        line-height: 1.7;
    }


    /*
     * Content comes FIRST on mobile.
     * This prevents the visitor from seeing
     * a large image before the actual testimony.
     */

    .teem-testimony-card {
        display: flex;

        flex-direction: column;

        min-height: auto;

        border-radius: 22px;
    }


    .teem-testimony-content {
        order: 1;

        padding:
            2.7rem
            1.5rem
            2.5rem;
    }


    .teem-testimony-image {
        order: 2;

        min-height: 300px;

        height: 300px;
    }


    .teem-testimony-quote-icon {
        top: 1.4rem;

        left: 1.4rem;

        font-size: 4rem;
    }


    .teem-testimony-meta {
        margin-bottom: 1.5rem;
    }


    .teem-testimony-text {
        font-size: 1.12rem;

        line-height: 1.7;
    }


    .teem-testimony-person {
        margin-top: 1.8rem;
    }


    .teem-testimony-control {
        bottom: -4rem;
    }


    .teem-testimony-control-prev {
        right: 3.3rem;
    }


    .teem-testimony-arrow {
        width: 38px;

        height: 38px;
    }


    .teem-testimony-footer {
        margin-top: 5.3rem;
    }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 400px) {

    .teem-testimony-content {
        padding:
            2.4rem
            1.2rem
            2.2rem;
    }


    .teem-testimony-text {
        font-size: 1.03rem;
    }


    .teem-testimony-image {
        height: 270px;

        min-height: 270px;
    }

}


/* =========================================================
   TEEM — WEEKLY PROGRAMS SECTION
========================================================= */

.teem-programs-section{
    padding:7rem 0;
    background:#fff;
    position:relative;
    margin-bottom: -2rem;
}

.teem-programs-heading{
    max-width:720px;
    margin:0 auto 4rem;
    text-align:center;
}

.teem-programs-eyebrow{
    color:#c49a52;
    text-transform:uppercase;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.18em;
}

.teem-programs-heading h2{
    margin:1rem 0;
    font-size:clamp(2.4rem,5vw,4rem);
    color:#08251d;
    font-weight:800;
}

.teem-programs-heading p{
    color:#64726d;
    line-height:1.8;
    font-size:.95rem;
}

/* Banner */

.teem-programs-banner{
    position:relative;
    border-radius:24px;
    overflow:hidden;
    padding:4rem;
    margin-bottom:4rem;
    background:
        linear-gradient(rgba(8,37,29,.82),rgba(8,37,29,.82)),
        url("../images/worship-banner.jpg") center/cover;
}

.teem-programs-banner-content{
    position:relative;
    z-index:2;
    max-width:600px;
}

.teem-programs-banner-tag{
    display:inline-block;
    padding:.45rem .9rem;
    border-radius:50px;
    background:rgba(196,154,82,.15);
    color:#d8b36d;
    font-size:.65rem;
    font-weight:700;
    letter-spacing:.15em;
}

.teem-programs-banner h3{
    margin:1rem 0;
    color:#fff;
    font-size:2.3rem;
    font-weight:800;
}

.teem-programs-banner p{
    color:rgba(255,255,255,.8);
    line-height:1.8;
}

/* Cards */

.teem-program-card{
    display:flex;
    gap:1.2rem;
    padding:2rem;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(8,37,29,.08);
    box-shadow:0 12px 35px rgba(8,37,29,.06);
    transition:.35s ease;
    height:100%;
}

.teem-program-card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 45px rgba(8,37,29,.12);
}

.teem-program-featured{
    border:2px solid #c49a52;
}

.teem-program-icon{
    width:65px;
    height:65px;
    border-radius:18px;
    background:rgba(196,154,82,.12);
    display:flex;
    justify-content:center;
    align-items:center;
    color:#b8893f;
    font-size:1.4rem;
    flex-shrink:0;
}

.teem-program-day{
    color:#c49a52;
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.12em;
}

.teem-program-info h4{
    margin:.5rem 0;
    color:#08251d;
    font-size:1.35rem;
    font-weight:700;
}

.teem-program-info p{
    color:#6d7772;
    line-height:1.7;
    margin-bottom:1rem;
}

.teem-program-time{
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    padding:.65rem 1rem;
    border-radius:50px;
    background:#f8f5ef;
    color:#08251d;
    font-weight:700;
    font-size:.85rem;
}

.teem-program-time i{
    color:#c49a52;
}

/* Monthly Special */

.teem-program-special{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:2rem;
    padding:2.5rem;
    border-radius:24px;
    background:linear-gradient(135deg,#08251d,#104031);
    color:#fff;
}

.teem-program-special span{
    color:#d8b36d;
    font-size:.7rem;
    letter-spacing:.15em;
    font-weight:700;
}

.teem-program-special h3{
    font-size:2rem;
    margin:.8rem 0;
    font-weight:800;
}

.teem-program-special p{
    color:rgba(255,255,255,.82);
    line-height:1.8;
}

.teem-special-date,
.teem-special-time{
    display:flex;
    align-items:center;
    gap:1rem;
    margin-bottom:1rem;
}

.teem-special-date i,
.teem-special-time i{
    width:55px;
    height:55px;
    border-radius:15px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:rgba(255,255,255,.08);
    color:#d8b36d;
    font-size:1.2rem;
}

.teem-special-date small{
    display:block;
    color:#d8b36d;
    letter-spacing:.12em;
}

.teem-special-date strong{
    display:block;
    font-size:1.2rem;
    color:#fff;
}

/* CTA */

.teem-programs-footer{
    text-align:center;
    margin-top:4rem;
}

.teem-programs-footer p{
    color:#64726d;
    margin-bottom:1.5rem;
}

.teem-programs-button{
    display:inline-flex;
    align-items:center;
    gap:.8rem;
    padding:1rem 1.8rem;
    border-radius:60px;
    background:#08251d;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    transition:.3s;
}

.teem-programs-button:hover{
    background:#c49a52;
    color:#fff;
    transform:translateY(-3px);
}

.teem-programs-button i{
    transition:.3s;
}

.teem-programs-button:hover i{
    transform:translateX(5px);
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width:768px){

    .teem-programs-section{
        padding:5rem 0;
    }

    .teem-programs-banner{
        padding:2rem;
    }

    .teem-programs-banner h3{
        font-size:1.7rem;
    }

    .teem-program-card{
        padding:1.4rem;
    }

    .teem-program-special{
        flex-direction:column;
        align-items:flex-start;
        padding:2rem;
    }

    .teem-program-special h3{
        font-size:1.6rem;
    }

    .teem-program-time{
        font-size:.8rem;
    }

}



/* =========================================================
   TEEM ABOUT PAGE
========================================================= */

.teem-about-hero {
    position: relative;
    min-height: 62vh;
    display: flex;
    align-items: center;
    background:
        linear-gradient(
            90deg,
            rgba(5, 30, 23, .98),
            rgba(5, 30, 23, .90),
            rgba(5, 30, 23, .60)
        ),
        url("../images/about-hero.jpg") center/cover no-repeat;
    overflow: hidden;
}

.teem-about-hero::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -160px;
    bottom: -200px;
    border-radius: 50%;
    border: 1px solid rgba(215, 178, 105, .25);
}

.teem-about-hero-inner {
    position: relative;
    z-index: 2;
    padding: 8rem 0;
}

.teem-about-hero-content {
    max-width: 800px;
}

.teem-about-eyebrow,
.teem-about-section-label {
    display: inline-block;
    color: #c9a05a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.teem-about-hero h1 {
    margin: 1rem 0 1.5rem;
    color: #fff;
    font-size: clamp(2.8rem, 6vw, 5.8rem);
    line-height: .98;
    font-weight: 850;
    letter-spacing: -.04em;
}

.teem-about-hero h1 span {
    display: block;
    color: #d9b56c;
}

.teem-about-hero p {
    max-width: 680px;
    color: rgba(255,255,255,.78);
    font-size: 1.05rem;
    line-height: 1.8;
}


/* =========================================================
   FOUNDER
========================================================= */

.teem-about-founder {
    padding: 8rem 0;
    background: #fff;
}

.teem-about-founder-image-wrap {
    position: relative;
    max-width: 470px;
    margin: auto;
}

.teem-about-founder-image-decoration {
    position: absolute;
    width: 90%;
    height: 90%;
    left: -22px;
    bottom: -22px;
    border: 2px solid #c9a05a;
    border-radius: 28px;
}

.teem-about-founder-image {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 570px;
    object-fit: cover;
    object-position: center top;
    border-radius: 28px;
    box-shadow: 0 25px 70px rgba(5,30,23,.16);
}

.teem-about-founder-caption {
    position: absolute;
    z-index: 3;
    left: 25px;
    right: 25px;
    bottom: 25px;
    padding: 1.2rem 1.4rem;
    border-radius: 16px;
    background: rgba(5,30,23,.90);
    backdrop-filter: blur(12px);
}

.teem-about-founder-caption span {
    display: block;
    margin-bottom: .3rem;
    color: #d9b56c;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .15em;
}

.teem-about-founder-caption strong {
    color: #fff;
    font-size: 1rem;
}

.teem-about-story {
    padding-left: 1rem;
}

.teem-about-story h2,
.teem-about-vision h2,
.teem-about-mission-heading h2 {
    margin: 1rem 0 1.5rem;
    color: #08251d;
    font-size: clamp(2.3rem, 4vw, 4rem);
    line-height: 1.05;
    font-weight: 850;
    letter-spacing: -.035em;
}

.teem-about-story h2 span,
.teem-about-vision h2 span,
.teem-about-mission-heading h2 span {
    color: #c49a52;
}

.teem-about-story p,
.teem-about-vision p {
    color: #65736d;
    font-size: .98rem;
    line-height: 1.9;
    margin-bottom: 1.2rem;
}

.teem-about-lead {
    color: #263d35 !important;
    font-size: 1.12rem !important;
    line-height: 1.8 !important;
}

.teem-about-history-placeholder {
    padding: 1.2rem 1.4rem;
    border-left: 3px solid #c49a52;
    background: #faf8f3;
    border-radius: 0 12px 12px 0;
}


/* =========================================================
   ESTABLISHMENT
========================================================= */

.teem-about-establishment {
    padding: 0 0 7rem;
    background: #fff;
}

.teem-about-establishment-card {
    display: flex;
    align-items: center;
    gap: 2rem;
    max-width: 850px;
    margin: auto;
    padding: 2rem 2.5rem;
    border-radius: 24px;
    background: #08251d;
    box-shadow: 0 25px 60px rgba(5,30,23,.15);
}

.teem-about-establishment-icon {
    width: 75px;
    height: 75px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    background: rgba(201,160,90,.12);
    color: #d9b56c;
    font-size: 1.7rem;
}

.teem-about-establishment-content span {
    color: #d9b56c;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .15em;
}

.teem-about-establishment-content h2 {
    margin: .2rem 0;
    color: #fff;
    font-size: 2rem;
    font-weight: 850;
}

.teem-about-establishment-content p {
    margin: 0;
    color: rgba(255,255,255,.68);
    line-height: 1.7;
}


/* =========================================================
   VISION
========================================================= */

.teem-about-vision {
    padding: 8rem 0;
    background: #f7f5ef;
}

.teem-about-vision-card {
    position: relative;
    padding: 3.5rem;
    border-radius: 30px;
    background:
        linear-gradient(
            145deg,
            #08251d,
            #123e31
        );
    overflow: hidden;
    box-shadow: 0 25px 60px rgba(5,30,23,.15);
}

.teem-about-vision-card::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    right: -130px;
    top: -130px;
    border-radius: 50%;
    border: 1px solid rgba(217,181,108,.22);
}

.teem-about-vision-mark {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2rem;
    border-radius: 18px;
    background: rgba(217,181,108,.12);
    color: #d9b56c;
    font-size: 1.4rem;
}

.teem-about-vision-card > span {
    color: #d9b56c;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .16em;
}

.teem-about-vision-card blockquote {
    margin: 1rem 0;
    color: #fff;
    font-size: clamp(1.8rem, 3vw, 2.7rem);
    line-height: 1.25;
    font-weight: 750;
}

.teem-about-vision-line {
    width: 60px;
    height: 3px;
    margin: 1.8rem 0;
    background: #c49a52;
}

.teem-about-vision-card p {
    color: rgba(255,255,255,.72);
}


/* =========================================================
   MISSION
========================================================= */

.teem-about-mission {
    padding: 8rem 0;
    background: #fff;
}

.teem-about-mission-heading {
    max-width: 700px;
    margin: 0 auto 4rem;
    text-align: center;
}

.teem-about-mission-heading p {
    color: #65736d;
    line-height: 1.8;
}

.teem-about-mission-card {
    position: relative;
    height: 100%;
    padding: 2rem;
    border: 1px solid rgba(8,37,29,.08);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 15px 40px rgba(8,37,29,.05);
    transition: .35s ease;
}

.teem-about-mission-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 55px rgba(8,37,29,.11);
}

.teem-about-mission-number {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    color: rgba(8,37,29,.08);
    font-size: 2.5rem;
    font-weight: 900;
}

.teem-about-mission-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    border-radius: 16px;
    background: rgba(196,154,82,.12);
    color: #bd8f42;
    font-size: 1.3rem;
}

.teem-about-mission-card h3 {
    margin-bottom: .8rem;
    color: #08251d;
    font-size: 1.2rem;
    font-weight: 800;
}

.teem-about-mission-card p {
    margin: 0;
    color: #69756f;
    font-size: .9rem;
    line-height: 1.8;
}


/* =========================================================
   CLOSING
========================================================= */

.teem-about-closing {
    padding: 8rem 0;
    background:
        linear-gradient(
            rgba(4,24,19,.92),
            rgba(4,24,19,.96)
        ),
        url("../images/about-closing.jpg") center/cover;
}

.teem-about-closing-inner {
    max-width: 760px;
    margin: auto;
    text-align: center;
}

.teem-about-closing-icon {
    width: 65px;
    height: 65px;
    margin: 0 auto 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(201,160,90,.12);
    color: #d9b56c;
    font-size: 1.4rem;
}

.teem-about-closing-inner > span {
    color: #d9b56c;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .18em;
}

.teem-about-closing h2 {
    margin: 1.2rem 0;
    color: #fff;
    font-size: clamp(2.2rem, 5vw, 4.5rem);
    line-height: 1.05;
    font-weight: 850;
    letter-spacing: -.04em;
}

.teem-about-closing p {
    color: rgba(255,255,255,.68);
    margin-bottom: 2rem;
}

.teem-about-closing-button {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    padding: .95rem 1.7rem;
    border-radius: 50px;
    background: #c49a52;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    transition: .3s ease;
}

.teem-about-closing-button:hover {
    background: #d5ac61;
    color: #fff;
    transform: translateY(-3px);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {

    .teem-about-story {
        padding-left: 0;
    }

    .teem-about-founder-image {
        height: 520px;
    }

}

@media (max-width: 767px) {

    .teem-about-hero {
        min-height: 65vh;
    }

    .teem-about-hero-inner {
        padding: 6rem 0;
    }

    .teem-about-hero h1 {
        font-size: clamp(2.6rem, 12vw, 4rem);
    }

    .teem-about-founder,
    .teem-about-vision,
    .teem-about-mission {
        padding: 5rem 0;
    }

    .teem-about-founder-image-wrap {
        margin-bottom: 1rem;
    }

    .teem-about-founder-image {
        height: 450px;
    }

    .teem-about-founder-caption {
        left: 15px;
        right: 15px;
        bottom: 15px;
    }

    .teem-about-story h2,
    .teem-about-vision h2,
    .teem-about-mission-heading h2 {
        font-size: 2.4rem;
    }

    .teem-about-vision-card {
        padding: 2rem;
    }

    .teem-about-vision-card blockquote {
        font-size: 1.7rem;
    }

    .teem-about-establishment-card {
        flex-direction: column;
        align-items: flex-start;
        padding: 2rem;
    }

    .teem-about-closing {
        padding: 6rem 0;
    }

}



/* =========================================================
   TEEM — GALLERY PAGE
========================================================= */


/* =========================================================
   GALLERY HERO
========================================================= */

.teem-gallery-hero {
    position: relative;
    min-height: 58vh;
    display: flex;
    align-items: center;
    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(5, 30, 23, 0.96),
            rgba(5, 30, 23, 0.86),
            rgba(5, 30, 23, 0.62)
        ),
        url("../images/gallery/gallery-hero.jpg")
        center / cover no-repeat;
}

.teem-gallery-hero::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -180px;
    top: -200px;
    border: 1px solid rgba(213, 177, 104, 0.25);
    border-radius: 50%;
}

.teem-gallery-hero::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    left: -130px;
    bottom: -150px;
    border: 1px solid rgba(213, 177, 104, 0.15);
    border-radius: 50%;
}

.teem-gallery-hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    padding: 8rem 0;
}

.teem-gallery-eyebrow {
    display: inline-block;
    margin-bottom: 1rem;

    color: #d5b168;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.teem-gallery-hero h1 {
    margin: 0 0 1.5rem;

    color: #ffffff;
    font-size: clamp(2.8rem, 6vw, 5.5rem);
    line-height: 1;
    font-weight: 850;
    letter-spacing: -0.045em;
}

.teem-gallery-hero h1 span {
    display: block;
    color: #d5b168;
}

.teem-gallery-hero p {
    max-width: 680px;
    margin: 0;

    color: rgba(255, 255, 255, 0.75);
    font-size: 1rem;
    line-height: 1.9;
}


/* =========================================================
   GALLERY SECTION
========================================================= */

.teem-gallery-section {
    padding: 7rem 0;
    background: #ffffff;
}

.teem-gallery-section-heading {
    max-width: 700px;
    margin: 0 auto 4rem;
    text-align: center;
}

.teem-gallery-section-label {
    display: inline-block;

    color: #c49a52;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.teem-gallery-section-heading h2 {
    margin: 1rem 0 1.2rem;

    color: #08251d;
    font-size: clamp(2.4rem, 5vw, 4rem);
    line-height: 1.05;
    font-weight: 850;
    letter-spacing: -0.04em;
}

.teem-gallery-section-heading h2 span {
    color: #c49a52;
}

.teem-gallery-section-heading p {
    max-width: 600px;
    margin: 0 auto;

    color: #69766f;
    font-size: 0.95rem;
    line-height: 1.85;
}


/* =========================================================
   GALLERY GRID
========================================================= */

.teem-gallery-grid {
    position: relative;
}


/* =========================================================
   GALLERY ITEM
========================================================= */

.teem-gallery-item {
    position: relative;
    width: 100%;
    height: 360px;

    overflow: hidden;
    border-radius: 20px;

    background: #eef0ed;

    box-shadow:
        0 12px 35px rgba(8, 37, 29, 0.08);

    cursor: pointer;

    transition:
        transform 0.45s ease,
        box-shadow 0.45s ease;
}

.teem-gallery-item:hover {
    transform: translateY(-7px);

    box-shadow:
        0 25px 55px rgba(8, 37, 29, 0.15);
}


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

.teem-gallery-item img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
        filter 0.45s ease;
}

.teem-gallery-item:hover img {
    transform: scale(1.07);
    filter: brightness(0.86);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.teem-gallery-item::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(4, 24, 19, 0.38),
            transparent 55%
        );

    opacity: 0;

    transition: opacity 0.4s ease;
}

.teem-gallery-item:hover::after {
    opacity: 1;
}


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

@media (max-width: 991px) {

    .teem-gallery-hero {
        min-height: 52vh;
    }

    .teem-gallery-hero-content {
        padding: 7rem 0;
    }

    .teem-gallery-item {
        height: 320px;
    }

}


@media (max-width: 767px) {

    .teem-gallery-hero {
        min-height: 62vh;
    }

    .teem-gallery-hero-content {
        padding: 6rem 0;
    }

    .teem-gallery-hero h1 {
        font-size: clamp(2.7rem, 12vw, 4rem);
    }

    .teem-gallery-hero p {
        font-size: 0.92rem;
        line-height: 1.8;
    }

    .teem-gallery-section {
        padding: 5rem 0;
    }

    .teem-gallery-section-heading {
        margin-bottom: 3rem;
    }

    .teem-gallery-section-heading h2 {
        font-size: 2.5rem;
    }

    .teem-gallery-item {
        height: 300px;
        border-radius: 17px;
    }

}


@media (max-width: 480px) {

    .teem-gallery-hero-content {
        padding: 5rem 0;
    }

    .teem-gallery-hero h1 {
        font-size: 2.65rem;
    }

    .teem-gallery-section {
        padding: 4.5rem 0;
    }

    .teem-gallery-item {
        height: 270px;
        border-radius: 15px;
    }

}



/* =========================================================
   CHOIR GALLERY SECTION
========================================================= */

.teem-gallery-choir-section {
    background: #f7f5ef;
}

.teem-gallery-choir-section .teem-gallery-item {
    background: #e9e6dc;
}

/* =========================================================
   TEACHING & DISCIPLESHIP GALLERY
========================================================= */

.teem-gallery-teaching-section {
    background: #ffffff;
}

.teem-gallery-teaching-section .teem-gallery-item {
    background: #eef0ed;
}



/* =========================================================
   PROJECTFINALE — TEAM SECTION
========================================================= */

.teem-team-section {
    position: relative;

    padding: 110px 0;

    background: #ffffff;

    overflow: hidden;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.teem-team-heading {
    max-width: 760px;

    margin: 0 auto 60px;
}

.teem-team-eyebrow {
    display: inline-block;

    margin-bottom: 13px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;

    color: #520451;
}

.teem-team-heading h2 {
    margin: 0;

    font-size: 46px;

    line-height: 1.15;

    font-weight: 750;

    letter-spacing: -.8px;

    color: #15151a;
}

.teem-team-heading h2 span {
    color: #520451;
}

.teem-team-heading p {
    max-width: 650px;

    margin: 18px auto 0;

    color: #777982;

    font-size: 15px;

    line-height: 1.75;
}


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

.teem-team-card {
    position: relative;

    height: 100%;

    overflow: hidden;

    border-radius: 22px;

    background: #ffffff;

    border: 1px solid #ececef;

    box-shadow:
        0 10px 35px rgba(20, 20, 30, .055);

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


/* Hover */

.teem-team-card:hover {
    transform: translateY(-8px);

    border-color: rgba(82,4,81,.20);

    box-shadow:
        0 25px 55px rgba(20, 20, 30, .12);
}


/* =========================================================
   IMAGE AREA
========================================================= */

.teem-team-image {
    position: relative;

    height: 330px;

    overflow: hidden;

    display: flex;

    align-items: flex-end;

    justify-content: center;

    background:
        linear-gradient(
            145deg,
            #f7f3f7,
            #eee9ef
        );
}


/* Decorative circle */

.teem-team-image::before {
    content: "";

    position: absolute;

    width: 235px;

    height: 235px;

    border-radius: 50%;

    bottom: -75px;

    background:
        rgba(82,4,81,.08);
}


/* Decorative small circle */

.teem-team-image::after {
    content: "";

    position: absolute;

    width: 70px;

    height: 70px;

    border-radius: 50%;

    top: 25px;

    right: 25px;

    background:
        rgba(82,4,81,.055);
}


/* Person */

.teem-team-image img {
    position: relative;

    z-index: 2;

    width: 72%;

    height: 100%;

    object-fit: contain;

    object-position: center bottom;

    transition:
        transform .45s ease;
}


/* Image hover */

.teem-team-card:hover .teem-team-image img {
    transform: scale(1.045);
}


/* =========================================================
   TEAM INFORMATION
========================================================= */

.teem-team-info {
    position: relative;

    padding: 25px 26px 27px;

    background: #ffffff;
}


/* Role */

.teem-team-role {
    display: inline-flex;

    align-items: center;

    padding: 6px 10px;

    margin-bottom: 12px;

    border-radius: 50px;

    background: rgba(82,4,81,.07);

    color: #520451;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .8px;

    text-transform: uppercase;
}


/* Name */

.teem-team-info h3 {
    margin: 0 0 8px;

    color: #17171b;

    font-size: 21px;

    line-height: 1.3;

    font-weight: 750;
}

.teem-team-info h3 small {
    color: #777982;

    font-size: 12px;

    font-weight: 650;
}


/* Location */

.teem-team-info p {
    margin: 0;

    display: flex;

    align-items: center;

    gap: 6px;

    color: #85868d;

    font-size: 12px;

    font-weight: 500;
}

.teem-team-info p i {
    color: #520451;

    font-size: 12px;
}


/* =========================================================
   DESKTOP CARD HEIGHT
========================================================= */

@media (min-width: 992px) {

    .teem-team-card {
        min-height: 475px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .teem-team-section {
        padding: 85px 0;
    }

    .teem-team-heading {
        margin-bottom: 45px;
    }

    .teem-team-heading h2 {
        font-size: 38px;
    }

    .teem-team-image {
        height: 310px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-team-section {
        padding: 70px 0;
    }

    .teem-team-heading {
        padding: 0 18px;

        margin-bottom: 35px;
    }

    .teem-team-heading h2 {
        font-size: 31px;
    }

    .teem-team-heading p {
        font-size: 14px;

        line-height: 1.7;
    }

    .teem-team-card {
        border-radius: 19px;
    }

    .teem-team-image {
        height: 300px;
    }

    .teem-team-image img {
        width: 70%;
    }

    .teem-team-info {
        padding: 21px 22px 23px;
    }

    .teem-team-info h3 {
        font-size: 19px;
    }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 420px) {

    .teem-team-image {
        height: 275px;
    }

    .teem-team-image img {
        width: 75%;
    }

}


/* =========================================================
   MEDIA & TECHNICAL TEAM
========================================================= */

.teem-gallery-tech-section {
    background: #f7f5ef;
}

.teem-gallery-tech-grid {
    max-width: 1100px;
    margin: 0 auto;
}

.teem-gallery-tech-item {
    position: relative;
    height: 430px;
    overflow: hidden;
    border-radius: 24px;
    background: #e9e6dc;
    box-shadow: 0 18px 45px rgba(8, 37, 29, 0.08);
}

.teem-gallery-tech-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
        filter 0.5s ease;
}

.teem-gallery-tech-item:hover img {
    transform: scale(1.06);
    filter: brightness(0.72);
}


/* =========================================================
   TECH TEAM IMAGE OVERLAY
========================================================= */

.teem-gallery-tech-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    padding: 2rem;

    background:
        linear-gradient(
            to top,
            rgba(4, 24, 19, 0.92),
            rgba(4, 24, 19, 0.45),
            transparent
        );

    transform: translateY(8px);
    transition: transform 0.4s ease;
}

.teem-gallery-tech-item:hover .teem-gallery-tech-overlay {
    transform: translateY(0);
}

.teem-gallery-tech-overlay span {
    display: block;
    margin-bottom: 0.5rem;

    color: #d5b168;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.teem-gallery-tech-overlay h3 {
    margin: 0;

    color: #ffffff;
    font-size: 1.45rem;
    font-weight: 750;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-gallery-tech-item {
        height: 330px;
        border-radius: 18px;
    }

    .teem-gallery-tech-overlay {
        padding: 1.4rem;
        transform: none;
    }

    .teem-gallery-tech-overlay h3 {
        font-size: 1.2rem;
    }

}



/* =========================================================
   TEEM — PRAYER PAGE
========================================================= */


/* =========================================================
   PRAYER HERO
========================================================= */

.teem-prayer-hero {
    position: relative;
    min-height: 70vh;

    display: flex;
    align-items: center;

    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(4, 25, 19, 0.97),
            rgba(4, 25, 19, 0.88),
            rgba(4, 25, 19, 0.70)
        ),
        url("/static/images/prayer-hero.jpg")
        center / cover no-repeat;
}

.teem-prayer-hero::before {
    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    right: -230px;
    top: -250px;

    border: 1px solid rgba(214, 177, 103, 0.20);

    border-radius: 50%;
}

.teem-prayer-hero::after {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    left: -150px;
    bottom: -180px;

    border: 1px solid rgba(214, 177, 103, 0.12);

    border-radius: 50%;
}

.teem-prayer-hero-content {
    position: relative;
    z-index: 2;

    max-width: 850px;

    padding: 8rem 0;
}

.teem-prayer-eyebrow {
    display: inline-block;

    margin-bottom: 1rem;

    color: #d5b168;

    font-size: 0.68rem;
    font-weight: 800;

    letter-spacing: 0.2em;

    text-transform: uppercase;
}

.teem-prayer-hero h1 {
    margin: 0 0 1.5rem;

    color: #ffffff;

    font-size: clamp(3rem, 7vw, 6rem);

    line-height: 0.98;

    font-weight: 850;

    letter-spacing: -0.045em;
}

.teem-prayer-hero h1 span {
    display: block;

    color: #d5b168;
}

.teem-prayer-hero p {
    max-width: 700px;

    margin: 0;

    color: rgba(255, 255, 255, 0.76);

    font-size: 1.05rem;

    line-height: 1.9;
}


/* =========================================================
   HERO SCRIPTURE
========================================================= */

.teem-prayer-hero-verse {
    max-width: 600px;

    margin-top: 2.5rem;
    padding-left: 1.5rem;

    border-left: 2px solid #c49a52;
}

.teem-prayer-hero-verse i {
    color: #d5b168;

    font-size: 1.3rem;
}

.teem-prayer-hero-verse p {
    margin: 0.4rem 0;

    color: rgba(255, 255, 255, 0.88);

    font-size: 0.95rem;

    font-style: italic;

    line-height: 1.7;
}

.teem-prayer-hero-verse span {
    color: #d5b168;

    font-size: 0.72rem;

    font-weight: 700;

    letter-spacing: 0.08em;
}


/* =========================================================
   MAIN PRAYER SECTION
========================================================= */

.teem-prayer-section {
    padding: 8rem 0;

    background: #f7f5ef;
}


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

.teem-prayer-intro {
    position: sticky;
    top: 110px;
}

.teem-prayer-section-label {
    display: inline-block;

    color: #c49a52;

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}

.teem-prayer-intro h2 {
    margin: 1rem 0 1.5rem;

    color: #08251d;

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

    line-height: 1;

    font-weight: 850;

    letter-spacing: -0.04em;
}

.teem-prayer-intro h2 span {
    display: block;

    color: #c49a52;
}

.teem-prayer-intro > p {
    color: #69766f;

    font-size: 0.97rem;

    line-height: 1.9;
}

.teem-prayer-lead {
    color: #263d35 !important;

    font-size: 1.08rem !important;
}


/* =========================================================
   REASSURANCE BOX
========================================================= */

.teem-prayer-reassurance {
    display: flex;

    gap: 1rem;

    margin-top: 2rem;
    padding: 1.3rem;

    border-radius: 17px;

    background: #ffffff;

    border: 1px solid rgba(8, 37, 29, 0.07);
}

.teem-prayer-reassurance-icon {
    width: 48px;
    height: 48px;

    flex-shrink: 0;

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

    border-radius: 14px;

    background: rgba(196, 154, 82, 0.12);

    color: #bd8f42;

    font-size: 1.2rem;
}

.teem-prayer-reassurance strong {
    display: block;

    margin-bottom: 0.25rem;

    color: #08251d;

    font-size: 0.95rem;
}

.teem-prayer-reassurance p {
    margin: 0;

    color: #748078;

    font-size: 0.82rem;

    line-height: 1.7;
}


/* =========================================================
   PRAYER POINTS
========================================================= */

.teem-prayer-points {
    margin-top: 2rem;
}

.teem-prayer-point {
    display: flex;

    align-items: center;

    gap: 0.75rem;

    margin-bottom: 0.9rem;
}

.teem-prayer-point i {
    color: #c49a52;

    font-size: 0.9rem;
}

.teem-prayer-point span {
    color: #506159;

    font-size: 0.86rem;
}


/* =========================================================
   FORM CARD
========================================================= */

.teem-prayer-form-card {
    padding: 2.5rem;

    border-radius: 28px;

    background: #ffffff;

    border: 1px solid rgba(8, 37, 29, 0.07);

    box-shadow:
        0 25px 70px rgba(8, 37, 29, 0.08);
}


/* =========================================================
   FORM HEADER
========================================================= */

.teem-prayer-form-header {
    display: flex;

    align-items: center;

    gap: 1rem;

    margin-bottom: 2.2rem;

    padding-bottom: 1.5rem;

    border-bottom: 1px solid rgba(8, 37, 29, 0.08);
}

.teem-prayer-form-icon {
    width: 58px;
    height: 58px;

    flex-shrink: 0;

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

    border-radius: 17px;

    background: #08251d;

    color: #d5b168;

    font-size: 1.3rem;
}

.teem-prayer-form-header span {
    display: block;

    margin-bottom: 0.3rem;

    color: #c49a52;

    font-size: 0.62rem;

    font-weight: 800;

    letter-spacing: 0.15em;
}

.teem-prayer-form-header h3 {
    margin: 0;

    color: #08251d;

    font-size: 1.4rem;

    font-weight: 800;
}


/* =========================================================
   LABELS
========================================================= */

.teem-prayer-label {
    display: block;

    margin-bottom: 0.55rem;

    color: #263d35;

    font-size: 0.82rem;

    font-weight: 700;
}

.teem-prayer-label span {
    color: #9aaba3;

    font-size: 0.72rem;

    font-weight: 500;
}


/* =========================================================
   INPUT WRAPPER
========================================================= */

.teem-prayer-input-wrap,
.teem-prayer-textarea-wrap {
    position: relative;
}

.teem-prayer-input-wrap > i,
.teem-prayer-textarea-wrap > i {
    position: absolute;

    left: 1rem;
    top: 50%;

    transform: translateY(-50%);

    color: #8b9892;

    pointer-events: none;

    z-index: 2;
}

.teem-prayer-textarea-wrap > i {
    top: 1.25rem;

    transform: none;
}


/* =========================================================
   INPUTS
========================================================= */

.teem-prayer-input,
.teem-prayer-textarea {
    width: 100%;

    border: 1px solid #dde3df;

    border-radius: 13px;

    background: #fbfcfb;

    color: #20352e;

    font-family: inherit;

    font-size: 0.88rem;

    outline: none;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}

.teem-prayer-input {
    height: 54px;

    padding: 0 1rem 0 2.8rem;
}

.teem-prayer-textarea {
    min-height: 170px;

    resize: vertical;

    padding: 1rem 1rem 1rem 2.8rem;
}

.teem-prayer-input::placeholder,
.teem-prayer-textarea::placeholder {
    color: #a1aaa5;
}

.teem-prayer-input:focus,
.teem-prayer-textarea:focus {
    border-color: #c49a52;

    background: #ffffff;

    box-shadow:
        0 0 0 4px rgba(196, 154, 82, 0.10);
}


/* =========================================================
   SELECT
========================================================= */

.teem-prayer-select-wrap > i {
    z-index: 3;
}

.teem-prayer-select {
    appearance: none;

    cursor: pointer;

    padding-right: 2.5rem;
}

.teem-prayer-select-wrap::after {
    content: "\F282";

    position: absolute;

    right: 1rem;
    top: 50%;

    transform: translateY(-50%);

    color: #7f8d86;

    font-family: "bootstrap-icons";

    pointer-events: none;
}


/* =========================================================
   CHECKBOXES
========================================================= */

.teem-prayer-checkbox-label {
    position: relative;

    display: flex;

    align-items: flex-start;

    gap: 0.8rem;

    cursor: pointer;
}

.teem-prayer-checkbox {
    position: absolute;

    opacity: 0;

    pointer-events: none;
}

.teem-prayer-custom-checkbox {
    width: 21px;
    height: 21px;

    flex-shrink: 0;

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

    margin-top: 1px;

    border: 1.5px solid #cbd5d0;

    border-radius: 6px;

    color: #ffffff;

    transition:
        background 0.2s ease,
        border-color 0.2s ease;
}

.teem-prayer-custom-checkbox i {
    opacity: 0;

    font-size: 0.75rem;

    transition: opacity 0.2s ease;
}

.teem-prayer-checkbox:checked
+ .teem-prayer-custom-checkbox {
    background: #08251d;

    border-color: #08251d;
}

.teem-prayer-checkbox:checked
+ .teem-prayer-custom-checkbox i {
    opacity: 1;
}

.teem-prayer-checkbox-text strong {
    display: block;

    color: #33463e;

    font-size: 0.78rem;

    line-height: 1.5;
}

.teem-prayer-checkbox-text small {
    display: block;

    margin-top: 0.2rem;

    color: #87928d;

    font-size: 0.72rem;

    line-height: 1.6;
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.teem-prayer-submit {
    width: 100%;

    min-height: 57px;

    display: flex;

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

    gap: 0.7rem;

    border: none;

    border-radius: 14px;

    background: #08251d;

    color: #ffffff;

    font-family: inherit;

    font-size: 0.88rem;

    font-weight: 750;

    cursor: pointer;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}

.teem-prayer-submit:hover {
    transform: translateY(-3px);

    background: #103c30;

    box-shadow:
        0 15px 30px rgba(8, 37, 29, 0.18);
}

.teem-prayer-submit i {
    color: #d5b168;

    transition: transform 0.3s ease;
}

.teem-prayer-submit:hover i {
    transform: translateX(5px);
}


/* =========================================================
   CLOSING SECTION
========================================================= */

.teem-prayer-closing {
    position: relative;

    padding: 8rem 0;

    overflow: hidden;

    background:
        linear-gradient(
            rgba(4, 24, 19, 0.843),
            rgba(4, 24, 19, 0.911)
        ),
        url("/static/images/prayer-closing.jpg")
        center / cover no-repeat;
}

.teem-prayer-closing-content {
    max-width: 700px;

    margin: auto;

    text-align: center;
}

.teem-prayer-closing-icon {
    width: 65px;
    height: 65px;

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

    margin: 0 auto 1.5rem;

    border-radius: 50%;

    background: rgba(213, 177, 104, 0.12);

    color: #d5b168;

    font-size: 1.3rem;
}

.teem-prayer-closing-content > span {
    color: #d5b168;

    font-size: 0.68rem;

    font-weight: 800;

    letter-spacing: 0.18em;
}

.teem-prayer-closing h2 {
    margin: 1.2rem 0;

    color: #ffffff;

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

    line-height: 1.05;

    font-weight: 850;

    letter-spacing: -0.04em;
}

.teem-prayer-closing p {
    margin: 0;

    color: rgba(255, 255, 255, 0.65);

    font-size: 0.95rem;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .teem-prayer-intro {
        position: static;
    }

    .teem-prayer-section {
        padding: 6rem 0;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-prayer-hero {
        min-height: 75vh;
    }

    .teem-prayer-hero-content {
        padding: 6rem 0;
    }

    .teem-prayer-hero h1 {
        font-size: clamp(2.7rem, 12vw, 4rem);
    }

    .teem-prayer-hero p {
        font-size: 0.92rem;
    }

    .teem-prayer-hero-verse {
        margin-top: 2rem;
    }

    .teem-prayer-section {
        padding: 5rem 0;
    }

    .teem-prayer-intro h2 {
        font-size: 2.7rem;
    }

    .teem-prayer-form-card {
        padding: 1.5rem;

        border-radius: 21px;
    }

    .teem-prayer-form-header {
        align-items: flex-start;
    }

    .teem-prayer-form-header h3 {
        font-size: 1.2rem;
    }

    .teem-prayer-form-icon {
        width: 50px;
        height: 50px;
    }

    .teem-prayer-closing {
        padding: 6rem 0;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .teem-prayer-hero-content {
        padding: 5rem 0;
    }

    .teem-prayer-form-card {
        padding: 1.2rem;
    }

    .teem-prayer-reassurance {
        padding: 1rem;
    }

    .teem-prayer-closing h2 {
        font-size: 2.5rem;
    }

}

/* =========================================================
   PRAYER SUBMIT LOADING STATE
========================================================= */

.teem-prayer-submit {
    position: relative;
}

.teem-prayer-submit-spinner {
    display: none;

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

.teem-prayer-submit-loading {
    cursor: wait;

    opacity: 0.9;
}

.teem-prayer-submit-loading .spinner-border {
    width: 1rem;
    height: 1rem;

    border-width: 0.14em;
}

 

/* =========================================================
   TEEM GIVING PAGE
========================================================= */


/* =========================================================
   PAGE VARIABLES
========================================================= */

.teem-give-page {

    --teem-give-primary: #0b3d32;
    --teem-give-primary-dark: #062a23;
    --teem-give-accent: #c9a227;

    --teem-give-light: #f7f8f5;
    --teem-give-white: #ffffff;

    --teem-give-text: #26332f;
    --teem-give-muted: #6c7773;

    --teem-give-border: #e4e8e5;

    color: var(--teem-give-text);

    overflow: hidden;
}


/* =========================================================
   HERO
========================================================= */

.teem-give-hero {

    position: relative;

    min-height: 470px;

    display: flex;
    align-items: center;

    background:
        linear-gradient(
            110deg,
            rgba(4, 28, 23, 0.96),
            rgba(7, 55, 45, 0.88),
            rgba(7, 55, 45, 0.70)
        ),
        url("../images/give-hero.jpg");

    background-size: cover;
    background-position: center;

    isolation: isolate;
}


.teem-give-hero-overlay {

    position: absolute;

    inset: 0;

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(201, 162, 39, 0.12),
            transparent 35%
        );

    z-index: -1;
}


.teem-give-hero-container {

    position: relative;

    z-index: 2;

    padding-top: 70px;
    padding-bottom: 70px;
}


.teem-give-eyebrow {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 18px;

    color: var(--teem-give-accent);

    font-size: 0.78rem;

    font-weight: 700;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


.teem-give-eyebrow::before {

    content: "";

    width: 32px;

    height: 2px;

    background: var(--teem-give-accent);
}


.teem-give-hero h1 {

    max-width: 850px;

    margin: 0;

    color: var(--teem-give-white);

    font-size: clamp(2.6rem, 6vw, 5rem);

    font-weight: 800;

    line-height: 1.05;

    letter-spacing: -2px;
}


.teem-give-hero h1 span {

    display: block;

    color: var(--teem-give-accent);
}


.teem-give-hero p {

    max-width: 680px;

    margin: 25px 0 0;

    color: rgba(255, 255, 255, 0.82);

    font-size: 1.08rem;

    line-height: 1.8;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.teem-give-section-heading {

    max-width: 720px;

    margin: 0 auto 50px;

    text-align: center;
}


.teem-give-section-heading > span {

    display: block;

    margin-bottom: 12px;

    color: var(--teem-give-accent);

    font-size: 0.75rem;

    font-weight: 800;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.teem-give-section-heading h2 {

    margin: 0 0 15px;

    color: var(--teem-give-primary);

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

    font-weight: 800;

    line-height: 1.15;
}


.teem-give-section-heading p {

    margin: 0;

    color: var(--teem-give-muted);

    font-size: 1rem;

    line-height: 1.8;
}


/* =========================================================
   GIVING TYPE SELECTION
========================================================= */

.teem-give-selection {

    padding: 100px 0 80px;

    background: var(--teem-give-white);
}


.teem-give-type-card {

    position: relative;

    display: flex;

    align-items: center;

    gap: 20px;

    min-height: 155px;

    padding: 28px;

    border: 1px solid var(--teem-give-border);

    border-radius: 20px;

    background: var(--teem-give-white);

    text-decoration: none;

    box-shadow:
        0 12px 35px rgba(11, 61, 50, 0.06);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


.teem-give-type-card:hover {

    transform: translateY(-7px);

    border-color: rgba(201, 162, 39, 0.55);

    box-shadow:
        0 20px 45px rgba(11, 61, 50, 0.12);
}


.teem-give-type-card-active {

    border-color: var(--teem-give-primary);

    background:
        linear-gradient(
            135deg,
            var(--teem-give-primary),
            #104e40
        );

    box-shadow:
        0 20px 45px rgba(11, 61, 50, 0.20);
}


.teem-give-type-icon {

    flex: 0 0 58px;

    width: 58px;

    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 16px;

    background: rgba(11, 61, 50, 0.08);

    color: var(--teem-give-primary);

    font-size: 1.35rem;
}


.teem-give-type-card-active
.teem-give-type-icon {

    background: rgba(255, 255, 255, 0.12);

    color: var(--teem-give-accent);
}


.teem-give-type-content {

    display: flex;

    flex-direction: column;

    gap: 7px;

    min-width: 0;
}


.teem-give-type-content strong {

    color: var(--teem-give-primary);

    font-size: 1.08rem;

    font-weight: 750;
}


.teem-give-type-card-active
.teem-give-type-content strong {

    color: var(--teem-give-white);
}


.teem-give-type-content small {

    color: var(--teem-give-muted);

    font-size: 0.88rem;

    line-height: 1.55;
}


.teem-give-type-card-active
.teem-give-type-content small {

    color: rgba(255, 255, 255, 0.72);
}


.teem-give-type-arrow {

    margin-left: auto;

    color: var(--teem-give-accent);

    font-size: 1.2rem;

    transition: transform 0.3s ease;
}


.teem-give-type-card:hover
.teem-give-type-arrow {

    transform: translateX(5px);
}


/* =========================================================
   MAIN GIVING AREA
========================================================= */

.teem-give-main {

    padding: 100px 0;

    background: var(--teem-give-light);
}


.teem-give-introduction {

    padding-right: 30px;

    position: sticky;

    top: 110px;
}


.teem-give-introduction h2 {

    margin: 5px 0 20px;

    color: var(--teem-give-primary);

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

    font-weight: 800;

    line-height: 1.15;
}


.teem-give-introduction > p {

    margin: 0;

    color: var(--teem-give-muted);

    font-size: 1rem;

    line-height: 1.9;
}


/* =========================================================
   SCRIPTURE
========================================================= */

.teem-give-scripture {

    position: relative;

    margin-top: 35px;

    padding: 28px 30px;

    border-left: 4px solid var(--teem-give-accent);

    border-radius: 0 15px 15px 0;

    background: var(--teem-give-white);

    box-shadow:
        0 12px 30px rgba(11, 61, 50, 0.06);
}


.teem-give-scripture > i {

    display: block;

    margin-bottom: 10px;

    color: var(--teem-give-accent);

    font-size: 1.5rem;
}


.teem-give-scripture p {

    margin: 0 0 8px;

    color: var(--teem-give-primary);

    font-size: 1.05rem;

    font-style: italic;

    font-weight: 600;
}


.teem-give-scripture span {

    color: var(--teem-give-muted);

    font-size: 0.82rem;

    font-weight: 600;
}


/* =========================================================
   BANK AREA
========================================================= */

.teem-give-bank-area {

    padding: 35px;

    border: 1px solid var(--teem-give-border);

    border-radius: 28px;

    background: var(--teem-give-white);

    box-shadow:
        0 20px 50px rgba(11, 61, 50, 0.07);
}


.teem-give-bank-area-heading {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding-bottom: 25px;

    border-bottom: 1px solid var(--teem-give-border);
}


.teem-give-bank-area-heading span {

    display: block;

    margin-bottom: 6px;

    color: var(--teem-give-accent);

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


.teem-give-bank-area-heading h3 {

    margin: 0;

    color: var(--teem-give-primary);

    font-size: 1.4rem;

    font-weight: 800;
}


.teem-give-bank-area-icon {

    flex: 0 0 52px;

    width: 52px;

    height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 15px;

    background: rgba(11, 61, 50, 0.08);

    color: var(--teem-give-primary);

    font-size: 1.3rem;
}


.teem-give-bank-intro {

    margin: 22px 0 30px;

    color: var(--teem-give-muted);

    font-size: 0.9rem;

    line-height: 1.75;
}


/* =========================================================
   CURRENCY HEADING
========================================================= */

.teem-give-currency-heading {

    display: flex;

    align-items: center;

    gap: 14px;

    margin: 30px 0 18px;
}


.teem-give-currency-icon {

    flex: 0 0 45px;

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    background: var(--teem-give-light);

    color: var(--teem-give-primary);

    font-size: 1.15rem;
}


.teem-give-currency-heading span {

    display: block;

    margin-bottom: 3px;

    color: var(--teem-give-muted);

    font-size: 0.65rem;

    font-weight: 800;

    letter-spacing: 1.2px;
}


.teem-give-currency-heading strong {

    display: block;

    color: var(--teem-give-primary);

    font-size: 1.1rem;

    font-weight: 800;
}


.teem-give-usd-heading {

    margin-top: 45px;
}


/* =========================================================
   BANK GRID
========================================================= */

.teem-give-bank-grid {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
}


.teem-give-usd-grid {

    grid-template-columns: minmax(0, 1fr);
}


/* =========================================================
   ACCOUNT CARD
========================================================= */

.teem-give-account-card {

    min-width: 0;

    padding: 23px;

    border: 1px solid var(--teem-give-border);

    border-radius: 19px;

    background: #fcfdfc;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-give-account-card:hover {

    transform: translateY(-4px);

    border-color: rgba(11, 61, 50, 0.25);

    box-shadow:
        0 14px 35px rgba(11, 61, 50, 0.08);
}


.teem-give-account-card-usd {

    max-width: 100%;
}


/* =========================================================
   ACCOUNT CARD TOP
========================================================= */

.teem-give-account-card-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 20px;
}


.teem-give-account-bank-icon {

    width: 43px;

    height: 43px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    background: rgba(11, 61, 50, 0.08);

    color: var(--teem-give-primary);

    font-size: 1.05rem;
}


.teem-give-currency-badge {

    padding: 5px 9px;

    border-radius: 20px;

    background: var(--teem-give-light);

    color: var(--teem-give-primary);

    font-size: 0.63rem;

    font-weight: 800;

    letter-spacing: 0.8px;
}


/* =========================================================
   ACCOUNT CONTENT
========================================================= */

.teem-give-account-label {

    display: block;

    margin-bottom: 5px;

    color: var(--teem-give-muted);

    font-size: 0.63rem;

    font-weight: 800;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.teem-give-account-content h4 {

    margin: 0 0 19px;

    color: var(--teem-give-primary);

    font-size: 1.08rem;

    font-weight: 800;
}


.teem-give-account-content p {

    min-height: 42px;

    margin: 0 0 19px;

    color: var(--teem-give-text);

    font-size: 0.86rem;

    font-weight: 600;

    line-height: 1.5;
}


/* =========================================================
   ACCOUNT NUMBER
========================================================= */

.teem-give-account-number-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 10px;

    padding: 10px 10px 10px 13px;

    border: 1px solid var(--teem-give-border);

    border-radius: 12px;

    background: var(--teem-give-white);
}


.teem-give-account-number-row strong {

    min-width: 0;

    color: var(--teem-give-primary);

    font-size: 0.96rem;

    letter-spacing: 0.8px;

    word-break: break-all;
}


/* =========================================================
   COPY BUTTON
========================================================= */

.teem-give-copy-button {

    flex: 0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    padding: 8px 11px;

    border: 1px solid var(--teem-give-border);

    border-radius: 9px;

    background: var(--teem-give-white);

    color: var(--teem-give-primary);

    font-size: 0.7rem;

    font-weight: 750;

    cursor: pointer;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease;
}


.teem-give-copy-button:hover {

    transform: translateY(-2px);

    border-color: var(--teem-give-primary);

    background: var(--teem-give-primary);

    color: var(--teem-give-white);
}


/* =========================================================
   BANK NOTE
========================================================= */

.teem-give-bank-note {

    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-top: 25px;

    padding: 17px;

    border-radius: 13px;

    background: #f4f7f5;
}


.teem-give-bank-note > i {

    flex: 0 0 auto;

    margin-top: 2px;

    color: var(--teem-give-accent);
}


.teem-give-bank-note p {

    margin: 0;

    color: var(--teem-give-muted);

    font-size: 0.78rem;

    line-height: 1.65;
}


/* =========================================================
   CONFIRMATION SECTION
========================================================= */

.teem-give-confirmation {

    padding: 110px 0;

    background: var(--teem-give-white);
}


.teem-give-confirmation-wrapper {

    max-width: 950px;

    margin: 0 auto;

    padding: 60px;

    border: 1px solid var(--teem-give-border);

    border-radius: 28px;

    background: var(--teem-give-light);

    box-shadow:
        0 20px 55px rgba(11, 61, 50, 0.06);
}


/* =========================================================
   FORM LABEL
========================================================= */

.teem-give-label {

    display: block;

    margin-bottom: 9px;

    color: var(--teem-give-primary);

    font-size: 0.82rem;

    font-weight: 700;
}


/* =========================================================
   FORM INPUTS
========================================================= */

.teem-give-input {

    width: 100%;

    min-height: 54px;

    padding: 13px 16px;

    border: 1px solid var(--teem-give-border);

    border-radius: 12px;

    outline: none;

    background: var(--teem-give-white);

    color: var(--teem-give-text);

    font-size: 0.9rem;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}


.teem-give-input::placeholder {

    color: #a0aaa6;
}


.teem-give-input:focus {

    border-color: var(--teem-give-primary);

    box-shadow:
        0 0 0 4px rgba(11, 61, 50, 0.08);
}


/* =========================================================
   AMOUNT
========================================================= */

.teem-give-amount-wrapper {

    position: relative;
}


.teem-give-amount-wrapper > span {

    position: absolute;

    top: 50%;

    left: 16px;

    transform: translateY(-50%);

    z-index: 2;

    color: var(--teem-give-muted);

    font-size: 0.72rem;

    font-weight: 700;

    pointer-events: none;
}


.teem-give-amount-wrapper
.teem-give-input {

    padding-left: 75px;
}


/* =========================================================
   CHECKBOX
========================================================= */

.teem-give-checkbox {

    display: flex;

    align-items: flex-start;

    gap: 11px;

    padding: 17px;

    border: 1px solid var(--teem-give-border);

    border-radius: 12px;

    background: var(--teem-give-white);

    color: var(--teem-give-muted);

    font-size: 0.85rem;

    line-height: 1.5;

    cursor: pointer;
}


.teem-give-checkbox input {

    flex: 0 0 auto;

    width: 18px;

    height: 18px;

    margin-top: 1px;

    accent-color: var(--teem-give-primary);
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.teem-give-submit {

    width: 100%;

    min-height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    padding: 15px 25px;

    border: 0;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            var(--teem-give-primary),
            #104e40
        );

    color: var(--teem-give-white);

    font-size: 0.92rem;

    font-weight: 750;

    cursor: pointer;

    box-shadow:
        0 12px 30px rgba(11, 61, 50, 0.16);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        opacity 0.3s ease;
}


.teem-give-submit:hover {

    transform: translateY(-3px);

    box-shadow:
        0 18px 38px rgba(11, 61, 50, 0.22);
}


.teem-give-submit:disabled {

    opacity: 0.75;

    cursor: not-allowed;

    transform: none;
}


/* =========================================================
   WHATSAPP
========================================================= */

.teem-give-whatsapp {

    padding: 0 0 100px;

    background: var(--teem-give-white);
}


.teem-give-whatsapp-card {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    padding: 45px;

    border-radius: 25px;

    background:
        linear-gradient(
            135deg,
            var(--teem-give-primary),
            #104e40
        );

    color: var(--teem-give-white);

    box-shadow:
        0 20px 50px rgba(11, 61, 50, 0.15);
}


.teem-give-whatsapp-card > div > span {

    display: block;

    margin-bottom: 9px;

    color: var(--teem-give-accent);

    font-size: 0.7rem;

    font-weight: 800;

    letter-spacing: 1.8px;
}


.teem-give-whatsapp-card h3 {

    margin: 0 0 10px;

    font-size: clamp(1.5rem, 3vw, 2.2rem);

    font-weight: 800;
}


.teem-give-whatsapp-card p {

    max-width: 600px;

    margin: 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 0.9rem;

    line-height: 1.7;
}


.teem-give-whatsapp-button {

    flex: 0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    padding: 14px 22px;

    border-radius: 50px;

    background: var(--teem-give-white);

    color: var(--teem-give-primary);

    text-decoration: none;

    font-size: 0.82rem;

    font-weight: 800;

    white-space: nowrap;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-give-whatsapp-button:hover {

    transform: translateY(-3px);

    color: var(--teem-give-primary);

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .teem-give-introduction {

        position: static;

        padding-right: 0;

    }


    .teem-give-bank-area {

        padding: 28px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-give-hero {

        min-height: 430px;

    }


    .teem-give-hero-container {

        padding-top: 60px;

        padding-bottom: 60px;

    }


    .teem-give-hero h1 {

        font-size: 2.45rem;

        letter-spacing: -1px;

    }


    .teem-give-hero p {

        font-size: 0.95rem;

    }


    .teem-give-selection {

        padding: 75px 0 60px;

    }


    .teem-give-type-card {

        min-height: 135px;

        padding: 22px;

    }


    .teem-give-main {

        padding: 75px 0;

    }


    .teem-give-introduction {

        margin-bottom: 10px;

    }


    .teem-give-bank-area {

        padding: 22px;

        border-radius: 22px;

    }


    .teem-give-bank-area-heading {

        align-items: flex-start;

    }


    .teem-give-bank-area-heading h3 {

        font-size: 1.2rem;

    }


    .teem-give-bank-grid {

        grid-template-columns: 1fr;

    }


    .teem-give-account-card {

        padding: 20px;

    }


    .teem-give-account-number-row {

        align-items: stretch;

        flex-direction: column;

    }


    .teem-give-account-number-row strong {

        text-align: center;

    }


    .teem-give-copy-button {

        width: 100%;

    }


    .teem-give-confirmation {

        padding: 75px 0;

    }


    .teem-give-confirmation-wrapper {

        padding: 30px 20px;

        border-radius: 22px;

    }


    .teem-give-whatsapp {

        padding-bottom: 70px;

    }


    .teem-give-whatsapp-card {

        flex-direction: column;

        align-items: flex-start;

        padding: 30px 24px;

        border-radius: 22px;

    }


    .teem-give-whatsapp-button {

        width: 100%;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 400px) {

    .teem-give-hero h1 {

        font-size: 2.15rem;

    }


    .teem-give-bank-area {

        padding: 18px;

    }


    .teem-give-account-card {

        padding: 18px;

    }


    .teem-give-account-number-row strong {

        font-size: 0.9rem;

    }

}




/* =========================================================
   TEEM COUNSELLING PAGE
========================================================= */

.teem-counselling-hero {
    position: relative;
    min-height: 500px;

    display: flex;
    align-items: center;

    background:
        linear-gradient(
            110deg,
            rgba(4, 31, 25, 0.95),
            rgba(8, 61, 49, 0.84),
            rgba(8, 61, 49, 0.65)
        ),
        url("../images/counselling-hero.jpg");

    background-size: cover;
    background-position: center;

    overflow: hidden;
}


.teem-counselling-hero-overlay {
    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(201, 162, 39, 0.16),
            transparent 35%
        );
}


.teem-counselling-hero-container {
    position: relative;
    z-index: 2;

    padding-top: 80px;
    padding-bottom: 80px;
}


.teem-counselling-hero-content {
    max-width: 780px;
}


.teem-counselling-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    margin-bottom: 20px;

    color: #c9a227;

    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}


.teem-counselling-eyebrow i {
    font-size: 1rem;
}


.teem-counselling-hero h1 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(2.7rem, 6vw, 5rem);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -2px;
}


.teem-counselling-hero h1 span {
    display: block;
    color: #c9a227;
}


.teem-counselling-hero p {
    max-width: 650px;

    margin: 25px 0 30px;

    color: rgba(255, 255, 255, 0.82);

    font-size: 1.05rem;
    line-height: 1.8;
}


.teem-counselling-hero-button {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    padding: 14px 22px;

    border-radius: 10px;

    background: #ffffff;
    color: #0b3d32;

    font-size: 0.88rem;
    font-weight: 750;

    text-decoration: none;

    transition: 0.3s ease;
}


.teem-counselling-hero-button:hover {
    transform: translateY(-3px);

    color: #0b3d32;

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   INTRODUCTION
========================================================= */

.teem-counselling-intro {
    padding: 100px 0 90px;

    background: #ffffff;
}


.teem-counselling-section-heading {
    max-width: 750px;

    margin: 0 auto 55px;

    text-align: center;
}


.teem-counselling-section-heading > span {
    display: block;

    margin-bottom: 12px;

    color: #c9a227;

    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}


.teem-counselling-section-heading h2 {
    margin: 0 0 18px;

    color: #0b3d32;

    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
}


.teem-counselling-section-heading h2 span {
    color: #c9a227;
}


.teem-counselling-section-heading p {
    margin: 0;

    color: #6d7773;

    line-height: 1.85;
}


/* =========================================================
   CARE CARDS
========================================================= */

.teem-counselling-care-card {
    height: 100%;

    padding: 35px 30px;

    border: 1px solid #e5e9e6;
    border-radius: 20px;

    background: #ffffff;

    box-shadow: 0 12px 35px rgba(11, 61, 50, 0.06);

    transition: 0.35s ease;
}


.teem-counselling-care-card:hover {
    transform: translateY(-7px);

    box-shadow: 0 20px 45px rgba(11, 61, 50, 0.11);
}


.teem-counselling-care-icon {
    width: 58px;
    height: 58px;

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

    margin-bottom: 22px;

    border-radius: 15px;

    background: rgba(11, 61, 50, 0.08);

    color: #0b3d32;

    font-size: 1.35rem;
}


.teem-counselling-care-card h3 {
    margin: 0 0 12px;

    color: #0b3d32;

    font-size: 1.15rem;
    font-weight: 750;
}


.teem-counselling-care-card p {
    margin: 0;

    color: #6d7773;

    font-size: 0.9rem;
    line-height: 1.75;
}


/* =========================================================
   BOOKING SECTION
========================================================= */

.teem-counselling-booking {
    padding: 100px 0;

    background: #f7f8f5;
}


.teem-counselling-booking-info {
    position: sticky;
    top: 110px;
}


.teem-counselling-small-label {
    display: block;

    margin-bottom: 12px;

    color: #c9a227;

    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}


.teem-counselling-booking-info h2 {
    margin: 0 0 20px;

    color: #0b3d32;

    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 800;
    line-height: 1.15;
}


.teem-counselling-booking-info h2 span {
    color: #c9a227;
}


.teem-counselling-booking-info > p {
    margin: 0;

    color: #6d7773;

    line-height: 1.85;
}


/* =========================================================
   PROCESS
========================================================= */

.teem-counselling-process {
    margin-top: 35px;
}


.teem-counselling-process-item {
    display: flex;
    gap: 16px;

    margin-bottom: 24px;
}


.teem-counselling-process-number {
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

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

    border-radius: 50%;

    background: #0b3d32;
    color: #ffffff;

    font-size: 0.7rem;
    font-weight: 800;
}


.teem-counselling-process-item h4 {
    margin: 0 0 5px;

    color: #0b3d32;

    font-size: 0.95rem;
    font-weight: 750;
}


.teem-counselling-process-item p {
    margin: 0;

    color: #737d79;

    font-size: 0.82rem;
    line-height: 1.6;
}


/* =========================================================
   FORM CARD
========================================================= */

.teem-counselling-form-card {
    padding: 40px;

    border: 1px solid #e2e7e3;
    border-radius: 24px;

    background: #ffffff;

    box-shadow: 0 20px 50px rgba(11, 61, 50, 0.08);
}


.teem-counselling-form-heading {
    margin-bottom: 30px;
}


.teem-counselling-form-heading span {
    color: #c9a227;

    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 1.7px;
    text-transform: uppercase;
}


.teem-counselling-form-heading h3 {
    margin: 8px 0;

    color: #0b3d32;

    font-size: 1.7rem;
    font-weight: 800;
}


.teem-counselling-form-heading p {
    margin: 0;

    color: #77807d;

    font-size: 0.88rem;
}


/* =========================================================
   FORM
========================================================= */

.teem-counselling-form-group {
    margin-bottom: 20px;
}


.teem-counselling-form-group label {
    display: block;

    margin-bottom: 8px;

    color: #0b3d32;

    font-size: 0.8rem;
    font-weight: 700;
}


.teem-counselling-form-group label span {
    color: #c9a227;
}


.teem-counselling-input {
    width: 100%;
    min-height: 52px;

    padding: 12px 15px;

    border: 1px solid #dfe5e1;
    border-radius: 10px;

    outline: none;

    background: #ffffff;

    color: #26332f;

    font-size: 0.88rem;

    transition: 0.25s ease;
}


.teem-counselling-input:focus {
    border-color: #0b3d32;

    box-shadow: 0 0 0 4px rgba(11, 61, 50, 0.07);
}


.teem-counselling-textarea {
    min-height: 130px;

    resize: vertical;
}


/* =========================================================
   MEETING METHODS
========================================================= */

.teem-counselling-method-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}


.teem-counselling-method-option {
    position: relative;

    cursor: pointer;
}


.teem-counselling-method-option input {
    position: absolute;

    opacity: 0;
}


.teem-counselling-method-option span {
    min-height: 55px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 10px;

    border: 1px solid #dfe5e1;
    border-radius: 10px;

    color: #5f6965;

    font-size: 0.78rem;
    font-weight: 650;

    transition: 0.25s ease;
}


.teem-counselling-method-option input:checked + span {
    border-color: #0b3d32;

    background: rgba(11, 61, 50, 0.06);

    color: #0b3d32;
}


.teem-counselling-method-option span i {
    font-size: 1rem;
}


/* =========================================================
   NOTICE
========================================================= */

.teem-counselling-notice {
    display: flex;
    gap: 12px;

    margin: 10px 0 25px;
    padding: 15px;

    border-radius: 10px;

    background: #f5f7f5;
}


.teem-counselling-notice > i {
    flex-shrink: 0;

    color: #c9a227;
}


.teem-counselling-notice p {
    margin: 0;

    color: #727c78;

    font-size: 0.75rem;
    line-height: 1.6;
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.teem-counselling-submit {
    width: 100%;
    min-height: 55px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    border: 0;
    border-radius: 10px;

    background: #0b3d32;
    color: #ffffff;

    font-size: 0.88rem;
    font-weight: 750;

    cursor: pointer;

    transition: 0.3s ease;
}


.teem-counselling-submit:hover {
    transform: translateY(-2px);

    background: #062a23;

    box-shadow: 0 12px 25px rgba(11, 61, 50, 0.18);
}


.teem-counselling-submit:disabled {
    opacity: 0.75;

    cursor: wait;

    transform: none;
}


.teem-counselling-spinner {
    display: none;

    width: 18px;
    height: 18px;

    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;

    border-radius: 50%;

    animation: teemCounsellingSpin 0.7s linear infinite;
}


.teem-counselling-submit.is-loading
.teem-counselling-spinner {
    display: inline-block;
}


.teem-counselling-submit.is-loading
.teem-counselling-submit-text {
    display: none;
}


@keyframes teemCounsellingSpin {

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   WHATSAPP CONTACT
========================================================= */

.teem-counselling-contact {
    padding: 0 0 100px;

    background: #f7f8f5;
}


.teem-counselling-contact-card {
    display: flex;
    align-items: center;
    gap: 25px;

    padding: 40px 45px;

    border-radius: 22px;

    background: #0b3d32;
}


.teem-counselling-contact-icon {
    flex: 0 0 58px;

    width: 58px;
    height: 58px;

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

    border-radius: 15px;

    background: rgba(255, 255, 255, 0.1);

    color: #c9a227;

    font-size: 1.4rem;
}


.teem-counselling-contact-content {
    flex: 1;
}


.teem-counselling-contact-content > span {
    color: #c9a227;

    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}


.teem-counselling-contact-content h3 {
    margin: 5px 0;

    color: #ffffff;

    font-size: 1.35rem;
    font-weight: 750;
}


.teem-counselling-contact-content p {
    margin: 0;

    color: rgba(255, 255, 255, 0.68);

    font-size: 0.84rem;
}


.teem-counselling-whatsapp-button {
    flex-shrink: 0;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 13px 20px;

    border-radius: 9px;

    background: #ffffff;
    color: #0b3d32;

    font-size: 0.82rem;
    font-weight: 750;

    text-decoration: none;

    transition: 0.3s ease;
}


.teem-counselling-whatsapp-button:hover {
    transform: translateY(-2px);

    color: #0b3d32;
}


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

@media (max-width: 991.98px) {

    .teem-counselling-booking-info {
        position: static;
    }

}


@media (max-width: 767.98px) {

    .teem-counselling-hero {
        min-height: 430px;

        background-position: center;
    }


    .teem-counselling-hero-container {
        padding-top: 60px;
        padding-bottom: 60px;
    }


    .teem-counselling-hero h1 {
        font-size: 2.6rem;
        letter-spacing: -1px;
    }


    .teem-counselling-hero p {
        font-size: 0.92rem;
    }


    .teem-counselling-intro,
    .teem-counselling-booking {
        padding: 70px 0;
    }


    .teem-counselling-form-card {
        padding: 27px 20px;

        border-radius: 18px;
    }


    .teem-counselling-method-grid {
        grid-template-columns: 1fr;
    }


    .teem-counselling-contact {
        padding-bottom: 70px;
    }


    .teem-counselling-contact-card {
        align-items: flex-start;
        flex-direction: column;

        padding: 30px 25px;
    }


    .teem-counselling-whatsapp-button {
        width: 100%;

        justify-content: center;
    }

}


@media (max-width: 420px) {

    .teem-counselling-hero h1 {
        font-size: 2.25rem;
    }


    .teem-counselling-form-card {
        padding: 23px 16px;
    }


    .teem-counselling-process-item {
        gap: 12px;
    }

}


/* =========================================================
   COUNSELLING SUCCESS PAGE
========================================================= */

.teem-counselling-success {
    min-height: 75vh;

    display: flex;
    align-items: center;

    padding: 100px 0;

    background: #f7f8f5;
}


.teem-counselling-success-card {
    max-width: 680px;

    margin: 0 auto;
    padding: 55px 45px;

    text-align: center;

    border: 1px solid #e3e8e4;
    border-radius: 24px;

    background: #ffffff;

    box-shadow: 0 20px 55px rgba(11, 61, 50, 0.08);
}


.teem-counselling-success-icon {
    width: 72px;
    height: 72px;

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

    margin: 0 auto 25px;

    border-radius: 50%;

    background: rgba(11, 61, 50, 0.09);

    color: #0b3d32;

    font-size: 2rem;
}


.teem-counselling-success-label {
    display: block;

    margin-bottom: 10px;

    color: #c9a227;

    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}


.teem-counselling-success-card h1 {
    margin: 0 0 18px;

    color: #0b3d32;

    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
}


.teem-counselling-success-card > p {
    max-width: 560px;

    margin: 0 auto 30px;

    color: #6d7773;

    font-size: 0.95rem;
    line-height: 1.8;
}


.teem-counselling-reference {
    display: inline-flex;
    flex-direction: column;
    gap: 5px;

    margin-bottom: 30px;
    padding: 16px 25px;

    border-radius: 12px;

    background: #f4f6f4;
}


.teem-counselling-reference span {
    color: #78817d;

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}


.teem-counselling-reference strong {
    color: #0b3d32;

    font-size: 1.1rem;
    letter-spacing: 1px;
}


.teem-counselling-success-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;

    flex-wrap: wrap;
}


.teem-counselling-success-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 13px 20px;

    border-radius: 9px;

    background: #0b3d32;
    color: #ffffff;

    font-size: 0.82rem;
    font-weight: 700;

    text-decoration: none;

    transition: 0.3s ease;
}


.teem-counselling-success-button:hover {
    transform: translateY(-2px);

    background: #062a23;

    color: #ffffff;
}


.teem-counselling-success-secondary {
    padding: 13px 20px;

    color: #0b3d32;

    font-size: 0.82rem;
    font-weight: 700;

    text-decoration: none;
}


.teem-counselling-success-secondary:hover {
    color: #c9a227;
}


@media (max-width: 575.98px) {

    .teem-counselling-success {
        padding: 70px 15px;
    }

    .teem-counselling-success-card {
        padding: 40px 22px;

        border-radius: 18px;
    }

    .teem-counselling-success-actions {
        flex-direction: column;
    }

    .teem-counselling-success-button,
    .teem-counselling-success-secondary {
        width: 100%;

        justify-content: center;

        text-align: center;
    }

}



/* =========================================================
   BLOG PAGE
========================================================= */

.teem-blog-page {
    padding: 110px 0;
    background: #f7f8f5;
}


/* =========================================================
   BLOG HEADER
========================================================= */

.teem-blog-header {
    max-width: 720px;
    margin: 0 auto 60px;
    text-align: center;
}

.teem-blog-header h1 {
    margin: 10px 0 15px;

    color: #0b3d32;

    font-size: clamp(2.2rem, 5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.1;
}

.teem-blog-header p {
    max-width: 620px;
    margin: 0 auto;

    color: #6d7773;

    line-height: 1.8;
}


/* =========================================================
   FEATURED POST
========================================================= */

.teem-blog-featured {
    margin-bottom: 75px;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e5ebe7;

    border-radius: 22px;

    box-shadow: 0 18px 50px rgba(11, 61, 50, 0.07);
}


/* FEATURED IMAGE */

.teem-blog-featured-image {
    height: 100%;
    min-height: 380px;
}

.teem-blog-featured-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.teem-blog-image-placeholder {
    display: flex;

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

    width: 100%;
    height: 100%;

    min-height: 380px;

    background: #edf2ef;

    color: #0b3d32;

    font-size: 4rem;
}


/* FEATURED CONTENT */

.teem-blog-featured-content {
    display: flex;

    flex-direction: column;
    justify-content: center;

    height: 100%;

    padding: 50px;
}


.teem-blog-category {
    display: inline-block;

    width: fit-content;

    margin-bottom: 18px;

    padding: 7px 12px;

    border-radius: 50px;

    background: #edf3ef;

    color: #0b3d32;

    font-size: 0.68rem;

    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 0.06em;
}


.teem-blog-featured-content h2 {
    margin: 0 0 15px;

    color: #0b3d32;

    font-size: clamp(1.8rem, 3vw, 2.6rem);

    font-weight: 800;

    line-height: 1.2;
}


.teem-blog-date {
    display: flex;

    align-items: center;

    gap: 7px;

    margin-bottom: 20px;

    color: #8a938f;

    font-size: 0.78rem;
}


.teem-blog-date i {
    color: #c99b35;
}


.teem-blog-featured-content p {
    margin-bottom: 28px;

    color: #606b66;

    font-size: 0.93rem;

    line-height: 1.85;
}


/* =========================================================
   READ BUTTON
========================================================= */

.teem-blog-read-button {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    width: fit-content;

    padding: 12px 20px;

    border-radius: 8px;

    background: #0b3d32;

    color: #ffffff;

    font-size: 0.78rem;

    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}

.teem-blog-read-button:hover {
    transform: translateX(3px);

    background: #145445;

    color: #ffffff;
}


/* =========================================================
   LATEST HEADER
========================================================= */

.teem-blog-latest-header {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    margin-bottom: 30px;
}


.teem-blog-latest-header h2 {
    margin: 8px 0 0;

    color: #0b3d32;

    font-size: 2rem;

    font-weight: 800;
}


/* =========================================================
   BLOG CARD
========================================================= */

.teem-blog-card {
    height: 100%;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e5ebe7;

    border-radius: 17px;

    box-shadow: 0 10px 30px rgba(11, 61, 50, 0.05);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.teem-blog-card:hover {
    transform: translateY(-6px);

    box-shadow: 0 18px 40px rgba(11, 61, 50, 0.09);
}


/* CARD IMAGE */

.teem-blog-card-image {
    position: relative;

    height: 220px;

    overflow: hidden;
}


.teem-blog-card-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.5s ease;
}


.teem-blog-card:hover
.teem-blog-card-image img {
    transform: scale(1.04);
}


.teem-blog-card-placeholder {
    display: flex;

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

    width: 100%;
    height: 100%;

    background: #edf2ef;

    color: #0b3d32;

    font-size: 3rem;
}


/* CARD CATEGORY */

.teem-blog-card-category {
    position: absolute;

    top: 15px;
    left: 15px;

    max-width: calc(100% - 30px);

    padding: 6px 10px;

    border-radius: 50px;

    background: rgba(255, 255, 255, 0.94);

    color: #0b3d32;

    font-size: 0.62rem;

    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 0.04em;
}


/* CARD CONTENT */

.teem-blog-card-content {
    padding: 23px;
}


.teem-blog-card-date {
    display: block;

    margin-bottom: 9px;

    color: #8a938f;

    font-size: 0.7rem;
}


.teem-blog-card-date i {
    margin-right: 4px;

    color: #c99b35;
}


.teem-blog-card-content h3 {
    margin: 0 0 12px;

    color: #0b3d32;

    font-size: 1.12rem;

    font-weight: 750;

    line-height: 1.4;
}


.teem-blog-card-content p {
    margin: 0 0 18px;

    color: #68736e;

    font-size: 0.84rem;

    line-height: 1.75;
}


/* CARD LINK */

.teem-blog-card-link {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #0b3d32;

    font-size: 0.76rem;

    font-weight: 750;

    text-decoration: none;
}


.teem-blog-card-link:hover {
    color: #c99b35;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.teem-blog-empty {
    padding: 70px 20px;

    text-align: center;

    background: #ffffff;

    border: 1px solid #e5ebe7;

    border-radius: 20px;
}


.teem-blog-empty i {
    color: #c99b35;

    font-size: 3rem;
}


.teem-blog-empty h3 {
    margin: 15px 0 10px;

    color: #0b3d32;
}


.teem-blog-empty p {
    margin: 0;

    color: #7b8580;
}


/* =========================================================
   BLOG DETAIL
========================================================= */

.teem-blog-detail-page {
    padding: 110px 0;

    background: #f7f8f5;
}


.teem-blog-detail {
    max-width: 900px;

    margin: 0 auto;
}


.teem-blog-detail-category {
    display: block;

    width: fit-content;

    margin: 0 auto 18px;

    padding: 7px 13px;

    border-radius: 50px;

    background: #edf3ef;

    color: #0b3d32;

    font-size: 0.68rem;

    font-weight: 800;

    text-transform: uppercase;
}


.teem-blog-detail h1 {
    max-width: 850px;

    margin: 0 auto 15px;

    color: #0b3d32;

    font-size: clamp(2.2rem, 5vw, 4rem);

    font-weight: 800;

    line-height: 1.12;

    text-align: center;
}


.teem-blog-detail-meta {
    display: flex;

    justify-content: center;

    margin-bottom: 45px;

    color: #7d8783;

    font-size: 0.8rem;
}


.teem-blog-detail-meta i {
    margin-right: 5px;

    color: #c99b35;
}


/* DETAIL IMAGE */

.teem-blog-detail-image {
    width: 100%;

    max-height: 520px;

    margin-bottom: 45px;

    overflow: hidden;

    border-radius: 22px;

    box-shadow: 0 15px 40px rgba(11, 61, 50, 0.08);
}


.teem-blog-detail-image img {
    display: block;

    width: 100%;
    height: auto;

    max-height: 520px;

    object-fit: cover;
}


/* DETAIL CONTENT */

.teem-blog-detail-content {
    padding: 0 30px;
}


.teem-blog-detail-excerpt {
    margin-bottom: 30px;

    color: #52605a;

    font-size: 1.12rem;

    font-weight: 600;

    line-height: 1.8;
}


.teem-blog-detail-body {
    color: #596560;

    font-size: 1rem;

    line-height: 2;
}


.teem-blog-detail-body p {
    margin-bottom: 22px;
}


/* DETAIL FOOTER */

.teem-blog-detail-footer {
    margin-top: 50px;

    padding-top: 25px;

    border-top: 1px solid #e1e7e3;
}


.teem-blog-back-button {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #0b3d32;

    font-size: 0.8rem;

    font-weight: 750;

    text-decoration: none;
}


.teem-blog-back-button:hover {
    color: #c99b35;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-blog-page {
        padding: 75px 15px;
    }


    .teem-blog-featured {
        border-radius: 17px;
    }


    .teem-blog-featured-image,
    .teem-blog-image-placeholder {
        min-height: 250px;
        height: 250px;
    }


    .teem-blog-featured-content {
        padding: 30px 25px;
    }


    .teem-blog-featured-content h2 {
        font-size: 1.8rem;
    }


    .teem-blog-card-image {
        height: 210px;
    }


    .teem-blog-detail-page {
        padding: 75px 15px;
    }


    .teem-blog-detail-content {
        padding: 0;
    }


    .teem-blog-detail-image {
        border-radius: 15px;
    }

}


/* =========================================================
   RESOURCES PAGE
========================================================= */

.teem-resources-page {
    padding: 40px 0;
    background: #f8f9fa;
}


/* HEADER */

.teem-resources-header {
    max-width: 760px;
    margin: 0 auto 40px;
    text-align: center;
}

.teem-resources-header h1 {
    margin: 15px 0;
    font-size: clamp(2.2rem, 5vw, 4rem);
    font-weight: 800;
}

.teem-resources-header p {
    max-width: 650px;
    margin: 0 auto;
    color: #6c757d;
    line-height: 1.8;
}


/* SEARCH */

.teem-resource-search-form {
    max-width: 720px;
    margin: 0 auto 40px;
}

.teem-resource-search-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 8px 7px 18px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 50px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.05);
}

.teem-resource-search-box i {
    color: #777;
}

.teem-resource-search-box input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
}

.teem-resource-search-box button {
    border: 0;
    border-radius: 40px;
    padding: 11px 22px;
    font-weight: 600;
}


/* CATEGORIES */

.teem-resource-categories {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 80px;
}

.teem-resource-category-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 18px;
    border: 1px solid #e3e5e8;
    border-radius: 50px;
    background: #fff;
    color: #333;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
    transition: 0.3s ease;
}

.teem-resource-category-link:hover,
.teem-resource-category-link.active {
    transform: translateY(-2px);
}


/* SECTION HEADINGS */

.teem-resources-heading {
    margin-bottom: 30px;
}

.teem-resources-heading h2 {
    margin-top: 8px;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 800;
}

.teem-resources-featured {
    margin-bottom: 80px;
}


/* RESOURCE CARD */

.teem-resource-card {
    height: 100%;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 24px;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.05);
    transition: transform 0.35s ease,
                box-shadow 0.35s ease;
}

.teem-resource-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.09);
}


/* CARD IMAGE */

.teem-resource-card-image {
    position: relative;
    height: 230px;
    overflow: hidden;
}

.teem-resource-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.teem-resource-card:hover
.teem-resource-card-image img {
    transform: scale(1.04);
}


/* PLACEHOLDER */

.teem-resource-card-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    background: #eef0f2;
}


/* TYPE BADGE */

.teem-resource-card-type {
    position: absolute;
    left: 16px;
    bottom: 16px;
    padding: 7px 12px;
    border-radius: 30px;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    backdrop-filter: blur(8px);
}


/* CARD CONTENT */

.teem-resource-card-content {
    padding: 25px;
}

.teem-resource-card-content h3 {
    margin-bottom: 12px;
    font-size: 1.25rem;
    font-weight: 750;
}

.teem-resource-card-content p {
    min-height: 52px;
    margin-bottom: 22px;
    color: #6c757d;
    line-height: 1.7;
}


/* BUTTON */

.teem-resource-card-button,
.teem-resource-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-weight: 700;
}

.teem-resource-card-button i {
    transition: transform 0.3s ease;
}

.teem-resource-card-button:hover i {
    transform: translateX(5px);
}


/* EMPTY STATE */

.teem-resources-empty {
    padding: 70px 25px;
    text-align: center;
    background: #fff;
    border-radius: 24px;
    border: 1px solid #e9ecef;
}

.teem-resources-empty i {
    font-size: 3rem;
    margin-bottom: 20px;
}

.teem-resources-empty h3 {
    font-weight: 750;
}

.teem-resources-empty p {
    color: #6c757d;
}


/* =========================================================
   RESOURCE DETAIL
========================================================= */

.teem-resource-detail-page {
    padding: 120px 0;
    background: #f8f9fa;
}

.teem-resource-detail {
    max-width: 900px;
    margin: auto;
    padding: 45px;
    background: #fff;
    border-radius: 28px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.06);
}

.teem-resource-detail-type {
    display: inline-block;
    margin-bottom: 15px;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.teem-resource-detail h1 {
    margin-bottom: 35px;
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 800;
}


/* DETAIL IMAGE */

.teem-resource-detail-image {
    margin-bottom: 35px;
    overflow: hidden;
    border-radius: 20px;
}

.teem-resource-detail-image img {
    display: block;
    width: 100%;
    max-height: 550px;
    object-fit: cover;
}


/* DESCRIPTION */

.teem-resource-detail-description {
    color: #495057;
    font-size: 1.05rem;
    line-height: 1.9;
}


/* ACTION */

.teem-resource-detail-action {
    margin-top: 35px;
}

.teem-resource-youtube-button,
.teem-resource-download-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 24px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
}


/* FOOTER */

.teem-resource-detail-footer {
    margin-top: 45px;
    padding-top: 25px;
    border-top: 1px solid #eee;
}

.teem-resource-back-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-weight: 600;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-resources-page,
    .teem-resource-detail-page {
        padding: 90px 0;
    }

    .teem-resource-categories {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 8px;
    }

    .teem-resource-category-link {
        flex: 0 0 auto;
    }

    .teem-resource-search-box {
        border-radius: 20px;
        flex-wrap: wrap;
        padding: 12px;
    }

    .teem-resource-search-box input {
        width: calc(100% - 40px);
    }

    .teem-resource-search-box button {
        width: 100%;
    }

    .teem-resource-detail {
        padding: 28px 20px;
        border-radius: 20px;
    }

    .teem-resource-detail-image img {
        max-height: 350px;
    }

}



/* =========================================================
   SCROLL TO TOP BUTTON
========================================================= */

.teem-scroll-top {
    position: fixed;
    right: 25px;
    bottom: 25px;

    width: 48px;
    height: 48px;

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

    border: none;
    border-radius: 50%;

    background: #111;
    color: #fff;

    font-size: 1.1rem;

    cursor: pointer;

    z-index: 999;

    opacity: 0;
    visibility: hidden;

    transform: translateY(20px);

    transition:
        opacity 0.3s ease,
        visibility 0.3s ease,
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


/* Visible state */

.teem-scroll-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* Hover */

.teem-scroll-top:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
}


/* Icon */

.teem-scroll-top i {
    transition: transform 0.3s ease;
}

.teem-scroll-top:hover i {
    transform: translateY(-2px);
}


/* Mobile */

@media (max-width: 576px) {

    .teem-scroll-top {
        width: 44px;
        height: 44px;

        right: 18px;
        bottom: 18px;

        font-size: 1rem;
    }

}


/* =========================================================
   PRIVACY POLICY
========================================================= */

.teem-privacy-page {
    padding: 120px 0;
    background: #f8f9fa;
}


/* HEADER */

.teem-privacy-header {
    max-width: 800px;
    margin: 0 auto 55px;
    text-align: center;
}

.teem-privacy-header h1 {
    margin: 15px 0;
    font-size: clamp(2.3rem, 5vw, 4rem);
    font-weight: 800;
}

.teem-privacy-header p {
    max-width: 650px;
    margin: 0 auto;
    color: #6c757d;
    line-height: 1.8;
}


/* POLICY CARD */

.teem-privacy-card {
    max-width: 950px;
    margin: 0 auto;
    padding: 55px;
    background: #fff;
    border-radius: 28px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.05);
}


/* LAST UPDATED */

.teem-privacy-updated {
    margin-bottom: 45px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
    color: #6c757d;
    font-size: 0.9rem;
}


/* SECTIONS */

.teem-privacy-section {
    margin-bottom: 45px;
}

.teem-privacy-section:last-of-type {
    margin-bottom: 0;
}

.teem-privacy-section h2 {
    margin-bottom: 15px;
    font-size: 1.45rem;
    font-weight: 750;
}

.teem-privacy-section p {
    margin-bottom: 15px;
    color: #555;
    line-height: 1.9;
}

.teem-privacy-section ul {
    margin: 15px 0 0;
    padding-left: 25px;
}

.teem-privacy-section li {
    margin-bottom: 10px;
    color: #555;
    line-height: 1.7;
}


/* FOOTER */

.teem-privacy-footer {
    margin-top: 50px;
    padding-top: 25px;
    border-top: 1px solid #eee;
}

.teem-privacy-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-weight: 700;
    transition: 0.3s ease;
}

.teem-privacy-back:hover {
    transform: translateX(-4px);
}


/* MOBILE */

@media (max-width: 767px) {

    .teem-privacy-page {
        padding: 90px 0;
    }

    .teem-privacy-card {
        padding: 30px 20px;
        border-radius: 20px;
    }

    .teem-privacy-section {
        margin-bottom: 35px;
    }

    .teem-privacy-section h2 {
        font-size: 1.25rem;
    }

}


/* =========================================================
   COOKIE CONSENT BANNER
========================================================= */

.teem-cookie-banner {
    position: fixed;
    left: 24px;
    right: 24px;
    bottom: 24px;

    z-index: 9999;

    max-width: 1100px;
    margin: 0 auto;

    background: rgba(255, 255, 255, 0.97);

    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 20px;

    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.15);

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

    opacity: 0;
    visibility: hidden;

    transform: translateY(30px);

    transition:
        opacity 0.4s ease,
        visibility 0.4s ease,
        transform 0.4s ease;
}


/* Visible state */

.teem-cookie-banner.teem-cookie-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* Content layout */

.teem-cookie-content {
    display: flex;
    align-items: center;

    gap: 20px;

    padding: 22px 24px;
}


/* Cookie icon */

.teem-cookie-icon {
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

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

    border-radius: 14px;

    background: #f5f5f5;

    font-size: 1.35rem;
}


/* Text */

.teem-cookie-text {
    flex: 1;
}

.teem-cookie-text h3 {
    margin: 0 0 6px;

    font-size: 1rem;
    font-weight: 750;
}

.teem-cookie-text p {
    margin: 0 0 7px;

    color: #666;

    font-size: 0.88rem;
    line-height: 1.6;
}

.teem-cookie-policy-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: inherit;

    font-size: 0.82rem;
    font-weight: 700;

    text-decoration: none;
}

.teem-cookie-policy-link:hover {
    text-decoration: underline;
}


/* Actions */

.teem-cookie-actions {
    display: flex;
    align-items: center;

    gap: 10px;

    flex-shrink: 0;
}


/* Buttons */

.teem-cookie-btn {
    min-width: 90px;

    padding: 11px 18px;

    border-radius: 10px;

    font-size: 0.85rem;
    font-weight: 700;

    cursor: pointer;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}


/* Reject */

.teem-cookie-reject {
    border: 1px solid #ddd;

    background: transparent;
}

.teem-cookie-reject:hover {
    background: #f5f5f5;
}


/* Accept */

.teem-cookie-accept {
    border: 1px solid #111;

    background: #111;
    color: #fff;
}

.teem-cookie-accept:hover {
    transform: translateY(-2px);

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-cookie-banner {
        left: 14px;
        right: 14px;
        bottom: 14px;

        border-radius: 18px;
    }


    .teem-cookie-content {
        align-items: flex-start;

        flex-wrap: wrap;

        padding: 20px;
    }


    .teem-cookie-icon {
        width: 42px;
        height: 42px;

        flex-basis: 42px;

        border-radius: 12px;

        font-size: 1.15rem;
    }


    .teem-cookie-text {
        flex: 1;

        min-width: 200px;
    }


    .teem-cookie-text h3 {
        font-size: 0.95rem;
    }


    .teem-cookie-text p {
        font-size: 0.82rem;
    }


    .teem-cookie-actions {
        width: 100%;

        margin-top: 4px;
    }


    .teem-cookie-btn {
        flex: 1;

        padding: 11px 15px;
    }

}



/* =========================================================
   TERMS & CONDITIONS
========================================================= */

.teem-terms-page {
    padding: 120px 0;
    background: #f8f9fa;
}


/* HEADER */

.teem-terms-header {
    max-width: 800px;
    margin: 0 auto 55px;
    text-align: center;
}

.teem-terms-header h1 {
    margin: 15px 0;

    font-size: clamp(2.3rem, 5vw, 4rem);
    font-weight: 800;
}

.teem-terms-header p {
    max-width: 650px;
    margin: 0 auto;

    color: #6c757d;

    line-height: 1.8;
}


/* CARD */

.teem-terms-card {
    max-width: 950px;
    margin: 0 auto;

    padding: 55px;

    background: #fff;

    border-radius: 28px;

    box-shadow:
        0 15px 50px rgba(0, 0, 0, 0.05);
}


/* LAST UPDATED */

.teem-terms-updated {
    margin-bottom: 45px;
    padding-bottom: 20px;

    border-bottom: 1px solid #eee;

    color: #6c757d;

    font-size: 0.9rem;
}


/* SECTIONS */

.teem-terms-section {
    margin-bottom: 45px;
}

.teem-terms-section:last-of-type {
    margin-bottom: 0;
}


.teem-terms-section h2 {
    margin-bottom: 15px;

    font-size: 1.45rem;
    font-weight: 750;
}


.teem-terms-section p {
    margin-bottom: 15px;

    color: #555;

    line-height: 1.9;
}


/* FOOTER */

.teem-terms-footer {
    margin-top: 50px;
    padding-top: 25px;

    border-top: 1px solid #eee;
}


.teem-terms-back {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    text-decoration: none;

    font-weight: 700;

    transition: 0.3s ease;
}


.teem-terms-back:hover {
    transform: translateX(-4px);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-terms-page {
        padding: 90px 0;
    }


    .teem-terms-card {
        padding: 30px 20px;

        border-radius: 20px;
    }


    .teem-terms-section {
        margin-bottom: 35px;
    }


    .teem-terms-section h2 {
        font-size: 1.25rem;
    }


    .teem-terms-section p {
        font-size: 0.95rem;
    }

}




/* =========================================================
   SHARE YOUR TESTIMONY PAGE
========================================================= */

.teem-testimony-submit-page {
    padding: 120px 0;
    background: #f8f9fa;
}


/* =========================================================
   PAGE HEADER
========================================================= */

.teem-testimony-submit-header {
    max-width: 760px;
    margin: 0 auto 50px;

    text-align: center;
}


.teem-testimony-submit-header h1 {
    margin: 15px 0;

    font-size: clamp(2.2rem, 5vw, 3.8rem);
    font-weight: 800;

    line-height: 1.15;
}


.teem-testimony-submit-header p {
    max-width: 650px;

    margin: 0 auto;

    color: #6c757d;

    font-size: 1rem;
    line-height: 1.8;
}


/* =========================================================
   FORM CARD
========================================================= */

.teem-testimony-form-card {
    max-width: 850px;

    margin: 0 auto;

    padding: 45px;

    background: #fff;

    border-radius: 24px;

    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.07);
}


/* =========================================================
   FORM GROUP
========================================================= */

.teem-form-group {
    margin-bottom: 25px;
}


.teem-form-group label {
    display: block;

    margin-bottom: 9px;

    font-size: 0.9rem;
    font-weight: 700;

    color: #222;
}


.teem-form-group label span {
    color: #888;

    font-size: 0.8rem;
    font-weight: 500;
}


/* =========================================================
   INPUTS
========================================================= */

.teem-form-control {
    width: 100%;

    padding: 14px 16px;

    border: 1px solid #ddd;
    border-radius: 12px;

    background: #fff;

    color: #222;

    font-size: 0.92rem;

    outline: none;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}


.teem-form-control:focus {
    border-color: #222;

    box-shadow:
        0 0 0 3px rgba(0, 0, 0, 0.06);
}


.teem-form-control::placeholder {
    color: #aaa;
}


/* =========================================================
   FILE INPUT
========================================================= */

input[type="file"].teem-form-control {
    padding: 11px 14px;

    cursor: pointer;
}


/* =========================================================
   TEXTAREA
========================================================= */

.teem-testimony-textarea {
    min-height: 200px;

    resize: vertical;

    line-height: 1.7;
}


/* =========================================================
   WORD COUNTER
========================================================= */

.teem-word-counter {
    display: flex;

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

    gap: 15px;

    margin-top: 8px;

    color: #888;

    font-size: 0.78rem;
}


.teem-word-counter strong {
    color: #555;

    font-weight: 700;
}


.teem-word-count-error {
    color: #dc3545 !important;
}


/* =========================================================
   FORM HELP
========================================================= */

.teem-form-help {
    display: block;

    margin-top: 7px;

    color: #888;

    font-size: 0.78rem;
}


/* =========================================================
   INFORMATION NOTICE
========================================================= */

.teem-testimony-notice {
    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin: 10px 0 25px;

    padding: 16px 18px;

    border-radius: 12px;

    background: #f7f7f7;
}


.teem-testimony-notice i {
    margin-top: 2px;

    font-size: 1rem;
}


.teem-testimony-notice p {
    margin: 0;

    color: #666;

    font-size: 0.82rem;

    line-height: 1.6;
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.teem-testimony-submit-form-btn {
    width: 100%;

    display: flex;

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

    gap: 10px;

    padding: 15px 20px;

    border: none;
    border-radius: 12px;

    background: #111;
    color: #fff;

    font-size: 0.9rem;
    font-weight: 700;

    cursor: pointer;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        opacity 0.25s ease;
}


.teem-testimony-submit-form-btn:hover {
    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.15);
}


.teem-testimony-submit-form-btn:active {
    transform: translateY(0);
}


.teem-testimony-submit-form-btn:disabled {
    cursor: not-allowed;

    opacity: 0.7;
}


/* =========================================================
   DJANGO FORM ERRORS
========================================================= */

.teem-form-error {
    margin-top: 6px;

    color: #dc3545;

    font-size: 0.8rem;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-testimony-submit-page {
        padding: 90px 0;
    }


    .teem-testimony-submit-header {
        margin-bottom: 35px;
    }


    .teem-testimony-submit-header h1 {
        font-size: 2.2rem;
    }


    .teem-testimony-submit-header p {
        font-size: 0.9rem;
    }


    .teem-testimony-form-card {
        padding: 28px 20px;

        border-radius: 20px;
    }


    .teem-testimony-textarea {
        min-height: 180px;
    }


    .teem-word-counter {
        font-size: 0.75rem;
    }

}




/* =========================================================
   EAZYTECH DEVELOPER CREDIT
========================================================= */

.teem-footer-developer {

    border-top: 1px solid rgba(255, 255, 255, 0.08);

    background: rgba(0, 0, 0, 0.08);
}


.teem-footer-developer-inner {

    min-height: 68px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding: 15px 0;
}


/* =========================================================
   DEVELOPER CREDIT
========================================================= */

.teem-footer-developer-credit {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 7px;

    color: rgba(255, 255, 255, 0.45);

    font-size: 0.72rem;

    line-height: 1.5;
}


.teem-footer-developer-brand {

    color: rgba(255, 255, 255, 0.78);

    font-size: 0.75rem;

    font-weight: 800;

    letter-spacing: 0.3px;

    text-decoration: none;

    transition:
        color 0.25s ease,
        opacity 0.25s ease;
}


.teem-footer-developer-brand:hover {

    color: #c9a227;

    opacity: 1;
}


/* =========================================================
   DEVELOPER CONTACT
========================================================= */

.teem-footer-developer-contact {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 9px;

    color: rgba(255, 255, 255, 0.42);

    font-size: 0.7rem;
}


.teem-footer-developer-label {

    margin-right: 3px;

    color: rgba(255, 255, 255, 0.38);

    font-size: 0.68rem;
}


.teem-footer-developer-link {

    display: inline-flex;

    align-items: center;

    gap: 5px;

    color: rgba(255, 255, 255, 0.62);

    font-size: 0.7rem;

    font-weight: 650;

    text-decoration: none;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.teem-footer-developer-link:hover {

    color: #c9a227;

    transform: translateY(-1px);
}


.teem-footer-developer-link i {

    font-size: 0.75rem;
}


.teem-footer-developer-divider {

    color: rgba(255, 255, 255, 0.2);

    user-select: none;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-footer-developer-inner {

        flex-direction: column;

        justify-content: center;

        gap: 10px;

        padding: 18px 0;

        text-align: center;
    }


    .teem-footer-developer-credit {

        justify-content: center;

    }


    .teem-footer-developer-contact {

        justify-content: center;

    }

}


@media (max-width: 400px) {

    .teem-footer-developer-contact {

        gap: 7px;

    }


    .teem-footer-developer-label {

        width: 100%;

        margin-right: 0;

        margin-bottom: 1px;

    }

}



/* =========================================================
   OUTREACH & IMPACT GALLERY
========================================================= */

.teem-outreach-gallery {
    padding: 110px 0;
    background: #f7f8f6;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.teem-gallery-section-header {
    max-width: 760px;
    margin: 0 auto 55px;
    text-align: center;
}

.teem-gallery-eyebrow {
    display: inline-block;
    margin-bottom: 14px;

    color: #c9a227;

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 2px;
}

.teem-gallery-section-header h2 {
    margin: 0 0 18px;

    color: #0b3d32;

    font-size: clamp(2.2rem, 5vw, 3.8rem);

    font-weight: 850;

    line-height: 1.08;

    letter-spacing: -1px;
}

.teem-gallery-section-header h2 span {
    display: block;
    color: #c9a227;
}

.teem-gallery-section-header p {
    max-width: 680px;

    margin: 0 auto;

    color: #6d7974;

    font-size: 0.95rem;

    line-height: 1.85;
}


/* =========================================================
   GALLERY CARD
========================================================= */

.teem-outreach-card {
    position: relative;

    display: block;

    height: 360px;

    overflow: hidden;

    border-radius: 20px;

    background: #0b3d32;

    text-decoration: none;

    box-shadow:
        0 15px 35px rgba(11, 61, 50, 0.08);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.teem-outreach-card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 25px 50px rgba(11, 61, 50, 0.16);
}


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

.teem-outreach-image {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.6s ease;
}

.teem-outreach-card:hover .teem-outreach-image {
    transform: scale(1.07);
}


/* =========================================================
   OVERLAY
========================================================= */

.teem-outreach-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(3, 20, 16, 0.94) 0%,
            rgba(3, 20, 16, 0.55) 42%,
            rgba(3, 20, 16, 0.05) 78%
        );
}


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

.teem-outreach-content {
    position: absolute;

    right: 24px;
    bottom: 22px;
    left: 24px;

    color: #ffffff;
}

.teem-outreach-content > span {
    display: inline-block;

    margin-bottom: 9px;

    color: #d6b33d;

    font-size: 0.65rem;

    font-weight: 800;

    letter-spacing: 1.4px;

    text-transform: uppercase;
}

.teem-outreach-content h3 {
    margin: 0;

    max-width: 340px;

    color: #ffffff;

    font-size: 1.25rem;

    font-weight: 750;

    line-height: 1.25;
}


/* =========================================================
   VIEW LINK
========================================================= */

.teem-outreach-view {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    margin-top: 15px;

    color: rgba(255,255,255,0.72);

    font-size: 0.72rem;

    font-weight: 700;

    transition:
        color 0.25s ease,
        gap 0.25s ease;
}

.teem-outreach-view i {
    font-size: 0.8rem;
}

.teem-outreach-card:hover .teem-outreach-view {
    gap: 11px;
    color: #ffffff;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .teem-outreach-gallery {
        padding: 90px 0;
    }

    .teem-outreach-card {
        height: 340px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .teem-outreach-gallery {
        padding: 75px 0;
    }

    .teem-gallery-section-header {
        margin-bottom: 40px;
    }

    .teem-gallery-section-header h2 {
        font-size: 2.25rem;
    }

    .teem-gallery-section-header p {
        font-size: 0.88rem;
    }

    .teem-outreach-card {
        height: 320px;

        border-radius: 17px;
    }

    .teem-outreach-content {
        right: 20px;
        bottom: 19px;
        left: 20px;
    }

    .teem-outreach-content h3 {
        font-size: 1.12rem;
    }

}




/* =========================================================
   OTHER MOMENTS AT TEEM
========================================================= */

.teem-other-moments-section {
    position: relative;
    padding: 110px 0;
    background: #f7f8f6;
    overflow: hidden;
}


/* ---------------------------------------------------------
   SECTION HEADING
--------------------------------------------------------- */

.teem-gallery-section-heading {
    max-width: 760px;
    margin: 0 auto 55px;
}

.teem-gallery-eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #3f6b58;
}

.teem-gallery-section-heading h2 {
    margin: 0 0 18px;
    font-size: clamp(2.2rem, 4vw, 3.5rem);
    line-height: 1.1;
    font-weight: 700;
    color: #14251d;
}

.teem-gallery-section-heading p {
    max-width: 680px;
    margin: 0 auto;
    font-size: 1rem;
    line-height: 1.8;
    color: #68736d;
}


/* ---------------------------------------------------------
   FEATURED INTRO IMAGE
--------------------------------------------------------- */

.teem-other-moments-featured {
    margin-bottom: 65px;
}

.teem-other-moments-featured-image {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    border-radius: 24px;
    background: #17241e;
    box-shadow: 0 25px 70px rgba(20, 37, 29, 0.18);
}

.teem-other-moments-featured-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(10, 24, 17, 0.88) 0%,
            rgba(10, 24, 17, 0.68) 38%,
            rgba(10, 24, 17, 0.20) 72%,
            rgba(10, 24, 17, 0.05) 100%
        );
    z-index: 1;
}

.teem-other-moments-featured-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 1s ease;
}

.teem-other-moments-featured:hover img {
    transform: scale(1.025);
}

.teem-other-moments-featured-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    padding: 60px;
}

.teem-other-moments-featured-content {
    max-width: 570px;
}

.teem-other-moments-featured-label {
    display: inline-block;
    margin-bottom: 18px;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.teem-other-moments-featured-content h3 {
    margin: 0;
    color: #fff;
    font-size: clamp(2.2rem, 5vw, 4.2rem);
    line-height: 1.04;
    font-weight: 700;
}

.teem-other-moments-featured-content h3 span {
    display: block;
    color: #d7eadf;
}

.teem-other-moments-featured-content p {
    max-width: 520px;
    margin: 25px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1rem;
    line-height: 1.8;
}

.teem-other-moments-featured-divider {
    width: 65px;
    height: 2px;
    margin: 25px 0 17px;
    background: rgba(255, 255, 255, 0.65);
}

.teem-other-moments-featured-scripture {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9rem;
    font-style: italic;
}


/* ---------------------------------------------------------
   MOMENT CARDS
--------------------------------------------------------- */

.teem-other-moments-grid {
    position: relative;
}

.teem-other-moment-card {
    height: 100%;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(20, 37, 29, 0.07);
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(20, 37, 29, 0.06);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.teem-other-moment-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 20px 50px rgba(20, 37, 29, 0.12);
}


/* ---------------------------------------------------------
   CARD IMAGE
--------------------------------------------------------- */

.teem-other-moment-image {
    position: relative;
    height: 330px;
    overflow: hidden;
    background: #e8ece9;
}

.teem-other-moment-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.teem-other-moment-card:hover .teem-other-moment-image img {
    transform: scale(1.06);
}


/* Image dark overlay */

.teem-other-moment-image::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(8, 18, 13, 0.35),
        transparent 50%
    );
}


/* ---------------------------------------------------------
   VIEW BUTTON
--------------------------------------------------------- */

.teem-other-moment-view {
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 3;

    width: 44px;
    height: 44px;

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

    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;

    background: rgba(10, 25, 18, 0.65);
    backdrop-filter: blur(8px);

    color: #fff;
    cursor: pointer;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.teem-other-moment-view:hover {
    background: #fff;
    color: #183126;
    transform: scale(1.08);
}


/* ---------------------------------------------------------
   CARD CONTENT
--------------------------------------------------------- */

.teem-other-moment-content {
    position: relative;
    padding: 25px 27px 28px;
}

.teem-other-moment-number {
    display: block;
    margin-bottom: 8px;
    color: #6b8878;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
}

.teem-other-moment-content h3 {
    margin: 0 0 10px;
    color: #172920;
    font-size: 1.25rem;
    font-weight: 700;
}

.teem-other-moment-content p {
    margin: 0;
    color: #727d77;
    font-size: 0.92rem;
    line-height: 1.7;
}


/* ---------------------------------------------------------
   CLOSING STATEMENT
--------------------------------------------------------- */

.teem-other-moments-closing {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;

    margin-top: 65px;
    text-align: center;
}

.teem-other-moments-closing-icon {
    width: 38px;
    height: 38px;

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

    border-radius: 50%;
    background: #e3ece7;

    color: #3d6955;
    font-size: 0.85rem;
}

.teem-other-moments-closing p {
    margin: 0;
    color: #68736d;
    font-size: 0.95rem;
}

.teem-other-moments-closing p span {
    color: #183126;
    font-weight: 700;
}


/* ---------------------------------------------------------
   LIGHTBOX
--------------------------------------------------------- */

.teem-other-moments-lightbox {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 18px;
    background: #101613;
}

.teem-other-moments-lightbox-image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 500px;
    background: #101613;
}

.teem-other-moments-lightbox-image-wrap img {
    display: block;
    width: 100%;
    max-height: 78vh;
    object-fit: contain;
}

.teem-other-moments-lightbox-close {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 5;

    width: 42px;
    height: 42px;

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

    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;

    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(8px);

    color: #fff;
    cursor: pointer;
}

.teem-other-moments-lightbox-close:hover {
    background: #fff;
    color: #111;
}

.teem-other-moments-lightbox-caption {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 18px 24px;

    background: #101613;
    color: rgba(255, 255, 255, 0.82);
}

.teem-other-moments-lightbox-caption i {
    margin-top: 3px;
    color: #a9c8b7;
}

.teem-other-moments-lightbox-caption p {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.6;
}


/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */

@media (max-width: 991.98px) {

    .teem-other-moments-section {
        padding: 85px 0;
    }

    .teem-other-moments-featured-image {
        min-height: 520px;
    }

    .teem-other-moments-featured-overlay {
        padding: 45px;
    }

    .teem-other-moment-image {
        height: 300px;
    }
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media (max-width: 767.98px) {

    .teem-other-moments-section {
        padding: 70px 0;
    }

    .teem-gallery-section-heading {
        margin-bottom: 38px;
    }

    .teem-other-moments-featured {
        margin-bottom: 45px;
    }

    .teem-other-moments-featured-image {
        min-height: 520px;
        border-radius: 18px;
    }

    .teem-other-moments-featured-image::after {
        background:
            linear-gradient(
                to bottom,
                rgba(10, 24, 17, 0.18) 0%,
                rgba(10, 24, 17, 0.38) 35%,
                rgba(10, 24, 17, 0.9) 100%
            );
    }

    .teem-other-moments-featured-image img {
        object-position: center;
    }

    .teem-other-moments-featured-overlay {
        align-items: flex-end;
        padding: 30px 25px;
    }

    .teem-other-moments-featured-content h3 {
        font-size: 2.35rem;
    }

    .teem-other-moments-featured-content p {
        font-size: 0.9rem;
        line-height: 1.65;
    }

    .teem-other-moment-image {
        height: 280px;
    }

    .teem-other-moments-closing {
        margin-top: 45px;
    }

    .teem-other-moments-lightbox-image-wrap {
        min-height: 300px;
    }

    .teem-other-moments-lightbox-caption {
        padding: 16px 18px;
    }

}



/* =========================================================
   TEEM — INSTRUMENTALISTS / MUSIC MINISTRY
========================================================= */

.teem-instrumentalists-section {
    position: relative;
    padding: 7rem 0;
    background: #f8f8f5;
    overflow: hidden;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.teem-instrumentalists-heading {
    max-width: 720px;
    margin: 0 auto 3.5rem;
    text-align: center;
}

.teem-instrumentalists-eyebrow {
    display: inline-block;
    margin-bottom: 0.85rem;

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b58a43;
}

.teem-instrumentalists-title {
    margin: 0 0 1rem;

    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.1;
    font-weight: 700;

    color: #102c24;
}

.teem-instrumentalists-intro {
    max-width: 620px;
    margin: 0 auto;

    font-size: 0.98rem;
    line-height: 1.8;

    color: #66736e;
}


/* =========================================================
   GALLERY GRID
========================================================= */

.teem-instrumentalists-gallery {
    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        repeat(3, minmax(0, 0.75fr));

    grid-template-rows:
        250px
        250px
        250px;

    gap: 1rem;
}


/* =========================================================
   IMAGE CARD
========================================================= */

.teem-instrumentalist-card {
    position: relative;

    display: block;

    min-width: 0;
    min-height: 0;

    overflow: hidden;

    border-radius: 18px;

    background: #102c24;

    text-decoration: none;

    cursor: zoom-in;
}

.teem-instrumentalist-card img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-instrumentalist-card:hover img {
    transform: scale(1.06);
    filter: brightness(0.76);
}


/* =========================================================
   LEADING IMAGE
========================================================= */

.teem-instrumentalist-featured {
    grid-column: 1;
    grid-row: 1 / 4;
}

.teem-instrumentalist-featured .teem-instrumentalist-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(5, 22, 18, 0.88) 0%,
            rgba(5, 22, 18, 0.25) 45%,
            rgba(5, 22, 18, 0.05) 100%
        );

    transition: opacity 0.4s ease;
}

.teem-instrumentalist-featured:hover
.teem-instrumentalist-overlay {
    opacity: 0.85;
}

.teem-instrumentalist-featured-content {
    position: absolute;

    left: 2rem;
    right: 2rem;
    bottom: 2rem;

    z-index: 2;
}

.teem-instrumentalist-featured-label {
    display: inline-block;
    margin-bottom: 0.7rem;

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #d0aa67;
}

.teem-instrumentalist-featured-content h3 {
    max-width: 470px;
    margin: 0 0 1rem;

    font-size: clamp(1.5rem, 3vw, 2.4rem);
    line-height: 1.15;
    font-weight: 700;

    color: #ffffff;
}

.teem-instrumentalist-view {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;

    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;

    color: rgba(255, 255, 255, 0.78);
}


/* =========================================================
   SMALL IMAGE ZOOM BUTTON
========================================================= */

.teem-instrumentalist-zoom {
    position: absolute;

    top: 1rem;
    right: 1rem;

    width: 38px;
    height: 38px;

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

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.92);

    color: #102c24;

    font-size: 0.8rem;

    opacity: 0;

    transform: translateY(8px);

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;
}

.teem-instrumentalist-card:hover
.teem-instrumentalist-zoom {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   LIGHTBOX
========================================================= */

.teem-instrumentalist-lightbox {
    overflow: hidden;

    border: 0;
    border-radius: 20px;

    background: #071c17;
}

.teem-instrumentalist-lightbox .modal-header {
    padding: 1.25rem 1.5rem;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.teem-instrumentalist-lightbox .btn-close {
    filter: invert(1);
    opacity: 0.8;
}

.teem-instrumentalist-lightbox-eyebrow {
    display: block;
    margin-bottom: 0.25rem;

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.17em;
    text-transform: uppercase;

    color: #c49a52;
}

.teem-instrumentalist-lightbox .modal-title {
    font-size: 1.05rem;
    font-weight: 600;

    color: #ffffff;
}

.teem-instrumentalist-lightbox .modal-body {
    padding: 1.25rem;
}

.teem-instrumentalist-lightbox-image-wrap {
    width: 100%;
    min-height: 300px;

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

    overflow: hidden;

    border-radius: 14px;

    background: #020b08;
}

.teem-instrumentalist-lightbox-image {
    display: block;

    max-width: 100%;
    max-height: 75vh;

    width: auto;
    height: auto;

    object-fit: contain;
}

.teem-instrumentalist-lightbox-caption {
    margin: 1rem 0 0;

    text-align: center;

    font-size: 0.82rem;
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.68);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-instrumentalists-section {
        padding: 5rem 0;
    }

    .teem-instrumentalists-gallery {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);

        grid-template-rows:
            420px
            220px
            220px
            220px
            220px
            220px;

        gap: 0.8rem;
    }

    .teem-instrumentalist-featured {
        grid-column: 1 / 3;
        grid-row: 1;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .teem-instrumentalists-section {
        padding: 4rem 0;
    }

    .teem-instrumentalists-heading {
        margin-bottom: 2rem;
        padding: 0 0.75rem;
    }

    .teem-instrumentalists-title {
        font-size: 2rem;
    }

    .teem-instrumentalists-intro {
        font-size: 0.9rem;
        line-height: 1.75;
    }

    .teem-instrumentalists-gallery {
        grid-template-columns: 1fr 1fr;

        grid-template-rows:
            330px
            170px
            170px
            170px
            170px
            170px;

        gap: 0.55rem;
    }

    .teem-instrumentalist-featured {
        grid-column: 1 / 3;
        grid-row: 1;
        border-radius: 14px;
    }

    .teem-instrumentalist-card {
        border-radius: 12px;
    }

    .teem-instrumentalist-featured-content {
        left: 1.1rem;
        right: 1.1rem;
        bottom: 1.1rem;
    }

    .teem-instrumentalist-featured-content h3 {
        font-size: 1.35rem;
    }

    .teem-instrumentalist-featured-label {
        font-size: 0.54rem;
    }

    .teem-instrumentalist-view {
        font-size: 0.62rem;
    }

    .teem-instrumentalist-zoom {
        width: 32px;
        height: 32px;

        top: 0.65rem;
        right: 0.65rem;

        opacity: 1;
        transform: none;
    }

    .teem-instrumentalist-lightbox .modal-body {
        padding: 0.7rem;
    }

    .teem-instrumentalist-lightbox-image-wrap {
        min-height: 220px;
    }

    .teem-instrumentalist-lightbox-image {
        max-height: 70vh;
    }
}


/* =========================================================
   TEEM — SERVING WITH PURPOSE
   CHURCH WORKERS / DEPARTMENTS
========================================================= */

.teem-serving-purpose-section {
    position: relative;
    padding: 7rem 0;
    overflow: hidden;
    background: #f7f7f4;
}


/* =========================================================
   SECTION INTRO
========================================================= */

.teem-serving-purpose-heading {
    max-width: 760px;
    margin: 0 auto 5rem;
    text-align: center;
}

.teem-serving-purpose-eyebrow {
    display: inline-block;
    margin-bottom: 0.85rem;

    font-size: 0.67rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b58a43;
}

.teem-serving-purpose-title {
    margin: 0 0 1rem;

    font-size: clamp(2.1rem, 4vw, 3.4rem);
    line-height: 1.08;
    font-weight: 700;

    color: #102c24;
}

.teem-serving-purpose-intro {
    max-width: 680px;
    margin: 0 auto;

    font-size: 0.98rem;
    line-height: 1.85;

    color: #68746f;
}


/* =========================================================
   DEPARTMENT
========================================================= */

.teem-serving-department {
    padding: 3rem 0 4.5rem;

    border-top: 1px solid rgba(16, 44, 36, 0.1);
}

.teem-serving-department-last {
    padding-bottom: 0;
}


/* =========================================================
   DEPARTMENT HEADER
========================================================= */

.teem-serving-department-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;

    margin-bottom: 2rem;
}

.teem-serving-department-header > div {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.teem-serving-department-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    border: 1px solid rgba(181, 138, 67, 0.4);
    border-radius: 50%;

    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;

    color: #b58a43;
}

.teem-serving-department-label {
    display: block;
    margin-bottom: 0.35rem;

    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.17em;
    text-transform: uppercase;

    color: #b58a43;
}

.teem-serving-department-title {
    margin: 0;

    font-size: clamp(1.45rem, 2.5vw, 2rem);
    line-height: 1.15;
    font-weight: 700;

    color: #102c24;
}

.teem-serving-department-description {
    max-width: 390px;
    margin: 0;

    font-size: 0.83rem;
    line-height: 1.7;

    color: #78837e;
}


/* =========================================================
   IMAGE PAIRS
========================================================= */

.teem-serving-pair {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1rem;
}


/* =========================================================
   IMAGE CARD
========================================================= */

.teem-serving-image {
    position: relative;

    display: block;

    height: 440px;

    overflow: hidden;

    border-radius: 20px;

    background: #102c24;

    text-decoration: none;

    cursor: zoom-in;
}

.teem-serving-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-serving-image:hover img {
    transform: scale(1.045);
    filter: brightness(0.78);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.teem-serving-image-overlay {
    position: absolute;
    inset: 0;

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

    background: rgba(7, 28, 23, 0.12);

    opacity: 0;

    transition: opacity 0.35s ease;
}

.teem-serving-image-overlay i {
    width: 48px;
    height: 48px;

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

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.95);

    color: #102c24;

    font-size: 1rem;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
}

.teem-serving-image:hover .teem-serving-image-overlay {
    opacity: 1;
}


/* =========================================================
   IMAGE CAPTION
========================================================= */

.teem-serving-image-caption {
    position: absolute;

    left: 1.25rem;
    right: 1.25rem;
    bottom: 1.15rem;

    z-index: 2;

    font-size: 0.73rem;
    font-weight: 600;
    letter-spacing: 0.04em;

    color: #ffffff;

    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
}

.teem-serving-image::after {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 45%;

    pointer-events: none;

    background: linear-gradient(
        to top,
        rgba(4, 18, 14, 0.72),
        transparent
    );
}


/* =========================================================
   SINGLE SANITATION IMAGE
========================================================= */

.teem-serving-single {
    display: flex;
    justify-content: center;
}

.teem-serving-single-image {
    width: min(100%, 760px);
    height: 430px;
}


/* =========================================================
   LIGHTBOX
========================================================= */

.teem-serving-lightbox {
    overflow: hidden;

    border: 0;
    border-radius: 20px;

    background: #071c17;
}

.teem-serving-lightbox .modal-header {
    padding: 1.25rem 1.5rem;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.teem-serving-lightbox .btn-close {
    filter: invert(1);
    opacity: 0.8;
}

.teem-serving-lightbox-eyebrow {
    display: block;
    margin-bottom: 0.25rem;

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.17em;
    text-transform: uppercase;

    color: #c49a52;
}

.teem-serving-lightbox .modal-title {
    font-size: 1.05rem;
    font-weight: 600;

    color: #ffffff;
}

.teem-serving-lightbox .modal-body {
    padding: 1.25rem;
}

.teem-serving-lightbox-image-wrap {
    width: 100%;
    min-height: 300px;

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

    overflow: hidden;

    border-radius: 14px;

    background: #020b08;
}

.teem-serving-lightbox-image {
    display: block;

    max-width: 100%;
    max-height: 75vh;

    width: auto;
    height: auto;

    object-fit: contain;
}

.teem-serving-lightbox-caption {
    margin: 1rem 0 0;

    text-align: center;

    font-size: 0.82rem;
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.68);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-serving-purpose-section {
        padding: 5.5rem 0;
    }

    .teem-serving-purpose-heading {
        margin-bottom: 4rem;
    }

    .teem-serving-department-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .teem-serving-department-description {
        max-width: 600px;
    }

    .teem-serving-image {
        height: 360px;
    }

    .teem-serving-single-image {
        height: 390px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-serving-purpose-section {
        padding: 4.5rem 0;
    }

    .teem-serving-purpose-heading {
        margin-bottom: 3rem;
        padding: 0 0.75rem;
    }

    .teem-serving-purpose-title {
        font-size: 2rem;
    }

    .teem-serving-purpose-intro {
        font-size: 0.9rem;
        line-height: 1.75;
    }

    .teem-serving-department {
        padding: 2.5rem 0 3.5rem;
    }

    .teem-serving-department-header {
        gap: 1rem;
        margin-bottom: 1.4rem;
    }

    .teem-serving-department-header > div {
        gap: 0.75rem;
    }

    .teem-serving-department-number {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        font-size: 0.57rem;
    }

    .teem-serving-department-title {
        font-size: 1.45rem;
    }

    .teem-serving-department-description {
        padding-left: 2.7rem;
        font-size: 0.8rem;
    }

    .teem-serving-pair {
        grid-template-columns: 1fr;
        gap: 0.7rem;
    }

    .teem-serving-image {
        height: 330px;
        border-radius: 15px;
    }

    .teem-serving-image-caption {
        left: 1rem;
        right: 1rem;
        bottom: 0.9rem;
        font-size: 0.66rem;
    }

    .teem-serving-image-overlay {
        opacity: 1;
        align-items: flex-start;
        justify-content: flex-end;
        padding: 0.8rem;
        background: transparent;
    }

    .teem-serving-image-overlay i {
        width: 36px;
        height: 36px;
        font-size: 0.8rem;
    }

    .teem-serving-single-image {
        width: 100%;
        height: 330px;
    }

    .teem-serving-lightbox .modal-body {
        padding: 0.7rem;
    }

    .teem-serving-lightbox-image-wrap {
        min-height: 220px;
    }

    .teem-serving-lightbox-image {
        max-height: 70vh;
    }
}



/* =========================================================
   TEEM — WOMEN MINISTRY GALLERY SECTION
========================================================= */

.teem-women-ministry-section {
    position: relative;
    overflow: hidden;

    padding: 7rem 0;

    background: #fbfaf7;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.teem-women-ministry-heading {
    max-width: 820px;

    margin: 0 auto 4rem;

    text-align: center;
}

.teem-women-ministry-eyebrow {
    display: inline-block;

    margin-bottom: 0.9rem;

    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b58a43;
}

.teem-women-ministry-title {
    margin: 0 0 1.1rem;

    font-size: clamp(2rem, 4vw, 3.35rem);
    line-height: 1.08;
    font-weight: 700;

    color: #102c24;
}

.teem-women-ministry-intro {
    max-width: 680px;

    margin: 0 auto;

    font-size: 0.95rem;
    line-height: 1.85;

    color: #727b76;
}


/* =========================================================
   MAIN HERO
========================================================= */

.teem-women-ministry-hero {
    position: relative;

    width: 100%;

    margin-bottom: 2rem;

    overflow: hidden;

    border-radius: 24px;

    background: #102c24;
}

.teem-women-image-link {
    position: relative;

    display: block;

    text-decoration: none;

    cursor: zoom-in;
}

.teem-women-ministry-hero-image {
    display: block;

    width: 100%;
    height: 590px;

    object-fit: cover;

    transition:
        transform 0.8s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-women-ministry-hero:hover
.teem-women-ministry-hero-image {
    transform: scale(1.025);

    filter: brightness(0.88);
}


/* =========================================================
   HERO OVERLAY
========================================================= */

.teem-women-ministry-hero-overlay {
    position: absolute;

    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            to top,
            rgba(4, 20, 15, 0.88) 0%,
            rgba(4, 20, 15, 0.42) 40%,
            rgba(4, 20, 15, 0.05) 75%
        );
}

.teem-women-ministry-hero-content {
    position: absolute;

    left: 2.5rem;
    right: 2.5rem;
    bottom: 2.4rem;

    z-index: 2;

    max-width: 610px;
}

.teem-women-ministry-hero-label {
    display: block;

    margin-bottom: 0.7rem;

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #d4ae68;
}

.teem-women-ministry-hero-content h3 {
    margin: 0 0 0.6rem;

    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.05;
    font-weight: 700;

    color: #ffffff;
}

.teem-women-ministry-hero-content p {
    max-width: 520px;

    margin: 0 0 1rem;

    font-size: 0.9rem;
    line-height: 1.7;

    color: rgba(255, 255, 255, 0.8);
}

.teem-women-ministry-view {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;

    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;

    color: rgba(255, 255, 255, 0.9);
}


/* =========================================================
   FEATURED SECTION
========================================================= */

.teem-women-featured {
    display: grid;

    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);

    gap: 1.5rem;

    margin-bottom: 1.5rem;
}


/* =========================================================
   FEATURED TEXT
========================================================= */

.teem-women-featured-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-height: 440px;

    padding: 3rem;

    border-radius: 22px;

    background: #102c24;
}

.teem-women-featured-eyebrow {
    display: block;

    margin-bottom: 0.85rem;

    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #c49a52;
}

.teem-women-featured-title {
    margin: 0 0 1.1rem;

    font-size: clamp(1.8rem, 3vw, 2.65rem);
    line-height: 1.1;
    font-weight: 700;

    color: #ffffff;
}

.teem-women-featured-text {
    max-width: 500px;

    margin: 0;

    font-size: 0.9rem;
    line-height: 1.85;

    color: rgba(255, 255, 255, 0.7);
}

.teem-women-featured-divider {
    width: 42px;
    height: 1px;

    margin: 1.7rem 0;
    
    background: #c49a52;
}

.teem-women-featured-quote {
    max-width: 480px;

    margin: 0;

    font-size: 0.78rem;
    line-height: 1.7;
    font-style: italic;

    color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   FEATURED IMAGE
========================================================= */

.teem-women-featured-image-wrap {
    min-height: 440px;

    overflow: hidden;

    border-radius: 22px;

    background: #e9e5dc;
}

.teem-women-featured-image-link {
    width: 100%;
    height: 100%;
}

.teem-women-featured-image {
    display: block;

    width: 100%;
    height: 440px;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-women-featured-image-link:hover
.teem-women-featured-image {
    transform: scale(1.035);

    filter: brightness(0.84);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.teem-women-image-overlay {
    position: absolute;

    right: 1.25rem;
    top: 1.25rem;

    z-index: 4;

    width: 43px;
    height: 43px;

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

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.94);

    color: #102c24;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.15);

    opacity: 0;

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.teem-women-image-link:hover
.teem-women-image-overlay {
    opacity: 1;

    transform: translateY(-2px);
}


/* =========================================================
   FEATURED CAPTION
========================================================= */

.teem-women-featured-caption {
    position: absolute;

    left: 1.5rem;
    right: 1.5rem;
    bottom: 1.35rem;

    z-index: 4;

    padding: 0.9rem 1rem;

    border-radius: 10px;

    background: rgba(7, 28, 23, 0.76);

    backdrop-filter: blur(8px);

    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;

    color: #ffffff;
}


/* =========================================================
   SUPPORTING IMAGES
========================================================= */

.teem-women-supporting-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1.5rem;
}

.teem-women-supporting-image {
    position: relative;

    display: block;

    height: 380px;

    overflow: hidden;

    border-radius: 20px;

    background: #e9e5dc;
}

.teem-women-supporting-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-women-supporting-image:hover img {
    transform: scale(1.035);

    filter: brightness(0.86);
}


/* =========================================================
   LIGHTBOX
========================================================= */

.teem-women-lightbox {
    overflow: hidden;

    border: 0;

    border-radius: 20px;

    background: #071c17;
}

.teem-women-lightbox .modal-header {
    padding: 1.25rem 1.5rem;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.teem-women-lightbox .btn-close {
    filter: invert(1);

    opacity: 0.8;
}

.teem-women-lightbox-eyebrow {
    display: block;

    margin-bottom: 0.25rem;

    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #c49a52;
}

.teem-women-lightbox .modal-title {
    font-size: 1.05rem;
    font-weight: 600;

    color: #ffffff;
}

.teem-women-lightbox .modal-body {
    padding: 1.25rem;
}

.teem-women-lightbox-image-wrap {
    width: 100%;
    min-height: 300px;

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

    overflow: hidden;

    border-radius: 14px;

    background: #020b08;
}

.teem-women-lightbox-image {
    display: block;

    max-width: 100%;
    max-height: 75vh;

    width: auto;
    height: auto;

    object-fit: contain;
}

.teem-women-lightbox-caption {
    margin: 1rem 0 0;

    text-align: center;

    font-size: 0.8rem;
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.7);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-women-ministry-section {
        padding: 5.5rem 0;
    }

    .teem-women-ministry-hero-image {
        height: 500px;
    }

    .teem-women-featured {
        grid-template-columns: 1fr;
    }

    .teem-women-featured-content {
        min-height: auto;

        padding: 2.5rem;
    }

    .teem-women-featured-image-wrap {
        min-height: 500px;
    }

    .teem-women-featured-image {
        height: 500px;
    }

    .teem-women-supporting-image {
        height: 330px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-women-ministry-section {
        padding: 4.5rem 0;
    }

    .teem-women-ministry-heading {
        margin-bottom: 2.8rem;
    }

    .teem-women-ministry-title {
        font-size: 2rem;
    }

    .teem-women-ministry-intro {
        font-size: 0.88rem;
        line-height: 1.75;
    }


    /* Hero */

    .teem-women-ministry-hero {
        margin-bottom: 0.8rem;

        border-radius: 16px;
    }

    .teem-women-ministry-hero-image {
        height: 390px;
    }

    .teem-women-ministry-hero-content {
        left: 1.25rem;
        right: 1.25rem;
        bottom: 1.35rem;
    }

    .teem-women-ministry-hero-label {
        font-size: 0.55rem;
    }

    .teem-women-ministry-hero-content h3 {
        font-size: 1.8rem;
    }

    .teem-women-ministry-hero-content p {
        font-size: 0.78rem;
    }


    /* Featured */

    .teem-women-featured {
        gap: 0.8rem;

        margin-bottom: 0.8rem;
    }

    .teem-women-featured-content {
        padding: 2rem 1.4rem;

        border-radius: 16px;
    }

    .teem-women-featured-title {
        font-size: 1.75rem;
    }

    .teem-women-featured-text {
        font-size: 0.83rem;
    }

    .teem-women-featured-image-wrap {
        min-height: 390px;

        border-radius: 16px;
    }

    .teem-women-featured-image {
        height: 390px;
    }


    /* Supporting */

    .teem-women-supporting-grid {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }

    .teem-women-supporting-image {
        height: 320px;

        border-radius: 16px;
    }


    /* Mobile zoom icon always visible */

    .teem-women-image-overlay {
        width: 36px;
        height: 36px;

        right: 0.8rem;
        top: 0.8rem;

        opacity: 1;

        font-size: 0.8rem;
    }


    /* Lightbox */

    .teem-women-lightbox .modal-body {
        padding: 0.7rem;
    }

    .teem-women-lightbox-image-wrap {
        min-height: 220px;
    }

    .teem-women-lightbox-image {
        max-height: 70vh;
    }

}



/* =========================================================
   TEEM — MEN'S MINISTRY GALLERY SECTION
========================================================= */

.teem-men-ministry-section {
    position: relative;
    overflow: hidden;

    padding: 7rem 0;

    background: #f5f6f3;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.teem-men-ministry-heading {
    max-width: 820px;

    margin: 0 auto 4rem;

    text-align: center;
}

.teem-men-ministry-eyebrow {
    display: inline-block;

    margin-bottom: 0.9rem;

    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b58a43;
}

.teem-men-ministry-title {
    margin: 0 0 1.1rem;

    font-size: clamp(2rem, 4vw, 3.35rem);
    line-height: 1.08;
    font-weight: 700;

    color: #102c24;
}

.teem-men-ministry-intro {
    max-width: 680px;

    margin: 0 auto;

    font-size: 0.95rem;
    line-height: 1.85;

    color: #727b76;
}


/* =========================================================
   MAIN HERO
========================================================= */

.teem-men-ministry-hero {
    position: relative;

    width: 100%;

    margin-bottom: 1.5rem;

    overflow: hidden;

    border-radius: 24px;

    background: #102c24;
}

.teem-men-image-link {
    position: relative;

    display: block;

    text-decoration: none;

    cursor: zoom-in;
}

.teem-men-ministry-hero-image {
    display: block;

    width: 100%;
    height: 590px;

    object-fit: cover;

    transition:
        transform 0.8s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-men-ministry-hero:hover
.teem-men-ministry-hero-image {
    transform: scale(1.025);

    filter: brightness(0.88);
}


/* =========================================================
   HERO OVERLAY
========================================================= */

.teem-men-ministry-hero-overlay {
    position: absolute;

    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            to top,
            rgba(4, 20, 15, 0.88) 0%,
            rgba(4, 20, 15, 0.42) 40%,
            rgba(4, 20, 15, 0.05) 75%
        );
}

.teem-men-ministry-hero-content {
    position: absolute;

    left: 2.5rem;
    right: 2.5rem;
    bottom: 2.4rem;

    z-index: 2;

    max-width: 610px;
}

.teem-men-ministry-hero-label {
    display: block;

    margin-bottom: 0.7rem;

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #d4ae68;
}

.teem-men-ministry-hero-content h3 {
    margin: 0 0 0.6rem;

    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.05;
    font-weight: 700;

    color: #ffffff;
}

.teem-men-ministry-hero-content p {
    max-width: 520px;

    margin: 0 0 1rem;

    font-size: 0.9rem;
    line-height: 1.7;

    color: rgba(255, 255, 255, 0.8);
}

.teem-men-ministry-view {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;

    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;

    color: rgba(255, 255, 255, 0.9);
}


/* =========================================================
   SUPPORTING IMAGE GRID
========================================================= */

.teem-men-supporting-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1.5rem;
}


/* =========================================================
   SUPPORTING IMAGE
========================================================= */

.teem-men-supporting-image {
    position: relative;

    display: block;

    height: 390px;

    overflow: hidden;

    border-radius: 20px;

    background: #e9e5dc;

    text-decoration: none;

    cursor: zoom-in;
}

.teem-men-supporting-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1),
        filter 0.5s ease;
}

.teem-men-supporting-image:hover img {
    transform: scale(1.035);

    filter: brightness(0.84);
}


/* =========================================================
   ZOOM ICON
========================================================= */

.teem-men-image-overlay {
    position: absolute;

    right: 1.25rem;
    top: 1.25rem;

    z-index: 4;

    width: 43px;
    height: 43px;

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

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.94);

    color: #102c24;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.15);

    opacity: 0;

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.teem-men-supporting-image:hover
.teem-men-image-overlay {
    opacity: 1;

    transform: translateY(-2px);
}


/* =========================================================
   SUPPORTING IMAGE CAPTION
========================================================= */

.teem-men-supporting-caption {
    position: absolute;

    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.25rem;

    z-index: 4;

    padding: 0.85rem 1rem;

    border-radius: 10px;

    background: rgba(7, 28, 23, 0.76);

    backdrop-filter: blur(8px);

    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;

    color: #ffffff;
}


/* =========================================================
   IMAGE BOTTOM GRADIENT
========================================================= */

.teem-men-supporting-image::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 35%;

    pointer-events: none;

    background: linear-gradient(
        to top,
        rgba(4, 18, 14, 0.6),
        transparent
    );
}


/* =========================================================
   LIGHTBOX
========================================================= */

.teem-men-lightbox {
    overflow: hidden;

    border: 0;

    border-radius: 20px;

    background: #071c17;
}

.teem-men-lightbox .modal-header {
    padding: 1.25rem 1.5rem;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.teem-men-lightbox .btn-close {
    filter: invert(1);

    opacity: 0.8;
}

.teem-men-lightbox-eyebrow {
    display: block;

    margin-bottom: 0.25rem;

    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #c49a52;
}

.teem-men-lightbox .modal-title {
    font-size: 1.05rem;
    font-weight: 600;

    color: #ffffff;
}

.teem-men-lightbox .modal-body {
    padding: 1.25rem;
}

.teem-men-lightbox-image-wrap {
    width: 100%;
    min-height: 300px;

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

    overflow: hidden;

    border-radius: 14px;

    background: #020b08;
}

.teem-men-lightbox-image {
    display: block;

    max-width: 100%;
    max-height: 75vh;

    width: auto;
    height: auto;

    object-fit: contain;
}

.teem-men-lightbox-caption {
    margin: 1rem 0 0;

    text-align: center;

    font-size: 0.8rem;
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.7);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-men-ministry-section {
        padding: 5.5rem 0;
    }

    .teem-men-ministry-hero-image {
        height: 500px;
    }

    .teem-men-supporting-image {
        height: 330px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-men-ministry-section {
        padding: 4.5rem 0;
    }

    .teem-men-ministry-heading {
        margin-bottom: 2.8rem;
    }

    .teem-men-ministry-title {
        font-size: 2rem;
    }

    .teem-men-ministry-intro {
        font-size: 0.88rem;
        line-height: 1.75;
    }


    /* Hero */

    .teem-men-ministry-hero {
        margin-bottom: 0.8rem;

        border-radius: 16px;
    }

    .teem-men-ministry-hero-image {
        height: 390px;
    }

    .teem-men-ministry-hero-content {
        left: 1.25rem;
        right: 1.25rem;
        bottom: 1.35rem;
    }

    .teem-men-ministry-hero-label {
        font-size: 0.55rem;
    }

    .teem-men-ministry-hero-content h3 {
        font-size: 1.8rem;
    }

    .teem-men-ministry-hero-content p {
        font-size: 0.78rem;
    }


    /* Supporting images */

    .teem-men-supporting-grid {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }

    .teem-men-supporting-image {
        height: 320px;

        border-radius: 16px;
    }


    /* Mobile zoom icon */

    .teem-men-image-overlay {
        width: 36px;
        height: 36px;

        right: 0.8rem;
        top: 0.8rem;

        opacity: 1;

        font-size: 0.8rem;
    }


    /* Lightbox */

    .teem-men-lightbox .modal-body {
        padding: 0.7rem;
    }

    .teem-men-lightbox-image-wrap {
        min-height: 220px;
    }

    .teem-men-lightbox-image {
        max-height: 70vh;
    }

}



/* =========================================================
   TEEM — 20TH ANNIVERSARY GALLERY
========================================================= */

.teem-20th-anniversary-section {
    position: relative;
    overflow: hidden;

    padding: 8rem 0;

    background:
        linear-gradient(
            180deg,
            #071c17 0%,
            #0b241d 35%,
            #f5f3ed 35.1%,
            #f5f3ed 100%
        );
}


/* =========================================================
   ANNIVERSARY INTRO
========================================================= */

.teem-20th-anniversary-heading {
    max-width: 850px;

    margin: 0 auto 4.5rem;

    text-align: center;
}

.teem-20th-anniversary-eyebrow {
    display: inline-block;

    margin-bottom: 1rem;

    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;

    color: #d0a45a;
}


/* =========================================================
   MAIN ANNIVERSARY HEADING
========================================================= */

.teem-20th-anniversary-title {
    margin: 0 0 1.2rem;

    font-size: clamp(2.3rem, 5vw, 4.2rem);
    line-height: 1.02;

    font-weight: 900;
    letter-spacing: -0.04em;

    color: #ffffff;
}

.teem-20th-anniversary-intro {
    max-width: 700px;

    margin: 0 auto 1.8rem;

    font-size: 0.95rem;
    line-height: 1.85;

    font-weight: 400;

    color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   ANNIVERSARY DATE
========================================================= */

.teem-20th-anniversary-date {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;

    padding: 0.75rem 1.15rem;

    border: 1px solid rgba(208, 164, 90, 0.28);

    border-radius: 100px;

    background: rgba(255, 255, 255, 0.04);

    text-align: left;
}

.teem-20th-anniversary-date-icon {
    width: 38px;
    height: 38px;

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

    flex-shrink: 0;

    border-radius: 50%;

    background: rgba(208, 164, 90, 0.13);

    color: #d0a45a;
}

.teem-20th-anniversary-date div {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.teem-20th-anniversary-date strong {
    font-size: 0.75rem;
    font-weight: 800;

    color: #ffffff;
}

.teem-20th-anniversary-date div span {
    font-size: 0.62rem;
    font-weight: 400;

    color: rgba(255, 255, 255, 0.55);
}


/* =========================================================
   TWO FEATURED ANNIVERSARY IMAGES
========================================================= */

.teem-anniversary-featured-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1.5rem;

    margin-bottom: 6rem;
}

.teem-anniversary-featured-card {
    overflow: hidden;

    border-radius: 24px;

    background: #102c24;

    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.18);
}

.teem-anniversary-featured-image {
    position: relative;

    height: 520px;

    overflow: hidden;
}

.teem-anniversary-featured-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.8s cubic-bezier(.22, .61, .36, 1);
}

.teem-anniversary-featured-card:hover
.teem-anniversary-featured-image img {
    transform: scale(1.035);
}


/* =========================================================
   FEATURED IMAGE OVERLAY
========================================================= */

.teem-anniversary-featured-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(4, 18, 14, 0.92) 0%,
            rgba(4, 18, 14, 0.48) 40%,
            transparent 75%
        );
}


/* =========================================================
   FEATURED IMAGE TEXT
========================================================= */

.teem-anniversary-featured-content {
    position: absolute;

    left: 2rem;
    right: 2rem;
    bottom: 2rem;

    z-index: 2;
}

.teem-anniversary-featured-content > span {
    display: block;

    margin-bottom: 0.65rem;

    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.18em;

    color: #d0a45a;
}

.teem-anniversary-featured-content h3 {
    margin: 0 0 0.5rem;

    font-size: clamp(1.5rem, 3vw, 2.25rem);
    line-height: 1.08;

    font-weight: 800;
    letter-spacing: -0.02em;

    color: #ffffff;
}

.teem-anniversary-featured-content p {
    max-width: 500px;

    margin: 0;

    font-size: 0.78rem;
    line-height: 1.7;

    font-weight: 400;

    color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   ANNIVERSARY MOMENTS HEADING
========================================================= */

.teem-anniversary-moments-heading {
    max-width: 700px;

    margin: 0 auto 2.5rem;

    text-align: center;
}

.teem-anniversary-moments-heading > span {
    display: block;

    margin-bottom: 0.7rem;

    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b18748;
}

.teem-anniversary-moments-heading h3 {
    margin: 0 0 0.7rem;

    font-size: clamp(1.8rem, 3vw, 2.6rem);
    line-height: 1.1;

    font-weight: 800;
    letter-spacing: -0.025em;

    color: #102c24;
}

.teem-anniversary-moments-heading p {
    margin: 0;

    font-size: 0.88rem;
    line-height: 1.75;

    font-weight: 400;

    color: #747b76;
}


/* =========================================================
   ANNIVERSARY IMAGE GRID
========================================================= */

.teem-anniversary-gallery-grid {
    display: grid;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 1rem;

    margin-bottom: 7rem;
}

.teem-anniversary-gallery-item {
    position: relative;

    height: 270px;

    overflow: hidden;

    border-radius: 16px;

    background: #dedbd2;
}

.teem-anniversary-gallery-item img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.65s cubic-bezier(.22, .61, .36, 1),
        filter 0.4s ease;
}

.teem-anniversary-gallery-item:hover img {
    transform: scale(1.045);

    filter: brightness(0.92);
}


/* =========================================================
   GUEST MINISTER SECTION
========================================================= */

.teem-anniversary-guest-section {
    padding: 4rem 0 0;

    border-top: 1px solid rgba(16, 44, 36, 0.1);
}

.teem-anniversary-guest-heading {
    max-width: 700px;

    margin-bottom: 2.5rem;
}

.teem-anniversary-guest-heading > span {
    display: block;

    margin-bottom: 0.7rem;

    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #b18748;
}

.teem-anniversary-guest-heading h3 {
    margin: 0 0 0.7rem;

    font-size: clamp(1.8rem, 3vw, 2.6rem);
    line-height: 1.1;

    font-weight: 800;
    letter-spacing: -0.025em;

    color: #102c24;
}

.teem-anniversary-guest-heading p {
    max-width: 600px;

    margin: 0;

    font-size: 0.88rem;
    line-height: 1.75;

    font-weight: 400;

    color: #747b76;
}


/* =========================================================
   GUEST MINISTER LAYOUT
========================================================= */

.teem-anniversary-guest-grid {
    display: grid;

    grid-template-columns: 1.35fr 1fr;

    gap: 1.25rem;
}


/* =========================================================
   MAIN GUEST MINISTER IMAGE
========================================================= */

.teem-anniversary-guest-main {
    overflow: hidden;

    border-radius: 22px;

    background: #102c24;
}

.teem-anniversary-guest-image {
    height: 580px;

    overflow: hidden;
}

.teem-anniversary-guest-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.7s cubic-bezier(.22, .61, .36, 1);
}

.teem-anniversary-guest-main:hover
.teem-anniversary-guest-image img {
    transform: scale(1.025);
}


/* =========================================================
   GUEST MINISTER CAPTION
========================================================= */

.teem-anniversary-guest-caption {
    padding: 1.6rem 1.7rem 1.8rem;
}

.teem-anniversary-guest-caption > span {
    display: block;

    margin-bottom: 0.45rem;

    font-size: 0.57rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #d0a45a;
}

.teem-anniversary-guest-caption h4 {
    margin: 0 0 0.45rem;

    font-size: 1.5rem;
    line-height: 1.1;

    font-weight: 800;
    letter-spacing: -0.015em;

    color: #ffffff;
}

.teem-anniversary-guest-caption p {
    max-width: 600px;

    margin: 0;

    font-size: 0.78rem;
    line-height: 1.7;

    font-weight: 400;

    color: rgba(255, 255, 255, 0.7);
}


/* =========================================================
   GUEST MINISTER SUB IMAGES
========================================================= */

.teem-anniversary-guest-subgrid {
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1.25rem;
}

.teem-anniversary-guest-small {
    min-height: 280px;

    overflow: hidden;

    border-radius: 18px;

    background: #dedbd2;
}

.teem-anniversary-guest-small img {
    display: block;

    width: 100%;
    height: 100%;

    min-height: 280px;

    object-fit: cover;

    transition:
        transform 0.65s cubic-bezier(.22, .61, .36, 1),
        filter 0.4s ease;
}

.teem-anniversary-guest-small:hover img {
    transform: scale(1.04);

    filter: brightness(0.94);
}


/* =========================================================
   ANNIVERSARY CLOSING
========================================================= */

.teem-anniversary-closing {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;

    margin-top: 6rem;

    text-align: center;
}

.teem-anniversary-closing-line {
    width: 70px;
    height: 1px;

    background: rgba(16, 44, 36, 0.18);
}

.teem-anniversary-closing i {
    flex-shrink: 0;

    font-size: 1rem;

    color: #b18748;
}

.teem-anniversary-closing p {
    max-width: 420px;

    margin: 0;

    font-size: 0.7rem;
    line-height: 1.7;

    font-weight: 500;

    color: #727a75;
}

.teem-anniversary-closing strong {
    display: none;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-20th-anniversary-section {
        padding: 6rem 0;
    }


    /* Featured */

    .teem-anniversary-featured-image {
        height: 430px;
    }


    /* Gallery */

    .teem-anniversary-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .teem-anniversary-gallery-item {
        height: 300px;
    }


    /* Guest */

    .teem-anniversary-guest-grid {
        grid-template-columns: 1fr;
    }

    .teem-anniversary-guest-image {
        height: 520px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-20th-anniversary-section {
        padding: 4.8rem 0;
    }


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

    .teem-20th-anniversary-heading {
        margin-bottom: 3rem;
    }

    .teem-20th-anniversary-eyebrow {
        font-size: 0.58rem;
        letter-spacing: 0.18em;
    }

    .teem-20th-anniversary-title {
        font-size: 2.25rem;

        font-weight: 900;
        letter-spacing: -0.035em;
    }

    .teem-20th-anniversary-intro {
        font-size: 0.84rem;

        line-height: 1.75;
    }


    /* =====================================================
       DATE
    ===================================================== */

    .teem-20th-anniversary-date {
        border-radius: 14px;

        padding: 0.65rem 0.85rem;
    }

    .teem-20th-anniversary-date-icon {
        width: 34px;
        height: 34px;
    }

    .teem-20th-anniversary-date strong {
        font-size: 0.7rem;
    }

    .teem-20th-anniversary-date div span {
        font-size: 0.57rem;
    }


    /* =====================================================
       FEATURED IMAGES
    ===================================================== */

    .teem-anniversary-featured-grid {
        grid-template-columns: 1fr;

        gap: 0.9rem;

        margin-bottom: 4.5rem;
    }

    .teem-anniversary-featured-card {
        border-radius: 17px;
    }

    .teem-anniversary-featured-image {
        height: 390px;
    }

    .teem-anniversary-featured-content {
        left: 1.25rem;
        right: 1.25rem;
        bottom: 1.25rem;
    }

    .teem-anniversary-featured-content h3 {
        font-size: 1.75rem;

        font-weight: 800;
        letter-spacing: -0.02em;
    }

    .teem-anniversary-featured-content p {
        font-size: 0.74rem;
    }


    /* =====================================================
       MOMENTS HEADING
    ===================================================== */

    .teem-anniversary-moments-heading {
        margin-bottom: 2rem;
    }

    .teem-anniversary-moments-heading h3 {
        font-size: 2rem;

        font-weight: 800;
        letter-spacing: -0.025em;
    }

    .teem-anniversary-moments-heading p {
        font-size: 0.8rem;
    }


    /* =====================================================
       ANNIVERSARY IMAGE GRID
    ===================================================== */

    .teem-anniversary-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 0.65rem;

        margin-bottom: 4.5rem;
    }

    .teem-anniversary-gallery-item {
        height: 210px;

        border-radius: 12px;
    }


    /* =====================================================
       GUEST MINISTER
    ===================================================== */

    .teem-anniversary-guest-section {
        padding-top: 3rem;
    }

    .teem-anniversary-guest-heading {
        margin-bottom: 2rem;
    }

    .teem-anniversary-guest-heading h3 {
        font-size: 2rem;

        font-weight: 800;
        letter-spacing: -0.025em;
    }

    .teem-anniversary-guest-heading p {
        font-size: 0.8rem;
    }


    /* =====================================================
       GUEST MAIN IMAGE
    ===================================================== */

    .teem-anniversary-guest-grid {
        gap: 0.8rem;
    }

    .teem-anniversary-guest-main {
        border-radius: 16px;
    }

    .teem-anniversary-guest-image {
        height: 390px;
    }


    /* =====================================================
       GUEST CAPTION
    ===================================================== */

    .teem-anniversary-guest-caption {
        padding: 1.2rem 1.25rem 1.4rem;
    }

    .teem-anniversary-guest-caption h4 {
        font-size: 1.35rem;

        font-weight: 800;
    }

    .teem-anniversary-guest-caption p {
        font-size: 0.74rem;
    }


    /* =====================================================
       GUEST SUB IMAGES
    ===================================================== */

    .teem-anniversary-guest-subgrid {
        grid-template-columns: 1fr 1fr;

        gap: 0.65rem;
    }

    .teem-anniversary-guest-small {
        min-height: 210px;

        border-radius: 12px;
    }

    .teem-anniversary-guest-small img {
        min-height: 210px;
    }


    /* =====================================================
       CLOSING
    ===================================================== */

    .teem-anniversary-closing {
        margin-top: 4rem;

        gap: 0.7rem;
    }

    .teem-anniversary-closing-line {
        width: 30px;
    }

    .teem-anniversary-closing p {
        font-size: 0.63rem;
    }

}


/* =========================================================
   TEEM — 20TH ANNIVERSARY JOURNEY
   Clean / Cinematic / Editorial
========================================================= */

.teem-anniversary-journey {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    margin-top: 0;
    padding: 120px 0 110px;

    background:
        radial-gradient(
            circle at 50% 42%,
            rgba(201, 157, 82, 0.12),
            transparent 32%
        ),
        #071f1a;

    color: #ffffff;
}


/* =========================================================
   BACKGROUND GLOW
========================================================= */

.teem-anniversary-journey-glow {
    position: absolute;
    z-index: -1;

    width: 600px;
    height: 600px;

    top: 20%;
    left: 50%;

    transform: translateX(-50%);

    border-radius: 50%;

    background: rgba(201, 157, 82, 0.045);

    filter: blur(30px);

    pointer-events: none;
}


/* =========================================================
   EYEBROW
========================================================= */

.teem-anniversary-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 25px;
}

.teem-anniversary-eyebrow span {
    width: 35px;
    height: 1px;

    background: #c99d52;
}

.teem-anniversary-eyebrow p {
    margin: 0;

    color: #c99d52;

    font-size: 0.68rem;
    font-weight: 800;

    letter-spacing: 0.2em;
    text-transform: uppercase;
}


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

.teem-anniversary-intro {
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}

.teem-anniversary-intro h2 {
    margin: 0;

    font-size: clamp(3.3rem, 7vw, 6.5rem);
    line-height: 0.92;

    font-weight: 900;

    letter-spacing: -0.055em;
}

.teem-anniversary-intro h2 span {
    display: block;

    color: #c99d52;
}

.teem-anniversary-intro p {
    max-width: 500px;

    margin: 27px auto 0;

    color: rgba(255, 255, 255, 0.58);

    font-size: 0.95rem;
    line-height: 1.7;
}


/* =========================================================
   MAIN STAGE
========================================================= */

.teem-anniversary-stage {
    position: relative;

    width: 100%;
    max-width: 900px;

    min-height: 650px;

    margin: 70px auto 0;

    display: flex;

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


/* =========================================================
   MAIN PORTRAIT
========================================================= */

.teem-anniversary-portrait {
    position: relative;

    z-index: 5;

    width: 100%;
    max-width: 470px;
}


/* =========================================================
   IMAGE FRAME
========================================================= */

.teem-anniversary-image-frame {
    position: relative;

    width: 100%;

    aspect-ratio: 4 / 5;

    padding: 9px;

    background: #c99d52;

    box-shadow:
        0 35px 80px rgba(0, 0, 0, 0.4),
        0 0 0 1px rgba(255, 255, 255, 0.08);

    overflow: hidden;
}

.teem-anniversary-image-frame img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center;

    transition: transform 0.8s ease;
}

.teem-anniversary-image-frame:hover img {
    transform: scale(1.025);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.teem-anniversary-image-overlay {
    position: absolute;

    inset: 9px;

    background:
        linear-gradient(
            to top,
            rgba(4, 24, 20, 0.75),
            transparent 55%
        );

    pointer-events: none;
}


/* =========================================================
   20 MARK
========================================================= */

.teem-anniversary-image-mark {
    position: absolute;

    right: 25px;
    bottom: 22px;

    display: flex;
    flex-direction: column;

    align-items: flex-end;

    color: #ffffff;
}

.teem-anniversary-image-mark small {
    margin-bottom: -6px;

    font-size: 0.58rem;
    font-weight: 800;

    letter-spacing: 0.22em;
}

.teem-anniversary-image-mark strong {
    font-size: 5rem;

    line-height: 1;

    font-weight: 900;

    letter-spacing: -0.08em;
}


/* =========================================================
   IMAGE CAPTION
========================================================= */

.teem-anniversary-image-caption {
    position: absolute;

    left: -125px;
    bottom: 32px;

    display: flex;

    align-items: flex-start;

    gap: 14px;

    width: 220px;
}

.teem-anniversary-image-caption > span {
    width: 35px;
    height: 1px;

    margin-top: 8px;

    flex-shrink: 0;

    background: #c99d52;
}

.teem-anniversary-image-caption small {
    display: block;

    margin-bottom: 6px;

    color: #c99d52;

    font-size: 0.58rem;
    font-weight: 800;

    letter-spacing: 0.18em;
}

.teem-anniversary-image-caption h3 {
    margin: 0;

    color: #ffffff;

    font-size: 1.25rem;
    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -0.025em;
}


/* =========================================================
   SUBTLE WORDS
   Desktop only
========================================================= */

.teem-anniversary-word {
    position: absolute;

    color: rgba(255, 255, 255, 0.16);

    font-size: 0.62rem;
    font-weight: 800;

    letter-spacing: 0.25em;

    z-index: 2;

    pointer-events: none;
}

.teem-anniversary-word-one {
    top: 130px;
    left: 70px;
}

.teem-anniversary-word-two {
    top: 330px;
    right: 55px;

    color: rgba(201, 157, 82, 0.5);
}

.teem-anniversary-word-three {
    bottom: 105px;
    left: 90px;
}


/* =========================================================
   BOTTOM
========================================================= */

.teem-anniversary-bottom {
    text-align: center;

    max-width: 600px;

    margin: 0 auto;
}


/* =========================================================
   YEARS
========================================================= */

.teem-anniversary-years {
    display: flex;

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

    gap: 16px;

    margin-bottom: 18px;
}

.teem-anniversary-years strong {
    color: rgba(255, 255, 255, 0.4);

    font-size: 0.65rem;
    font-weight: 800;

    letter-spacing: 0.15em;
}

.teem-anniversary-years span {
    width: 50px;
    height: 1px;

    background: rgba(201, 157, 82, 0.55);
}


/* =========================================================
   BOTTOM MESSAGE
========================================================= */

.teem-anniversary-bottom > p {
    margin: 0 0 28px;

    color: #ffffff;

    font-size: 1.15rem;

    font-weight: 700;

    letter-spacing: -0.015em;
}


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

.teem-anniversary-cta {
    display: inline-flex;

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

    gap: 18px;

    min-height: 56px;

    padding: 0 9px 0 23px;

    border-radius: 100px;

    background: #c99d52;

    color: #071f1a;

    text-decoration: none;

    font-size: 0.78rem;
    font-weight: 800;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.teem-anniversary-cta i {
    width: 38px;
    height: 38px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background: #071f1a;

    color: #ffffff;

    transition: transform 0.3s ease;
}

.teem-anniversary-cta:hover {
    transform: translateY(-3px);

    background: #d5ad68;

    color: #071f1a;

    box-shadow:
        0 18px 35px rgba(0, 0, 0, 0.25);
}

.teem-anniversary-cta:hover i {
    transform: rotate(45deg);
}


/* =========================================================
   BOTTOM TRANSITION
========================================================= */

.teem-anniversary-transition {
    position: absolute;

    left: 50%;
    bottom: 0;

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    gap: 6px;
}

.teem-anniversary-transition span {
    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #c99d52;
}

.teem-anniversary-transition span:nth-child(2) {
    width: 22px;

    border-radius: 10px;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .teem-anniversary-journey {
        padding: 100px 0 95px;
    }

    .teem-anniversary-stage {
        min-height: 600px;

        margin-top: 60px;
    }

    .teem-anniversary-portrait {
        max-width: 420px;
    }

    .teem-anniversary-image-caption {
        left: -70px;
    }

    .teem-anniversary-word-one {
        left: 20px;
    }

    .teem-anniversary-word-three {
        left: 35px;
    }

    .teem-anniversary-word-two {
        right: 15px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .teem-anniversary-journey {
        padding: 78px 0 75px;
    }


    /* Eyebrow */

    .teem-anniversary-eyebrow {
        gap: 9px;

        margin-bottom: 20px;
    }

    .teem-anniversary-eyebrow span {
        width: 22px;
    }

    .teem-anniversary-eyebrow p {
        font-size: 0.57rem;

        letter-spacing: 0.15em;
    }


    /* Heading */

    .teem-anniversary-intro {
        padding: 0 12px;
    }

    .teem-anniversary-intro h2 {
        font-size: clamp(2.7rem, 13vw, 4.2rem);

        line-height: 0.94;

        letter-spacing: -0.055em;
    }

    .teem-anniversary-intro p {
        max-width: 320px;

        margin-top: 20px;

        font-size: 0.82rem;

        line-height: 1.65;
    }


    /* =====================================================
       IMPORTANT MOBILE FIX
       Turn the stage into a vertical layout.
    ===================================================== */

    .teem-anniversary-stage {
        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: flex-start;

        width: 100%;

        min-height: auto;

        margin-top: 42px;

        padding: 0 15px;
    }


    /* Portrait */

    .teem-anniversary-portrait {
        width: 100%;

        max-width: 330px;

        margin: 0 auto;
    }


    /* Image */

    .teem-anniversary-image-frame {
        width: 100%;

        aspect-ratio: 4 / 5;

        padding: 6px;

        box-shadow:
            0 22px 45px rgba(0, 0, 0, 0.35);
    }

    .teem-anniversary-image-overlay {
        inset: 6px;
    }


    /* 20 mark */

    .teem-anniversary-image-mark {
        right: 18px;
        bottom: 17px;
    }

    .teem-anniversary-image-mark small {
        font-size: 0.5rem;
    }

    .teem-anniversary-image-mark strong {
        font-size: 3.7rem;
    }


    /* =====================================================
       MOBILE CAPTION
       No negative positioning.
    ===================================================== */

    .teem-anniversary-image-caption {
        position: relative;

        left: auto;
        bottom: auto;

        width: 100%;

        margin-top: 18px;

        justify-content: center;

        text-align: left;
    }

    .teem-anniversary-image-caption > span {
        width: 25px;

        margin-top: 7px;
    }

    .teem-anniversary-image-caption small {
        font-size: 0.53rem;
    }

    .teem-anniversary-image-caption h3 {
        font-size: 1.05rem;
    }


    /* =====================================================
       REMOVE DECORATIVE WORDS ON MOBILE
       They add clutter and can cause visual overflow.
    ===================================================== */

    .teem-anniversary-word {
        display: none;
    }


    /* Bottom */

    .teem-anniversary-bottom {
        width: 100%;

        padding: 0 15px;

        margin-top: 38px;
    }


    /* Years */

    .teem-anniversary-years {
        gap: 12px;

        margin-bottom: 14px;
    }

    .teem-anniversary-years strong {
        font-size: 0.58rem;
    }

    .teem-anniversary-years span {
        width: 35px;
    }


    /* Message */

    .teem-anniversary-bottom > p {
        margin-bottom: 24px;

        font-size: 0.92rem;
    }


    /* CTA */

    .teem-anniversary-cta {
        width: 100%;

        max-width: 330px;

        min-height: 53px;

        padding-left: 18px;

        font-size: 0.72rem;
    }

    .teem-anniversary-cta i {
        width: 36px;
        height: 36px;
    }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 380px) {

    .teem-anniversary-journey {
        padding-top: 65px;
    }

    .teem-anniversary-intro h2 {
        font-size: 2.55rem;
    }

    .teem-anniversary-intro p {
        font-size: 0.78rem;
    }

    .teem-anniversary-stage {
        padding: 0 12px;

        margin-top: 35px;
    }

    .teem-anniversary-portrait {
        max-width: 290px;
    }

    .teem-anniversary-image-caption h3 {
        font-size: 0.98rem;
    }

    .teem-anniversary-bottom {
        margin-top: 32px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .teem-anniversary-image-frame img,
    .teem-anniversary-cta,
    .teem-anniversary-cta i {
        transition: none;
    }
}