/* Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Nunito Sans", sans-serif;
}

:root {
    /* sample colour */
    --dark-green: #0f3d33;
    --text-gray: #3f3f3f;
    --yellow: #f6f14d;
    --green-btn: #0f4d3c;
    --radial-yellow-gradient: linear-gradient(to right,
            #ffe550 0%,
            #f6c94d 0%,
            #fdfc47 100%);

    /* Primary Brand Colors */
    --color-home-bg: #f5f5f2;
    --color-primary: #ffca40;
    --color-primary-lighter: #ffe599;
    --color-primary-lighter-50: #fff2cb;
    --color-primary-darker: #cc9c2d;
    --color-primary-hover: #f5c036;
    --color-primary-active: #d9a52c;
    --color-primary-disabled: #e6d8a8;
    --color-primary-text-disabled: #8c8c8c;
    --color-black: black;
    --color-ash: rgb(56, 56, 56);
    --color-white: #ffffff;
    --feature-blue: rgb(182, 207, 207);
    --black-shadow: 0 -1px 1px rgba(8, 8, 8, 0.1) !important;
    --image-background: #f5f6f9;
    --thumb: #ffc107;
    --card-gradinet: linear-gradient(135deg,
            #f1eacff5 0%,
            #f3e48cf6 50%,
            #f7d765 120%);
    --card-blue: linear-gradient(135deg,
            #def4f8f5 0%,
            #dbf2faf6 50%,
            #f3e48cf6 120%);
    --card-overlay-gradient: linear-gradient(var(--card-white-overlay-start),
            var(--card-white-overlay-end));
    --card-white-overlay-end: rgba(255, 255, 255, 0.45);
    --card-white-overlay-start: rgba(253, 253, 253, 0.55);
    /* --card-feature-shadow: 0 20px 30px rgba(33, 182, 199, 0.87); */

    --header-blue: radial-gradient(circle at top right,
            #fcf8ec 30%,
            #e0f1f8 65%,
            #e0f0f5 100%);
    --card-white-shadow: 0 10px 30px rgba(252, 248, 248, 0.08);
}

/* Header start */
.headertop .navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--header-blue) !important;
    z-index: 1050;
}

.chtbt-para {
    font-size: 15px !important;
}

.chtbt-pre {
    font-size: 16px !important;
    color: var(--color-white) !important;
    font-weight: 600;
    font-family: "Nunito Sans", sans-serif;
    padding-top: 0 !important;
}

.chtbot-second {
    padding-top: 40px !important;
}

.Customer-Engagement {
    padding-top: 100px !important;
    font-size: 38px !important;
    font-weight: 700;
    color: var(--color-white) !important;

}

.custom-eng {
    font-size: 38px !important;
    font-weight: 700 !important;
}

.feature-topic {
    color: var(--color-white) !important;
    font-size: 40px !important;
    padding-bottom: 25px !important;
}

.feature-card {
    height: 100%;
    background: var(--color-home-bg);
    border-radius: 16px;
    padding: 30px;
    text-align: center;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 20px;
    box-shadow: 1px 10px 20px var(--color-primary-lighter);
}

.feature-card:hover {
    background-color: var(--color-white) !important;
    color: var(--color-black) !important;
    transform: translateY(-6px);
    box-shadow: 1px 10px 30px var(--color-primary);
}

.feature-card1 .feture-title {
    color: var(--color-primary) !important;
    font-size: 24px !important;
}

.feature-card h5 {
    font-weight: 700;
    margin-bottom: 10px;
}

.feture-title {
    font-size: 20px !important;
    font-weight: 600;
}

.feture-title2 {
    font-size: 16px !important;
}

.feture-title1 {
    font-size: 20px !important;
    font-weight: 600;
    color: var(--color-primary) !important;
}

.feture-content {
    color: var(--color-white) !important;
}

.feature-topics {
    color: var(--color-black) !important;
    font-size: 35px !important;
    font-weight: 700;
    padding-bottom: 20px !important;
}

.keyfeature-card {
    border-radius: 25px !important;
    padding-bottom: 50px !important;
    background: var(--card-blue) !important;
}

.feture-title3 {
    font-size: 16px !important;
    color: var(--color-white) !important;
}

.badge-icon {
    font-size: 20px !important;
    color: var(--color-primary) !important;
    width: 20px;
    height: 20px;
}

.accordion {
    --bs-accordion-border-width: 0;
}

.feature-topic span {
    color: var(--color-primary) !important;
    font-weight: 700;
}

.chtbt-title span {
    color: var(--color-primary) !important;
}

@media (max-width: 767px) {
    .navbar-collapse {
        background: var(--color-home-bg);
        border-radius: 12px;
        padding: 20px;
        margin-top: 10px;
    }
}

.navbar-collapse {
    background-color: transparent !important;
}

/* Mobile (≤ 767px) */
@media (max-width: 767px) {
    .hero-title {
        font-size: 30px;
    }

    .hero-subtitle {
        font-size: 15px;
        padding: 0 10px;
    }

    .navbar-collapse {
        background: var(--color-home-bg);
        border-radius: 12px;
        padding: 20px;
        margin-top: 10px;
    }

    .navbar-nav {
        gap: 12px;
    }

    .features-section {
        padding: 60px 0;
    }
}

.navbar-nav .nav-link {
    font-weight: 600;
    color: var(--color-black);
    padding: 8px 0;
}

.business_card {
    border-radius: 10px;
    border: 2px solid var(--color-white) !important;
    background: var(--card-overlay-gradient), var(--header-blue) !important;
    box-shadow: var(--black-shadow) !important;
}

.start_head_title {
    font-size: 28px !important;
}

.footer-link {
    display: block;
    color: var(--color-black) !important;
    text-decoration: none;
    margin-bottom: 6px;
    font-size: 14px;
}

.platform-img {
    border-radius: 15px !important;
}