@import url("https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Kalam:wght@300;400;700&family=Prompt:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
    --heading-font: "Prompt", sans-serif;
    --sub-font: "Cabin", sans-serif;
    --cursive-font: "Kalam", cursive;
    --font-52: 52px;
    --font-48: 48px;
    --font-44: 44px;
    --font-40: 40px;
    --font-36: 36px;
    --font-32: 32px;
    --font-28: 28px;
    --font-24: 24px;
    --font-20: 20px;
    --font-18: 18px;
    --font-16: 16px;
    --font-14: 14px;
    --font-12: 12px;
    --font-10: 10px;
    --weight-100: 100;
    --weight-200: 200;
    --weight-300: 300;
    --weight-400: 400;
    --weight-500: 500;
    --weight-600: 600;
    --weight-700: 700;
    --weight-800: 800;
    --weight-900: 900;
    --black-clr: #000000;
    --black-light: #4d4d4d;
    --white-clr: #ffffff;
    --white-light: #f9f9f9;
    --logo-clr: #E66526;
    --logo-rgb: 230, 101, 38;
    --logo-clr-100: #FFF6F1;
    --logo-clr-200: #FDE5D9;
    --logo-clr-300: #FAD4C1;
    --logo-clr-400: #F5B292;
    --logo-clr-500: #EF9063;
    --logo-clr-600: #ED8350;
    --logo-clr-700: #EC7C46;
    --logo-clr-800: #EA743B;
    --logo-clr-900: #E96E33;
    --transition-fast: .1s ease;
    --transition-nrml: .25s ease;
    --transition-slow: .4s ease;
    --transition-xslow: .6s ease;
    --border-radius-5: 5px;
    --border-radius-10: 10px;
    --border-radius-15: 15px;
    --border-radius-20: 20px;
    --border-radius-25: 25px;
    --border-radius-30: 30px;
    --border-radius-circle: 50%;
    --box-shadow-sm: 0 0px 10px 5px rgba(0, 0, 0, 0.05);
    --box-shadow-nrml: 0 5px 10px -3px rgba(0, 0, 0, 0.1);
    --box-shadow-rglr: 0 5px 15px -3px rgba(0, 0, 0, 0.15);
    --box-shadow-lg: 0 4px 25px -3px rgba(0, 0, 0, 0.3);
    --primary: #e66526;
    --primary-dk: #c4501a;
    --primary-lt: #fdf0e9;
    --or: #E66526;
    --orl: #FFF0E8;
    --bc: #e8edf3;
    --pg: #EEF3FA;
}

body {
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    color: var(--black-light);
    font-family: var(--sub-font);
}

a,
a:hover {
    color: currentColor;
    text-decoration: none;
}

.heading {
    font-family: var(--sub-font);
}

.heading h1,
.heading .h1 {
    font-size: var(--font-40);
    font-weight: var(--weight-800);
    color: var(--black-clr);
    margin: 0;
}

.heading h1 span,
.heading .h1 span {
    color: var(--black-clr);
    font-weight: var(--weight-300);
}

.heading h2,
.heading .h2 {
    font-size: var(--font-36);
    font-weight: var(--weight-700);
    color: var(--logo-clr);
}

.heading h3,
.heading .h3 {
    font-size: var(--font-32);
    font-weight: var(--weight-600);
    color: var(--logo-clr);
}

.heading h6.h6 {
    font-size: var(--font-24);
    font-weight: var(--weight-500);
}

.heading p,
.heading .p {
    color: var(--black-light);
    margin: 16px 0;
    font-size: var(--font-18);
    font-weight: var(--weight-400);
    line-height: 34px;
}

header {
    box-shadow: var(--box-shadow-nrml);
    position: relative;
    z-index: 111;
    background: var(--white-clr);
}

header .top_menu {
    background: var(--black-clr);
    text-align: right;
    font-size: var(--font-14);
    padding: 5px 0;
}

header .top_menu ul li {
    position: relative;
    color: #c4c2c2;
    transition: var(--transition-nrml);
}

header .top_menu ul li:hover {
    color: var(--white-clr);
}

header .top_menu ul li::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background-image: var(--bg-url);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px;
    margin-left: -30px;
}

.text_justify {
    text-align: justify;
}

.menu_outer.navbar-nav:hover .nav-item .nav-link {
    color: #b2b2b2;
    transition: var(--transition-xslow);
}

.menu_outer.navbar-nav .nav-item .nav-link {
    font-size: var(--font-18);
    font-weight: var(--weight-400);
    color: var(--black-clr);
    transition: var(--transition-slow);
    letter-spacing: 0.5px;
}

.menu_outer.navbar-nav .nav-item .nav-link:hover {
    color: var(--logo-clr);
}

.menu_outer.navbar-nav .nav-item.signUp .nav-link {
    color: var(--white-clr);
    background-color: var(--logo-clr);
    border-radius: var(--border-radius-25);
    padding: 10px 30px;
    transition: var(--transition-nrml);
    display: block;
    width: -moz-fit-content;
    width: fit-content;
}

.menu_outer.navbar-nav .nav-item.signUp .nav-link:hover {
    background-color: var(--logo-clr-800);
}

.menu_outer.navbar-nav .nav-item.signUp .nav-link:active,
.menu_outer.navbar-nav .nav-item.signUp .nav-link:focus {
    transform: scale(0.95);
}

.menu_outer.navbar-nav .nav-item.dropdown:hover.nav-item {
    color: var(--logo-clr);
}

.menu_outer.navbar-nav .nav-item.dropdown:hover .dropdown-menu.parentMenu {
    display: block;
    transform: translateY(0px);
    animation: sldup 0.5s forwards;
}

@keyframes sldup {
    0% {
        opacity: 0;
        transform: translateY(60px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu {
    background: transparent;
    border: unset;
    font-family: var(--sub-font);
    padding-top: 14px;
    transform: translateY(60px);
    transition: var(--transition-slow);
    padding-bottom: 0;
    min-width: var(--menu-width);
    left: var(--pos-left);
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu.show {
    display: none;
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu {
    transition: var(--transition-nrml);
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu:hover {
    background-color: var(--white-light) !important;
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu .dropSub_Menu {
    position: relative;
    padding-left: 20px;
    font-size: 14px;
}

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu .dropSub_Menu::before {
    position: absolute;
    content: "";
    background: url(../images/icons/check-logo.png);
    left: 0;
    width: 15px;
    height: 15px;
    background-size: 15px;
    top: 2px;
    background-repeat: no-repeat;
}

.menu_outer.navbar-nav .nav-item.dropdown .dropend .dropdown-toggle::after {
    vertical-align: 0;
    right: 10px;
    position: absolute;
    top: 20px;
    border-top: 0.4em solid transparent;
    border-right: 0;
    border-bottom: 0.4em solid transparent;
    border-left: 0.4em solid var(--logo-clr);
}

.menu_outer.navbar-nav .nav-item #showSignup ul {
    padding: 20px;
    box-shadow: var(--box-shadow-nrml);
    background-color: var(--white-clr);
}

.menu_outer.navbar-nav .nav-item #showSignup ul li a {
    color: var(--logo-clr);
    text-decoration: none;
    display: block;
    background: var(--logo-clr-100);
    font-size: var(--font-16);
    padding: 10px 20px;
    border-radius: var(--border-radius-25);
    font-weight: var(--weight-500);
    transition: var(--transition-nrml);
}

.menu_outer.navbar-nav .nav-item #showSignup ul li a:hover {
    background-color: var(--logo-clr-800);
    color: var(--white-clr);
}

.swiper-button-next,
.swiper-button-prev {
    width: 44px;
    height: 44px;
}

.swiper-button-next::after,
.swiper-button-next::after,
.swiper-button-prev::after,
.swiper-button-prev::after {
    content: "";
    width: 44px;
    height: 44px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 44px;
}

.swiper-button-next::after {
    background-image: url(../images/icons/angle-circle-right.svg);
}

.swiper-button-prev::after {
    background-image: url(../images/icons/angle-circle-left.svg);
}

.swiper-button-prev {
    left: 60px;
}

.swiper-button-next {
    right: 60px;
}

.swiper-pagination-bullet {
    opacity: 0.7;
    outline: 1px solid #000;
    outline-offset: 2px;
    margin: 0 8px !important;
}

.swiper-pagination-bullet-active {
    background: var(--logo-clr);
    opacity: 1;
    outline-color: var(--logo-clr);
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 45px;
}

@media only screen and (max-width: 480px) {

    .swiper-horizontal>.swiper-pagination-bullets,
    .swiper-pagination-bullets.swiper-pagination-horizontal {
        bottom: 20px;
    }
}

.liveFeed {
    position: relative;
    padding: 3rem 0 0;
    top: 100px;
    margin-top: -100px;
    z-index: 11;
}

.liveFeed .liveFeedWrapper {
    padding: 20px 20px 0;
    border-radius: var(--border-radius-10);
    border: 1px solid 255 255 255/60%;
    transition: var(--transition-slow);
    overflow: hidden;
    position: relative;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: var(--white-clr);
}

.liveFeed .liveFeedWrapper .liveFeed_img {
    position: relative;
    z-index: 1;
    width: 85px;
    height: 85px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: rgba(254, 227, 227, 0.61);
}

.liveFeed .liveFeedWrapper .liveFeed_text .heading h2 {
    font-size: var(--font-24);
    font-weight: var(--weight-700);
    color: var(--black-clr);
    transition: var(--transition-slow);
}

.liveFeed .liveFeedWrapper .liveFeed_text .heading p {
    --font-18: 16px;
    line-height: 26px;
    opacity: 0.8;
}

.liveFeed .liveFeedWrapper:hover {
    box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.06);
    transform: translateY(-10px);
}

#footer {
    position: relative;
    padding: 3rem 0 0;
    background-color: var(--black-light);
    background-color: #383838;
    color: var(--white-clr);
    overflow: hidden;
}

#footer .footer_download_link .heading {
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
}

#footer .footer_links {
    padding: 3rem 0;
}

#footer .footer_links .footer_linksWrapper .footer_title {
    font-size: 20px;
    color: var(--logo-clr);
}

#footer .footer_links .footer_linksWrapper ul li {
    color: #bbbbbb;
    font-size: 15px;
    margin-bottom: 8px;
    width: -moz-fit-content;
    width: fit-content;
    transition: var(--transition-slow);
}

#footer .footer_links .footer_linksWrapper ul li:hover {
    color: var(--white-clr);
    padding-left: 5px;
}

#footer .footer_links .footer_linksWrapper ul li:last-child {
    margin-bottom: 0;
}

#footer .footer_contactLinks {
    position: relative;
    padding: 30px 0;
    background: #000;
    margin-top: 3rem;
}

.hero_btn {
    --hb-px: 12px;
    --hb-py: 35px;
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    background-color: var(--logo-clr-100);
    font-size: var(--font-16);
    font-weight: var(--weight-500);
    color: var(--logo-clr);
    padding: var(--hb-px) var(--hb-py);
    transition: var(--transition-nrml);
    overflow: hidden;
    z-index: 1;
    border: 1px solid var(--logo-clr-300);
    border-radius: var(--border-radius-10);
    text-transform: capitalize;
}

.hero_btn:active {
    transform: scale(1.02);
}

.hero_btn::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 200px;
    background-color: var(--logo-clr);
    border-radius: var(--border-radius-circle);
    left: 0;
    top: 100%;
    transition: var(--transition-slow);
    z-index: -1;
}

.hero_btn:hover {
    color: var(--white-clr);
    box-shadow: var(--box-shadow-lg);
}

.hero_btn:hover::after {
    top: -50%;
    border-radius: var(--border-radius-5);
}

.hero_btn.btn_invers {
    background-color: var(--logo-clr);
    color: var(--white-clr);
}

.hero_btn.btn_invers::after {
    background-color: var(--white-clr);
}

/*.hero_btn.btn_invers:hover {
            color: var(--logo-clr);
        }*/

.hero_btn.btn_sm {
    --hb-px: 8px;
    --hb-py: 20px;
    font-size: var(--font-14);
    border-radius: var(--border-radius-5);
}

.hero_btn.btn_lg {
    --hb-px: 16px;
    --hb-py: 60px;
    font-size: var(--font-20);
}

.pill_btn {
    --hb-px: 16px;
    --hb-py: 60px;
    letter-spacing: 1px;
    font-size: var(--font-20);
    font-family: var(--heading-font);
    color: var(--white-clr);
    background: linear-gradient(60deg, #dd912d 40%, #f4c48e 100%);
    background: linear-gradient(60deg, #de8e2c 40%, #e56b27 100%);
    padding: var(--hb-px) var(--hb-py);
    border-radius: var(--border-radius-30);
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    border: unset;
    transition: var(--transition-nrml);
    text-transform: uppercase;
    font-weight: var(--weight-500);
}

.pill_btn:focus {
    outline: unset;
    transform: scale(0.98);
}

.pill_btn:active {
    transform: scale(1.02);
}

.pill_btn.pill_sm {
    --hb-px: 8px;
    --hb-py: 16px;
    letter-spacing: 0;
    font-size: var(--font-14);
}

label {
    font-weight: var(--weight-600);
    font-size: var(--font-14);
    margin-bottom: 8px;
    transition: var(--transition-slow);
}

label .star {
    color: red;
}

label a {
    color: var(--logo-clr);
}

.form-group:has(input:focus) label {
    color: var(--logo-clr);
    font-weight: 600;
}

.form-control,
.form-select {
    font-size: var(--font-14);
    font-weight: var(--weight-400);
    color: var(--black-light);
    /*border-radius: 0px;*/
    border: 1px solid #d3d3d3;
    /*border: none;*/
    border-bottom: 1px solid #d3d3d3;
    height: 42px;
    margin-bottom: 10px;
}

.form-control:focus,
.form-control:hover,
.form-select:focus,
.form-select:hover {
    border-color: var(--logo-clr);
    box-shadow: unset;
}

.form-control::-moz-placeholder,
.form-select::-moz-placeholder {
    color: #acacac;
    font-size: var(--font-14);
}

.form-control::placeholder,
.form-select::placeholder {
    color: #acacac;
    font-size: var(--font-14);
}

.form-control:focus~label,
.form-select:focus~label {
    color: var(--logo-clr);
}

.form-check-input {
    border-radius: 0 !important;
    border-color: var(--logo-clr);
    background-color: var(--logo-clr-100);
    transition: var(--transition-nrml);
    width: 15px;
    height: 14px;
    background-size: 15px;
}

.form-check-input:checked {
    background-color: var(--logo-clr);
    border-color: var(--logo-clr);
}

.form-check-input:focus {
    box-shadow: unset;
    border-color: var(--logo-clr);
}

.float {
    animation: float 4s ease-in-out infinite;
    transform: translatey(0px);
}

@keyframes float {
    0% {
        transform: translatey(0px);
    }

    50% {
        transform: translatey(-10px);
    }

    100% {
        transform: translatey(0px);
    }
}

#appFlow {
    position: relative;
    padding: 12rem 0 6rem;
    background-color: #fafafa;
}

#appFlow .appFlowWrapper ul {
    width: 95%;
    margin-left: auto;
    position: relative;
}

#appFlow .appFlowWrapper ul li {
    position: relative;
    padding: 12px 0 15px 70px;
    font-size: var(--font-16);
    font-weight: var(--weight-600);
    border-radius: var(--border-radius-5);
}

#appFlow .appFlowWrapper ul li::before {
    content: attr(data-step);
    font-size: 32px;
    font-weight: var(--weight-900);
    position: absolute;
    right: 10px;
    bottom: -3px;
    color: var(--logo-clr);
    opacity: 0.15;
    line-height: 1;
}

#appFlow .appFlowWrapper ul li::after {
    position: absolute;
    content: "";
    width: 1.5rem;
    top: 100%;
    left: 40px;
    background-image: url(../images/icons/line.png);
    background-repeat: repeat-x;
    background-size: 10px;
    height: 3px;
    animation: slideInLeft 2s infinite linear;
    z-index: 2;
    transform: rotate(90deg);
    transform-origin: left;
}

@keyframes slideInLeft {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 40px 0;
    }
}

#appFlow .appFlowWrapper ul li:last-child::after {
    display: none;
}

#appFlow .appFlowWrapper ul li .flowCheck {
    position: absolute;
    left: 30px;
}

#aboutSection {
    position: relative;
    padding: 6rem 0;
}

#scroll_detect .scroll_spy {
    position: relative;
    padding: 16px 20px;
    padding-left: 55px;
    border-radius: var(--border-radius-10);
    margin-bottom: 10px;
    font-size: var(--font-20);
    text-transform: uppercase;
    font-weight: var(--weight-600);
    transition: var(--transition-nrml);
}

#scroll_detect .scroll_spy span {
    font-size: var(--font-14);
    margin-top: 10px;
    text-transform: capitalize;
    display: none;
    transition: var(--transition-slow);
    color: var(--black-clr);
}

#scroll_detect .scroll_spy::before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    background-image: url(../images/icons/read.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
    left: 15px;
    filter: grayscale(1);
    transition: var(--transition-slow);
}

#scroll_detect .scroll_spy.active,
#scroll_detect .scroll_spy:hover {
    background: linear-gradient(45deg, var(--logo-clr-100), var(--white-clr));
    color: var(--logo-clr);
    transition: var(--transition-slow);
}

#scroll_detect .scroll_spy.active::before,
#scroll_detect .scroll_spy:hover::before {
    filter: grayscale(0);
    transform: scale(1.3);
}

#scroll_detect .scroll_spy.active span {
    display: block;
    animation: fadeIN 0.5s ease;
}

@keyframes fadeIN {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#testimonial_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--white-light);
}

#testimonial_section .swiper-horizontal>.swiper-pagination-bullets,
#testimonial_section .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 0px;
}

#testimonial_section .testimonial_outerWrapper {
    padding: 60px 0 40px;
    position: relative;
}

#testimonial_section .testimonial_outerWrapper .testimonial_innerWrapper {
    background: #fff;
    padding: 40px 30px 25px;
    position: relative;
    border-radius: 10px;
}

#testimonial_section .testimonial_outerWrapper .quote_icon {
    position: absolute;
    top: -40px;
    right: 40px;
    width: 80px;
    height: 80px;
    box-shadow: var(--box-shadow-rglr);
    border-radius: var(--border-radius-5);
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
}

#testimonial_section .testimonial_outerWrapper .quote_icon img {
    width: 50px;
}

#loan_categories {
    position: relative;
    padding: 4rem 0 0;
}

#loan_categories .loanProdutsSlider {
    position: relative;
    top: -65px;
}

#loan_categories .loanProdutsSlider .swiper-button-next,
#loan_categories .loanProdutsSlider .swiper-button-prev {
    top: 25px;
    width: 30px;
    height: 30px;
}

#loan_categories .loanProdutsSlider .swiper-button-next {
    right: 0px;
}

#loan_categories .loanProdutsSlider .swiper-button-prev {
    left: auto;
    right: 45px;
}

#loan_categories .loanProdutsSlider .swiper-button-next::after,
#loan_categories .loanProdutsSlider .swiper-button-next::after,
#loan_categories .loanProdutsSlider .swiper-button-prev::after,
#loan_categories .loanProdutsSlider .swiper-button-prev::after {
    width: 30px;
    height: 30px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
}

#loan_categories .loan_categoriesWrapper {
    position: relative;
    margin: 60px 0 30px;
    background: #fff;
    box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.1);
    padding: 15px 10px;
    text-align: center;
    border-radius: 10px;
    border: 1px solid #e2e2e2;
    transition: var(--transition-nrml);
}

#loan_categories .loan_categoriesWrapper img {
    width: 80px;
    margin-bottom: 15px;
    filter: grayscale(0.8) opacity(0.6);
    transition: var(--transition-slow);
}

#loan_categories .loan_categoriesWrapper a {
    font-size: var(--font-16);
    font-weight: var(--weight-600);
    color: var(--black-light);
}

#loan_categories .loan_categoriesWrapper:hover {
    box-shadow: var(--box-shadow-lg);
    transform: translateY(-6px);
}

#loan_categories .loan_categoriesWrapper:hover img {
    filter: drop-shadow(0px 10px 5px rgba(0, 0, 0, 0.1));
}

#loan_categories .loan_categoriesWrapper:hover a {
    color: var(--logo-clr);
}

#download_app {
    background: linear-gradient(90deg, #9ecb8a 0%, #DCE775 35%, #e6d155 100%);
    padding-top: 3rem;
    position: relative;
}

#quick_apply {
    position: relative;
    padding: 30px 0;
}

#quick_apply .quick_applyWrapper h4 {
    font-weight: var(--weight-700);
    color: black;
    font-size: var(--font-36);
}

#quick_apply .quick_applyWrapper span {
    display: block;
    font-size: var(--font-14);
    font-weight: var(--weight-500);
    color: var(--logo-clr);
}

#callback_section {
    position: relative;
    padding: 7rem 0;
    background-color: var(--logo-clr-100);
}

#callback_section .callback_formSection {
    min-width: 400px;
    padding: 30px;
    box-shadow: var(--box-shadow-lg);
    background: var(--white-clr);
    border-radius: var(--border-radius-10);
}

#blog_listing {
    position: relative;
    padding: 6rem 0;
    background: #fafafa;
}

#blog_listing .blog_listing_item {
    position: relative;
    padding: 10px;
    border: 1px solid #c4c4c4;
    border-radius: 10px;
    background: white;
    transition: var(--transition-nrml);
}

#blog_listing .blog_listing_item:hover {
    box-shadow: var(--box-shadow-lg);
    border: 1px solid var(--logo-clr-100);
}

#blog_listing .blog_listing_item .blog_listing_item_img {
    margin-bottom: 25px;
}

#blog_listing .blog_listing_item .blog_listing_item_text .upldType li {
    font-weight: var(--weight-700);
    padding-left: 25px;
    font-size: var(--font-14);
    position: relative;
}

#blog_listing .blog_listing_item .blog_listing_item_text .upldType li::before {
    position: absolute;
    content: "";
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: var(--bg-url);
    left: 0;
    top: 2px;
}

#blog_listing .blog_listing_item .blog_listing_item_text h4 {
    font-size: 20px;
    font-weight: 700;
    color: #000;
    line-height: 30px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 10px;
}

#blog_listing .blog_listing_item .blog_listing_item_text p {
    line-height: 26px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #545454;
}

.page-link {
    --bs-pagination-color: var(--logo-clr);
    --bs-pagination-border-color: var(--logo-clr-300);
}

.page-link:hover {
    --bs-pagination-hover-bg: var(--logo-clr-100);
    --bs-pagination-hover-border-color: var(--logo-clr-300);
    --bs-pagination-hover-color: var(--logo-clr-800);
}

.page-link:focus {
    --bs-pagination-focus-bg: var(--logo-100) color: var(--logo-clr);
    box-shadow: unset;
}

#mv_section {
    position: relative;
    padding: 5rem 0;
    background-color: var(--logo-clr-200);
    overflow: hidden;
}

#faqs_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

.accordion-button {
    font-size: var(--font-20);
    padding-left: 0;
    height: auto;
}

.accordion-button:focus {
    box-shadow: unset;
}

.accordion-button::after {
    background-image: url(../images/icons/pluss-circle.png);
}

.accordion-button:not(.collapsed)::after {
    background-image: url(../images/icons/minus-circle.png);
}

.accordion-button:not(.collapsed) {
    --bs-accordion-active-bg: var(--logo-clr-100);
    color: var(--logo-clr);
}

.accordion-body {
    padding: 15px 45px 15px 0;
    color: #616161;
}

.accordion-item {
    --bs-accordion-bg: var(--logo-clr-100);
    border: unset;
    border-bottom: 1px solid var(--logo-clr-200);
}

.accordion-header {
    --bs-accordion-btn-bg: var(--logo-clr-100);
}

#contact_section {
    position: relative;
    padding: 5rem 0;
}

#contact_section .contact_detailsWrapper {
    position: relative;
    border-left: 3px solid var(--logo-clr-200);
    padding-left: 15px;
}

#contact_section .contact_detailsWrapper::after {
    position: absolute;
    content: "";
    width: 3px;
    height: 24px;
    background-color: var(--logo-clr);
    left: -3px;
    top: 0;
}

#contact_section .contact_section_left {
    position: relative;
    padding: 50px 30px;
    background: linear-gradient(90deg, var(--logo-clr-100), var(--white-clr));
    border-radius: var(--border-radius-20);
}

#team_seciton {
    position: relative;
    padding: 6rem 0;
    background-color: var(--white-light);
}

#team_seciton .teamDetailswrapper {
    position: relative;
}

#team_seciton .teamDetailswrapper .teamDetailswrapperText .textText h3 {
    font-size: var(--font-20);
    font-weight: var(--weight-600);
    margin-bottom: 5px;
    color: var(--logo-clr-700);
}

#team_seciton .teamDetailswrapper .teamDetailswrapperText .textText a {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    color: #747474;
    border-bottom: 1px solid;
    transition: var(--transition-nrml);
}

#team_seciton .teamDetailswrapper .teamDetailswrapperText .textText a:hover {
    color: rgb(41, 41, 41);
}

.teamdetails .btn-close {
    top: 25px;
    right: 30px;
}

.teamdetails .btn-close:focus {
    box-shadow: unset;
    border: unset;
}

#team_header {
    position: relative;
    padding: 6rem 0;
}

.joinNow_section {
    background: linear-gradient(90deg, #9ecb8a 0%, #DCE775 35%, #e6d155 100%);
    padding: 1rem 3rem;
    margin: 5rem 0;
    position: relative;
    border-radius: var(--border-radius-30);
}

.joinNow_section .pill_btn {
    border-radius: var(--border-radius-10);
    background: rgb(0, 0, 0);
    background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgb(68, 65, 65) 35%, rgb(122, 122, 122) 100%);
    color: var(--white-clr);
}

.joinNow_section .heading h1 {
    background: linear-gradient(90deg, rgb(13, 135, 163) 0%, rgb(35, 206, 54) 35%, rgb(0, 255, 146) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#partner_section {
    position: relative;
    padding: 6rem 0;
    background-image: url(../images/partner-bg.png);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: var(--white-light);
}

#partner_section .partner_section {
    padding: 3rem 0;
    background-color: rgba(255, 255, 255, 0.431372549);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid var(--white-clr);
    border-radius: var(--border-radius-15);
    box-shadow: var(--box-shadow-sm);
}

#partner_section .partner_section .choose_prtnr {
    margin-top: 30px;
}

#partner_section .partner_section .choose_prtnr .choose_prtnrLi .choose_prtnrType {
    cursor: pointer;
    transition: var(--transition-nrml);
}

#partner_section .partner_section .choose_prtnr .choose_prtnrLi .choose_prtnrType:hover {
    background-color: var(--logo-clr-100);
    box-shadow: var(--box-shadow-sm);
    color: var(--logo-clr);
    transform: translateY(-5px);
    font-weight: var(--weight-700);
}

.logo_clr {
    color: var(--logo-clr) !important;
}

#loginWrapper {
    position: relative;
    padding: 2rem 0;
    background: radial-gradient(#e66526, transparent);
}

#loginWrapper .loginWrapper .loginWrapperOuter {
    background-color: var(--logo-clr-100);
    padding: 40px 30px;
    box-shadow: var(--box-shadow-sm);
    border: 1px solid var(--white-light);
    border-radius: var(--border-radius-15);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}



#toastWrapper {
    display: none;
    transition: all 0.2s;
}

.hiddensss {
    visibility: hidden;
    opacity: 0;
    height: 0;
    transform: translateY(-140px);
}

.img_bg {
    background-image: url(../images/loanBg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    background-color: #398a6a;
}

#borrowerSection {
    z-index: 1;
    position: relative;
    padding: 6rem 0;
    background-image: url(../images/borrowBg.png);
}

#borrowForm_section .accordion-header {
    --bs-accordion-btn-bg: transparent;
}

#borrowForm_section .accordion-header .accordion-button:not(.collapsed) {
    --bs-accordion-active-bg: transparent;
    color: var(--logo-clr);
}

#borrowForm_section .accordion-item {
    --bs-accordion-bg: var(--white-clr);
    border: unset;
    padding: 10px;
    margin-bottom: 10px;
    background-color: var(--white-light);
    border-radius: var(--border-radius-5);
}

#lender_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

#media_center {
    position: relative;
}

#media_center .awardSectionWrapper {
    background: var(--logo-clr-100);
    height: 150px;
    padding: 20px 45px;
    display: flex;
    justify-content: center;
    transition: var(--transition-slow);
    align-items: center;
}

@media only screen and (max-width: 768px) {
    #media_center .awardSectionWrapper {
        padding: 10px;
    }
}

#media_center .awardSectionWrapper img {
    height: 60px;
    -o-object-fit: contain;
    object-fit: contain;
    transition: var(--transition-slow);
}

#media_center .awardSectionWrapper:hover {
    cursor: pointer;
    box-shadow: var(--box-shadow-sm);
}

#media_center .awardSectionWrapper:hover img {
    transform: scale(1.1);
}

#newsandevents {
    position: relative;
    padding: 6rem 0;
}

#newsandevents .newsandeventsWrapper .videoWrapper {
    background: var(--logo-clr-100);
    padding: 20px;
    transition: var(--transition-nrml);
}

@media only screen and (max-width: 768px) {
    #newsandevents .newsandeventsWrapper .videoWrapper {
        padding: 0;
    }
}

#newsandevents .newsandeventsWrapper .videoWrapper:hover {
    box-shadow: var(--box-shadow-rglr);
}

#newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperImg {
    position: relative;
}

#newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperImg img {
    border-radius: var(--border-radius-5);
    height: 220px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top;
}

#newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperText a {
    font-size: var(--font-18);
    font-weight: var(--weight-500);
    margin-bottom: 0;
    line-height: 28px;
}

#careerSection {
    position: relative;
    padding: 12rem 0;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/careerBg.png);
    background-size: 100%;
}

#careerAbout {
    position: relative;
    padding: 6rem 0 9rem;
    background-color: var(--white-light);
}

#careerAbout .careerAboutLeft .careerAboutLeftWrapper {
    background-color: var(--white-clr);
    padding: 30px 20px;
    border-radius: var(--border-radius-10);
    box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.1);
    transform: var(--trsan-top);
}

#careerAbout .careerAboutLeft .careerAboutLeftWrapper h6 {
    color: var(--black-clr);
    font-size: var(--font-18);
    font-weight: var(--weight-600);
    margin: 15px 0;
}

#careerAbout .careerAboutLeft .careerAboutLeftWrapper p {
    color: #8d8d8d;
}

#jobOpneing {
    position: relative;
    padding: 6rem 0;
}

#jobOpneing .jobOpneingWrapper {
    padding: 10px;
    border-radius: var(--border-radius-5);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08);
    background-color: var(--white-clr);
}

#jobOpneing .jobOpneingWrapper .jobOpneingImg {
    padding: 25px 20px;
    background-color: var(--logo-clr-100);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-radius-5);
}

#jobOpneing .jobOpneingWrapper .jobOpneingImg img {
    width: 65px;
}

.jobOpneingText ul li {
    position: relative;
    padding-left: 25px;
    margin-right: 8px;
}

.jobOpneingText ul li:last-child {
    margin-left: 0;
}

.jobOpneingText ul li::before {
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    background-image: var(--bg-url);
    background-size: 16px;
    background-position: left;
    background-repeat: no-repeat;
    left: 0;
    top: 1px;
}

#homeAbout {
    position: relative;
    padding: 6rem 0 0;
}

/*----- Styling the sliders ----*/
#emiCalcSection {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

.formRange {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 10px 0;
    width: 100%;
}

.formRange:focus {
    outline: none;
}

.formRange::-webkit-slider-runnable-track {
    width: 100%;
    height: 6px;
    cursor: pointer;
    background: var(--logo-clr);
    border-radius: 10px;
}

.formRange::-webkit-slider-thumb {
    box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
    border: 5px solid #ffffff;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: var(--logo-clr);
    cursor: pointer;
    margin-top: -6px;
    -webkit-appearance: none;
}

.formRange:focus::-webkit-slider-runnable-track {
    background: #b3b3b3;
}

.formRange::-moz-range-track {
    width: 100%;
    height: 6px;
    cursor: pointer;
    background: var(--logo-clr);
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
    border-radius: 10px;
}

.formRange::-moz-range-thumb {
    box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
    border: 5px solid #ffffff;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: var(--logo-clr);
    cursor: pointer;
    margin-top: -6px;
}

.formRange::-ms-track {
    width: 100%;
    height: 6px;
    cursor: pointer;
    background: var(--logo-clr);
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
    border-radius: 10px;
}

.formRange::-ms-fill-lower {
    background: var(--logo-clr);
    border-radius: 5px;
}

.formRange::-ms-fill-upper {
    background: var(--logo-clr);
    border-radius: 5px;
}

.formRange::-ms-thumb {
    box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
    border: 5px solid #ffffff;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: var(--logo-clr);
    cursor: pointer;
    margin-top: -6px;
}

.formRange:focus::-ms-fill-lower {
    background: var(--logo-clr);
}

.formRange:focus::-ms-fill-upper {
    background: var(--logo-clr);
}

.congrats {
    position: fixed;
    width: 100%;
    height: 100vh;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 11111;
    display: block;
    /*opacity: 0;
    visibility: hidden;*/
}

.congrats .congrats_inner {
    max-width: 400px;
    width: 100%;
    background-color: var(--white-clr);
    background-color: #ffff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: var(--border-radius-10);
    padding: 20px 30px 30px;
    box-shadow: var(--box-shadow-lg);
}

.congrats .congrats_inner .congrats_imgWrapper {
    text-align: center;
}

.congrats .congrats_inner .congrats_imgWrapper img {
    width: 200px;
}

.congrats.visible {
    display: block !important;
    animation: showani 0.4s ease-in forwards;
}

@keyframes showani {
    0% {
        display: block;
        opacity: 0.3;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}

#loan_details {
    position: relative;
    padding: 5rem 0;
}

#loan_details .nav-link {
    font-size: var(--font-18);
    font-weight: var(--weight-700);
}

#loan_details .nav-link:focus,
#loan_details .nav-link:hover {
    --bs-nav-link-hover-color: var(--logo-clr);
    background-color: var(--logo-clr-100);
}

#loan_details .nav-pills .nav-link.active {
    background-color: var(--logo-clr);
}

/*-------------------------------------*/
@media only screen and (max-width: 992px) {
    .navbar-brand img {
        width: 180px;
    }
}

@media only screen and (max-width: 480px) {
    .heading {
        width: 100% !important;
    }

    .heading h1,
    .heading .h1 {
        font-size: var(--font-24);
    }

    .heading p {
        font-size: var(--font-16);
        line-height: var(--font-28);
    }

    #appFlow {
        padding: 3rem 0;
        overflow: hidden;
    }

    #loan_categories .loan_categoriesWrapper a {
        display: block;
        line-height: 20px;
        margin: 0 auto;
        text-align: center;
        word-wrap: break-word;
    }

    .liveFeed {
        top: 0;
        margin-top: 0;
    }

    .liveFeed .liveFeedWrapper {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background: rgba(244, 249, 255, 0.168627451);
        border: 1px solid #fff;
    }

    /*.liveFeed .liveFeedWrapper .liveFeed_text .heading p {
                color: var(--white-clr);
            }*/

    #callback_section {
        padding: 4rem 0;
    }

    #callback_section .callback_formSection {
        min-width: 100%;
    }

    #download_app {
        padding-bottom: 3rem;
        overflow: hidden;
    }

    .hero_btn.btn_lg {
        --hb-px: 10px;
        --hb-py: 26px;
        font-size: var(--font-18);
    }

    .menu_outer.navbar-nav .nav-item.signUp .nav-link {
        padding: 0.4rem 1rem;
        font-size: var(--font-14);
    }

    #quick_apply .quick_applyWrapper h4 {
        font-size: var(--font-24);
        margin-bottom: 0px;
    }

    #quick_apply .quick_applyForm .heading h4 {
        font-size: var(--font-18);
        color: var(--logo-clr-800);
    }

    #homeAbout {
        padding: 3rem 0 0;
        overflow: hidden;
    }

    #homeAbout .heading .h1 br {
        display: none;
    }

    #careerSection {
        padding: 2rem 0;
        background-position: 60% 60px;
        background-size: cover;
        background-color: var(--logo-clr-200);
    }

    #careerAbout {
        padding: 3rem 0 3rem;
    }

    #careerAbout .careerAboutLeft .careerAboutLeftWrapper {
        transform: unset;
    }

    .accordion-body {
        padding: 15px 5px 15px 0;
    }

    #blog_listing {
        padding: 3rem 0;
    }

    section {
        overflow: hidden !important;
    }

    #contact_section {
        padding: 2rem 0 3rem;
    }

    #contact_section .contact_section_left {
        padding: 40px 20px;
        background: var(--logo-clr-100);
    }

    #congrats .congrats_inner {
        width: 85%;
    }

    #congrats .congrats_inner .congrats_imgWrapper img {
        width: 120px;
    }

    .mobPos {
        position: relative !important;
        width: 100%;
        margin: 0 auto;
    }

    #borrowerSection {
        padding: 1rem 0 4rem;
    }

    #lender_section {
        padding: 3rem 0;
    }

    #faqs_section {
        padding: 3rem 0 !important;
    }

    #jobOpneing {
        padding: 2rem 0;
    }

    #testimonial_section {
        padding: 2rem 0;
    }

    #media_center {
        padding: 3rem 0;
    }

    #newsandevents {
        padding: 0 0 3rem;
    }

    #newsandevents .newsandeventsWrapper .videoWrapper {
        padding: 15px;
    }

    .joinNow_section {
        padding: 1rem 1rem 2rem;
        border-radius: var(--border-radius-10);
    }

    .joinNow_section .heading h1 {
        color: #000;
        background-clip: unset;
        -webkit-background-clip: unset;
        background: unset;
        -webkit-text-fill-color: unset;
    }

    .parentMenu {
        --menu-width: 100% !important;
        --pos-left: 0 !important;
    }

    .menu_outer.navbar-nav .nav-item {
        width: 100%;
    }
}

.mmbg {
    background-color: var(--logo-clr);
    position: absolute;
    inset: 0;
    z-index: -1;
}

.op5 {
    opacity: 0.05;
}

.op10 {
    opacity: 0.1;
}

.op15 {
    opacity: 0.15;
}

.op20 {
    opacity: 0.2;
}

#supportWrapper {
    position: relative;
    background-color: var(--white-clr);
}

#supportWrapper .support_topWrapper {
    position: relative;
    padding: 12px 0;
    background-color: var(--white-light);
}

#supportWrapper .support_topWrapper li a:hover {
    transition: var(--transition-nrml);
    color: var(--logo-clr);
    text-decoration: underline;
}

#supportWrapper .supportWrapper {
    position: relative;
    padding: 5rem 0;
}

#supportWrapper .supportWrapper .supportWrapperTab a {
    transition: var(--transition-fast);
    padding: 12px 10px;
    background-color: var(--logo-clr-100);
    font-size: var(--font-18);
    text-align: center;
    display: block;
}

#supportWrapper .supportWrapper .supportWrapperTab a.active {
    background-color: var(--logo-clr);
    color: var(--white-clr);
    font-weight: var(--weight-600);
}

.hero_btn.btn_invers:hover {
    color: var(--logo-clr);
}

.errorlabels {
    background-image: url('../../../images/cancel.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 13px 13px;
    color: #f00;
    display: inline-block;
    padding: 0px 5px 0px 20px;
    border-radius: 3px;
    position: relative;
    margin: 4px 0;
}


/*----- fixed-header section ----*/
.fixed-header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.fixed-header .navbar {
    padding: 10px 0;
}

.fixed-header .container {
    max-width: 1200px;
    margin: 0 auto;
}

.navbar-toggler {
    border: none;
    background-color: transparent;
}

.navbar-nav .nav-link {
    color: #000;
    padding: 5px 10px;
}

.navbar-nav .nav-link:hover {
    color: #007bff;
}

/*.navbar-nav .dropdown-menu {
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    min-width: 12rem;
}

    .navbar-nav .dropdown-menu a {
        display: block;
        padding: 5px 10px;
        color: #000;
        text-decoration: none;
    }

        .navbar-nav .dropdown-menu a:hover {
            background-color: #f8f9fa;
            color: #007bff;
        }*/

.menu_outer {
    display: flex;
    align-items: center;
}

.menu_outer .signUp {
    position: relative;
}

.menu_outer .signUp .collapse {
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    min-width: 200px;
}

@media (max-width: 991px) {
    .fixed-header .navbar-collapse {
        background-color: #fff;
    }

    .fixed-header .navbar-nav {
        flex-direction: column;
        align-items: flex-start;
    }

    .fixed-header .navbar-nav .dropdown-menu {
        position: static;
        float: none;
        background-color: #fff;
        border: none;
        box-shadow: none;
        padding: 0;
        width: 100%;
    }

    .fixed-header .navbar-nav .dropdown-menu .dropdown-item {
        padding: 10px 15px;
    }
}

/*-----End fixed-header section ----*/
/*-----Deena180924 ----*/
.section_heading {
    color: var(--white-clr);
    background: var(--white-clr);
    border-left: 7px solid var(--primary);
    font-weight: 900;
    padding-right: 20px;
}

.section_heading h3 {
    background: var(--logo-clr-700);
    height: 50px;
    line-height: 50px;
    padding: 0px 20px 0 20px;
    position: relative;
}

.section_heading h3::after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 51px 0 0 51px;
    border-color: transparent transparent transparent var(--logo-clr-700);
    left: 100%;
    bottom: 0;
    margin-left: -1px;
}

.section_heading h3.invers {
    background: var(--logo-clr-200);
    color: var(--logo-clr);
    margin-left: 50px;
}

.section_heading h3.invers::after {
    border-color: transparent transparent transparent var(--logo-clr-200);
}

.section_heading h3.invers::before {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 51px 51px 0;
    border-color: transparent var(--logo-clr-200) transparent transparent;
    right: 100%;
    bottom: 0;
    margin-left: -1px;
}

.subHeading {
    display: block;
    text-align: center;
    margin: 1rem 0;
    overflow: hidden;
    white-space: nowrap;
    background: #f5f5f5;
    padding: 10px;
}

.subHeading h3 {
    position: relative;
    display: inline-block;
    font-size: var(--font-18);
    padding: 0rem 1rem;
    margin-bottom: 0;
}

.subHeading h3::before,
.subHeading h3::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 100vw;
    border-top: 1px solid var(--logo-clr-300);
}

.subHeading h3::before {
    right: 100%;
}

.subHeading h3::after {
    left: 100%;
}

.border_500 {
    border: 1px solid var(--logo-clr-600);
}

.border_500 {
    border: 1px solid var(--logo-clr-600);
}

.logo_bgClr {
    background-color: var(--logo-clr);
}

/*-----RBI Certified  Date21_09_2024deena ----*/
.success-message {
    color: green;
}

.errorlabels {
    color: red;
}

.ValidationError {
    color: red;
}

.logo_bgClr {
    background-color: var(--logo-clr);
}

.badgeRBI_500 {
    border: 1px solid var(--logo-clr-600);
}

.badgeRBI {
    display: inline-flex;
    align-items: center;
    background-color: #94e2a429;
    border: 1px solid #3dd068;
    border-radius: 20px;
    padding: 5px 15px;
    font-size: 14px;
    color: #4a4a4a;
}

.badgeRBI-icon {
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

.badgeRBI-text {
    font-weight: 400;
}

/* Mobile Responsiveness */
@media only screen and (max-width: 480px) {
    .badgeRBI {
        padding: 3px 9px;
        font-size: 9px;
    }

    .pill_btn {
        --hb-px: 16px;
        --hb-py: 35px;
    }

    .badgeRBI-text {
        font-weight: 900;
    }
}

/*-----END RBI Certified NBFC ----*/

/*------------ Login new Header Design ---------------*/
.login-header {
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--logo-clr-500);
    width: 275px;
    height: 48px;
    border-radius: 0 0 20px 20px;
}

@media (max-width: 768px) {
    .login-header {
        width: 200px !important;
    }
}

.login-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: -30px;
    width: 30px;
    height: 30px;
    border-top-right-radius: 50%;
    background: transparent;
    box-shadow: 15px 0 0 0 var(--logo-clr-500);
}

.login-header::after {
    content: "";
    position: absolute;
    top: 0;
    right: -30px;
    width: 30px;
    height: 30px;
    border-top-left-radius: 50%;
    background: transparent;
    box-shadow: -15px 0 0 0 var(--logo-clr-500);
}

/*-------------- Login new Header Design End --------------*/

.login-headerr {
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--logo-clr-500);
    width: 57rem;
    height: 48px;
    border-radius: 0 0 20px 20px;
}

@media (max-width: 768px) {
    .login-headerr {
        width: 200px !important;
    }
}

.login-headerr::before {
    content: "";
    position: absolute;
    top: 0;
    left: -30px;
    width: 30px;
    height: 30px;
    border-top-right-radius: 50%;
    background: transparent;
    box-shadow: 15px 0 0 0 var(--logo-clr-500);
}

.login-headerr::after {
    content: "";
    position: absolute;
    top: 0;
    right: -30px;
    width: 30px;
    height: 30px;
    border-top-left-radius: 50%;
    background: transparent;
    box-shadow: -15px 0 0 0 var(--logo-clr-500);
}



.Email-header {
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--logo-clr-500) !important;
    width: 258px;
    height: 47px;
    border-radius: 0 0 20px 20px;
}

@media (max-width: 768px) {
    .Email-header {
        width: 200px !important;
    }
}

.Email-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: -30px;
    width: 30px;
    height: 30px;
    border-top-right-radius: 50%;
    background: transparent;
    box-shadow: 15px 0 0 0 var(--logo-clr-500);
}

.Email-header::after {
    content: "";
    position: absolute;
    top: 0;
    right: -30px;
    width: 30px;
    height: 30px;
    border-top-left-radius: 50%;
    background: transparent;
    box-shadow: -15px 0 0 0 var(--logo-clr-500);
}

:root {
    --primary-bg-color: white;
    --box-shadow-color: rgba(0, 0, 0, 0.2);
    --border-color: #ddd;
    --focus-border-color: #de8e2c;
    --gradient-start-color: #de8e2c;
    --gradient-end-color: #e56b27;
    --hover-color: #0056b3;
    --text-color: white;
    --padding-container: 30px;
    --padding-button: 3px 10px;
    --border-radius-container: 8px;
    --border-radius-box: 4px;
    --border-radius-button: 5px;
    --box-width: 300px;
    --box-width-otp: 50px;
    --box-height-otp: 50px;
    --font-size-otp: 24px;
    --flex-justify-center: center;
    --flex-align-center: center;
}

.otp-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: var(--flex-justify-center);
    align-items: var(--flex-align-center);
}

.otp-container {
    background-color: var(--primary-bg-color);
    padding: var(--padding-container);
    border-radius: var(--border-radius-container);
    text-align: center;
    box-shadow: 0 4px 8px var(--box-shadow-color);
    width: var(--box-width);
}

.otp-inputs {
    display: flex;
    justify-content: space-between;
    margin: 4px 0;
}

.otp-box {
    width: var(--box-width-otp);
    height: var(--box-height-otp);
    text-align: center;
    font-size: var(--font-size-otp);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-box);
}

.otp-box:focus {
    border-color: var(--focus-border-color);
    outline: none;
}

.verify-btn,
.resend-btn {
    background: linear-gradient(60deg, var(--gradient-start-color) 40%, var(--gradient-end-color) 100%);
    color: var(--text-color);
    border: none;
    padding: var(--padding-button);
    border-radius: var(--border-radius-button);
    cursor: pointer;
    margin: 10px 0;
}

.verify-btn:hover,
.resend-btn:hover {
    background-color: var(--hover-color);
}

.emailValClass {
    background-color: #fff;
    max-width: 450px;
    width: 100%;
    padding: 40px 30px;
    box-shadow: var(--box-shadow-lg);
    border-radius: 10px;
}

.show-password-label {
    display: flex;
    align-items: center;
    margin-top: 10px;
    position: absolute;
    top: 3px;
    right: 15px;
}

.show-password-label input {
    margin-right: 5px;
}

.modalBackground {
    background-color: rgb(0 0 0 / 66%);
    backdrop-filter: blur(5px);
}

.login-headerr h4 {
    color: var(--logo-clr-100);
}

.login-header h4 {
    color: var(--logo-clr-100);
}

.card-header {
    background-color: rgba(0, 0, 0, 0.075);
    border-radius: 5px;
}

.error-message {
    color: red;
    font-size: 13px;
    font-style: normal;
}

/*-------------- Login new Header Design End --------------*/
:root {
    /* Color Variables */
    --success-color: #28a7458f;
    --error-color: #db3646b8;
    --modal-bg-color: #fff;
    /* Size Variables */
    --border-radius: 20px;
    --iconn-size: 80px;
    /* Stroke Variables */
    --stroke-width: 6;
    --circle-radius: 62.1;
    --dasharray: 1000;
    /* Animation Timing Variables */
    --dash-duration: 0.9s;
    --check-delay: 0.35s;
    --check-duration: 0.95s;
}

/* Success Modal */
/*#AccountSuccess .modal-content {
    border-radius: var(--border-radius);
    background-color: var(--modal-bg-color);
    box-shadow: 0 4px 15px var(--modal-shadow-color);
    padding: 20px;
    width:450px;
}*/
#Accountsuccess .card-body svg {
    width: var(--iconn-size);
    display: block;
    margin: 0 auto;
}

#Accountsuccess .card-body .path {
    stroke-dasharray: var(--dasharray);
    stroke-dashoffset: 0;
}

#Accountsuccess .card-body .path.circle {
    animation: dash var(--dash-duration) ease-in-out;
    fill: none;
    stroke: var(--success-color);
    stroke-width: var(--stroke-width);
    stroke-miterlimit: 10;
}

#Accountsuccess .card-body .path.check {
    stroke-dashoffset: -100;
    animation: dash-check var(--check-duration) var(--check-delay) ease-in-out forwards;
    fill: none;
    stroke: var(--success-color);
    stroke-width: var(--stroke-width);
    stroke-linecap: round;
    stroke-miterlimit: 10;
}

/* Error Modal */


#AccountError .card-body svg {
    width: var(--iconn-size);
    display: block;
    margin: 0 auto;
}

#AccountError .card-body .path {
    stroke-dasharray: var(--dasharray);
    stroke-dashoffset: 0;
}

#AccountError .card-body .path.circle {
    animation: dash var(--dash-duration) ease-in-out;
    fill: none;
    stroke: var(--error-color);
    stroke-width: var(--stroke-width);
    stroke-miterlimit: 10;
}

#AccountError .card-body .path.line {
    stroke-dashoffset: var(--dasharray);
    animation: dash var(--check-duration) var(--check-delay) ease-in-out forwards;
    fill: none;
    stroke: var(--error-color);
    stroke-width: var(--stroke-width);
    stroke-linecap: round;
    stroke-miterlimit: 10;
}

/* Animations */
@keyframes dash {
    0% {
        stroke-dashoffset: var(--dasharray);
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes dash-check {
    0% {
        stroke-dashoffset: -100;
    }

    100% {
        stroke-dashoffset: 900;
    }
}

.lettps {
    letter-spacing: 10px;
}

.btn-group {
    border: unset !important;
}

.btn-group .btn.btn-secondary {
    position: relative;
    padding-left: 30px;
    margin-right: 10px;
    border-radius: var(--border-radius-5) !important;
    background-color: var(--logo-clr);
    border-color: var(--logo-clr-400);
    font-weight: var(--weight-600);
    font-size: var(--font-14);
}

.btn-group .btn.btn-secondary::before {
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    left: 10px;
    top: 9px;
    font-size: 14px;
}

.btn-group .btn.btn-secondary.buttons-copy::before {
    content: "\f0c5";
}

.btn-group .btn.btn-secondary.buttons-pdf::before {
    content: "\f1c1";
}

.btn-group .btn.btn-secondary.buttons-print::before {
    content: "\f02f";
}

.btn-group .btn.btn-secondary.buttons-colvis {
    border-radius: var(--border-radius-5) !important;
}

.btn-group .btn.btn-secondary.buttons-colvis::before {
    content: "\f0b0";
}

.dataTables_length,
.dataTables_info {
    float: left;
    margin-right: 30px;
}

.dt-button-collection .dropdown-menu {
    padding: 0 !important;
}

.dt-button-collection .dropdown-item.buttons-columnVisibility {
    font-size: var(--font-14);
    border-bottom: 1px solid var(--logo-clr-300);
    transition: var(--transition-nrml);
}

.dt-button-collection .dropdown-item.buttons-columnVisibility:last-child {
    border: unset;
}

.dt-button-collection .dropdown-item.buttons-columnVisibility:active {
    background-color: var(--logo-clr-100);
}

.dt-button-collection .dropdown-item.buttons-columnVisibility.active {
    color: var(--logo-clr);
    background-color: var(--logo-clr-100);
}

.dt-button-collection .dropdown-item.buttons-columnVisibility:hover {
    background-color: var(--logo-clr-200);
}

.dataTables_wrapper {
    margin-bottom: 50px;
}

.congrats {
    position: fixed;
    width: 100%;
    height: 100vh;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 11111;
    display: block;
    /*opacity: 0;
    visibility: hidden;*/
}

.congrats .congrats_inner {
    max-width: 400px;
    width: 100%;
    background-color: var(--white-clr2);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: var(--border-radius-10);
    padding: 20px 30px 30px;
    box-shadow: var(--box-shadow-lg);
}

.congrats .congrats_inner .congrats_imgWrapper {
    text-align: center;
}

.congrats .congrats_inner .congrats_imgWrapper img {
    width: 200px;
}

.congrats.visible {
    display: block !important;
    animation: showani 0.4s ease-in forwards;
}

@keyframes showani {
    0% {
        display: block;
        opacity: 0.3;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}


#borrower__showCase {
    position: relative;
    padding: 3rem 0;
}

#borrower__showCase .borrower__showCase {
    position: relative;
    background: rgb(208, 70, 4);
    background: linear-gradient(90deg, rgb(208, 70, 4) 0%, rgb(237, 131, 80) 35%, rgb(227, 93, 29) 100%);
    padding: 2rem 1.5rem;
    border-radius: 1rem;
    color: white;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

#borrower__showCase .borrower__showCase .borrower__heading span {
    opacity: 0.7;
    display: block;
    line-height: 1;
}

#borrower__showCase .borrower__showCase .borrower__heading h2 {
    font-size: 40px;
    margin-top: 10px;
    font-weight: 800;
}

#borrower__showCase .borrower__showCase .borrower__right .borrower_batch {
    padding: 8px 14px;
    border-radius: 5px;
    background-color: #ec804d;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

#borrower__showCase .borrower__showCase .borrower__right .loan__apply {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    background-color: white;
    color: var(--logo-clr);
    padding: 8px 18px;
    border-radius: 5px;
    margin-left: auto;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.25s ease-in;
}

#borrower__showCase .borrower__showCase .borrower__right .loan__apply:hover {
    background-color: #ec804d;
    color: white;
}

#active__loan {
    position: relative;
    padding: 2rem 0;
}

#active__loan .active__loan {
    background-color: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.07);
    padding: 1rem;
    margin-bottom: 1.2rem;
    border-radius: 10px;
}

#active__loan .view__loanDetails {
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    background-color: #ec804d;
    color: white;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.25s ease-in;
}

#active__loan .view__loanDetails:hover {
    color: white;
    background-color: #d75519;
}

#active__loan .view__loanDetails.view__payEraly {
    background-color: white;
    color: var(--logo-clr);
    border: 1px solid var(--logo-clr);
}

#active__loan .view__loanDetails.view__payEraly:hover {
    background-color: #ec804d;
    color: white;
}


.content_wrapper {
    margin: 20px;
    height: calc(100% - 61px);
}

.dataTables_filter,
.dataTables_paginate {
    float: right;
}

.pagination {
    margin-bottom: 0;
}

.dataTables_length label,
.dataTables_filter label {
    display: inline-flex;
    align-items: center;
}

.dataTables_length .form-select,
.dataTables_length .form-control,
.dataTables_filter .form-select,
.dataTables_filter .form-control {
    height: 35px;
    margin: 0 0 0 10px;
}

/* added by designer */
/* Home page's apply loan section */
.applyloan .row {
    position: relative;
}

.applyloan .row::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('/website/images/works-two-s-2.webp') center / 90% no-repeat;
    pointer-events: none;
    z-index: 0;
}

.parallax-layer {
    position: relative;
    z-index: 1;
    /* ← add this */
    transition: transform .12s linear;
    will-change: transform;
}

.applyloan::before,
.applyloan::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 220px;
    background-image: radial-gradient(circle, #e6652640 1px, transparent 1px);
    background-size: 18px 18px;
    pointer-events: none;
    z-index: 0;
}

.applyloan::before {
    top: 0;
    right: 0;
}

.applyloan::after {
    bottom: 0;
    left: 0;
}

.section-badge {
    background: #1a2332;
    border-radius: 50px;
}

.section-badge i {
    color: #f5c518;
}

.letter {
    display: inline-block;
    opacity: 0;
    transform: translateX(20px);
    transition: opacity .3s ease-out, transform .3s ease-out;
}

.letter.play {
    opacity: 1;
    transform: translateX(0);
}

.step-card {
    border: 1.5px solid transparent;
    border-radius: 18px;
    opacity: 1;
    transform: translateY(36px);
    transition: opacity .55s ease, transform .55s cubic-bezier(.34, 1.2, .64, 1), box-shadow .3s, border-color .3s;
}

.step-card.visible {
    opacity: 1;
    transform: translateY(0);
}

.step-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    border-color: var(--primary);
    box-shadow: 0 20px 48px rgba(230, 101, 38, .2) !important;
}

.ghost-icon {
    position: absolute;
    bottom: 12px;
    right: 16px;
    font-size: 72px;
    color: var(--primary-lt);
    opacity: .5;
    pointer-events: none;
    transition: opacity .3s;
}

.step-card:hover .ghost-icon {
    opacity: .85;
}

/* Step number circle */
.step-num {
    position: absolute;
    top: -18px;
    right: 20px;
    width: 42px;
    height: 42px;
    background: var(--primary);
    border-radius: 50%;
    box-shadow: 0 4px 16px rgba(230, 101, 38, .35);
    transition: background .3s, transform .3s;
}

.step-card:hover .step-num {
    background: var(--primary-dk);
    transform: scale(1.15) rotate(-8deg);
}

/* Icon box */
.step-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--primary-lt);
    transition: background .3s;
}

.step-icon i {
    color: var(--primary);
    transition: transform .4s, color .3s;
}

.step-card:hover .step-icon {
    background: var(--primary);
}

.step-card:hover .step-icon i {
    color: #fff;
    transform: scale(1.2) rotate(-5deg);
}

@media (min-width: 992px) {
    .step-lower {
        margin-top: 64px;
    }
}

/* Parallax */
.parallax-layer {
    transition: transform .12s linear;
    will-change: transform;
}

/* Ripple */
.ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(230, 101, 38, .18);
    transform: scale(0);
    animation: rpl .6s ease-out forwards;
    pointer-events: none;
}

@keyframes rpl {
    to {
        transform: scale(4);
        opacity: 0;
    }
}


/* ── /// Banner section CSS /// Deenabandhu ── */
.hero_slider {
    height: clamp(260px, 55vw, 580px);
}

.slide-image {
    transform: scale(1);
    transition: transform 8s ease-in-out;
    object-position: center center;
}

.swiper-slide-active .slide-image {
    transform: scale(1.12);
}

.slide-tag {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s 0.2s ease, transform 0.7s 0.2s ease;
}

.slide-title {
    opacity: 0;
    transform: translateX(-48px);
    transition: opacity 0.8s 0.4s ease, transform 0.8s 0.4s ease;
}

.slide-sub {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s 0.65s ease, transform 0.7s 0.65s ease;
}

.swiper-slide-active .slide-tag,
.swiper-slide-active .slide-title,
.swiper-slide-active .slide-sub {
    opacity: 1;
    transform: translate(0);
}

@media (max-width: 767px) {
    .hero_slider .position-absolute.d-flex {
        padding: 0 20px !important;
        align-items: center;
        text-align: center;
    }

    .hero_slider .position-absolute.d-flex>div {
        max-width: 100% !important;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .slide-tag {
        justify-content: center;
    }

    .slide-tag span {
        display: none !important;
    }

    .slide-sub {
        max-width: 100% !important;
    }

    /* .swiper-slide .position-absolute[style*="gradient"] {
            background: linear-gradient(180deg, rgba(8,18,50,0.65) 0%, rgba(8,18,50,0.75) 100%) !important;
        } */
}

@media (max-width: 400px) {
    .slide-sub {
        display: none !important;
    }
}

/* ── End Banner  ── */
/* ── //// About section ////Deenabandhu ── */
.about-section {
    position: relative;
    overflow: hidden;
}

.about-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 51%;
    height: 100%;
    background-image: url('/website/images/pattern-01.jpg');
    background-repeat: repeat;
    background-position: right top;
    opacity: 0.5;
    z-index: 0;
}

/* Keep content above background */
.about-section .container {
    position: relative;
    z-index: 2;
}

/* ── End About section  ── */

/* ──/// Loan Categories  ///Deenabandhu── */
.swiper-slide {
    transition: .4s ease;
}

.loan-number {
    color: transparent;
    -webkit-text-stroke: 1px #adb5bd;
    transition: .4s ease;
}

.swiper-slide:hover .loan-number {
    color: #e66526;
    -webkit-text-stroke: 0;
}

.loan-icon {
    filter: grayscale(100%);
    opacity: .7;
    transition: .4s ease;
}

.swiper-slide:hover {
    transform: translateY(-12px);
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .15) !important;
}

.loanProdutsSlider .swiper-slide img {
    width: 70px;
    filter: grayscale(100%);
    opacity: .7;
    transition: .5s ease;
    transform: scale(1);
}

.loanProdutsSlider .swiper-slide:hover img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.15) rotate(5deg);
}

/* ── End Loan Categories  ── */


/* ── /// Meet India's New Lending /////Deenabandhu ── */
.why-choose-section {
    background: linear-gradient(rgba(230, 101, 38, .10),
            rgba(230, 101, 38, .10)),
        url('/website/images/banner-2.jpg') center/cover no-repeat;
}

.feature-card {
    position: relative;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 15px;
    padding: 1.5rem;
    overflow: hidden;
    transition: .3s ease;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}

.feature-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 .75rem 1.5rem rgba(0, 0, 0, .12);
    border-color: #ffd5c1;
    background-color: #ffede5;
}

.feature-card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 140px;
    height: 140px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right top;
    opacity: 1.08;
    pointer-events: none;
}

.bg-img-1::after {
    background-image: url('/website/images/project-shape3.png');
}

.feature-card .icon-box {
    width: 55px;
    height: 55px;
    background: rgba(230, 101, 38, .12);
    color: #E66526;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 15px;
    transition: all 0.3s ease;
    position: relative;
    z-index: 2;
}

.feature-card:hover .icon-box {
    background: #E66526;
    color: #fff;
    transform: rotate(10deg) scale(1.1);
    box-shadow: 0 8px 20px rgba(230, 101, 38, 0.35);
}

.feature-card:hover .icon-box i {
    animation: iconPop 0.4s ease;
}

@keyframes iconPop {
    0% {
        transform: scale(0.8);
    }

    100% {
        transform: scale(1);
    }
}

.floating-img {
    max-width: 500px;
    animation: float 4s ease-in-out infinite;
}

@keyframes float {
    50% {
        transform: translateY(-12px);
    }
}

/* ──  End Meet India's New Lending ── */
/* ──  letter-by-letter animation ── */

/* ──  End letter-by-letter animation ── */
/*  End home page's apply loan section*/
/* ///
            personal loan page
        /// */
/* ── Merged :root (previously declared 3x) ── */
:root {
    --brand-orange: #E66526;
    --brand-orange-light: #FFF0E8;
    --brand-red: #e66628;
    --brand-red-light: #fdecea;

    --or: #E66526;
    --orl: #FFF0E8;
    --bc: #e8edf3;
    --pg: #EEF3FA;

    --primary: #e66526;
    --primary-dk: #c4501a;
    --primary-lt: #fdf0e9;
}

/* ── Loan Focused section ── */
#loan-focused {
    background:url('../images/apply_loanbg.webp') no-repeat center center/cover;
}

/* (duplicate #loan-focused::before/::after block removed — was written twice identically) */
#loan-focused::before,
#loan-focused::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 220px;
    background-image: radial-gradient(circle, #e6652640 1px, transparent 1px);
    background-size: 18px 18px;
    pointer-events: none;
    z-index: 0;
}

#loan-focused::before {
    top: 0;
    right: 0;
}

#loan-focused::after {
    bottom: 0;
    left: 0;
}

#loan-focused .badge-pill {
    background: var(--brand-orange-light);
    color: var(--brand-orange);
}

#loan-focused .highlight {
    color: var(--brand-orange);
}

.benefit-card {
    position: relative;
    height: 300px;
    overflow: hidden;
    border-radius: 28px;
    cursor: pointer;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .08);
}

.benefit-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 1s;
}

.benefit-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .9), rgba(0, 0, 0, .2));
    transition: .5s;
}

.benefit-content {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: 0;
    color: #fff;
    z-index: 2;
    transition: .5s;
}

.benefit-icon {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    margin-bottom: 20px;
}

.benefit-content p {
    margin-bottom: 25px;
    transform: translateY(40px);
    opacity: 0;
    transition: .5s;
}

.read-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 25px;
    background: var(--brand-orange);
    color: #fff;
    border-radius: 50px;
    text-decoration: none;
    transform: translateY(40px);
    opacity: 0;
    transition: .5s;
}

.benefit-card:hover .benefit-img {
    transform: scale(1.15) rotate(2deg);
}

.benefit-card:hover .benefit-overlay {
    background: linear-gradient(to top, rgba(230, 101, 38, .95), rgba(0, 0, 0, .35));
}

.benefit-card:hover .benefit-content {
    bottom: 50px;
}

.benefit-card:hover p,
.benefit-card:hover .read-btn {
    transform: translateY(0);
    opacity: 1;
}

.read-btn:hover {
    background: #fff;
    color: var(--brand-orange);
}

@media(max-width:768px) {
    .benefit-card {
        height: 360px;
    }

    .benefit-content h4 {
        font-size: 24px;
    }
}

/* ── End Loan Focused section ── */
/* ── Eligibility section ── */
#eligibility {
    background: #fff;
}

#eligibility .img-panel {
    background:linear-gradient(to right, #fff 0%, transparent 20%),
    url('../images/2112794.webp') center/cover no-repeat;
}

.section-eyebrow {
    width: 28px;
    height: 2px;
    background: var(--brand-red);
    display: inline-block;
}

.section-eyebrow-label {
    color: var(--brand-red);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .05em;
}

.elig-card {
    border-left: 4px solid transparent !important;
    transition: all .25s;
}

.elig-card .elig-icon {
    background: var(--brand-red-light);
    transition: background .25s;
}

.elig-card .elig-icon i {
    color: var(--brand-red);
    transition: color .25s;
}

.elig-card:hover {
    border-left-color: var(--brand-red) !important;
    transform: translateX(5px);
    box-shadow: 0 8px 24px rgba(192, 57, 43, .12);
}

.elig-card:hover .elig-icon {
    background: var(--brand-red);
}

.elig-card:hover .elig-icon i {
    color: #fff;
}

/* ──End Eligibility section ── */
/* ── How to Apply section ── */
#how-to-apply {
    background: #f7f8fa;
}

#how-to-apply .img-panel {
    width: 46%;
    background:linear-gradient(to left, #f7f8fa 0%, transparent 20%),
    url('../images/about.webp') center/cover no-repeat;
}

.timeline {
    padding-left: 56px;
}

.timeline-line {
    left: 18px;
    width: 2px;
    background: linear-gradient(to bottom, var(--brand-red), #f0c0bc);
}

.step-num1 {
    left: -56px;
    top: 6px;
    width: 38px;
    height: 38px;
    background: var(--brand-red);
    font-size: 13px;
    border: 3px solid #f7f8fa;
    box-shadow: 0 0 0 2px var(--brand-red);
    transition: transform .2s, box-shadow .2s;
}

.step-box {
    transition: all .25s;
}

.step-item:hover .step-box {
    box-shadow: 0 8px 24px rgba(192, 57, 43, .12);
    transform: translateX(4px);
    border-color: rgba(192, 57, 43, .35) !important;
}

.step-item:hover .step-num1 {
    transform: scale(1.12);
    box-shadow: 0 0 0 5px rgba(192, 57, 43, .2);
}

/* ──End How to Apply section ── */

/* ///
            Index page page
        /// */

/* EMI Calculator */
.form-range {
    height: 10px;
    border-radius: 6px;
    outline: none;
    background: #f0e6df;
}

.form-range::-webkit-slider-runnable-track {
    height: 10px;
    border-radius: 6px;
    background: transparent;
}

.form-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    background: var(--or);
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(230, 101, 38, .4);
    cursor: pointer;
    margin-top: -4px;
}

.form-range::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: var(--or);
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(230, 101, 38, .4);
    cursor: pointer;
}

.form-range::-moz-range-track {
    height: 10px;
    border-radius: 6px;
    background: #f0e6df;
}

.sdiv {
    border-top: 1px solid var(--bc);
}

.sc-hl {
    background: var(--orl) !important;
    border-color: #f5c5a3 !important;
}

.apply-btn {
    background: var(--or);
    letter-spacing: 1px;
    transition: background .2s;
}

.apply-btn:hover {
    background: #c9551e;
}

.sum-link {
    color: #4A7FD4;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
}

.sum-link:hover {
    text-decoration: underline;
}

.feat-icon {
    width: 48px;
    height: 48px;
    background: var(--orl);
    color: var(--or);
    border-radius: 14px;
    flex-shrink: 0;
}

/* End EMI Calculator */
/* ── MOBILE RESPONSIVE FIXES ── */
@media (max-width: 991px) {
    .emi-left {
        border-right: none !important;
        border-bottom: 1px solid var(--bc) !important;
    }
}

@media (max-width: 480px) {
    .emi-input-group {
        width: 120px !important;
    }

    .emi-input-group input {
        font-size: 13px !important;
    }
}

@media (max-width: 400px) {
    .emi-label-row {
        flex-wrap: wrap;
        gap: 8px !important;
    }

    .emi-label-row .ms-auto {
        width: 100%;
    }

    .emi-input-group {
        width: 100% !important;
    }
}

@media (max-width: 575px) {
    .emi-summary-top {
        flex-direction: column !important;
        align-items: center !important;
    }

    .emi-chart-wrap {
        width: 150px !important;
        height: 150px !important;
    }

    #radial {
        width: 150px !important;
        height: 150px !important;
    }

    #r-pct {
        font-size: 1.5rem !important;
    }

    #r-total {
        font-size: 1.4rem !important;
    }
}

@media (max-width: 480px) {
    .emi-bottom-links {
        flex-direction: column !important;
        align-items: center !important;
        gap: 10px !important;
    }
}

@media (max-width: 400px) {
    .feat-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }
}

@media (max-width: 575px) {
    .emi_calculator h2.display-5 {
        font-size: 1.8rem !important;
    }

    .emi-left>div {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }
}

.stat-card-val {
    font-size: 1.05rem;
    word-break: break-word;
}

@media (max-width: 360px) {
    .stat-card-val {
        font-size: 0.9rem;
    }

    .stat-card-icon {
        width: 32px !important;
        height: 32px !important;
    }
}

/* ── END MOBILE RESPONSIVE ── */
/* ///
            About page page
        /// */
/* ── About Section images Mouse Over Effect ── */
.about-image-shine::before {
    position: absolute;
    top: 0;
    left: -85%;
    display: block;
    content: "";
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, hsla(0, 0%, 100%, 0.3));
    transform: skewX(-25deg);
    z-index: 2;
}

.about-image-shine:hover::before {
    animation: shineSweep 0.6s ease forwards;
}

.about-image-shine:hover img {
    transform: scale(1.04);
}

@keyframes shineSweep {
    0% {
        left: -85%;
    }

    100% {
        left: 125%;
    }
}

/* ── About Section images Mouse Over Effect ── */

/* ── Why to lend through us page ── */
/* ── Why Lend section ── */
#why-lend {
    background-image: linear-gradient(268deg, #fff 0, transparent 66%), repeating-linear-gradient(223deg, rgba(189, 189, 189, .08) 0, rgba(189, 189, 189, .08) 1px, transparent 1px, transparent 16px), repeating-linear-gradient(268deg, rgba(189, 189, 189, .08) 0, rgba(189, 189, 189, .08) 1px, transparent 1px, transparent 16px), repeating-linear-gradient(313deg, rgba(189, 189, 189, .08) 0, rgba(189, 189, 189, .08) 1px, transparent 1px, transparent 16px), linear-gradient(178deg, #fff, #fff);
}

/* ──End Why Lend section ── */

/* ///
            personal Loan page
        /// */
/* personal Loan page*/
.personalslider-text {
    font-size: clamp(52px, 8vw, 110px);
    font-weight: 900;
    line-height: 1.1;
    padding: 10px 0;
    display: inline-block;
    -webkit-text-stroke-color: #ffffff;
    -webkit-text-stroke-width: 2px;
    -webkit-text-fill-color: transparent;
    color: transparent;
    opacity: 0.18;
}

/* End personal Loan page*/

/* ///
            Footer section page
        /// */
/* Footer section images  */
.main-footer__bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
    mix-blend-mode: color-burn;
    opacity: 0.3;
}

#footer .footer_links,
#footer .container,
#footer .bg-black {
    position: relative;
    z-index: 1;
}

/* End Footer section images  */

/* Apply Loan Section */
.applyloan .row {
    position: relative;
}

.applyloan .row::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/works-two-s-2.webp') center / 90% no-repeat;
    pointer-events: none;
    z-index: 0;
}

.parallax-layer {
    position: relative;
    z-index: 1;
    transition: transform .12s linear;
    will-change: transform;
}

.applyloan::before,
.applyloan::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 220px;
    background-image: radial-gradient(circle, #e6652640 1px, transparent 1px);
    background-size: 18px 18px;
    pointer-events: none;
    z-index: 0;
}

.applyloan::before {
    top: 0;
    right: 0;
}

.applyloan::after {
    bottom: 0;
    left: 0;
}

.section-badge {
    background: #1a2332;
    border-radius: 50px;
}

.section-badge i {
    color: #f5c518;
}

.letter {
    display: inline-block;
    opacity: 0;
    transform: translateX(20px);
    transition: opacity .3s ease-out, transform .3s ease-out;
}

.letter.play {
    opacity: 1;
    transform: translateX(0);
}

.step-card {
    border: 1.5px solid transparent;
    border-radius: 18px;
    opacity: 1;
    transform: translateY(36px);
    transition: opacity .55s ease, transform .55s cubic-bezier(.34, 1.2, .64, 1), box-shadow .3s, border-color .3s;
}

.step-card.visible {
    opacity: 1;
    transform: translateY(0);
}

.step-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    border-color: var(--primary);
    box-shadow: 0 20px 48px rgba(230, 101, 38, .2) !important;
}

.ghost-icon {
    position: absolute;
    bottom: 12px;
    right: 16px;
    font-size: 72px;
    color: var(--primary-lt);
    opacity: .5;
    pointer-events: none;
    transition: opacity .3s;
}

.step-card:hover .ghost-icon {
    opacity: .85;
}

.step-num {
    position: absolute;
    top: -18px;
    right: 20px;
    width: 42px;
    height: 42px;
    background: var(--primary);
    border-radius: 50%;
    box-shadow: 0 4px 16px rgba(230, 101, 38, .35);
    transition: background .3s, transform .3s;
}

.step-card:hover .step-num {
    background: var(--primary-dk);
    transform: scale(1.15) rotate(-8deg);
}

/* Icon box */
.step-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--primary-lt);
    transition: background .3s;
}

.step-icon i {
    color: var(--primary);
    transition: transform .4s, color .3s;
}

.step-card:hover .step-icon {
    background: var(--primary);
}

.step-card:hover .step-icon i {
    color: #fff;
    transform: scale(1.2) rotate(-5deg);
}

@media (min-width: 992px) {
    .step-lower {
        margin-top: 64px;
    }
}

/* (duplicate .parallax-layer block removed — was redefined here with only transition/will-change) */
/* Ripple */
.ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(230, 101, 38, .18);
    transform: scale(0);
    animation: rpl .6s ease-out forwards;
    pointer-events: none;
}

@keyframes rpl {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

/* End Apply Loan Section */

/* Banner section CSS  */
.hero_slider {
    height: clamp(260px, 55vw, 580px);
}

.slide-image {
    transform: scale(1);
    transition: transform 8s ease-in-out;
    object-position: center center;
}

.swiper-slide-active .slide-image {
    transform: scale(1.12);
}

.slide-tag {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s 0.2s ease, transform 0.7s 0.2s ease;
}

.slide-title {
    opacity: 0;
    transform: translateX(-48px);
    transition: opacity 0.8s 0.4s ease, transform 0.8s 0.4s ease;
}

.slide-sub {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s 0.65s ease, transform 0.7s 0.65s ease;
}

.swiper-slide-active .slide-tag,
.swiper-slide-active .slide-title,
.swiper-slide-active .slide-sub {
    opacity: 1;
    transform: translate(0);
}

@media (max-width: 767px) {
    .hero_slider .position-absolute.d-flex {
        padding: 0 20px !important;
        align-items: center;
        text-align: center;
    }

    .hero_slider .position-absolute.d-flex>div {
        max-width: 100% !important;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .slide-tag {
        justify-content: center;
    }

    .slide-tag span {
        display: none !important;
    }

    .slide-sub {
        max-width: 100% !important;
    }

}

@media (max-width: 400px) {
    .slide-sub {
        display: none !important;
    }
}

/* End Banner */

/* About section  */
.about-section {
    position: relative;
    overflow: hidden;
}

.about-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 51%;
    height: 100%;
    background-image: url('/website/images/pattern-01.jpg');
    background-repeat: repeat;
    background-position: right top;
    opacity: 0.5;
    z-index: 0;
}

/* Keep content above background */
.about-section .container {
    position: relative;
    z-index: 2;
}

/*End About section */

/* Loan Categories  */
.loan_sec {
    transition: .4s ease;
}

.loan-number {
    color: transparent;
    -webkit-text-stroke: 1px #adb5bd;
    transition: .4s ease;
}

.loan_sec:hover .loan-number {
    color: #e66526;
    -webkit-text-stroke: 0;
}

.loan-icon {
    filter: grayscale(100%);
    opacity: .7;
    transition: .4s ease;
}

.loan_sec:hover {
    transform: translateY(-12px);
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .15) !important;
}

.loanProdutsSlider .loan_sec img {
    width: 70px;
    filter: grayscale(100%);
    opacity: .7;
    transition: .5s ease;
    transform: scale(1);
}

.loanProdutsSlider .loan_sec:hover img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.15) rotate(5deg);
}

/* End Loan Categories */

/* Meet India's New Lending  */
.why-choose-section {
    background: linear-gradient(rgba(230, 101, 38, .10),
        rgba(230, 101, 38, .10)),
    url('../images/banner-2.jpg') center/cover no-repeat;
}

.feature-card {
    position: relative;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 15px;
    padding: 1.5rem;
    overflow: hidden;
    transition: .3s ease;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}

.feature-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 .75rem 1.5rem rgba(0, 0, 0, .12);
    border-color: #ffd5c1;
    background-color: #ffede5;
}

.feature-card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 140px;
    height: 140px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right top;
    opacity: 1.08;
    pointer-events: none;
}

.bg-img-1::after {
    background-image: url('../images/project-shape3.png');
}

.feature-card .icon-box {
    width: 55px;
    height: 55px;
    background: rgba(230, 101, 38, .12);
    color: #E66526;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 15px;
    transition: all 0.3s ease;
    position: relative;
    z-index: 2;
}

.feature-card:hover .icon-box {
    background: #E66526;
    color: #fff;
    transform: rotate(10deg) scale(1.1);
    box-shadow: 0 8px 20px rgba(230, 101, 38, 0.35);
}

.feature-card:hover .icon-box i {
    animation: iconPop 0.4s ease;
}

@keyframes iconPop {
    0% {
        transform: scale(0.8);
    }

    100% {
        transform: scale(1);
    }
}

.floating-img {
    max-width: 500px;
    animation: float 4s ease-in-out infinite;
}

@keyframes float {
    50% {
        transform: translateY(-12px);
    }
}

/* End Meet India's New Lending */

.info-card {
    background: #fff;
    border-radius: 18px;
    padding: 30px;
    height: 100%;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .05);
    transition: .3s;
}

.info-card:hover {
    transform: translateY(-8px);
}

.info-card i {
    color: #E66526;
    font-size: 35px;
    margin-bottom: 15px;
}

.support-box {
    background: #fff;
    margin-top: 50px;
    border-left: 5px solid #E66526;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .05);
}

.support-box a {
    color: #E66526;
    font-weight: 700;
    text-decoration: none;
}

/* Subscribe banner full width input on mobile */
.footer-subscribe-banner .w-md-auto {
    width: 100% !important;
}

@media (min-width: 768px) {
    .footer-subscribe-banner .w-md-auto {
        width: auto !important;
        max-width: 480px;
    }
}

.footer_linksWrapper ul li {
    margin-bottom: 6px;
}

@media (max-width: 575px) {
    .footer_title {
        font-size: 13px !important;
    }

    .footer_linksWrapper ul li a {
        font-size: 12px;
    }
}

.footer-social-icons {
    align-items: center;
}

.footer-social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #1a1a1a;
    border: 0.5px solid #2e2e2e;
    color: #888;
    font-size: 15px;
    text-decoration: none;
    transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.footer-social-link:hover {
    transform: translateY(-4px) scale(1.15);
    border-color: transparent;
    color: #fff !important;
    animation: socialPulse 0.6s ease-out;
}

.footer-social-link[data-color="#1877f2"]:hover {
    background: #1877f2;
}

.footer-social-link[data-color="#1da1f2"]:hover {
    background: #1da1f2;
}

.footer-social-link[data-color="#e1306c"]:hover {
    background: #e1306c;
}

.footer-social-link[data-color="#0a66c2"]:hover {
    background: #0a66c2;
}

.footer-social-link[data-color="#ff0000"]:hover {
    background: #ff0000;
}

@keyframes socialPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(232, 119, 34, 0.5);
    }

    70% {
        box-shadow: 0 0 0 8px rgba(232, 119, 34, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(232, 119, 34, 0);
    }
}

@media (max-width: 767px) {
    .bg-black .d-flex.flex-column {
        text-align: center;
    }

    .bg-black .footer_logo img {
        width: 120px;
    }
}

/* End Subscribe banner full width input on mobile */
/* ── Bill Discounting: Why Choose Us ── */
        #bill-discounting .collage {
            position: relative;
            height: 460px;
            max-width: 480px;
        }
        #bill-discounting .collage::before {
            content: '';
            position: absolute;
            width: 220px;
            height: 220px;
            right: 0;
            top: 0;
            border-radius: 50%;
            background-image: radial-gradient(circle, #e6652640 1px, transparent 1px);
            background-size: 18px 18px;
            z-index: 0;
        }
        /* Striped arc + ring — echoes the swirl/ring behind the photos in the reference,
           in brand orange instead of blue */
        #bill-discounting .collage .arc {
            position: absolute;
            width: 190px;
            height: 190px;
            right: 10px;
            top: 0;
            z-index: 0;
            border-radius: 50%;
            background: repeating-linear-gradient(70deg, var(--brand-orange) 0 3px, transparent 3px 9px);
            -webkit-mask-image: radial-gradient(circle at 30% 70%, #000 45%, transparent 70%);
                    mask-image: radial-gradient(circle at 30% 70%, #000 45%, transparent 70%);
            opacity: .5;
        }
        #bill-discounting .collage .ring {
            position: absolute;
            width: 230px;
            height: 230px;
            right: 0;
            top: 0;
            z-index: 0;
            border-radius: 50%;
            border: 24px solid #f7f8fa;
        }
        #bill-discounting .collage .img-top,
        #bill-discounting .collage .img-bottom {
            position: absolute;
            border-radius: 50%;
            overflow: hidden;
            border: 6px solid #fff;
            box-shadow: 0 25px 55px rgba(0, 0, 0, .14);
        }
        #bill-discounting .collage img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        #bill-discounting .collage .img-top {
            width: 280px;
            height: 280px;
            top: 0;
            left: 10px;
            z-index: 2;
        }
        #bill-discounting .collage .img-bottom {
            width: 330px;
            height: 330px;
            bottom: 0;
            left: 127px;
            z-index: 1;
        }
        @media (max-width: 575px) {
            #bill-discounting .collage {
                height: 380px;
            }
            #bill-discounting .collage .arc,
            #bill-discounting .collage .ring {
                display: none;
            }
            #bill-discounting .collage .img-top {
                width: 190px;
                height: 190px;
            }
            #bill-discounting .collage .img-bottom {
                width: 230px;
                height: 230px;
            }
        }
    /* ──End Bill Discounting ── */


     /* ── Bill Discounting: Loan Apply (bd-prefixed, clip-path card design) ── */
        :root {
            --brand-orange: #E66526;
             --brand-orange-light: #FFF0E8;
            --bd-dark: #131b2e;
        }
        #billdiscountingloan {
            position: relative;
            background: var(--bd-dark);
            overflow: hidden;
            padding: 100px 0;
        }
        /* Right Background Image */
        #billdiscountingloan .bd-photo {
            position: absolute;
            inset: 0;
            left: 34%;
            background: linear-gradient(to right, var(--bd-dark) 0%, rgba(19, 27, 46, .55) 18%, transparent 42%), url('/website/images/chooseus-bg.webp') center / cover no-repeat;
            z-index: 0;
        }
        #billdiscountingloan .bd-photo::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(19, 27, 46, .15), rgba(19, 27, 46, .55));
        }
        /* faint decoration */
        #billdiscountingloan::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at left bottom, rgba(255, 255, 255, .03), transparent 55%);
            pointer-events: none;
        }
        /* Content Above Background */
        #billdiscountingloan .container {
            position: relative;
            z-index: 5;
        }
        /* SECTION TITLE */
        #billdiscountingloan .bd-tag {
            display: inline-block;
            color: #c9cad5;
            font-size: 15px;
            font-weight: 600;
            letter-spacing: 1px;
            margin-bottom: 10px;
        }
        #billdiscountingloan .bd-heading {
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }
        #billdiscountingloan .text-orange {
            color: var(--brand-orange);
        }
        /* CARD */
        #billdiscountingloan .bd-card {
            position: relative;
            background: #fff;
            border-radius: 10px;
            padding: 38px 30px 78px;
            overflow: hidden;
            transition: .4s;
            height: 100%;
            clip-path: polygon(0 0, 100% 0, 100% 78%, 50% 100%, 0 78%);
            box-shadow: 0 15px 35px rgba(0, 0, 0, .08);
        }
        /* Bottom Shape */
        #billdiscountingloan .bd-card::before {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 85px;
            background: linear-gradient(160deg, #f8f8f8 55%, #ececec 55%);
        }
        /* Second Shape */
        #billdiscountingloan .bd-card::after {
            content: "";
            position: absolute;
            bottom: 0;
            right: 0;
            width: 50%;
            height: 80px;
            background: #f2f2f2;
            clip-path: polygon(35% 0, 100% 55%, 100% 100%, 0 100%, 0 25%);
        }
        /* CARD CONTENT */
        #billdiscountingloan .bd-content {
            position: relative;
            z-index: 3;
        }
        #billdiscountingloan .bd-content h4 {
            font-size: 19px;
            font-weight: 700;
            color: #23253b;
            margin-bottom: 14px;
            transition: .4s;
        }

        #billdiscountingloan .bd-content p {
            color: #6b6b6b;
            line-height: 1.8;
            margin: 0;
            font-size: 14px;
        }
        /* ICON */
        #billdiscountingloan .bd-icon {
            position: absolute;
            bottom: 18px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 5;
            font-size: 42px;
            color: #9c9c9c;
            transition: .4s;
        }
        /* HOVER — icon + heading colour change only */
        #billdiscountingloan .bd-card:hover {
            transform: translateY(-12px);
              background: var(--brand-orange-light);
            box-shadow: 0 25px 50px rgba(0, 0, 0, .18);
        }

        #billdiscountingloan .bd-card:hover::before{
            background:linear-gradient(
                160deg,
                #FFF6F2 55%,
                #E66526 55%
            );
        }
        #billdiscountingloan .bd-card:hover .bd-icon {
            color: var(--brand-orange);
            transform: translateX(-50%) scale(1.15);
        }
        #billdiscountingloan .bd-card:hover h4 {
            color: var(--brand-orange);
        }


        @media (max-width: 991px) {
            #billdiscountingloan::after {
                width: 100%;
                opacity: .15;
            }
        }
    /* ──End Bill Discounting: Loan Apply ── */

    /* ── credit card repayment loan How to apply ── */
        .stat-cut-card {
            position: relative;
            background: linear-gradient(135deg, var(--brand-orange-light) 0%, #fff 55%);
            border-radius: 20px;
            padding: 34px 22px 26px;
            overflow: hidden;
            box-shadow: 0 12px 30px rgba(0, 0, 0, .06);
            transition: transform .35s ease, box-shadow .35s ease;
        }
        .stat-cut-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 120px;
            height: 120px;
            background: #ffaa81;
            border-radius: 0 0 100% 0;
            transition: width .35s ease, height .35s ease;
            z-index: 0;
        }
        .stat-cut-card .cut-dots {
            position: absolute;
            top: 0;
            left: 0;
            width: 110px;
            height: 110px;
            background-image: radial-gradient(circle, rgba(255, 255, 255, .55) 1.5px, transparent 1.5px);
            background-size: 14px 14px;
            border-radius: 0 0 100% 0;
            z-index: 1;
            pointer-events: none;
            transition: width .35s ease, height .35s ease;
        }
        .stat-cut-card::after {
            content: '';
            position: absolute;
            bottom: 0;
            right: 0;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 0 34px 34px;
            border-color: transparent transparent var(--brand-orange) transparent;
            transition: border-width .35s ease;
            z-index: 0;
        }
        .stat-cut-card .cut-icon {
            position: relative;
            z-index: 2;
            width: 60px;
            height: 60px;
            margin: 0 auto 18px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--brand-orange);
            font-size: 26px;
            background: #fff;
            box-shadow: 0 4px 14px rgba(230, 101, 38, .18);
            transition: background .35s ease, color .35s ease, transform .35s ease;
        }
        .stat-cut-card h4 {
            position: relative;
            z-index: 2;
            text-align: center;
            font-size: 19px;
            font-weight: 600;
            margin: 0 0 10px;
        }
        .stat-cut-card p {
            position: relative;
            z-index: 2;
            text-align: center;
            font-size: 13.5px;
            line-height: 1.6;
            color: #6b6b6b;
            margin: 0;
        }
        .stat-cut-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(230, 101, 38, .18);
        }
        .stat-cut-card:hover::before,
        .stat-cut-card:hover .cut-dots {
            width: 150px;
            height: 150px;
        }
        .stat-cut-card:hover::after {
            border-width: 0 0 44px 44px;
        }
        .stat-cut-card:hover .cut-icon {
            background: var(--brand-orange);
            color: #fff;
            transform: scale(1.1) rotate(-6deg);
        }
   /* ──End credit card repayment loan How to apply── */
        #eligibility .img-paneldebtcon {
            background:linear-gradient(to right, #fff 0%, transparent 20%), url('/website/images/user-interface.webp') center/cover no-repeat;
        }
        #eligibility .img-panelEdu {
            background:linear-gradient(to right, #fff 0%, transparent 20%), url('/website/images/presentation-1-99.png') center/cover no-repeat;
        }
    /* ── Smart_investment page CSS ── */
        :root {
            --brand-orange: #E66526;
            --brand-orange-light: #FFF0E8;
            --secondary-color: #1a2332;
            --secondary-color-light: #2a3348;
            --step-circle: 308px;
            --step-overlap: -13px;
        }

        .hiw-track {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: nowrap;
        }
        .hiw-step {
            position: relative;
            width: var(--step-circle);
            height: var(--step-circle);
            border-radius: 50%;
            background: #f2f2f2;
            overflow: hidden;
            text-align: center;
            flex-shrink: 0;
        }
        .hiw-step:not(:first-child) {
            margin-left: calc(var(--step-overlap) * -1);
        }
        /* base state (idle) */
        .hiw-idle {
            position: absolute;
            inset: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 0 30px;
            transition: opacity 400ms ease;
        }
        .hiw-icon {
            width: 64px;
            height: 64px;
            margin-bottom: 16px;
            color: var(--brand-orange);
            font-size: 26px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: var(--brand-orange-light);
            border: 2px solid rgba(230,101,38,.18);
            transition: transform 420ms cubic-bezier(.34,1.56,.64,1),
                        background-color 420ms ease,
                        color 420ms ease,
                        box-shadow 420ms ease,
                        border-color 420ms ease;
        }
        .hiw-title {
            font-weight: 700;
            font-size: 1.05rem;
            color: #1a2332;
            line-height: 1.35;
        }
        /* overlay reveal on hover - scales from center like a circular wipe */
        .hiw-overlay {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            background: var(--secondary-color);
            transform: scale(0, 0);
            transition: transform 500ms ease;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 40px 34px 0;
            z-index: 2;
        }
        .hiw-step:hover .hiw-overlay {
            transform: scale(1, 1);
        }
        .hiw-step:hover .hiw-idle {
            opacity: 0;
        }
        .hiw-overlay .hiw-title {
            color: #fff;
            margin-bottom: 10px;
        }
        .hiw-desc {
            font-size: .8rem;
            color: #b7bcc9;
            max-width: 195px;
            line-height: 1.55;
        }
        /* step number badge, always visible, floats above the overlay */
        .hiw-badge {
            position: absolute;
            left: 50%;
            top: 230px;
            transform: translateX(-50%);
            display: inline-block;
            width: 100%;
            height: 100%;
            background: #fff;
            text-align: center;
            border-radius: 50%;
            font-size: 18px;
            line-height: 28px;
            font-family: var(--title-font);
            color: var(--secondary-color);
            font-weight: 600;
            padding-top: 20px;
            z-index: 3;
            transition: all 500ms ease;
        }
        .hiw-step:hover .hiw-badge {
            color: #fff;
            background: var(--secondary-color-light);
        }
        .hiw-arrow {
            position: relative;
            z-index: 4;
            width: 34px;
            height: 34px;
            border-radius: 50%;
            background: #fff;
            border: 1px solid #e8e8e8;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #1a2332;
            font-size: 14px;
            flex-shrink: 0;
            margin: 0 -17px;
        }
        @media (max-width: 991px) {
            :root {
                --step-circle: 200px;
                --step-overlap: 40px;
            }
            .hiw-track {
                flex-wrap: wrap;
                row-gap: 40px;
            }
            .hiw-desc {
                max-width: 155px;
                font-size: .74rem;
            }
            .hiw-badge {
                width: 64px;
                height: 64px;
                font-size: .72rem;
                padding-top: 12px;
            }
        }
        @media (max-width: 575px) {
            .hiw-track {
                flex-direction: column;
            }
            .hiw-step:not(:first-child) {
                margin-left: 0;
                margin-top: -30px;
            }
            .hiw-arrow {
                transform: rotate(90deg);
                margin: 0;
            }
        }
   /* ── End Smart_investment page CSS ── */
   /* ── medicalemergencyloan page CSS ── */
    #medicalemergencyloan {
        position: relative;
        background: var(--bd-dark);
        overflow: hidden;
        padding: 100px 0;
    }
    /* Right Background Image */
    #medicalemergencyloan .bd-photo {
        position: absolute;
        inset: 0;
        left: 34%;
        background: linear-gradient(to right, var(--bd-dark) 0%, rgba(19, 27, 46, .55) 18%, transparent 42%), url('website/images/mel_456.webp') center / cover no-repeat;
        z-index: 0;
    }
    #medicalemergencyloan .bd-photo::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(19, 27, 46, .15), rgba(19, 27, 46, .55));
    }
       #medicalemergencyloan .bd-heading {
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }
        #medicalemergencyloan .text-orange {
            color: var(--brand-orange);
        }
    /* ── medicalemergencyloan page CSS ── */
    /* ── Education loan page CSS ── */
  :root {
    --brand-orange: #E66526;
    --brand-orange-light: #FFF0E8;
    --bd-dark: #131b2e;
}
#educationloan {
    position: relative;
    background: var(--bd-dark);
    overflow: hidden;
    padding: 100px 0;
}
/* Right Background Image */
#educationloan .bd-photo {
    position: absolute;
    inset: 0;
    left: 34%;
    background: linear-gradient(to right, var(--bd-dark) 0%, rgba(19, 27, 46, .55) 18%, transparent 42%), url('website/images/edu_howtoapp.webp') center / cover no-repeat;
    z-index: 0;
}
#educationloan .bd-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(19, 27, 46, .15), rgba(19, 27, 46, .55));
}
/* faint decoration */
#educationloan::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at left bottom, rgba(255, 255, 255, .03), transparent 55%);
    pointer-events: none;
}
/* Content Above Background */
#educationloan .container {
    position: relative;
    z-index: 5;
}
/* SECTION TITLE */
#educationloan .bd-tag {
    display: inline-block;
    color: #c9cad5;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 10px;
}
#educationloan .bd-heading {
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
}
#educationloan .text-orange {
    color: var(--brand-orange);
}
/* CARD */
#educationloan .bd-card {
    position: relative;
    background: #fff;
    border-radius: 10px;
    padding: 38px 30px 78px;
    overflow: hidden;
    transition: .4s;
    height: 100%;
    clip-path: polygon(0 0, 100% 0, 100% 78%, 50% 100%, 0 78%);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .08);
}
/* Bottom Shape */
#educationloan .bd-card::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 85px;
    background: linear-gradient(160deg, #f8f8f8 55%, #ececec 55%);
}
/* Second Shape */
#educationloan .bd-card::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    height: 80px;
    background: #f2f2f2;
    clip-path: polygon(35% 0, 100% 55%, 100% 100%, 0 100%, 0 25%);
}
/* CARD CONTENT */
#educationloan .bd-content {
    position: relative;
    z-index: 3;
}
#educationloan .bd-content h4 {
    font-size: 19px;
    font-weight: 700;
    color: #23253b;
    margin-bottom: 14px;
    transition: .4s;
}
#educationloan .bd-content p {
    color: #6b6b6b;
    line-height: 1.8;
    margin: 0;
    font-size: 14px;
}
/* ICON */
#educationloan .bd-icon {
    position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    font-size: 42px;
    color: #9c9c9c;
    transition: .4s;
}
/* HOVER — icon + heading colour change only */
#educationloan .bd-card:hover {
    transform: translateY(-12px);
    background: var(--brand-orange-light);
    box-shadow: 0 25px 50px rgba(0, 0, 0, .18);
}
#educationloan .bd-card:hover::before {
    background: linear-gradient(
        160deg,
        #FFF6F2 55%,
        #E66526 55%
    );
}
#educationloan .bd-card:hover .bd-icon {
    color: var(--brand-orange);
    transform: translateX(-50%) scale(1.15);
}
#educationloan .bd-card:hover h4 {
    color: var(--brand-orange);
}

@media (max-width: 991px) {
    #educationloan::after {
        width: 100%;
        opacity: .15;
    }
}
/* ── End Education Loan Section ── */
/* ── Header menu Section ── */
#header {
    background: #fff;
    position: relative;
    top: 0;
    transition: 0.3s ease;
}

#header.fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    backdrop-filter: blur(26px);
    background: rgba(255,255,255,0.4);
    box-shadow: 0 0 40px rgba(0,0,0,0.15);
}
/* ──End Header menu Section ── */
/* ──Page Loader ── */
#loader2 {
    position: fixed;
    inset: 0;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99999;
}

.bars {
    display: flex;
    gap: 6px;
}

.bars span {
    width: 8px;
    height: 40px;
    background: #E66526;
    border-radius: 10px;
    animation: bars .8s infinite ease-in-out;
}

.bars span:nth-child(2) {
    animation-delay: .1s;
}

.bars span:nth-child(3) {
    animation-delay: .2s;
}

.bars span:nth-child(4) {
    animation-delay: .3s;
}

.bars span:nth-child(5) {
    animation-delay: .4s;
}

@keyframes bars {

    0%,
    100% {
        transform: scaleY(.4);
    }

    50% {
        transform: scaleY(1.5);
    }
}

/* ──End Page Loader ── */