.bg-gradient-color {
    background: linear-gradient(45deg, #da251d, #3032A2) !important;
}

.cs-btn-one.btn-gradient-color {
    background: linear-gradient(45deg, #da251d, #3032A2) !important;
    color: #fff;
}

.feature-box .link a {
    position: absolute;
    background: linear-gradient(45deg, #da251d, #3032A2) !important;
    color: #fff;
    height: 45px;
    width: 85px;
    line-height: 45px;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: -20px;
    border-radius: 30px;
    z-index: 1;
    -moz-transition: all 400ms ease-out 0s;
    -webkit-transition: all 400ms ease-out 0s;
    -ms-transition: all 400ms ease-out 0s;
    -o-transition: all 400ms ease-out 0s;
    transition: all 400ms ease-out 0s;
}

.text-primary-color {
    color:#da251d;
}

.cs-btn-one.btn-primary-color,
.social-list.list-primary-color li a ,
.contact-icon i{
    background:#da251d;
}

.page-title-section{
        background-image: url(bread.png) !important;
}

.team-section {
    padding: 80px 0;
    background-size: cover;
    background-position: center;
}

/* HEADER */
.section-head {
    margin-bottom: 60px;
}
.team-title {
    font-size: 2.2rem;
    font-weight: 700;
}
.team-subtitle {
    font-size: 1.1rem;
    color: #6c757d;
}

/* CARD */
.team-card {
    background: #fff;
    border-radius: 16px;
    padding: 25px 20px;
    text-align: center;
    height: 100%;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}
.team-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(0,0,0,0.15);
}

/* IMAGE */
.team-image-box {
    width: 160px;
    height: 160px;
    margin: 0 auto 15px;
    border-radius: 50%;
    overflow: hidden;
    border: 5px solid #f1f1f1;
}
.team-image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* INFO */
.team-info h4 {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 5px;
}
.team-info span {
    display: block;
    font-size: 1rem;
    color: #127ec3;
    margin-bottom: 15px;
}

/* BUTTON */
.team-btn {
    border-radius: 30px;
    padding: 8px 22px;
    background: #127ec3;
    color: #fff;
    border: none;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}
.team-btn:hover {
    background: #0e6aa6;
    color: #fff;
}

/* MODAL */
.team-modal {
    border-radius: 18px;
    padding: 40px 30px;
    position: relative;
}
.modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 30px;
    background: none;
    border: none;
}

/* MODAL CONTENT */
.modal-avatar {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}
.modal-role {
    color: #127ec3;
    font-weight: 600;
    margin-bottom: 20px;
}
.modal-text {
    text-align: left;
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
}

/* MOBILE OPTIMIZATION */
@media (max-width: 768px) {
    .team-title {
        font-size: 1.8rem;
    }
    .team-image-box {
        width: 130px;
        height: 130px;
    }
    .modal-avatar {
        width: 110px;
        height: 110px;
    }
    .team-modal {
        padding: 30px 20px;
    }
    .page-title-content .title{
            font-size: 36px;
    }
}

        /* =============== TABLE STYLES =============== */
        .table-container {
       
            margin: 40px auto;
            padding: 0 20px;
        }
        table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            background: white;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 4px 16px rgba(0,0,0,0.08);
        }
        th {
            background: linear-gradient(90deg, #d32f2f, #b71c1c);
            color: white;
            padding: 14px;
            font-size: 1.05rem;
            font-weight: 600;
            text-align: left;
        }
        td {
            padding: 14px;
            font-size: 1rem;
            color: #333;
            border-bottom: 1px solid #eee;
        }
        tr {
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        tr:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
            background-color: #fafafa;
        }
        tr:nth-child(even) {
            background-color: #f9f9f9;
        }

    /* =============== IMAGE GALLERY =============== */
    .gallery-wrapper {
        position: relative;
        width: 100%;
        margin: 30px auto;
        overflow: hidden;
    }
    .image-gallery {
        display: flex;
        gap: 18px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding: 10px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .image-gallery::-webkit-scrollbar { display: none; }
    .gallery-item {
        flex: 0 0 auto;
        scroll-snap-align: center;
        position: relative;
        transition: transform 0.4s ease;
    }
    .gallery-item img {
        width: 100%;
        max-width: 500px;
        height: auto;
        border-radius: 16px;
        box-shadow: 0 6px 18px rgba(0,0,0,0.15);
        transition: transform 0.4s ease, box-shadow 0.4s ease;
    }
    .gallery-item:hover img {
        transform: scale(1.05);
        box-shadow: 0 12px 30px rgba(0,0,0,0.2);
    }

    .gallery-btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(183,28,28,0.9);
        color: #fff;
        border: none;
        padding: 12px 16px;
        border-radius: 50%;
        cursor: pointer;
        font-size: 20px;
        transition: background 0.3s ease;
        z-index: 10;
    }
    .gallery-btn:hover { background: rgba(211,47,47,1); }
    .left-btn { left: 5px; }
    .right-btn { right: 5px; }

    .placeholder-img {
        display: block;
        margin: auto;
        width: 90%;
        max-width: 500px;
        height: auto;
        border-radius: 16px;
        background: #e9ecef;
        box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    }

    @media (max-width: 768px) {
        .gallery-item img {
            width: 85vw;
            height: auto;
        }
        .gallery-btn {
            padding: 10px 14px;
            font-size: 18px;
        }
    }

    @media (max-width: 600px) {
        table { display: block; }
        thead { display: none; }
        tbody { display: flex; flex-direction: column; gap: 16px; }
        tr {
            display: flex;
            flex-direction: column;
            background: #fff;
            border-radius: 12px;
            padding: 14px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.08);
        }
        td {
            border: none;
            padding: 8px 0;
            font-size: 0.95rem;
        }
        td:before {
            content: attr(data-label);
            font-weight: 600;
            color: #b71c1c;
            display: block;
            margin-bottom: 4px;
            font-size: 0.85rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }
    }

            /* =============== TABLE STYLES =============== */
        .table-container {
     
            margin: 40px auto;
            padding: 0 20px;
        }
        table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            background: white;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 4px 16px rgba(0,0,0,0.08);
        }
        th {
            background: linear-gradient(90deg, #d32f2f, #b71c1c);
            color: white;
            padding: 14px;
            font-size: 1.05rem;
            font-weight: 600;
            text-align: left;
        }
        td {
            padding: 14px;
            font-size: 1rem;
            color: #333;
            border-bottom: 1px solid #eee;
        }
        tr {
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        tr:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
            background-color: #fafafa;
        }
        tr:nth-child(even) {
            background-color: #f9f9f9;
        }

        	/* TESTIMONIAL CARD */
.testimonial-item {
    background: #fff;
    padding: 35px 25px;
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(0,0,0,0.08);
    margin: 15px;
    position: relative;
}

/* Quote icon */
.testimonial-item .quote-icon {
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 36px;
    color: #127ec3;
    opacity: 0.15;
}

.comments {
    font-size: 16px;
    line-height: 1.7;
    color: #444;
    margin-bottom: 22px;
}

.client-name {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 17px;
}

.client-designation {
    font-size: 14px;
    color: #888;
}

.testimonial-btn-wrap {
    margin-top: 20px;
}

/* View Button */
.view-testimonial-btn {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 30px;
    background: #127ec3;
    color: #fff;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.view-testimonial-btn i {
    margin-right: 6px;
}

.view-testimonial-btn:hover {
    background: white;
    transform: translateY(-2px);
}

/* ================= LIGHTBOX CLOSE BUTTON ================= */

.lb-close {
    position: fixed !important;
    top: 16px !important;
    right: 16px !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(0,0,0,0.85) !important;
    border-radius: 50% !important;
    opacity: 1 !important;
    z-index: 9999 !important;
}

/* Custom X */
.lb-close::after {
    content: "✕";
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    line-height: 44px;
    text-align: center;
    display: block;
}

/* Hide default close icon */
.lb-close img {
    display: none !important;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .lb-close {
        width: 38px !important;
        height: 38px !important;
    }

    .lb-close::after {
        font-size: 20px;
        line-height: 38px;
    }
}

        /* ===== TESTIMONIAL MODAL ===== */
        .testimonial-modal {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.85);
            z-index: 99999;
            align-items: center;
            justify-content: center;
            flex-direction: column;
        }

        .testimonial-modal img {
            max-width: 90%;
            max-height: 80vh;
            border-radius: 6px;
        }

        .tm-caption {
            color: #fff;
            margin-top: 12px;
            font-size: 16px;
            text-align: center;
        }

        .tm-close {
            position: absolute;
            top: 20px;
            right: 30px;
            font-size: 36px;
            color: #fff;
            cursor: pointer;
        }

        .tm-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background: none;
            border: none;
            color: #fff;
            font-size: 40px;
            cursor: pointer;
            padding: 10px;
        }

        .tm-prev { left: 20px; }
        .tm-next { right: 20px; }

        @media (max-width: 768px) {
            .tm-nav { font-size: 30px; }
            .tm-close { font-size: 30px; }
        }