:root{
    --white: #FFFFFF;
    --black: #000000;
    --light-gray: #D9DADD;
    --dark-gray: #666666;
    --emerald-green: #0CCE6A;
    --amber: #FFA400;
    --crimson-red: #942525;
    --ivory: #FEFAEC;
    --peach: #FCCB74;
    --golden-rod:#FCB028;
    --mint-cream:#EDFFF9;
    --aquamarine: #3BEDA1;
    --jungle-green: #15B973;
    --lavender: #EDEEFF;
    --violet: #9F7AFE;
    --indigo:#472EFE;
    --trans-black: #0000001A;
    --transparent: transparent;
    --warm-amber:#fda2001c;
    --mint-green:#15b97326;
    --lav-purple:#9f7afe38;
    --v-light-gray: #F7F7F7;
    --medium-gray:#999999;
    --lightest-gray: #ccc;
    --blue-cyan:#3CC1E5;
    --soft-gray: #d2d2d2;
    --pastel-sky: #7fd6ee;
    --neutral-gray: #9f9d9d;
    --teal: #004c59;
    --charcoal-gray: #383838;
    --royal-blue: #1c52ac;
    --medium-blue: #4289ff;
    --coral-red: #f16e6e;
    --veryNeutral-gray:  #e9e9e9;
    --cyan-blue-light: #0a77a638;
    --black-light: #000000aa;
    --clean-gray: #f3f3f3;
    --luxury-red: #D20062;
    --blush-rose: #ed96bf;
    --transparent-orchid:#e771a830;
    --transparent-magenta: #d200622e;
    --awesome: FontAwesome;
    --box-shadow-btn: 0px 7px 29px 0px;
    --px0: 0;
    --px1: 1px;
    --px2: 2px;
    --px4: 4px;
    --px5: 5px;
    --px6: 6px;
    --px7: 7px;
    --px8: 8px;
    --px9: 9px;
    --px10: 10px;
    --px11: 11px;
    --px12: 12px;
    --px14: 14px;
    --px15: 15px;
    --px16: 16px;
    --px18: 18px;
    --px19: 19px;
    --px20: 20px;
    --px25: 25px;
    --px27: 27px;
    --px30: 30px;
    --px32: 32px;
    --px40: 40px;
    --px43: 43px;
    --px46: 46px;
    --px48: 48px;
    --px50: 50px;
    --px60: 60px;
    --px70: 70px;
    --px80: 80px;
    --px90: 90px;
    --fw1: 100;
    --fw2: 200;
    --fw3: 300;
    --fw4: 400;
    --fw5: 500;
    --fw6: 600;
    --fw7: 700;
    --fw8: 800;
    --fw9: 900;
    --width1: 33.33%; 
    --percen1: 10%;
    --percen2: 20%;
    --percen3: 30%;
    --percen4: 40%;
    --percen5: 50%;
    --percen6: 60%;
    --percen7: 70%;
    --percen8: 80%;
    --percen9: 90%;
    --percen10: 100%;
    --block: block;
    --flex: flex;
    --none: none;
    --grid: grid;
    --inline: inline;
    --center: center;
    --left: left;
    --right: right;
    --wrap: wrap;
    --nowrap: nowrap;
    --relative: relative;
    --absolute: absolute;
    --fixed: fixed;
    --auto: auto;
    --inherit: inherit;
    --unset: unset;
    --bold: bold;
    --flex-end: flex-end;
    --flex-start: flex-start;
}
/*pricingcard css*/
/*free card*/
.price-free .pricy_newcrd_btn a {
    background: linear-gradient(180deg, var(--blush-rose) 0%, var(--luxury-red) var(--percen10));
}
.pricing-card.price-free {
    background: linear-gradient(180deg, var(--transparent-orchid), transparent);
}
.price-free .pricy_newcrd_btn:hover a {
    border: 1px solid var(--luxury-red);
    color: var(--luxury-red) !important;
    background: transparent !important;
    box-shadow: var(--transparent-magenta) var(--box-shadow-btn);
}
/*free card end*/
.pricing-card {
    border: var(--px1) solid var(--light-gray);
    border-width: var(--px1);
    border-radius: var(--px20);
    padding: var(--px20) var(--px15);
    width: Var(--width1);
}
.price_new_cardhead img {
    width: var(--px48) !important;
    margin-right: var(--px12);
}
.price_new_cardhead h5 {
    display: var(--flex);
    align-items: var(--center);
    justify-content: var(--center);
}
.dynamic_rates span.table_header_price {
    font-weight: var(--fw6);
    font-size: var(--px32);
    line-height: var(--px46);
    letter-spacing: 0%;
    color: var(--black);
    margin-right:var(--px10);
}
span.price_actual_rate {
    font-weight: var(--fw3);
    font-size: var(--px18);
    line-height: var(--px46);
    letter-spacing: var(--px0);
    text-decoration: line-through;
    color: var(--dark-gray);
}
.pricy_newcrd_btn a {
    width: var(--percen10);
    border-radius: var(--px10) !important;
    font-weight: var(--fw6);
    font-size: var(--px20) !important;
    line-height: var(--px18) !important;
    padding: var(--px18) !important;
    text-transform: uppercase;
    color: var(--white) !important;
    text-align: var(--center);
}
.pricy_newcrd_btn {
    width: var(--percen10);
}
.price_point_section_new {
    margin-top: var(--px20);
}
p.price-point-header {
    font-weight: var(--fw5);
    font-size: var(--px18);
    line-height: var(--px27);
}
.pricy_new_point_cst span {
    font-weight: var(--fw6);
    font-size: var(--px18);
    line-height: var(--px16);
}
span.greeny_txt {
    color: var(--emerald-green);
}
.pricy_new_point_cst {
    font-weight: var(--fw5);
    font-size: var(--px14);
    line-height: var(--px20);
}
i.fa.fa-info-circle {
    color: var(--dark-gray);
}
span.orangy_txt {
    color: var(--amber);
}
.price_point_section_new  .pricy_new_point_cst:not(:last-child) {
    border-bottom: var(--px1) solid var(--trans-black);
    padding-bottom: var(--px15);
}
i.fa.fa-check-circle {
    color: var(--emerald-green);
    margin-right: var(--px10);
}
i.fa.fa-times-circle {
    color: var(--crimson-red);
    margin-right: var(--px10);
}
.pricing-card.price-basic {
    background: linear-gradient(180deg, var(--ivory) 0%, var(--white) 100%);
}
.pricing-card.price-basic .pricy_newcrd_btn a {
    background: linear-gradient(180deg, var(--peach) 0%, var(--golden-rod) 100%) !important;
}
.pricing-card.price-advance {
    background: linear-gradient(180deg, var(--mint-cream) 0%, var(--white) 100%);
}
.pricing-card.price-advance .pricy_newcrd_btn a {
    background: linear-gradient(180deg, var(--aquamarine) 0%, var(--jungle-green) 100%);
}
.pricing-card.price-expert {
    background: linear-gradient(180deg, var(--lavender) 0%, var(--white) 100%);
}
.pricing-card.price-expert .pricy_newcrd_btn a {
    background: linear-gradient(180deg, var(--violet) 0%, var(--indigo) 100%);
}
.pricing-main-div-parent {
    justify-content: var(--center);
}
.pricing-main-div-parent {
    display: var(--flex);
    column-gap: var(--px20);
}
@media(max-width:1199px){
    .pricing-main-div-parent .pricing-card {
        width: var(--percen10) !important;
        max-width:350px;
    }
    .pricing-main-div-parent {
        flex-wrap: var(--wrap);
        row-gap: var(--px20);
        justify-content: var(--center);
    }
}
section.vc_section.pricing-card-main {
    padding-left: var(--px0);
    padding-right: var(--px0);
    margin-left: var(--px0);
    margin-right: var(--px0);
}
span.cost-time {
    display: var(--block);
    margin-bottom: var(--px10);
}
.dynamic_rates {
    text-align: var(--center);
}
.pricing-card:hover {
    transform: translateY(-8px);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    transition: 0.3s;
}
.pricing-card {
    transition: 0.3s;
}
.pricing-card.price-basic .pricy_newcrd_btn:hover a {
    border-color: var(--amber);
    background: var(--transparent) !important;
    color: var(--amber) !important;
    box-shadow: var(--warm-amber) var(--box-shadow-btn);
}
.pricing-card.price-advance .pricy_newcrd_btn:hover a {
    border-color: var(--jungle-green);
    background: var(--transparent) !important;
    color: var(--jungle-green) !important;
    box-shadow: var(--mint-green) var(--box-shadow-btn);
}
.pricing-card.price-expert .pricy_newcrd_btn:hover a{
    border-color: var(--violet);
    background: var(--transparent) !important;
    color: var(--violet) !important;
    box-shadow: var(--lav-purple) var(--box-shadow-btn);
}
div.pricing-main-tab.active-tab {
    animation: zoom-ani 0.5s ease-in-out;
}
@keyframes zoom-ani{
    0%{
        transform: scale(0.8);
        opacity: var(--px0);
    }
    100%{
        transform: scale(1);
        opacity: 1;
    }
}
.parent-pop-div .custom-css-popup {
    background-color: var(--charcoal-gray) !important;
    background-image: radial-gradient(circle at 100% 100%, #16acb7, #fff0 110%), radial-gradient(circle farthest-side at 0 0, #51adcb, #fff0 97%) !important;
}
.mob-tools-filter {
    display: var(--none);
}
.cst-w3pop-content1 span.popup-next-button {
    border-radius: var(--px10) !important;
}
.parent-pop-div .custom-css-popup .close-button {
    border-radius: var(--px10) !important;
    height: var(--px30);
    width: var(--px30);
}
.cst-w3pop-content1 span.popup-previous-button {
    border-radius: var(--px10) !important;
}
.cst-w3pop-content1 button.btn.btn-outline-primary {
    border-radius:var(--px10) !important;
}
.parent-pop-div .custom-css-popup {
    border-radius:var(--px10) !important;
}
.cst-w3pop-content1 span.price_html.product_price_detail span.woocommerce-Price-amount.amount {
    border-radius: var(--px10) !important;
}
.parent-pop-div .custom-css-popup .close-button {
    width: var(--px30) !important;
    height: var(--px30) !important;
}
.parent-pop-div .custom-css-popup {
    padding: var(--px30) var(--px20) var(--px10) var(--px20) !important;
}
/* Bottom filter button */
.mobile-menu-pricing .filter-btn {
    position: var(--fixed);
    bottom: var(--px0);
    left: var(--px0);
    width: var(--percen10);
    background: linear-gradient(to var(--right), var(--royal-blue), var(--medium-blue));
    color: var(--white);
    text-align: var(--center);
    padding: var(--px8) var(--px0);
    font-size: var(--px18);
    font-weight: var(--bold);
    cursor: pointer;
    z-index: 999;
}
/* Popup overlay */
.mobile-menu-pricing .filter-popup {
    position: var(--fixed);
    top: var(--px0);
    left: var(--px0);
    width: var(--percen10);
    height: var(--percen10);
    background: var(--black-light);
    display: var(--none);
    justify-content: var(--center);
    align-items: var(--flex-end);
    z-index: 100;
}
/* Filter content */
.mobile-menu-pricing .filter-content {
    background: var(--white);
    width: var(--percen10);
    max-height: var(--percen8);
    overflow-y: var(--auto);
    border-top-left-radius: var(--px10);
    border-top-right-radius: var(--px10);
    padding: var(--px20);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2);
    margin-bottom: var(--px43);
    position: var(--relative);
}
.mobile-menu-pricing .close-filter {
    text-align: var(--right);
    margin-bottom: var(--px10);
    cursor: pointer;
    font-weight: var(--bold);
    position: var(--absolute);
    right: var(--px0);
    top: var(--px0);
    background: var(--coral-red);
    padding: var(--px5) var(--px10);
    border-bottom-left-radius: var(--px15);
    color: var(--white);
}
.mobile-menu-pricing .menu-tab {
    display: var(--flex);
    justify-content: space-around;
    margin-bottom: var(--px15);
    padding: var(--px10) var(--px15);
    cursor: pointer;
    row-gap: var(--px5);
    column-gap: var(--px5);
    flex-wrap: var(--wrap);
    justify-content: var(--flex-start);
}
.mobile-menu-pricing .menu-title {
    font-weight: var(--fw6);
    cursor: pointer;
    background: var(--clean-gray);
    border-radius: var(--px5);
    transition: background 0.3s;
    padding: var(--px8) var(--px12);
    font-size: var(--px14);
}
.mobile-menu-pricing .menu-title:hover,
.mobile-menu-pricing .menu-title.active {
    background: linear-gradient(to right, rgba(28, 82, 172, 1), rgba(66, 137, 255, 1));
    color: var(--white);
}
.mobile-menu-pricing ul.submenu.framework_ul {
    list-style: var(--none);
    padding: var(--px0);
}
.mobile-menu-pricing .submenu-child p {
    margin-bottom: var(--px0) !important;
    color: var(--black);
}
.mobile-menu-pricing .menu-list {
    list-style: var(--none);
    padding: var(--px0);
    margin: var(--px0);
}
@media(min-width:768px){
    .mobile-menu-pricing{
        display: var(--none) !important;
    }
} 
.mobile-menu-pricing li.submenu-child:before {
    content: '\f101';
    font-family: var(--awesome);
    position: var(--absolute);
    left: var(--px10);
}
.mobile-menu-pricing .submenu li:hover {
    background: var(--cyan-blue-light);
}
.mobile-menu-pricing .submenu li {
    padding: var(--px8) var(--px10) var(--px8) var(--px30);
    position: var(--relative);
    font-size: var(--px14);
}
.mobile-menu-pricing .submenu li:after {
    content: '';
    width: var(--percen10);
    height: var(--px1);
    background: var(--veryNeutral-gray);
    position: var(--absolute);
    left: var(--px0);
    bottom: var(--px0);
}
.section-content {
    scroll-margin-top: var(--px80); /* Ensures spacing from top when scrolled into view */
}

.api-page .pricing-card {
    width:  var(--percen10);
    height: var(--percen10);
}
.pricing-main-div-parent.api-page .vc_column-inner {
    padding: var(--px0);
    height: var(--percen10);
}
.pricing-main-div-parent.api-page .vc_column-inner > .wpb_wrapper,
.pricing-main-div-parent.api-page .vc_column-inner > .wpb_wrapper > .wpb_raw_code,
.pricing-main-div-parent.api-page .vc_column-inner > .wpb_wrapper > .wpb_raw_code > .wpb_wrapper{
    height: var(--percen10);
}