:root {
    --primary-color: #0974F2;
    --heading-color: #253053;
    --text-color: #464D62;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
    text-decoration: none;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 6rem;
    overflow-x: hidden;
    font-display: swap;
}

body {
    font-family: "Helvetica Neue", Arial, sans-serif;
    min-height: 100vh;
}

li {
    list-style: none;
}

/* For Chrome, Edge, Safari, Opera */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* For Firefox */
input[type=number] {
  -moz-appearance: textfield; /* hides arrows */
}

/* font weight */
.font_weight_1 {
    font-weight: 400 !important;
}

.font_weight_2 {
    font-weight: 500 !important;
}

.font_weight_3 {
    font-weight: 600 !important;
}

.font_weight_4 {
    font-weight: 700 !important;
}

.mb-1 {
    margin-bottom: 4px;
}

.mb-2 {
    margin-bottom: 8px;
}

.mb-3 {
    margin-bottom: 14px;
}

.mb-4 {
    margin-bottom: 18px;
}

.mb-5 {
    margin-bottom: 24px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mt-1 {
    margin-top: 4px;
}

.mt-2 {
    margin-top: 8px;
}

.mt-3 {
    margin-top: 14px;
}

.mt-4 {
    margin-top: 18px;
}

.mt-5 {
    margin-top: 24px;
}

.m-auto{
    margin: auto;
}

h1 {
    font-size: 3rem; /* ~48px */
    line-height: 1.2; /* ~57.6px */
}

h2 {
    font-size: 2.5rem; /* ~40px */
    line-height: 1.25; /* ~50px */
}

h3 {
    font-size: 2rem; /* ~32px */
    line-height: 1.3; /* ~41.6px */
}

h4 {
    font-size: 1.5rem; /* ~24px */
    line-height: 1.4; /* ~33.6px */
}

h5 {
    font-size: 1.25rem; /* ~20px */
    line-height: 1.5; /* ~30px */
}

h6 {
    font-size: 1rem; /* ~16px */
    line-height: 1.5; /* ~24px */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--heading-color)
}

p {
    font-size: 1rem;
    line-height: 1.5625rem;
    color: var(--text-color);
}


.font-30 {
    font-size: 1.875rem;
    /* line-height: 2.4rem; */
}

.font-35 {
    font-size: 2.19rem;
}


.font-28 {
    font-size: 28px;
}

.font-18 {
    font-size: 18px;
}

.font-45 {
    font-size: 45px;
}

.font-22 {
    font-size: 22px;
}

.text_underline {
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
}

.text-center {
    text-align: center;
}

.text-white {
    color: #fff;
}

.text-yellow {
    color: #FFEA07 !important;
}

.yellow_text {
    color: #FFC907;
}

.text-green {
    color: #29CC59;
}

.text-black {
    color: #000;
}

.text-grey {
    color: #777777 !important;
}

.head-color {
    color: var(--heading-color) !important;
}

.d-flex {
    display: flex
}

.gap-2 {
    gap: 8px;
}

.align-center {
    align-items: center;
}

.justify-center {
    justify-content: center !important;
}

.flex-wrap {
    flex-wrap: wrap;
}

.position-relative {
    position: relative;
}


.em {
    font-style: italic;
}

/* header */
header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0px 17px 7px rgba(5, 82, 163, 0.01),
        0px 9px 6px rgba(5, 82, 163, 0.02), 0px 4px 4px rgba(5, 82, 163, 0.03),
        0px 1px 2px rgba(5, 82, 163, 0.04);
    z-index: 1000;
}

header a {
    text-decoration: none;
    text-transform: none;
    color: #262f39;
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    font-family: Arial;
    transition: 0.4s ease-in-out;
}

.navbar {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    background: #fff;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    gap: 20px;
}


.navbar .logo,
.navbar .header_buttons {
    padding: 0 !important;
}

.logo-div {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.navbar .header_buttons{
    display: flex;
    align-items: normal;
    gap: 30px;
}

.contact-no{
    color: #676767;
}

.header-contact {
    display: flex; 
    align-items: center; 
    gap: 10px
}

.logo img {
    max-height: 54px;
}

.demo-header-btn{
    padding: 15px 30px;
    background: #0974F2;
    box-shadow: 0px 14px 10.2px rgba(9, 188, 255, 0.1);
    border-radius: 5px;
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.padding-20 {
    padding: 20px 0;
}

.padding-40 {
    padding: 40px 0;
}

.mb-0 {
    margin-bottom: 0px !important;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-40 {
    margin-bottom: 40px;
}

.img_fluid {
    max-width: 100%;
    margin: 0 auto;
}

.main_semibold_heading {
    font-size: 24px;
    font-weight: 600;
    color: #0974F2;
    margin-bottom: 10px;
}

.main_section {
    padding: 40px 0;
}

.main_section .small_heading {
    font-size: 16px;
    font-weight: 600;
    color: #253053;
    margin-bottom: 20px;
}

.sub_content_heading {
    font-size: 20px;
    color: #636B83;
    margin-bottom: 64px;
}

.sub_content_heading.mb-0 {
    margin-bottom: 0;
}

.btn {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    padding: 15px 20px;
    border-radius: 8px;
    cursor: pointer;
}

.lg_block {
    display: block;
}

.lg_none {
    display: none;
}

.primary_btn {
    background: #0974F2;
    color: #fff;
    border: 1px solid #0974F2;
}

.primary_outlined_btn {
    background: #fff;
    color: #0974F2;
    border: 1px solid #0974F2;
}

.white_btn {
    background: #fff;
    color: #0974F2;
    border: 1px solid #fff;
}

.white_outlined_btn {
    background: transparent;
    color: #fff;
    border: 1px solid #fff;
}

.container_holder {
    /* max-width: 1170px; */
    max-width: calc(100vw - 15%);
    margin: 0 auto;
}

.whatsapp_clickable_holder {
    display: inline-block;
    position: fixed;
    right: 0;
    top: 320px;
    z-index: 100000;
}

.desktop_view {
    display: block;
}

.mobile_view {
    display: none;
}

.main_row_holder {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px;
}

.row_reverse_holder {
    flex-direction: row-reverse;
}

.main_row_holder .left_holder {
    width: calc(50% - 15px);
}

.main_row_holder .right_holder {
    width: calc(50% - 15px);
}

.banner_text {
    color: #0974f2;
}

.left_banner {
    width: calc(55% - 10px);
}

.right_banner {
    width: calc(45% - 10px);
}

.banner_buttons {
    margin-top: 40px;
}

.left_banner .sub_banner_text,
.left_banner .typed-text {
    color: #0974f2;
    font-size: 48px;
}

.content .popover_banner {
    margin-top: 10px;
    margin-bottom: 20px;
}

.content ul {
    list-style-type: none;
}

.content ul li {
    line-height: 2;
    display: flex;
    align-items: center;
}

.content .left_banner li h5 {
    font-weight: 600;
    font-size: 18px;
    color: #262f39;
}

.content .left_banner ul li span {
    color: #808080;
}

.content ul li::before,
.project_management ul li::before,
.main_index_page ul li::before {
    content: "";
    background-color: #29cc59;
    display: inline-block;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    margin-right: 10px;
}

.main_heading_one {
    color: #253053;
    font-size: 48px;
    line-height: 1;
    font-weight: 700;
    margin-bottom: 20px;
}

.main_heading_two {
    color: #253053;
    font-weight: 700;
    font-size: 42px;
    margin-bottom: 48px;
}

.main_heading_three {
    font-weight: 600;
    font-size: 30px;
    color: #ffffff;
    margin-bottom: 20px;
}

.main_heading_four {
    color: #253053;
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 15px;
}

.main_heading_five {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 10px;
}

.banner_section {
    /* margin-top: 65px; */
    margin-top: 59px;
}

.header_buttons .new_Btn {
    border-radius: 5px;
    padding: 15px 30px;
    box-shadow: 0px 14px 10.2px rgba(9, 188, 255, 0.1);
    white-space: nowrap;
}

.header_buttons .contact_us {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lp_banner_section {
    padding: 50px 0;
    background: url("../lp/image/NewBanner.svg") no-repeat;
    background-size: cover;
    background-position: center;
}

.thankyou_section {
    padding: 100px 0;
    background: url("../lp/image/ty_bg.png") no-repeat;
    background-size: cover;
    background-position: center;
    /* min-height: 450px; */
    min-height: calc(100vh - 157px);
    max-height: calc(100vh - 157px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.thankyou_holder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    color: #ffffff;
    /* margin-top: 20px; */
}

.thankyou_holder .main_heading_one {
    font-weight: 800;
    font-size: 48px;
    text-align: center;
    color: #FFFFFF;
    margin-bottom: 0px;

}

.thankyou_holder .thankyou_content {
    font-size: 24px;
    font-weight: 400;
    font-size: 24px;
    text-align: center;
    color: #EDF3F9;
    margin-bottom: 0px;
}

.thankyou_content.mail-contact {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.mail-icon {
    margin: 0px 5px;
    display: flex;
}

.containerBg {
    padding: 30px 0;
    background: url("../lp/image/background.png") no-repeat;
    background-size: cover;
    background-position: center;
}

.lp_banner_section .left_holder .main_heading_three {
    color: #FFDC21;
    font-weight: 500;
}

.lp_banner_section .left_holder .main_heading_one {
    color: #ffffff;
}

.lp_banner_section .left_holder .header_text {
    color: #ffffff;
    font-weight: 400;
}

.lp_banner_list .features_list {
    list-style-type: none;
}

.lp_banner_list .features_list li {
    display: flex;
    gap: 12px;
    font-size: 20px;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 15px;
}

.lp_banner_list .features_list li::before {
    content: url('../lp/image/yellow-arrow.svg');
    width: 16px;
    height: 11px;
    display: inline-block;
}

.lp_banner_list .price_text {
    color: #FFC907;
    text-decoration: line-through
}

.lp_banner_section .ribbon {
    display: flex;
    align-items: center;
    padding: 4px;
    width: 170px;
    /* height: 24px; */
    font-size: 16px;
    background: #29CC59;
    clip-path: polygon(0% 0%, 100% 0%, calc(100% - 20px) 50%, 100% 100%, 0% 100%);
}

.monitoring_testimonal {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.text_center {
    text-align: center;
}

.two_columns_holder,
.flexbox_holder {
    display: flex;
    flex-wrap: wrap;
}

.w-33 {
    width: 33.33%;
}

.two_columns_holder .w-50 {
    width: 50%;
}

.three_columns_holder {
    justify-content: space-between;
    gap: 16px;
}

.three_columns_holder .w-33 {
    width: calc(33.33% - 16px);
}

.border_btm {
    border-bottom: 1px solid #e5e5e5;
}

.vertical_tabs_holder,
.image_content_tabs {
    display: flex;
    align-items: flex-start;
}

.cstm_white_card {
    display: flex;
    flex-direction: column;
    padding: 10px 0px;
    gap: 20px;

    background: #FFFFFF;
    border: 2px solid #95C1F6;
    box-shadow: 8px 8px 8px rgba(97, 141, 250, 0.16);
    border-radius: 10px;

}

.cstm_white_card .card__text {
    padding: 0px 20px;
}

.cstm_white_card .card__text .main_heading_five {
    font-weight: 600;
    font-size: 20px;
    color: #253053;
}

.cstm_white_card .card__text .content {
    font-weight: 400;
    font-size: 16px;
    color: #464D62;
    margin-top: 10px
}

.cstm_card_holder {
    background: #fff;
    border: 1px solid #EDF3F9;
    border-radius: 8px;
    padding: 15px;
}

.cstm_white_card .heading_container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.cstm_white_card .heading_container .heading {
    font-size: 16px;
    font-weight: 600;
    color: #0974F2;
    margin-bottom: 0;
}

.cstm_white_card .content_holder {
    font-size: 14px;
    color: #636B83;
}

.cstm_white_card .heading {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #253053;
}

.cstm_white_card .content {
    font-size: 14px;
    color: #636B83;
}

.cstm_white_card .read_link {
    display: inline-block;
    font-size: 14px;
    color: #0974F2;
    padding-top: 20px;
}

.cstm_white_card.no_content {
    padding: 16px;
}

.cstm_white_card.no_content .flexbox_holder {
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
}

.cstm_white_card.no_content .img_holder,
.cstm_white_card.no_content .heading,
.cstm_white_card .heading.mb-0 {
    margin-bottom: 0;
}

.banner_row_card_holder .cstm_banner_white_card {
    background: #FFFFFF;
    border: 1px solid #D1DAE4;
    border-radius: 10px;
    padding: 16px;
    gap: 20px;
    width: 285px;
}

.cstm_banner_white_card .rating {
    color: #29cc59;
    margin-left: 5px;
    font-weight: 600;
    font-size: 16px;
}

.two_card_row_holder {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.two_card_row_holder .cstm_white_card,
.two_card_row_holder .cstm_card_holder {
    width: calc(50% - 10px);
}

.three_card_row_holder {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.three_card_row_holder .cstm_white_card {
    width: 370px;
}

.three_card_row_holder.center {
    justify-content: center;
}

.four_card_row_holder {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.four_card_row_holder .cstm_white_card {
    width: 276px;
}

.client_detail {
    display: flex;
    gap: 35px;
    height: 100%;
}

.client_avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    width: 110px;
    height: 100%;
    border: 2px solid rgba(57, 76, 83, 0.25);
    box-shadow: 0px 4px 10.2px rgba(9, 188, 255, 0.1);
    border-radius: 50%;
    height: max-content;
}

.client_thought {
    padding: 20px;
    gap: 10px;
    background: #FFFFFF;
    border: 1px solid #BDDBFF;
    border-radius: 5px;
    width: 425px;
    position: relative;
    /* height: 290px; */
    display: flex;
    flex-direction: column;
    text-align: left;
}

.client_thought::before {
    content: url('../lp/image/Client-arrow.svg');
    display: inline-block;
    position: absolute;
    left: -40px;
    top: 40px;
}

.client_detail:hover .client_avatar {
    border: 1px solid #09BCFF;
}

.client_detail:hover .client_thought {
    border: none;
    background: #FFFFFF;
    box-shadow: 0px 4px 4px rgba(2, 67, 91, 0.25);
    border-radius: 5px;
}

.blue_gradient_bg_holder {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 315px;
    background: url("../lp/image/CTA-BG.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
    padding: 30px 0px;
}

.blue_gradient_bg_holder .main_heading_two,
.blue_gradient_bg_holder .main_heading_five,
.blue_gradient_bg_holder .sub_content_heading {
    color: #fff;
    margin-bottom: 24px;
}

.blue_gradient_bg_holder .sub_content_heading.mb-0 {
    margin-bottom: 0;
}

.blue_gradient_bg_holder .main_heading_five.mb-40 {
    margin-bottom: 40px;
}

.blue_gradient_bg_holder .content_holder {
    font-size: 18px;
    margin-bottom: 40px;
}

.container_holder>.blue_gradient_bg_holder {
    padding: 60px 30px;
    border-radius: 20px;
}

/* .container_holder>.blue_gradient_bg_holder .main_heading_two {
    font-size: 36px;
} */

.blue_gradient_bg_holder .two_sided_equal_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.blue_gradient_bg_holder .two_sided_equal_container .main_heading_two {
    text-align: left;
    margin-bottom: 0;
    font-weight: 700;
    color: #FFFFFF;
}

.blue_gradient_bg_holder .two_sided_equal_container .main_heading_four {
    text-align: left;
    color: #ffffff;
    font-weight: 500;
    font-size: 20px;
}

.blue_gradient_bg_holder .text_content {
    /* font-style: italic; */
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #EDF3F9;
    text-align: left;
}

.yellow_btn {
    color: #394C53;
    background: #FFDC21;
    box-shadow: 0px 14px 10.2px rgba(9, 188, 255, 0.1);
    border-radius: 10px;
    padding: 13px 67px;
}

.demo_btn {
    display: flex;
}

/* Footer */

.endfooter {
    background: #253053;
    border-bottom: 1px solid #36424f;
    padding: 30px 0px;
}

.footer_section .end_footer_row {
    display: flex;
    justify-content: space-between;
    /* flex-wrap: wrap; */
}

.footer_section .end_footer_row p {
    color: #EDF3F9;
    font-size: 20px;
    font-weight: 400;
}

.form_holder {
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid #09BCFF;
    box-shadow: 0px 4px 10.2px #09BCFF;
    border-radius: 15px;
    padding: 10.5px;
    margin-left: 50px;
    /* width: 480px; */
    /* width: 480px;
    height: 525px; */
}

.banner_form_holder {
    background: #FFFFFF;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
}

.cstm_form_control {
    background: #F4F7FA;
    border: 1px solid #88A5C7;
    border-radius: 8px;
    font-size: 14px;
    padding: 15px 10px;
    /* background: rgba(255, 255, 255, 0.1); */
    border: 1px solid #2CACDB;
    box-shadow: 0px 14px 10.2px rgba(9, 188, 255, 0.1);
    border-radius: 10px;
}

.cstm_form_control::placeholder {
    color: #9BA4AE;
}

.cstm_form_control.w-100,
.w-100 {
    width: 100%;
}

.lp_banner_section .muted_txt {
    font-weight: 400;
    font-size: 13px;
    color: #394C53;
    text-align: center;

}

.banner_form_holder .main_heading_three {
    font-weight: 600;
    font-size: 32px;
    text-align: center;
    color: #0974F2;
}

.banner_form_holder .sub_content_heading {
    color: #464D62;
    font-weight: 600;
    text-align: center;
}

.banner_form_holder .yellow_btn {
    text-align: center;
}

.cstm_form_control::placeholder {
    color: #394C53;
}

.form_holder .cstm_form_control.required::after {
    content: "*";
    color: red;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 1.2em;
}

.banner_form_holder .each_input_holder {
    position: relative;
}

.banner_form_holder .each_input_holder input {
    width: 100%;
    padding: 16px 12px;
    font-size: 16px;
    border: 1.5px solid #00bfff;
    border-radius: 10px;
    outline: none;
}

.banner_form_holder .placeholder-text {
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    color: #555;
    pointer-events: none;
    font-size: 16px;
}

.banner_form_holder .placeholder-text .asterisk {
    color: red;
}

.banner_form_holder .each_input_holder input:focus+.placeholder-text,
.each_input_holder input:not(:placeholder-shown)+.placeholder-text {
    display: none;
}

.banner_form_holder input::placeholder {
    color: transparent;
}

.warning-text {
    color: #e60505;
    justify-content: left;
    display: flex;
    font-size: 14px;
}

.disabled-button-style {
    cursor: not-allowed !important
}

.mb_view_text {
    display: none;
}

.founder_name {
  margin-top: auto;
}

/* PRICING CSS */

.custom-navbar {
    position: sticky;
    transition: all .2s linear;
}

.custom-navbar.navbar-scrollEffect {
    background-color: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
}

.our_pricing_card .feature_comparison_table_button {
    padding: 20px 0px 0px;
}

.new-pricing-banner {
    margin-top: 0;
}

.text_price_strike {
    font-weight: 600;
    font-size: 23px;
    line-height: 142%;
    color: #253053;
    position: relative;
    display: inline-block;
    padding: 0 10px;
}

.text_price_strike::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 3px;
    background-color: #FF6200;
    transform: translateY(-50%);
}

.pricing-footer {
    padding: 18px 0;
    background: #0974F2;
}

.pricing-footer * {
    font-size: 14px !important;
}

.text_bold_name {
    font-size: 24px;
    font-weight: 500;
    color: #253053;
    font-weight: 600;
    line-height: 139%;
}

.feature_comparison_table_head .main_sub_heading {
    color: #464D62;
    margin-bottom: 0;
}

.text_head_bold {
    color: #253053;
    font-weight: 700;
    font-size: 1.875em;
    line-height: 35px;
    margin-top: 8px;
}

.plan_list .text__para {
    line-height: 16px;
    color: #464D62;
}

.price-tag {
    height: 75px;
    justify-content: center;
    align-items: center;
    display: flex;
}

.space-hidden {
    visibility: hidden;
}

.faq_collapsible .text_about_name {
    margin-left: 0px;
    text-align: left;
}

.text-left {
    text-align: left;
}

.faq-desc {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #464D62;
    margin-top: 10px;
}

section.main_section.faq.main_section {
    background: #F7FBFF;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-top: 40px;
}

.faq_collapsible {
    border: none;
    border-bottom: 1px solid #0974f2;
    background: transparent;
}

.faq-header {
    position: relative;
    margin-bottom: 35px;
    padding-bottom: 13px;
}

.faq-header::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -5px;
    transform: translateX(-50%);
    width: 97px;
    height: 1px;
    background-color: #0974F2;
    border-radius: 1px;
}

.features .features_comparison_table thead th {
    min-width: 150px;
}

.table-title {
    color: #253053;
}

/* Modal Overlay */
.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    align-items: center;
    justify-content: center;
    z-index: 1000001;
    overflow-y: auto;
}

.modal-overlay.show {
    display: flex;
}

/* Modal Container */
.modal {
    background-color: white;
    width: 90%;
    max-width: 500px;
    box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.12);
    border-radius: 8px;
    padding: 2.5rem;
}

/* Modal Content */
.modal-body .headings h4 {
    color: #0974F2;
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    text-align: center;
}

.modal-body .headings p {
    font-size: 1rem;
    text-align: center;
    color: #6E6E6E;
    margin: .5rem;
}

.modal-body .headings .caption {
    font-size: 0.9rem;
    color: #323A43;
    margin-bottom: 1rem;
}

/* Form Styles */
.modal-body form {
    display: flex;
    flex-direction: column;
    gap: 0.80rem;
}

.modal-body form input[type="text"],
.modal-body form input[type="email"],
.modal-body form input[type="number"] {
    padding: 10px 14px;
    font-size: 0.95rem;
    border: 1px solid #EFEFEF;
    border-radius: 8px;
    outline: none;
    transition: border-color 0.2s ease;
}

.modal-body form input[type="text"]:focus,
.modal-body form input[type="number"]:focus,
.modal-body form input[type="email"]:focus {
    border-color: #0974F2;
}

.modal-body form input[type="submit"],
.demo-btn {
    background-color: #0974F2;
    color: white;
    font-weight: bold;
    border: none;
    padding: 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.modal-body form input[type="submit"]:hover,
.demo-btn:hover {
    background-color: #0554b5;
}

.banner_form_holder.pricing {
    padding: 0
}

/* landing page1 banner */
.lp-banner {
    background-image: url('../lp/image/banner1.webp');
    background-position: center;
    background-size: cover;
}

.banner-container {
    padding: 47px 10px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: auto;
    gap: 30px;
    min-height: 513px;
}

.icon-div {
    width: 24px;
    text-align: left;
}

.left {
    /* flex: 1; */
    width: 50%;
}

.hash-div {
    display: flex;
    align-items: end;
    gap: 10px;
    margin-bottom: 0.7rem;
}

.hash-div img {
    max-width: 60px;
    max-height: 57px;
    width: 100%;
    margin-bottom: -12px;
}

.left h1 {
    margin-bottom: 27px;
    line-height: 1.2;
    font-weight: 500;
}

.features {
    margin: 27px 0 30px;
    list-style: none;
    color: #fff;
}

.features li {
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    gap: 17px;
    color: #fff;
}

.features li p {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
}

.lp-banner.productivity .features li p{
    font-weight: 400;
    font-size: 16px;
}

.price-strike {
    position: relative;
}

.price-strike::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 2px;
    background-color: #FF6200;
    transform: translateY(-50%);
}

.company-ratings {
    display: flex;
    gap: 15px;
    margin-top: 20px;
    /* flex-wrap: wrap; */
    align-items: center;
}

.trust-image {
    max-width: 90px;
    min-width: 60px;
    max-height: 110px;
    width: 100%;
    object-fit: contain;
}

.company-card {
    background: #fff;
    color: #000;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.9rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 180px;
    min-height: 80px;
}

.company-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2px;
}

.company-card img {
    max-width: 100px;
    max-height: 32px;
    object-fit: contain;
}

.cstm_banner_white_card .rating,
.rating-value {
    color: #29cc59;
    padding-left: 5px;
    border-left: 1.6px solid #B6B6B6;
    font-weight: 600;
    font-size: 14px;
}

.rating-stars {
    margin-top: auto;
    display: flex;
    gap: 8px;
    align-items: center;
}

.rating-stars img {
    max-width: 14px;
    height: 14px;
}

.right {
    background: rgba(0, 0, 0, 0.33);
    padding: 30px;
    /* flex: 1; */
    width: 50%;
    max-width: 542px;
    box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.12);
    backdrop-filter: blur(21.2px);
    border-radius: 8px;
    border: .5px solid rgba(255, 255, 255, 0.3);
}

.landing-page-form {
    background-color: transparent;
    padding: 20px 10px 10px !important;
    gap: 8px;
}

.landing-page-form .each_input_holder input {
    background: transparent;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #fff;
    color: #fff;
    padding: 18px 0 10px;
}

.landing-page-form .placeholder-text {
    color: #fff !important;
    font-size: 16px;
    left: 0;
}

.submit-btn {
    outline: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px 20px;
    cursor: pointer;
    background: #00B9FF;
    border-radius: 8px;
    border: none;
    font-weight: 500;
    transition: background 0.3s ease;
}

.submit-btn:hover {
    background: #009acd;
}

/* landing page1 section 2 */

.clients-view {
    background-image:
        linear-gradient(to bottom, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, 1) 100%),
        linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 15%),
        url('../lp/image/landing-page/section2.webp');
    background-position: right top;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 80px 0;
    margin-bottom: 90px;
}

.text-blue {
    color: #0974F2;
}

.clients-view .title {
    line-height: 38px;
}

.client-stack {
    display: flex;
    flex-direction: column;
    padding: 40px 0 0;
    gap: 25px;
}

.client-review {
    display: flex;
    gap: 20px;
    align-items: center;
}

.review-card {
    padding: 20px;
    background: #FFFFFF;
    box-shadow: 0px 186px 74px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    max-width: 770px;
}

.client-review:nth-child(even) .review-card {
    background: var(--primary-color);
    color: white;
}

.client-review:nth-child(even) .review-card * {
    color: white;
}

.client-review img {
    max-width: 100px;
    max-height: 100px;
}

.clients-view .title,
.center-title,
.feature-title {
    position: relative;
    padding-bottom: 16px;
    font-weight: 600;
}

.center-title {
    text-align: center;
}

.clients-view .title::before,
.feature-title::before,
.center-title::before {
    content: '';
    height: 1px;
    width: 70px;
    position: absolute;
    left: 0;
    border-bottom: 1.5px solid var(--primary-color);
    bottom: 0;
}

.center-title::before {
    left: 50%;
    transform: translate(-50%, -50%);
}

/* landing page1 section 3 */

.key-features {
    margin-bottom: 90px;
}

.key-features .client-stack {
    gap: 30px;
}

.feature-card {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
    /* padding: 34px 48px; */
    padding: 50px 7%;
    background: #F0F7FF;
    border-radius: 13px;
}

.feature-card:nth-child(even) {
    background: #F1FFF5;
    flex-direction: row-reverse;
}

.feature-list {
    margin-top: 5px;
    display: grid;
    gap: 8px;
}

.feature-image {
    margin: 0 auto;
    position: relative;
}

.feature-image .img {
    max-width: 307px;
    max-height: 330px;
    width: 100%;
}

.feature-title {
    padding-bottom: 9px;
}

.ss1-image {
    position: absolute;
    right: -52%;
    top: 9%;
    max-width: 279px;
    filter: drop-shadow(63px -18px 26px rgba(9, 116, 242, 0.01)) drop-shadow(35px -10px 22px rgba(9, 116, 242, 0.05)) drop-shadow(16px -5px 16px rgba(9, 116, 242, 0.09)) drop-shadow(4px -1px 9px rgba(9, 116, 242, 0.1));
    border-radius: 8px;
}

.ss2-image {
    position: absolute;
    left: 64%;
    bottom: 32%;
    max-width: 280px;
    border: 1px solid #EAEBEC;
    box-shadow: 94px -46px 42px rgba(109, 238, 148, 0.01), 53px -26px 35px rgba(109, 238, 148, 0.05), 24px -12px 26px rgba(109, 238, 148, 0.09), 6px -3px 14px rgba(109, 238, 148, 0.1);
    border-radius: 8px;
}

.ss3-image {
    position: absolute;
    left: 64%;
    bottom: 14%;
    max-width: 212px;
    border: 1px solid #EAEBEC;
    box-shadow: 35px -27px 18px rgba(9, 215, 71, 0.01), 20px -15px 15px rgba(9, 215, 71, 0.03), 9px -7px 11px rgba(9, 215, 71, 0.04), 2px -2px 6px rgba(9, 215, 71, 0.05);
    border-radius: 8px;
}

.ss3-image.first {
    max-width: 268px;
}

.ss4-image {
    position: absolute;
    right: 64%;
    bottom: 10%;
    max-width: 244px;
    box-shadow: -35px -22px 17px rgba(9, 116, 242, 0.01), -20px -12px 14px rgba(9, 116, 242, 0.03), -9px -5px 10px rgba(9, 116, 242, 0.07), -2px -1px 6px rgba(9, 116, 242, 0.1);
    border-radius: 6px;
}

.ss7-image {
    position: absolute;
    left: 64%;
    max-width: 250px;
    top: -7%;
    border: 1px solid #EAEBEC;
    box-shadow: 41px -26px 19px rgba(9, 116, 242, 0.01), 23px -15px 16px rgba(9, 116, 242, 0.05), 10px -7px 12px rgba(9, 116, 242, 0.09), 3px -2px 7px rgba(9, 116, 242, 0.1);
    border-radius: 4px;
}

.ss8-image {
    position: absolute;
    left: 80%;
    max-width: 162px;
    bottom: -46px;
    border: 1px solid #E1E6EE;
    box-shadow: 0px 72px 29px rgba(9, 116, 242, 0.01), 0px 41px 24px rgba(9, 116, 242, 0.05), 0px 18px 18px rgba(9, 116, 242, 0.09), 0px 5px 10px rgba(9, 116, 242, 0.1);
    border-radius: 4px;
}

.feature-card:nth-child(even) .feature-image {
    margin-left: 0;
}

.feature-card:nth-child(even) .feature-list {
    margin: 0 auto;
}

.feature-description {
    width: 50%;
}

/* landing page1 section 4 */

.stats {
    margin-bottom: 90px;
    padding: 50px 0;
    background: #F1FFF5;
}

.stats-chart {
    display: flex;
    gap: 20px;
    padding: 40px 12px 0;
    justify-content: space-between
}

.stats-chart .chart-vs {
    border-left: 2px solid #979797;
    position: relative;
}

.stats-chart .chart-vs::before {
    content: 'vs';
    position: absolute;
    padding: 7px 17px;
    background: #F1FFF5;
    border-radius: 23px;
    border: 1px solid #000000;
    border-radius: 23px;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.stats-chart .chart {
    display: flex;
    gap: 13px;
}

.stats-chart .chart img {
    max-width: 249px;
    width: 100%;
}

.chart-description {
    display: grid;
    gap: 14px;
}

.chart-description div:nth-child(odd) {
    margin-left: -40px;
}

/* landing page1 section 5 */

.work-description {
    display: flex;
    align-items: center;
    justify-content: center;
}

.work-description .title {
    padding-right: 60px;
    border-right: 1px solid var(--primary-color);
    margin-right: 30px;
}

.work-section {
    margin-bottom: 90px;
}

.work-mode {
    margin-top: 40px;
    display: flex;
    gap: 30px;
    justify-content: center;
    align-items: stretch;
}

.mode-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 20px;
    max-width: 348px;
    border: 1px solid #DFEEFF;
    border-radius: 6px;
    width: 100%;
}

.mode-icon {
    width: 50px;
    height: 50px;
    background: #DFEEFF;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
}

.mode-card:hover {
    border: 1px solid #29CC59;
    box-shadow: 14px 127px 51px rgba(218, 255, 229, 0.01), 8px 72px 43px rgba(218, 255, 229, 0.05), 3px 32px 32px rgba(3, 119, 37, 0.06), 1px 8px 18.9px rgba(218, 255, 229, 0.07);
}

.mode-card:hover .mode-icon {
    background: #DAFFE5;
}

.mode-card:hover .mode-icon svg path {
    fill: #29CC59;
}

.mode-card:nth-child(2):hover .mode-icon svg path {
    fill: transparent;
    stroke: #29CC59;
}

.mode-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* landing page1 section 6 */

.pricing-plan {
    margin-bottom: 90px;
    padding: 50px 0;
    background-image: url('../lp/image/landing-page/pricing-bg.webp');
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
}

.pricing-plan .center-title {
    color: #fff;
}

.pricing-plan .center-title::before {
    border-color: #fff;
}

.price-section {
    max-width: max-content;
    margin: auto;
    position: relative;
}

.old-price {
    font-size: 3.4rem;
    color: white;
    padding-top: 33px;
    font-weight: 700;
    position: relative;
    margin-bottom: 22px;
    padding: 33px 10px 0;
}

.new-price {
    position: absolute;
    right: -97px;
    top: 15px;
    color: white;
    font-size: 2.8rem;
    font-family: system-ui;
    font-style: italic;
}

.old-price::before {
    content: '';
    position: absolute;
    top: 72%;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: red;
    transform: rotate(-19deg);
    transform-origin: center;

}

.pricing-inclusion-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 17px;
    background: rgba(255, 255, 255, 0.62);
    box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.12);
    backdrop-filter: blur(13.35px);
    border-radius: 8px;
    gap: 10px;
    max-width: 344px;
    width: 100%;
}

.pricing-inclusion-card .description {
    display: flex;
    gap: 14px;
    text-align: left;
}

.pricing-inclusion {
    display: flex;
    gap: 30px;
    align-items: stretch;
    justify-content: center;
    margin-top: 40px;
}

.demo-btn {
    font-size: 16px;
    cursor: pointer;
    padding: 14px 23px;
}

/* landing page1 section 7 */

.teamtrace-working {
    margin-bottom: 90px;
}

.functionality {
    display: flex;
    justify-content: space-between;
    align-items: start;
    padding: 40px;
    gap: 10px;
    background: #F7FBFF;
    border-radius: 13px;
    margin-top: 40px;
    gap: 20px;
}

.functions {
    width: 50%;
}

.functionality .img {
    max-width: 411px;
    max-height: 443px;
    width: 100%;
}

.accordion-item {
    border-bottom: 1px solid #99C4F7;
    padding: 12px 0;
}

.accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #00224f;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.accordion-header .arrow {
    color: #0974f2;
    transition: transform 0.3s ease;
}

.accordion-body {
    max-height: 0;
    overflow: hidden;
    color: #4a5568;
    font-size: 14px;
    transition: max-height 0s ease;
}

.accordion-item.active .accordion-body {
    max-height: 400px;
    margin-top: 10px;
}

.function-list {
    list-style: none;
    padding: 0;
    margin: 10px 0 0 0;
}

.function-list li {
    display: flex;
    align-items: center;
    margin: 6px 0;
    font-weight: 600;
    color: #1a202c;
}

.function-list .dot {
    color: #0974f2;
    font-size: 12px;
    margin-right: 8px;
}


.functionality-img {
    position: relative;
    margin: 0 auto;
}

.faq_collapsible {
    cursor: auto;
}

/* landing page1 section 8  */

.about-teamtrace {
    margin-top: 90px;
    background: linear-gradient(90deg, #043C8C 0%, #021A70 100%);
}

.about-container {
    padding: 50px 0 0;
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.about-description img {
    max-width: 200px;
    width: 100%;
    max-height: 54px;
}

.about-img {
    margin-bottom: -8px;
    max-width: 657px;
    width: 100%;
    max-height: 425px;
    padding: 4px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 4px;
    background: rgba(220, 220, 220, 0.3);
}

.about-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}

/* productivity langing page css */
/* header */

.custom-navbar.productivity-page {
    position: fixed;
    top: 20px;
    background: transparent;
    box-shadow: none;
}

.banner-header .navbar {
    padding: 10px 20px;
    background: #FFFFFF;
    box-shadow: 0px 546px 218px rgba(0, 0, 0, 0.01), 0px 307px 184px rgba(0, 0, 0, 0.05), 0px 136px 136px rgba(0, 0, 0, 0.09), 0px 34px 75px rgba(0, 0, 0, 0.1);
    border-radius: 14px;
}

.custom-navbar.productivity-page.navbar-scrollEffect {
    box-shadow: 0px 546px 218px rgba(0, 0, 0, 0.01), 0px 307px 184px rgba(0, 0, 0, 0.05), 0px 136px 136px rgba(0, 0, 0, 0.09), 0px 34px 75px rgba(0, 0, 0, 0.1);
    background: #fff;
    top: 0;
    position: fixed;
}

.custom-navbar.productivity-page.navbar-scrollEffect .navbar {
    box-shadow: none !important;
    padding-left: 0px;
    padding-right: 0px;
}


/* banner */
.productivity {
    background-image: url(../lp/image/productivity-page/banner.webp);
    z-index: 1;
    position: relative;
    margin-bottom: 60px;
}

.banner.productivity .banner-container {
    padding: 90px 0 40px;
}

.banner-description {
    line-height: 23px;
    width: 48%;
    margin: auto;
}

.banner.productivity .client-stack {
    z-index: 3;
    padding: 73px 0 40px;
}

.banner.productivity .features {
    display: flex;
    gap: 20px;
    margin: 0;
    justify-content: center;
    margin-top: 8px;
}

.banner.productivity .features li {
    padding: 8px 12px;
    min-width: 218px;
    max-height: 50px;
    background: #FFFFFF;
    border-radius: 70px;
    border: 1px solid #9AC8FF;
    margin-bottom: 0;
}


.banner.productivity .icon-div {
    width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.demo-btn.bg-green {
    background-color: #29CC59;
}

.demo-btn.bg-green:hover {
    filter: brightness(95%);
}

.producivity-stats {
    display: flex;
    /* justify-content: space-evenly; */
    justify-content: center;
    align-items: stretch;
}

.producivity-stats .stat-div {
    max-width: 275px;
    width: 100%;
    height: auto;
    padding: 0 2px;
    border-right: 1px solid #D3D3D3;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.producivity-stats div:last-child {
    border: none;
}

.banner.productivity .banner-left-image {
    position: absolute;
    left: 100px;
    top: 168px;
    z-index: 2;
}

.banner.productivity .banner-left-image img {
    max-width: 289px;
    height: auto;
}

.banner.productivity .banner-right-image {
    position: absolute;
    right: 100px;
    top: 168px;
    z-index: 2;
}

.banner.productivity .banner-right-image img {
    max-width: 318px;
    height: auto;
}

.banner-companies {
    background-color: var(--primary-color);
    padding: 30px 0;
}

.company-heading {
    display: inline-flex;
    align-items: center;
    position: relative;
    gap: 10px;

}

.company-heading::before {
    content: '';
    display: inline-block;
    height: 1px;
    width: 119px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to left, white 0%, white 30%, var(--primary-color) 100%);
}

.company-heading::after {
    content: '';
    display: inline-block;
    height: 1px;
    width: 119px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to right, white 0%, white 30%, var(--primary-color) 100%);
}

/* monitoring features css*/

.monitoring-feature {
    margin-bottom: 60px;
}

.gradiant-title {
    position: relative;
    text-align: center;
    font-weight: 500;
}

.gradiant-title::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -16px;
    transform: translateX(-50%);
    width: 70px;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--primary-color), transparent);
    border-radius: 2px;
}

.monitoring-feature .feature-image img {
    max-width: 500px;
    max-height: 310px;
    width: 100%;
}

.monitoring-feature .feature-description h5 {
    font-weight: 500;
    color: #464D62;
}

.monitoring-feature .client-stack {
    gap: 0;
}

.monitoring-feature .feature-card:nth-child(odd) {
    background-color: #fff;
}

.monitoring-feature .feature-card:nth-child(4n - 2) {
    background-color: #E5F1FF;
}

.monitoring-feature .feature-card {
    border-radius: 0;
}

.monitoring-feature.productivity-feature .feature-card {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* feature grid section css*/
.feature-grid-section {
    margin-bottom: 60px;
}

.feature-grid {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 20px;
    padding: 50px 0 40px;
    flex-wrap: wrap;
}

.feature-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 19px 20px;
    flex: 0 0 32%;
    min-height: 140px;
    background: #EEF6FF;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.feature-box:nth-child(even) {
    background: #E8FFEF;
}

.feature-box .icon {
    font-size: 24px;
    margin-bottom: 10px;
}

.feature-box h5 {
    font-weight: 500;
}


/* cta section css */

.cta-section.pricing-plan {
    background-image: url(../lp/image/productivity-page/bg-2.webp);
    margin-bottom: 0;
    background-size: auto;
    background-position: left;
}

/* platform css */

.platform-icons {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap;
    position: relative;
    margin-bottom: 20px;
}

.platform-icons::before {
    content: '';
    display: inline-block;
    height: 1.5px;
    width: 70px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to left, var(--primary-color) 0%, var(--primary-color) 30%, #fff 100%);
}

.platform-icons::after {
    content: '';
    display: inline-block;
    height: 1.5px;
    width: 70px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to right, var(--primary-color) 0%, var(--primary-color) 30%, #fff 100%);
}

.platform-icons img {
    width: 55px;
    height: 55px;
    object-fit: contain;
}

/* productivity plan css */
.productivity-pricing-plan {
    background-image: url(../lp/image/productivity-page/bg-1.webp);
    margin-bottom: 60px;
}

.gradiant-title.text-white::before {
    width: 70px;
    background: linear-gradient(to right, transparent, #fff, transparent);
}

.productivity-pricing-plan * {
    color: #fff;
}

.productivity-pricing-plan .price-strike {
    width: max-content;
    margin: 0 auto;
    padding: 0 20px;
}

.productivity-pricing-plan .pricing-inclusion-card {
    background: transparent;
    box-shadow: none;
    max-width: max-content;
    gap: 16px;
}

.svg-div {
    width: 20px;
}

.svg-div svg {
    width: 22px;
}

.productivity-pricing-plan .pricing-inclusion {
    justify-content: space-between;
    gap: 0;
    flex-wrap: wrap;
}

/* testimonial section css */

.testimonial-section {
    margin-bottom: 60px;
    overflow: hidden;
}

.testimonial-container .container_holder {
    position: relative;
    padding: 40px 0 30px;
}

.testimonial-container .container_holder::before {
    content: '';
    background-color: #3E96FF;
    position: absolute;
    height: 100%;
    width: 169px;
    top: 0;
    left: 40px;
}

.testimonial-container {
    margin-top: 50px;
    background-color: var(--primary-color);
}

.testimonial-container * {
    color: #fff;
}

.testimonial-slider-wrapper {
    overflow: hidden;
    width: 80%;
    margin: 0 auto;
}

.testimonial-slider {
    display: flex;
    transition: transform 0.5s ease-in-out;
    width: calc(100% * 2);
}

.testimonial-slide {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    padding: 20px 30px;
    gap: 50px;
}

.testimonial-image {
    flex: 0 0 176px;
    position: relative;
}

.testimonial-image.mrs {
    flex: 0 0 197px
}

.testimonial-image img {
    max-width: 176px;
    height: auto;
    border-radius: 4px;
}

.testimonial-image.mrs img {
    max-width: 197px;
}

.testimonial-content {
    flex: 1;
    min-width: 0;
    color: #fff;
    text-align: left;
    position: relative;
}

.testimonial-text {
    z-index: 2;
    position: relative;
}

.testimonial-content::before {
    content: '';
    background-image: url(../lp/image/productivity-page/qoute.webp);
    position: absolute;
    top: -35px;
    left: -30px;
    z-index: 0;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.testimonial-dots {
    margin-top: 20px;
    text-align: center;
}

.testimonial-dots .dot {
    width: 10px;
    height: 10px;
    margin: 0 6px;
    background: #ccc;
    display: inline-block;
    cursor: pointer;
    z-index: 11;
    position: relative;
}

.testimonial-dots .dot.active {
    background: #fff;
}

/* footer */

.custom-footer {
    position: relative;
    width: 100%;
    bottom: 0;
}

.modal .placeholder-text {
    font-size: 14px;
}

.btn-light {
    background: #fff;
    color: var(--primary-color) !important;
}

.btn-light:hover {
    color: #fff !important;
}

.custom-footer.light .pricing-footer {
    background: #fff;
}

.custom-footer.light .pricing-footer * {
    color: #464D62 !important;
}


/* field track landing page */
.lp-banner.field-tracking {
    background-image: url('../lp/image/field-tracking-page/banner.webp');
    background-position: center;
    background-size: cover;
}

.lp-banner.field-tracking .banner-container {
    padding: 135px 0 47px;
}


/* client logo scroll css */

.client-logos-section {
    padding: 50px 0 60px;
    background: #fff;
}

.logo-marquee {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.logo-track {
    display: flex;
    width: max-content; /* expand naturally based on items */
    animation: scroll-left 25s linear infinite;
}

.logo-item {
    flex: 0 0 auto;
    padding: 0 30px; /* spacing between logos */
}

.logo-item img {
    max-height: 47px; /* adjust as needed */
    width: auto;
    display: block;
}

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* field tracking feature css */
.fieldTracking-feature-title {
    width: 60%;
}

.monitoring-feature.field-tracking-feature .feature-card:nth-child(even) {
    background-color: #fff;
}

.monitoring-feature.field-tracking-feature .feature-card:nth-child(4n - 3) {
    background-color: #E5F1FF;
}

.monitoring-feature.field-tracking-feature .feature-card:nth-child(4n - 1) {
    background-color: #F1FFF5;
}

.monitoring-feature.field-tracking-feature .feature-card:nth-child(4n - 1) li::marker {
    color: #29CC59;
}

.feature-list-tracking li {
    list-style: disc;
    font-size: 18px;
    margin-left: 20px;
    padding-top: 11px;
    color: #777777;
}

.feature-list-tracking li::marker {
    color: var(--primary-color);
    font-size: 20px;
}

.field-tracking-form .each_input_holder select {
    font-weight: 400;
    line-height: 1.5;
    color: #FFFFFF;
    text-align: left;
    outline: none !important;
    border: none !important;
    border-bottom: 1px solid #EFEFEF !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    background: transparent !important;
    padding: 16px 12px !important;
    padding-left: 0 !important;
    font-size: 15px;
    cursor: pointer;
    position: relative;
    padding-right: 35px !important;
    -webkit-tap-highlight-color: transparent !important;
    -webkit-focus-ring-color: transparent !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 100%;
}

.field-tracking-form .each_input_holder {
    position: relative;
}

.field-tracking-form .each_input_holder .arrow {
    border: solid #F3F7FD;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
    width: 9px;
    height: 9px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    position: absolute;
    right: 15px;
    top: 50%;
    transform-origin: center;
    margin-top: -3px;
    pointer-events: none;
    opacity: 0.8;
    transition: all 0.3s ease;
}

.placeholder-text.hidden {
    display: none;
}

.field-tracking-form .each_input_holder:hover .arrow {
    opacity: 1;
    transform: rotate(45deg) translateY(-50%) scale(1.1);
    -webkit-transform: rotate(45deg) translateY(-50%) scale(1.1);
}

.field-tracking-form .each_input_holder .arrow.rotated {
    opacity: 1;
    transform: rotate(225deg) translateY(-50%);
    -webkit-transform: rotate(225deg) translateY(-50%);
}

.field-tracking-form .each_input_holder select option {
    background-color: #1a1a1a;
    color: #ffffff;
    padding: 10px;
    border: none;
    font-family: "Helvetica Neue", sans-serif;
    font-size: 14px;
    width: 150px;
}

.field-tracking-form .each_input_holder select option:hover {
    background-color: #0974F2;
    color: #ffffff;
}

.field-tracking-form .each_input_holder select option:checked {
    background-color: #0974F2;
    color: #ffffff;
    font-weight: 500;
}

.field-tracking-form .each_input_holder select option[disabled] {
    display: none;
}

.field-tracking-form .dropdown-arrow {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 24px;
    height: 24px;
}


.field-tracking-feature .feature-description h4, .head-grey {
    color: #373737;
}

.field-tracking-feature .feature-description h5 {
    color: #777777;
}

.field-tracking-testimonial {
    background-image: url("./image/field-tracking-page/testimonialBanner.webp") !important;
    background-size: cover;
    position: relative;
    background-position: right;
}

.field-tracking-testimonial .testimonial-container {
    background-color: transparent;
}

.field-tracking-testimonial .container_holder::before {
    display: none
}

.field-tracking-testimonial .testimonial-content::before {
    display: none
}

.field-tracking-testimonial .testimonial-container .container_holder {
    padding: 0;
}

.field-tracking-testimonial .testimonial-dots .dot {
    border-radius: 50%;
}

.company-card.border {
    background: #FFFFFF;
    border: 1px solid #0974F2;
    border-radius: 10px;
    width: 201px;
    padding: 14px;
}

.field-tracking-platforms {
    margin-bottom: 60px;
}

.field-tracking-cta.cta-section {
    margin: 0 auto;
    background: rgba(41, 204, 89, 0.13);
    margin-bottom: 60px;
    padding: 40px 0;
}

.field-tracking-about {
    background-image: url('./image/field-tracking-page/dashboard-frame-overlay.webp') !important;
    background-size: cover;
    position: relative;
    background-position: left top;
    background-color: #043C8C;
}

.cta-text {
    margin: 14px auto;
}

.side-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.side-line::before {
    content: '';
    display: inline-block;
    height: 1.5px;
    width: 70px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to right, var(--primary-color) 0%, var(--primary-color) 30%, #fff 100%);
}

.side-line::after {
    content: '';
    display: inline-block;
    height: 1.5px;
    width: 70px;
    background: #fff;
    align-self: center;
    background: linear-gradient(to left, var(--primary-color) 0%, var(--primary-color) 30%, #fff 100%);
}

.faq_collapsible .text_about_name {
    color: #464D62;
}

/* industry section */

.industries-section {
    padding: 50px 0;
    background: #0974F2;
    color: white;
}

.industries-section * {
    color: #fff;
}

.industries-section .industries-divider {
    width: 111px;
    height: 1px;
    margin: auto;
    background: linear-gradient(90deg, rgba(9, 116, 242, 1) 0%, rgba(243, 247, 253, 1) 51%, rgba(9, 116, 242, 1) 100%);
}

.industries-content {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    gap: 30px;
    /* min-height: 640px; */
    margin-top: 40px;
}

.industries-grid {
    display: flex;
    flex-direction: column;
    gap: 18px;
    flex: 1 1 50%;
}


.industry-card {
    transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
    transform: translateZ(0);
    cursor: pointer;
    display: flex;
    gap: 14px;
    align-items: center;
}

.industry-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(9, 116, 242, 0.12);
}

.industry-card.active {
    transform: scale(1.01);
    box-shadow: 0 8px 25px rgba(9, 116, 242, 0.18);
}

.industry-card.active h4 {
    color: #FFEA07;
}

.industry-icon {
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.industry-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

.industry-card.active .industry-icon img {
    filter: brightness(0) saturate(100%) invert(76%) sepia(95%) saturate(2808%) hue-rotate(23deg) brightness(107%) contrast(104%);
}

.industry-card h4 {
    transition: color 0.3s ease;
}

.industry-description {
    transition: all 0.3s ease;
    display: none;
}

.industry-description.show {
    display: block;
    margin-left: 36px;
}

.industries-visual {
    flex: 1 1 50%;
}

.industries-visual img{
    max-width: 100%;
    height: 604px;
    object-fit: cover;
    border-radius: 10px;
}

/* field employee mrs */

.lp-banner.field-tracking.field-monitoring {
    background-image: url('../lp/image/field-employee-mrs/banner.webp');
    background-size: cover;
}

.right.monitoring{
    background: rgba(0, 0, 0, 0.3);
    box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.12);
    backdrop-filter: blur(21.2px);
    border-radius: 8px;
    border: 1px solid #509BF4;
}

.testimonial-slide.monitoring img{
    border-radius: 50%;
}

.about-container.monitoring{
    padding: 30px 0;
    display: block;
}

.about-teamtrace.monitoring {
    background-image: url("./image/common/bg-2.webp") !important;
    background-size: cover;
    position: relative;
    background-position: left top;
    background-color: #043C8C;
    text-align: center;
}

.industries-section.mr-performance {
    background-image: url("./image/common/bg-1.webp") !important;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 60px 0;
}

.flex-container{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.left-section{
    flex: 1 1 50%;
}

.right-section{
    flex: 1 1 50%;
}

.mr-performance .right-section{
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    gap: 15px;
}

.mr-performance .left-section{
    padding-right: 53px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.mr-performance .left-section img{
    max-width: 492px;
    max-height: 572px;
    width: 100%;
}

.mr-performance .mr-performance-title{
    font-size: 22px;
    font-weight: 500;
}

.mr-performance .mr-performance-desc{
    font-size: 18px;
    font-weight: 500;
}

.mr-performance-div:not(:last-child){
    padding-bottom: 15px;
    border-bottom: 1px solid #4B4B4B;
}

.mr-tracking .feature-card{
    background-color: #D9EAFF !important;
    /* padding: 50px 135px;     */
}

.about-teamtrace.monitoring img {
    max-width: 285px;
    max-height: 77px;   
}

.about-teamtrace.monitoring .about-container {
    padding: 50px 0;
    justify-content: center;
    gap: 20px;
}

.mr-tracking.monitoring-feature img{
    max-height: 389px;
}

/* field employee Support */

.lp-banner.field-tracking.field-support {
    background-image: url('../lp/image/field-employee-support/banner.webp');
    background-size: cover;
}

.lp-banner.field-support .right{
    background: rgba(0, 53, 116, 0.2);
    box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.12);
    backdrop-filter: blur(21.2px);
    border-radius: 8px;
    border: 1px solid #509BF4;
}

/* field tracking for business */
.lp-banner.business {
    background-image: url(../lp/image/workforce-monitoring/banner.webp);
    margin-bottom: 0;
}

.banner.productivity.business .banner-left-image img {
    max-width: 298px;
}

.banner.productivity.business .banner-right-image img {
    max-width: 293px;
}

.lp-banner.business * {
    color: #fff;
}

.demo-btn.bg-yellow {
    background-color: #FFDC21;
    color: #000;
    padding: 15px 20px;
    font-weight: 500;
}

.lp-banner.business .banner-companies {
    background-color: transparent;
    padding: 10px 0 30px;
}

.lp-banner.business .banner-container {
    gap: 0;
    min-height: auto;
    padding: 90px 0 0;
}

.cstm_banner_white_card .rating,
.rating-value {
    color: #29cc59 !important
}

.mb-60 {
    margin-bottom: 60px;
}

.project-mastry-img {
    max-width: 642px;
    border-radius: 19px;
}

.project-mastry-icon {
    width: 90px;
    height: 90px;
    background: rgba(9, 116, 242, 0.06);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 24px;
    border-radius: 50%;
}

.project-mastry .flex-container {
    flex-wrap: nowrap;
    gap: 42px;
}

.leadership-section.pricing-plan {
    background-image: url(../lp/image/workforce-monitoring/bg1.webp);
}

.leadership-desc-box {
    padding: 17px 18px;
    max-width: 318px;
    background: rgba(255, 255, 255, 0.11);
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
}

.leadership-desc-box p {
    color: #fff !important;
    text-align: left;
}

.leadership-desc-box-container {
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.leadership-desc-box-container .leadership-desc-box {
    width: 263px
}

.leadership-desc-box-container .leadership-desc-box:first-child {
    margin-left: 8%;
}

.leadership-desc-box-container .leadership-desc-box:last-child {
    margin-right: 7%;
}

.meet-section h3,
.center-heading {
    width: 70%;
    text-align: center;
    margin: auto;
}

.meet-box {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.meet-icon {
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.11);
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #0974F2;
}

.meet-div {
    display: flex;
    flex-wrap: wrap;
    row-gap: 24px;
    justify-content: space-between;
}

.meet-box {
    flex: 0 0 47%;
}

.cta-section.workforce {
    background-image: url(../lp/image/workforce-monitoring/bg2.webp);
    background-position: center !important;
    background-size: cover !important;
}

.pricing-plan.workforce {
    background-image: url(../lp/image/workforce-monitoring/bg4.webp);
    background-position: center !important;
    background-size: cover !important;
    background-color: #0974F2;
}

.price_strike {
    position: relative;
    display: inline-block;
}

.price_strike::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 10px;
    background-image: url(../lp/image/workforce-monitoring/cross.webp);
    background-repeat: repeat-x;
    background-size: contain;
    transform: translateY(-50%);
}

.workforce-price-amount {
    position: relative;
    width: max-content;
    margin: auto;
    margin-top: 65px;
    font-weight: bold;
}

.current-price-div {
    padding: 8px 14px;
    position: absolute;
    right: -100px;
    top: -55px;
    background: rgba(255, 234, 7, 0.9);
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    transform: rotate(-4.63deg);
    line-height: 23px;
    color: #253053;
}

.pricing-plan.workforce .leadership-desc-box {
    width: max-content;
    padding: 9.5px 18px;
    max-width: max-content;
    height: max-content;
    backdrop-filter: blur(2.1px);
    -webkit-backdrop-filter: blur(2.1px);
}

.grid-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    column-gap: 160px;
    justify-content: center;
    margin-top: 40px;
    min-height: 300px
}

.client-review-workforce .client_thought::before {
    content: url('../lp/image/workforce-monitoring/arrow.svg');
    left: -33px;
    top: 37px;
}


/* media Queries */

@media (max-width: 1690px) {
   .banner.productivity .banner-right-image {
        right: 50px;
    }

    .banner.productivity .banner-left-image {
        left: 50px;
    }
}

@media (max-width: 1440px) {
   .banner.productivity .banner-right-image {
        right: -20px;
    }

    .banner.productivity .banner-left-image {
        left: -20px;
    }

    .leadership-desc-box-container .leadership-desc-box:first-child {
        margin-left: 6%;
    }

    .leadership-desc-box-container .leadership-desc-box:last-child {
        margin-right: 5%;
    }
}

/* Tablet */
@media (max-width: 1400px) {
    /* landing page section 2 */
    .review-card {
        max-width: 700px;
    }

    .hash-div img {
        margin-bottom: -11px;
        max-width: 50px;
    }

    .ss1-image {
        right: -41%;
        top: 9%;
        max-width: 243px;
    }

    .ss2-image {
        bottom: 30%;
        max-width: 242px;
    }

    .ss3-image {
        max-width: 180px;
    }

    .ss1-image.first,
    .ss4-image {
        max-width: 210px;
    }

    .ss7-image {
        max-width: 215px;
    }
}

@media (max-width: 1280px) {

    /* workfoce productivity */
    .project-mastry-img {
        max-width: 100%;
    }

    .project-mastry .flex-container {
        align-items: end;
    }

    .banner.buusiness .banner-left-image {
       left: 0;
    }

    .banner.buusiness .banner-left-image {
      right: 0;
    }

    .banner.productivity .banner-left-image img, .banner.productivity .banner-right-image img {
      max-width: 235px !important;
    }

}

@media (max-width: 1200px) {
    .main_content {
        max-width: 95%;
    }

    .container_holder {
        max-width: 1000px;
    }
     
    header .navbar a {
      font-size: 18px;
    }  

    .demo-header-btn {
      padding: 12px 15px;
    }

    .main_section,
    .lp_banner_section,
    .endfooter {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* landing page */

    .company-card img {
        max-width: 80px;
    }

    .stats-chart .chart img {
        max-width: 200px;
    }

    .chart-description div:nth-child(odd) {
        margin-left: -32px;
    }

    .ss1-image {
        right: -33%;
    }

    .ss3-image.first {
        max-width: 210px;
    }

    .ss8-image {
        left: 75%;
        max-width: 140px;
        bottom: -46px;
    }

    .emp-time-tracking .company-card {
        width: 110px;
        min-height: 60px;
        height: 60px;
        gap: 2px;
        padding: 7px;
    }

    .emp-time-tracking .company-card img {
        max-width: 40px;
        max-height: 20px;
    }

    .emp-time-tracking .rating-value {
        font-size: 9px;
    }

    .emp-time-tracking .rating-stars {
        margin-top: auto;
        display: flex;
        gap: 4px;
        align-items: center;
    }

    .emp-time-tracking .rating-stars img {
        height: 9px;
    }

}

@media (max-width: 1024px) {

    h1, .font-45 {
        font-size: 2.5rem;
        /* 40px */
        line-height: 1.2;
        /* ~48px */
    }

    h2 {
        font-size: 2.125rem;
        /* 34px */
        line-height: 1.25;
        /* ~42.5px */
    }

    h3 {
        font-size: 1.75rem;
        /* 28px */
        line-height: 1.3;
        /* ~36.4px */
    }

    h4 {
        font-size: 1.375rem;
        /* 22px */
        line-height: 1.4;
        /* ~30.8px */
    }

    h5 {
        font-size: 1.1875rem;
        /* 19px */
        line-height: 1.5;
        /* ~28.5px */
    }

    h6 {
        font-size: 1rem;
        /* 16px (unchanged) */
        line-height: 1.5;
        /* ~24px */
    }


    .font-18, .feature-list-tracking li {
        font-size: 98%;
    }

    .md_block {
        display: block;
    }

    .md_none {
        display: none;
    }

    .container_holder {
        max-width: 90%;
    }

    header .navbar .logo {
        padding: 8px;
    }

    .blue_gradient_bg_holder .two_sided_equal_container {
        justify-content: center;
    }

    .blue_gradient_bg_holder .two_sided_equal_container .each_sided_holder img {
        width: 45px;
    }

    .banner_form_holder .each_input_holder .flexbox_holder {
        flex-wrap: wrap;
    }

    /* landing page */

    .custom-navbar .header_buttons .new_Btn {
        padding: 10px 17px;
    }

    .stats-chart .chart img {
        max-width: 150px;
        max-height: 150px;
        object-fit: contain;
    }

    .chart-description {
        gap: 12px;
    }

    .chart-description div:nth-child(odd) {
        margin-left: -24px;
    }

    .chart-description p {
        font-size: 13px;
    }

    .mode-card {
        padding: 20px;
    }

    .ss2-image {
        left: 40%
    }

    .ss3-image {
        left: 60%;
    }

    /* productiity page css*/
    .banner-description {
        width: 70%;
    }

    .banner.productivity .banner-left-image, .banner.productivity .banner-right-image  {
        display: none;
    }

    .testimonial-container .container_holder::before {
        width: 110px;
        left: -17px;
    }

    .testimonial-slider-wrapper {
        width: 100%;
    }

    .company-heading::before,
    .company-heading::after {
        width: 70px;
    }
    /* workforce productivity */

    .meet-section h3,
    .center-heading {
        width: 100%
    }
}

@media (max-width: 991px) {

    header .navbar a {
      font-size: 16px;
    }

    .sm_block {
        display: block;
    }

    .sm_none {
        display: none;
    }

    .blue_gradient_bg_holder .two_sided_equal_container .equal_icon_heading {
        display: none;
    }

    .vertical_tabs_holder .outer_content_holder {
        width: 100%;
        padding-left: 0;
    }

    .two_columns_holder .w-50 {
        width: 100%;
    }

    .form_holder {
        margin-left: 0;
    }

    .three_card_row_holder .cstm_white_card,
    .four_card_row_holder .cstm_white_card,
    .blue_info_container_block .left_holder,
    .blue_info_container_block .right_holder {
        max-width: 100%;
        width: 100%;
    }

    .w-33 {
        width: 100% !important;
    }

    .image_content_tabs {
        flex-wrap: wrap;
    }

    .image_content_tabs .left_tabs_holder,
    .image_content_tabs .outer_content_holder {
        width: 100%;
        position: static;
    }

    .image_content_tabs .left_tabs_holder {
        min-height: auto;
        display: none;
    }

    .toolCard_text {
        padding-left: 0;
    }

    .cstm_white_card>div {
        justify-content: center;
    }

    .project_management .project_management_right_side ul li {
        justify-content: left;
    }

    .image_content_tabs .outer_content_holder .content_section {
        min-height: auto;
    }

    .home.banner_section .main_heading_two,
    .home.banner_section .popover_banner,
    .home.banner_section .muted_txt,
    .home.banner_section .right_banner.right_holder,
    .project_management .project_management_right_side p.text__para,
    .cstm_white_card,
    .image_content_tabs .outer_content_holder .content_section[data-feature-slider-content],
    .image_content_tabs .outer_content_holder .content_section[data-feature-slider-content] * {
        text-align: center;
    }

    .home .content {
        padding: 0 1rem;
    }

    .footerSection {
        padding-left: 20px;
    }

    .banner_center_content {
        display: block;
        text-align: center;
    }

    .right_holder,
    .main_row_holder .left_holder,
    .main_row_holder .right_holder,
    .main_row_holder .left_inner_page_holder,
    .main_row_holder .right_inner_page_holder {
        width: 100%;
        /* margin-top: 15px; */
    }

    .main_row_holder .left_holder {
        margin-bottom: 20px;
    }

    .main_row_holder,
    .row_reverse_holder {
        display: block;
        text-align: center;
    }

    .four_columns_holder .w-25 {
        width: 100%;
    }

    .main_row_holder .right_inner_page_holder .form_container label {
        text-align: left;
    }

    .employee__activity {
        gap: 20px;
    }

    .left_banner {
        width: 100%;
    }

    .right_banner {
        width: 100%;
        margin-top: 25px;
    }

    .text_align_center {
        text-align: center;
    }

    .client_detail {
        gap: 10px;
    }

    .client_avatar {
        height: 100%;
    }

    .client_thought {
        width: 100%;
    }

    .client_thought::before {
        display: none;
    }

    /* landing page */


    .feature-description {
        width: 100%;
    }

    .left {
        min-width: 50%;
    }

    .stats-chart {
        flex-direction: column;
        align-items: start;
        gap: 37px;
    }

    .stats-chart .chart {
        margin: 0 auto;
        width: 429px;
    }

    .stats-chart .chart-vs {
        border-bottom: 2px solid #979797;
        border-left: none;
        position: relative;
        width: 100%;
    }

    .ss1-image {
        right: -21%;
        max-width: 150px;
    }

    .ss2-image {
        left: -21%;
        max-width: 215px;
        bottom: 34%;
    }

    .ss3-image {
        left: -21%;
        max-width: 150px;
    }

    .ss1-image.first {
        max-width: 140px;
    }

    .ss4-image {
        max-width: 220px;
    }

    .ss4-image {
        max-width: 185px;
    }

    .ss3-image.first {
        max-width: 165px;
    }

    .ss7-image {
        left: 49%;
    }

    /* productivity page css*/

    .producivity-stats p {
        font-size: 12px;
        line-height: 17px !important;
    }

    .features li p {
       font-size: 16px;
     }

    .feature-box {
        flex: 0 1 300px;
    }

    .banner.productivity .banner-container {
        padding: 70px 0 0px;
    }

    /* field tracking css */

    .fieldTracking-feature-title {
        width: 100%;
    }
}

@media (max-width: 768px) {

    .footer_section .footer-col {
        width: calc(50% - 16px);
    }

    .footer_section .footer-col:nth-child(-n + 3) {
        width: calc(33.33% - 16px);
    }

    .home .content {
        display: block;
        text-align: center;
    }

    .left_banner .sub_banner_text {
        margin-bottom: 0px;
    }

    .main_heading_one,
    .thankyou_holder .main_heading_one {
        font-size: 30px;
    }

    .main_heading_two {
        font-size: 24px !important;
        margin-bottom: 25px;
    }

    .left_banner .sub_banner_text,
    .left_banner .typed-text {
        font-size: 30px;
    }

    .text_align_center {
        text-align: center;
    }

    .desktop_view {
        display: none;
    }

    .mobile_view {
        display: block;
    }

    .whatsapp_clickable_holder.mobile_view {
        top: 250px;
    }

    .whatsapp_clickable_holder.call-icon {
        top: 200px;
        /* background: #29CC59; */
        border: 1px solid #29CC59;
        border-radius: 5px 0px 0px 5px;
        padding: 3px;
    }

    .whatsapp_clickable_holder.call-icon img {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .client_detail {
        flex-wrap: wrap;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .header-contact {
        display: none;
    }

    .thankyou_content.mail-contact {
        justify-content: center;
    }

    .faq_main_content {
        padding: 0px;
    }

    .faq_collapsible .text_about_name {
        font-size: 16px;
        line-height: 21px;
    }

    .right {
        padding: 22px;
    }

    .industries-content {
        flex-wrap: wrap;
    }

    .industries-grid {
        width: 100%;
    }

}

@media (max-width: 767px) {

    /*  basic*/
    .flex-md-wrap {
        flex-wrap: wrap;
    }

    h1, .font-45 {
        font-size: 2rem;
        /* 32px */
        line-height: 1.2;
        /* ~38.4px */
    }

    h2 {
        font-size: 1.75rem;
        /* 28px */
        line-height: 1.25;
        /* ~35px */
    }

    h3 {
        font-size: 1.5rem;
        /* 24px */
        line-height: 1.3;
        /* ~31.2px */
    }

    h4, .font-22 {
        font-size: 1.25rem;
        /* 20px */
        line-height: 1.4;
        /* ~28px */
    }

    h5 {
        font-size: 1.125rem;
        /* 18px */
        line-height: 1.5;
        /* ~27px */
    }

    h6 {
        font-size: 1rem;
        /* 16px (unchanged) */
        line-height: 1.5;
        /* ~24px */
    }

    .font-35 {
        font-size: 1.8rem;
    }


    /* landing page */
    .banner-container {
        flex-direction: column;
    }

    .left .company-ratings {
        width: 100%;
        margin-top: -25px;
    }

    .clients-view {
        background-image:
            linear-gradient(to bottom, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, 1) 100%),
            linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 15%),
            linear-gradient(to top, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, 1) 100%),
            url('../lp/image/landing-page/section2.webp');
    }

    .feature-card {
        flex-wrap: wrap;
    }

    .left,
    .right,
    .company-ratings {
        width: 100%;
        max-width: 100%;
    }

    .feature-card:nth-child(even) .feature-image {
        margin: 0 auto;
    }

    .pricing-inclusion {
        flex-wrap: wrap;
    }

    .pricing-inclusion-card {
        flex: 0 294px;
    }

    .work-mode {
        flex-wrap: wrap;
    }

    .functionality {
        flex-wrap: wrap;
    }

    .functions {
        width: 100%;
    }

    .functionality {
        padding: 20px;
        padding-top: 10px;
    }

    .about-container {
        flex-wrap: wrap;
    }

    .ss1-image {
        max-width: 200px;
    }

    .ss2-image {
        bottom: 30%;
        max-width: 250px;
    }

    .ss3-image {
        left: -21%;
        max-width: 182px;
    }

    .ss1-image.first {
        max-width: 178px;
    }

    .ss3-image.first {
        max-width: 210px;
    }

    .ss7-image {
        max-width: 250px;
    }

    .ss8-image {
        max-width: 160px;
    }

    /* producivity banner */
    .font-30 {
        font-size: 22px;
    }

    .producivity-stats p,
    .banner.productivity .features li p {
        font-size: 10px !important;
        line-height: 16px !important;
    }

    .banner.productivity .features li {
        padding: 4px 12px;
        min-width: auto;
        gap: 7px;
    }

    .banner.productivity .features {
        gap: 5px;
    }

    .banner.productivity .icon-div {
        width: 16px;
    }

    .banner.productivity .banner-right-image,
    .banner.productivity .banner-left-image {
        display: none;
    }


    .cta-section.pricing-plan {
        background-size: auto;
        background-position: left center;
    }

    .platform-icons img {
        max-width: 40px;
    }

    .testimonial-slide {
        flex-direction: column;
    }

    .testimonial-container .container_holder::before {
        width: 105px;
        left: 54px;
    }

    .testimonial-slide {
        padding: 0 30px;
    }

    .industries-visual img {
      height: auto;
    }

    /* field monitoring MR's */
    .flex-container {
        flex-wrap: wrap;
        flex-direction: column;
        gap: 30px;
    }

    .mr-performance .mr-performance-title {
        font-size: 20px;
    }

    .mr-performance .mr-performance-desc {
        font-size: 16px;
    }

    .mr-performance .left-section {
        text-align: center;
        padding-right: 0;
    }

    .mr-performance .left-section img {
        max-width: 60%;
        margin: auto;
        max-height: fit-content;
    }

    .about-description.monitoring img {
        max-width: 70%;
    }

    .about-teamtrace.monitoring {
        background-position: right;
    }

    /* workforce productivity */
    .project-mastry-icon {
        width: 60px;
        height: 60px;
    }

    .meet-icon {
        width: 40px;
        height: 40px;
    }

    .meet-icon svg {
        width: 22px;
        height: 22px;
    }

    .project-mastry-icon svg {
        width: 30px;
    }

    .meet-box {
        flex: 0 0 100%;
    }

    .grid-container {
    column-gap: 10px;
}
}

@media (max-width: 574px) {

    /* basic css */

    h2 {
        font-size: 1.5rem; /* 24px */
        line-height: 1.25; /* ~30px */
    }

    h3 {
      font-size: 1.3rem;   /* ~20.8px */
      line-height: 1.4;    /* ~29.1px */
    }

    h4 {
      font-size: 1.25rem;  /* 20px */
      line-height: 1.3;    /* 26px */
    }

    .font-22{
        font-size: 1.1rem;  
    }


    .text_head_bold {
        font-size: 25px;
        line-height: 29px;
    }

    .text_price_strike {
        font-size: 19px;
        line-height: 22px;
    }

    .price-tag {
        height: 64px;
    }

    .text_about_name {
        font-size: 13px;
    }

    .footer_section .end_footer_row {
        text-align: center;
        flex-direction: column;
        row-gap: 10px;
    }

    .btn, .demo-header-btn {
        font-size: 12px !important;
    }

    .header_buttons .new_Btn {
        padding: 10px 20px;
        text-align: center;
    }

    .lp_banner_list .features_list li {
        text-align: left;
        font-size: 14px;
    }

    .monitoring_testimonal {
        margin-top: 15px;
    }

    .call-number {
        display: none;
    }

    .footer_section .end_footer_row p {
        font-size: 14px;
    }

    .dt_view_text {
        display: none;
    }

    .mb_view_text {
        display: block;
    }

    .lp_banner_section .ribbon {
        width: 150px;
        font-size: 14px;
    }

    .demo_btn {
        align-items: center;
        justify-content: center;
    }

    .blue_gradient_bg_holder .two_sided_equal_container .main_heading_two {
        margin-bottom: 15px;
    }

    .blue_gradient_bg_holder .text_content {
        font-size: 16px;
    }

    .thankyou_holder .thankyou_content {
        font-size: 18px;
    }


    .faq .container_holder,
    .features .container_holder,
    .pricing_tabs_section .container_holder {
        max-width: 100%;
    }

    .logo img {
        max-width: 145px !important;
        width: 100%;
        margin: 0 auto;
    }

    .logo-div img {
      max-height: 45px;
    }

    .client_thought {
        height: auto;
    }

    header .navbar .logo {
        padding: 4px;
    }

    .time-tracking-logo {
        margin-top: 4px !important;
    }

    header .navbar.navbar-scrollEffect .logo {
        padding: 8px 0;
    }

    .lp-banner.field-tracking .banner-container {
        padding: 112px 0 47px;
    }

    /* landing page */
    .stats-chart .chart {
        width: 100%;
        gap: 16px;
    }

    .chart-description p {
        font-size: 10px;
        line-height: 16px;
    }

    .chart-description {
        gap: 4px;
    }

    .stats-chart .chart img {
        object-fit: contain;
        max-width: 120px;
    }

    .pricing-inclusion-card {
        max-width: 100%;
    }


    .font-28 {
        font-size: 24px;
    }

    .banner-container {
        padding: 35px 0;
    }

    .client-review {
        flex-wrap: wrap;
        justify-content: center;
    }

    .clients-view {
        background-position: right bottom;
    }

    .work-description .title {
        padding-right: 0;
        margin-right: 0;
        border-right: none;
    }

    .work-description {
        flex-direction: column;
        gap: 15px;
        align-items: start;
    }

    .teamtrace-working,
    .key-features,
    .stats,
    .work-section,
    .pricing-plan {
        margin-bottom: 40px;
    }

    .clients-view {
        padding: 50px 0;
        margin-bottom: 50px;
    }

    .ss4-image {
        right: 50%;
    }

    .ss8-image {
        left: 55%;
    }

    .ss7-image {
        max-width: 175px;
        top: -7%;
    }

    .functionality .img {
        max-height: 325px;
    }

    .functionality {
        gap: 33px;
    }

    /*modal  */
    .modal {
        padding: 1.7rem;
    }

    /* productiity page css*/
    .banner-description {
        width: 100%;
    }

    .producivity-stats.mt-5 {
        margin-top: 5px !important;
    }


    .font-35 {
        font-size: 1.5rem;
    }

    .platform-icons::before,
    .platform-icons::after {
        width: 30px;
    }

    .platform-icons img {
        max-width: 32px;
    }

    .banner.productivity .banner-container {
        padding: 100px 0 10px;
    }

    .banner-header .navbar {
        padding: 10px;
    }

    .feature-grid-section,
    .productivity,
    .monitoring-feature,
    .testimonial-section,.mb-60 {
        margin-bottom: 40px;
    }

    .client-stack {
        padding: 15px 0;
        gap: 20px;
    }

    .banner.productivity .client-stack {
        padding: 25px 0 !important;
    }

    section.main_section.faq.main_section {
        margin-top: 0;
    }

    .cta-section.pricing-plan {
        background-size: cover;
    }

    .productivity-pricing-plan .pricing-inclusion-card {
        gap: 1px;
        max-width: 100%;
        padding-bottom: 0;
    }

    .productivity-pricing-plan .pricing-inclusion {
        margin-top: 10px;
    }

    .productivity-pricing-plan .svg-div svg {
        width: 18px;
    }

    .producivity-stats .stat-div {
        gap: 0px;
    }

    /* field tracking landing page */
    .client-logos-section {
        padding: 30px 0 40px;
        background: #fff;
    }

    .field-tracking-feature .client-stack {
        padding: 40px 0;
    }

    .feature-list-tracking li {
        font-size: 14px;
        line-height: 19px;
    }

    .field-tracking-feature .demo-btn {
        padding: 10px;
    }

    .cta-section.pricing-plan {
        background-size: auto;
    }


    .field-tracking-platforms .company-card, .company-ratings.responsive  .company-card{
        padding: 9px;
        width: 100px;
        min-height: 67px;
        height: 67px;
        gap: 3px;
    }

    .field-tracking-platforms .rating-stars img,.company-ratings.responsive .rating-stars img{
        height: 9px;
    }

    .field-tracking-platforms .rating-stars, .company-ratings.responsive .rating-stars{
        margin-top: auto;
        display: flex;
        gap: 4px;
        align-items: center;
    }

    .field-tracking-platforms .rating-value, .company-ratings.responsive .rating-value{
        font-size: 10px;
    }

    .company-card img, .company-ratings.responsive  .company-card img {
        max-width: 55px;
    }

    .testimonial-slide {
        gap: 25px;
    }

    /* .field-tracking .features {
        margin: 20px 0 12px;
    } */

    .field-tracking-platforms .company-ratings {
        flex-wrap: wrap;
        align-items: center;
    }

    .testimonial-image img {
        max-width: 150px !important;
    }

    .testimonial-image.mrs {
     flex: 0 0 150px !important;
     }

    /* Field Tracking MR's */
    .mr-performance .mr-performance-title {
        font-size: 18px;
    }

    .mr-performance .mr-performance-desc {
        font-size: 14px;
    }

    .about-teamtrace.monitoring img {
        max-width: 73%;
    }

    /* field tracking support */
    .feature-card {
        padding: 40px 7%;
    }
    
    .industries-section.mr-performance, .about-teamtrace.monitoring .about-container, .pricing-plan, section.main_section.faq.main_section {
        padding: 40px 0;
    }

    .monitoring-feature.productivity-feature {
        margin-bottom: 0;
    }

    .leadership-desc-box-container .leadership-desc-box{
        margin: 0 !important;
    }
    
}

html.prevent-flash,
body.prevent-flash {
    overflow: hidden !important;
}

@media (max-width: 460px) {

    h1, .font-45  {
        font-size: 1.5rem;
        /* 24px */
        line-height: 1.2;
        /* ~28.8px */
    }

    h2 {
        font-size: 1.375rem;
        /* 22px */
        line-height: 1.25;
        /* ~27.5px */
    }

    h3 {
        font-size: 1.25rem;
        /* 20px */
        line-height: 1.3;
        /* ~26px */
    }

    h4 {
        font-size: 1.125rem;
        /* 18px */
        line-height: 1.4;
        /* ~25.2px */
    }

    h5 {
        font-size: 1.0625rem !important;
        /* 17px */
        line-height: 1.5 !important;
        /* ~25.5px */
    }


    p, .landing-page-form .placeholder-text {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .ss1-image {
        right: -9%;
    }

    .ss2-image {
        max-width: 235px;
        left: -11%;
    }

    .ss3-image {
        left: -11%;
        max-width: 163px;
    }

    .ss1-image.first {
        max-width: 160px;
    }

    .ss4-image {
        max-width: 163px;
    }

    .company-ratings {
        gap: 6px;
    }

    .company-card img {
        max-width: 40px;
        max-height: 20px;
    }

    .rating-value {
        font-size: 9px;
    }

    .rating-stars {
        margin-top: auto;
        display: flex;
        gap: 4px;
        align-items: center;
    }

    .rating-stars img {
        height: 9px;
    }

    .old-price {
        font-size: 2.4rem !important;
    }

    .new-price {
        font-size: 2rem !important;
    }

    .pricing-footer {
        padding: 10px 0;
    }

    .clients-view .title {
        line-height: 30px;
    }

    .about-teamtrace {
        margin-top: 50px;
    }

    /* productiity page css*/

    .custom-navbar .header_buttons .new_Btn {
        font-size: 13px !important;
    }

    .platform-icons img {
        max-width: 28px;
    }

    .platform-icons {
        gap: 20px;
    }

    /* field employee tracking page */
    .field-tracking-testimonial .testimonial-slide {
        padding: 0 0px;
    }


    .field-tracking-platforms .trust-image {
        max-height: 92px;
    }

    .field-tracking-platforms .rating-stars img {
        height: 8px;
    }

    .field-tracking-platforms.rating-stars {
        gap: 2px;
    }

    .field-tracking-platforms .company-card {
        min-height: 50px;
        height: 50px;
        gap: 2px;
        padding: 7px;
    }

    .field-tracking-platforms {
        margin-bottom: 40px;
    }

    .about-container {
        padding: 30px 0 0;
    }

    .font-30 {
        font-size: 20px !important;
    }

    /* workforce productivity */

    .lp-banner.business .company-ratings {
        margin-top: 10px;
    }

    .current-price-div {
        font-size: 14px !important;
        line-height: 18px;
        right: -41px;
        top: -41px;
    }

    .workforce-price-amount {
        margin-top: 57px;
    }
}

@media (max-width: 370px) {

    .ss2-image {
        bottom: 32%;
    }

    .ss1-image.first {
        max-width: 130px;
    }

    .logo img {
        max-width: 150px;
    }

    .ss4-image {
        right: 41%;
    }

    .ss7-image {
        left: 45%;
        max-width: 158px;
    }

    .ss8-image {
        max-width: 133px;
        left: 56%;
    }

    .new-price {
        right: -83px;
        font-size: 2.4rem;
    }

    .old-price {
        font-size: 2.8rem;
    }

    .company-card {
        width: 81px;
    }

    .company-title {
       flex-wrap: wrap;
    }

    .company-ratings {
       flex-wrap: wrap;
    }

    /* productivity page css*/

    .custom-navbar .header_buttons .new_Btn {
        padding: 8px;
        font-size: 12px;
    }

    .platform-icons img {
        max-width: 25px;
    }

    .platform-icons {
        gap: 18px;
    }

    .trust-image {
        max-width: 63px;
    }

    .company-card {
        width: 81px !important;
        min-height: 60px !important;
        height: 60px !important;
        gap: 2px !important;
        padding: 8px !important
    }

}