:root{
    --navy:#132b5e;
    --orange:#f5820a;
    --blue:#1663c7;
    --red:#e5322e;
    --green:#2fa84f;
    --teal:#12b3c4;
    --purple:#7b3fbf;
    --bg:#eef2f8;
  }
  body{
    font-family: "Poppins", sans-serif;
    background:#f7fbff;
    color:#1b2b50;
}
.color-orange{ color: var(--orange) }

/* .container, .container-fluid{max-width: 90%;}  */
.px-60{padding-right: 60px;
    padding-left: 60px;}
.loan-section{
    background:#f7fbff;
    padding: 100px 0;
}

.section-tag{

    display:inline-block;
    padding:8px 20px;
    border-radius:50px;
    background:#fff3e7;
    color:#ff6b00;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:1px;
}

.section-title{

    font-size:48px;
    font-weight:800;
    color:#1b2b50;
}

.section-title span{

    color:#ff6b00;
}

.section-desc{

    color:#6c757d;
    font-size:18px;
    max-width:700px;
    margin:auto;
}

.loan-card{

    background:#fff;
    border-radius:20px;
    padding:40px 30px;
    text-align:center;
    height:100%;
    transition:.4s;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
    border:2px solid transparent;
}

.loan-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.loan-card.active{

    border-color:#0d6efd;
}

.icon{

    width:90px;
    height:90px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:25px;
    font-size:38px;
    color:#fff;
}

.orange{

    background:linear-gradient(135deg,#ff8c00,#ff5a00);
}

.blue{

    background:linear-gradient(135deg,#0d6efd,#1b52d8);
}

.red{

    background:linear-gradient(135deg,#ff3d3d,#d70000);
}

.loan-card h3{

    font-size:30px;
    font-weight:700;
    color:#1d2d50;
}

.loan-card h4{

    color:#ff6b00;
    font-weight:700;
    margin-bottom:20px;
}

.loan-card p{

    color:#666;
    line-height:1.8;
    min-height:120px;
}

.btn{

    border-radius:50px;
    padding:14px 32px;
    font-weight:600;
}

.btn-orange{

    background:#ff7a00;
    color:#fff;
}

.btn-orange:hover{

    background:#e86f00;
    color:#fff;
}

.btn-primary-custom{

    background:#0d6efd;
    color:#fff;
}

.btn-primary-custom:hover{

    background:#0b5ed7;
    color:#fff;
}

.btn-red{

    background:#e60023;
    color:#fff;
}

.btn-red:hover{

    background:#c7001f;
    color:#fff;
}

@media(max-width:991px){

.section-title{

font-size:36px;

}

.loan-card{

margin-bottom:15px;

}

.loan-card p{

min-height:auto;

}

}

@media(max-width:576px){

.section-title{

font-size:30px;

}

.section-desc{

font-size:16px;

}

.loan-card{

padding:30px 25px;

}

}



/*=================================================
               WHY CHOOSE SECTION
==================================================*/



.why-choose{
    position:relative;
    overflow:hidden;
    background:linear-gradient(180deg, #add6ff 0%, #ffd2d2 100%);
    padding: 100px 0;
}

/*=========================
Section Heading
==========================*/

.section-tag{

    display:inline-block;

    padding:10px 22px;

    border-radius:50px;

    background:#fff2e8;

    color:#ff6600;

    font-size:20px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

}

.section-title{

    font-size:52px;

    font-weight:800;

    line-height:1.15;

    color:#0d2d62;

}

.section-title span{

    display:block;

    color:#ff6600;

}

.section-desc{

    font-size:17px;

    line-height:30px;

    color:#6b7280;

    max-width:650px;

    margin-top:18px;

}

/*=========================
Feature Card
==========================*/

.feature-card{

    background:#fff;

    border-radius:22px;

    padding:35px 30px;

    text-align:center;

    height:100%;

    transition:.35s;

    box-shadow:0 15px 40px rgba(0,0,0,.07);

    border:1px solid rgba(0,0,0,.05);

    position:relative;

    overflow:hidden;

}

.feature-card:hover{

    transform:translateY(-10px);

    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.feature-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:6px;

    background:linear-gradient(90deg,#ff6600,#ff3300);

    transform:scaleX(0);

    transition:.4s;

}

.feature-card:hover::before{

    transform:scaleX(1);

}

.feature-card h4{

    font-size:22px;

    font-weight:700;

    color:#12325b;

    margin-bottom:15px;

}

.feature-card p{

    color:#6b7280;

    line-height:28px;

    margin:0;

    font-size:20px;

}

/*=========================
Icons
==========================*/

.feature-icon{

    width:85px;

    height:85px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 25px;

    color:#fff;

    font-size:34px;

    box-shadow:0 10px 25px rgba(0,0,0,.18);

}

.orange{

    background:linear-gradient(135deg,#ff9800,#ff6600);

}

.blue{

    background:linear-gradient(135deg,#007bff,#0048ff);

}

.red{

    background:linear-gradient(135deg,#ff5252,#d50000);

}

.green{

    background:linear-gradient(135deg,#00c853,#00a152);

}

.cyan{

    background:linear-gradient(135deg,#00c6ff,#0099ff);

}

.purple{

    background:linear-gradient(135deg,#7b4dff,#5b2cff);

}

/*=========================
Image Area
==========================*/

.right-image{

    position:relative;   

    margin:auto;

}

.right-image img{

    width:100%;

    border-radius:28px;

   /*  box-shadow:0 25px 70px rgba(0,0,0,.18); */

}

/*=========================
Floating Card
==========================*/

.floating-card{

    position:absolute;

    left:50%;

    transform:translateX(-50%);

    bottom:30px;

    width:88%;

    background:#0f4fa8;

    border-radius:18px;

    padding:22px;

    color:#fff;

    box-shadow:0 18px 45px rgba(0,0,0,.28);

}

.floating-icon{

    width:65px;

    height:65px;

    border-radius:50%;

    background:#fff;

    color:#ff6600;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    margin-right:18px;

    flex-shrink:0;

}

.floating-card h5{

    margin:0;

    font-size:24px;

    font-weight:700;

}

.floating-card p{

    margin:8px 0 0;

    color:#dfeaff;

    font-size:15px;

    line-height:24px;

}

/*==========================
Bottom Statistics
===========================*/

.arthsetu-stats{

   /*  margin-top:70px; */

    padding-top:30px;

   /*  border-top:1px solid #edf1f7; */

}

.stats-box{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:18px;

    padding:20px 30px;

    position:relative;

}

.middle{

    border-left:1px solid #dfe5ef;

    border-right:1px solid #dfe5ef;

}

.stats-icon{

    width:65px;

    height:65px;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#2f6cf6;

    font-size:44px;

}

.stats-box h4{

    margin:0;

    font-size:20px;

    font-weight:600;

    color:#17366b;

    line-height:28px;

}

.stats-box h4 span{

    color:#ff6a00;

    font-size:42px;

    font-weight:800;

}

.stats-box p{

    margin:6px 0 0;

    font-size:20px;

    color:#17366b;

}

.stats-box strong{

    color:#ff6a00;

    font-weight:700;

}

/* Hover */

.stats-box{

    transition:.35s;

}

.stats-box:hover{

    transform:translateY(-6px);

}

.stats-box:hover .stats-icon{

    transform:scale(1.08);

}

.stats-icon{

    transition:.35s;

}

/* Responsive */

@media(max-width:991px){

.middle{

border:none;

}

.stats-box{

margin-bottom:30px;

justify-content:flex-start;

}

}

@media(max-width:576px){

.stats-box{

flex-direction:column;

text-align:center;

}

.stats-box h4 span{

font-size:34px;

}

.stats-box p{

font-size:17px;

}

}

.image-wrapper{

    overflow:hidden;

    border-radius:30px;

}

.image-wrapper img{

    transition:all .8s cubic-bezier(.19,1,.22,1);

}

.image-wrapper:hover img{

    transform:scale(1.08) translateY(-8px);

}

.image-wrapper{

    overflow:hidden;

    border-radius:28px;

    position:relative;

}

.image-wrapper img{

    width:100%;

    display:block;

    transform:scale(1);

    transition:
        transform .9s cubic-bezier(.16,1,.3,1),
        filter .6s ease,
        box-shadow .6s ease;

    will-change:transform;

}

.image-wrapper:hover img{

    transform:scale(1.06);

    filter:brightness(1.04);

    box-shadow:0 35px 80px rgba(0,0,0,.18);

}



/*====================================================================================================
                                            OUR BUSINESS SERVICES
====================================================================================================*/

:root{

    --blue:#0b2f6b;
    --orange:#ff6b00;
    --text:#5b6578;
    --white:#ffffff;

}

body{

    font-family:'Plus Jakarta Sans',sans-serif;
    background:#f7fbff;
    overflow-x:hidden;

}

/*=================================================
SECTION
==================================================*/

.services-section{

    position:relative;

    padding:100px 0;

    background:linear-gradient(
        180deg,
        #f7fbff 0%,
        #ffffff 100%
    );

}

.services-section::before{

    content:"";

    position:absolute;

    width:350px;
    height:350px;

    background:#ff6b00;

    border-radius:50%;

    top:-180px;
    left:-180px;

    opacity:.04;

}

.services-section::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    background:#2563eb;

    border-radius:50%;

    bottom:-220px;
    right:-220px;

    opacity:.04;

}

/*=================================================
HEADING
==================================================*/

.section-top{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:18px;

    margin-bottom:15px;

}

.section-top span{

    width:45px;
    height:3px;

     background:linear-gradient(
        90deg,
        rgba(255,107,0,0) 0%,
        rgba(255,107,0,.25) 18%,
        rgba(255,107,0,.70) 35%,
        #ff6b00 50%,
        rgba(255,107,0,.70) 65%,
        rgba(255,107,0,.25) 82%,
        rgba(255,107,0,0) 100%
    );

    border-radius:50px;

}

.section-top h6{

    margin:0;

    color:var(--orange);

    font-size:16px;

    font-weight:800;

    letter-spacing:2px;

    text-transform:uppercase;

}

.service-title{

    font-size:52px;

    line-height:1;

    font-weight:800;

    color:var(--blue);

    margin-bottom:15px;

}

.service-title span{

    color:var(--orange);

}

.service-desc{

    max-width:700px;

    margin:auto;

    color:var(--text);

    font-size:18px;

    line-height:32px;

}

/*=================================================
SERVICE CARD
==================================================*/

.service-card{

    position:relative;

    background:#fff;

    border-radius:32px;

    padding:40px 35px;

    height:100%;

    overflow:hidden;

    border:1px solid rgba(0,0,0,.05);

    box-shadow:
    0 20px 45px rgba(0,0,0,.06);

    transition:.4s ease;

}

/*=================================================
ICON CIRCLE
==================================================*/

.icon-circle{

    width:88px;
    height:88px;

    border-radius:50%;

    display:flex;

    align-items:center;
    justify-content:center;

    font-size:36px;

    color:#fff;

    margin-bottom:25px;

    box-shadow:
    0 15px 35px rgba(0,0,0,.15);

}

/*=================================================
CONTENT
==================================================*/

.service-content h3{

    font-size:28px;

    font-weight:800;

    color:var(--blue);

    line-height:1.3;

    margin-bottom:18px;

}

.service-content p{

    color:var(--text);

    font-size:16px;

    line-height:30px;

    margin-bottom:0;

}

/*=================================================
UNDERLINE
==================================================*/

.underline{

    width:60px;
    height:5px;

    border-radius:20px;

    background:var(--orange);

    margin-bottom:20px;

}

/*=========================================
CARD COLOR THEMES
=========================================*/

.service-card.orange .icon-circle{
    background:linear-gradient(135deg,#ff8a00,#ff5a00);
}

.service-card.blue .icon-circle{
    background:linear-gradient(135deg,#2b7cff,#0047d4);
}

.service-card.green .icon-circle{
    background:linear-gradient(135deg,#16c784,#00a86b);
}

.service-card.purple .icon-circle{
    background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}

.service-card.yellow .icon-circle{
    background:linear-gradient(135deg,#f7b500,#ff8f00);
}

.service-card.pink .icon-circle{
    background:linear-gradient(135deg,#ff4d8d,#ff0066);
}


/*=========================================
ICON CIRCLE
=========================================*/

.icon-circle{

    width:82px;

    height:82px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:28px;

    color:#fff;

    font-size:34px;

    box-shadow:0 20px 40px rgba(0,0,0,.12);

    transition:.45s;

}


/*=========================================
CARD CONTENT
=========================================*/

.service-content h3{

    font-size:28px;

    font-weight:800;

    color:#0B2F6B;

    line-height:1.25;

    margin-bottom:18px;

}

.underline{

    width:55px;

    height:4px;

    border-radius:20px;

    background:#ff6b00;

    margin-bottom:20px;

}

.service-content p{

    color:#6b7280;

    font-size:16px;

    line-height:30px;

    margin:0;

}


/*=========================================
ARROW BUTTON
=========================================*/

.arrow-btn{

    position:absolute;

    right:28px;

    bottom:28px;

    width:54px;

    height:54px;

    border-radius:50%;

    background:#f4f8ff;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#0B2F6B;

    font-size:18px;

    transition:.45s;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

}


/*=========================================
HOVER EFFECT
=========================================*/

.service-card:hover{

    transform:translateY(-12px);

    box-shadow:
        0 35px 80px rgba(0,0,0,.12);

}

.service-card:hover .icon-circle{

    transform:scale(1.08) rotate(8deg);

}

.service-card:hover .arrow-btn{

    background:#ff6b00;

    color:#fff;

    transform:translateX(4px);

}

.service-card:hover .underline{

    width:90px;

    transition:.4s;

}


/*=========================================
DECORATIVE DOTS
=========================================*/

.card-dots{

    position:absolute;

    right:22px;

    top:22px;

    width:42px;

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:5px;

    opacity:.15;

}

.card-dots span{

    width:5px;

    height:5px;

    border-radius:50%;

    background:#0B2F6B;

}


/*=========================================
BOTTOM NOTE
=========================================*/

.bottom-note{

    margin-top:20px;

    background:#ffffff;

    border-radius:22px;

    padding:20px 10px;

    display:flex;

    align-items:center;

    gap:20px;

  /*   box-shadow:0 18px 50px rgba(0,0,0,.08); */

}

.bottom-note i{

    width:68px;

    height:68px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#2b7cff,#0047d4);

    color:#fff;

    font-size:30px;

    flex-shrink:0;

}

.bottom-note p{

    margin:0;

    color:#4b5563;

    font-size:18px;

    line-height:32px;

}

.bottom-note strong{

    color:var(--orange);

}


/*=========================================
TRANSITIONS
=========================================*/

.service-card,
.icon-circle,
.arrow-btn,
.underline{

    transition:all .4s ease;

}

/*=========================================
            LARGE DESKTOP
=========================================*/

@media (min-width:1400px){

.container{

max-width:1320px;

}

.service-title{

font-size:52px;

}

.service-card{

padding:45px;

min-height:420px;

}

}

/*=========================================
              DESKTOP
=========================================*/

@media (max-width:1199px){

.services-section{

padding:90px 0;

}

.service-title{

font-size:50px;

}

.service-desc{

max-width:720px;

}

.service-card{

padding:35px;

min-height:390px;

}

.service-content h3{

font-size:26px;

}

}


/*=========================================
             TABLET
=========================================*/

@media(max-width:991px){

.services-section{

padding:80px 0;

}

.section-top{

justify-content:center;

}

.service-title{

font-size:42px;

text-align:center;

}

.service-desc{

text-align:center;

margin:auto;

margin-bottom:45px;

}

.service-card{

min-height:370px;

}

.bottom-note{

flex-direction:column;

text-align:center;

padding:30px;

}

.bottom-note p{

font-size:17px;

line-height:30px;

}

}


/*=========================================
           MOBILE LARGE
=========================================*/

@media(max-width:767px){

.services-section{

padding:60px 15px;

}

.section-top h6{

font-size:15px;

letter-spacing:1.5px;

}

.section-top span{

width:30px;

}

.service-title{

font-size:35px;

line-height:1.15;

}

.service-desc{

font-size:16px;

line-height:28px;

margin-bottom:35px;

}

.service-card{

padding:30px;

min-height:auto;

border-radius:24px;

}

.icon-circle{

width:72px;

height:72px;

font-size:28px;

margin-bottom:22px;

}

.service-content h3{

font-size:22px;

line-height:1.35;

}

.service-content p{

font-size:15px;

line-height:28px;

}

.arrow-btn{

width:48px;

height:48px;

font-size:16px;

right:22px;

bottom:22px;

}

.bottom-note{

padding:25px;

border-radius:20px;

}

.bottom-note i{

width:60px;

height:60px;

font-size:24px;

}

.bottom-note p{

font-size:15px;

line-height:28px;

}

}


/*=========================================
          SMALL MOBILE
=========================================*/

@media(max-width:480px){

.service-title{

font-size:34px;

}

.service-desc{

font-size:15px;

}

.section-top h6{

font-size:13px;

}

.icon-circle{

width:65px;

height:65px;

font-size:24px;

}

.service-content h3{

font-size:20px;

}

.service-content p{

font-size:14px;

line-height:25px;

}

.arrow-btn{

width:44px;

height:44px;

}

.card-dots{

display:none;

}

}


/*=========================================
      EQUAL CARD HEIGHT
=========================================*/

.service-card{

display:flex;

flex-direction:column;

position:relative;

height:100%;

}

.service-content{

flex:1;

}

.arrow-btn{

margin-top:auto;

}


/*=========================================
      SMOOTH ANIMATION
=========================================*/

.service-card{

transition:all .45s cubic-bezier(.22,.61,.36,1);

}

.icon-circle{

transition:all .45s cubic-bezier(.22,.61,.36,1);

}

.arrow-btn{

transition:all .35s ease;

}

.service-card:hover{

transform:translateY(-12px);

}

.service-card:hover .icon-circle{

transform:scale(1.08) rotate(8deg);

}

.service-card:hover .arrow-btn{

transform:translateX(6px);

}


/*=========================================
      PREMIUM GLASS EFFECT
=========================================*/

.service-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(12px);

-webkit-backdrop-filter:blur(12px);

border:1px solid rgba(255,255,255,.55);

}


/*=========================================
        ICON SHADOW
=========================================*/

.icon-circle{

box-shadow:

0 12px 30px rgba(0,0,0,.12),

0 3px 8px rgba(0,0,0,.06);

}


/*=========================================
      CARD HOVER SHADOW
=========================================*/

.service-card:hover{

box-shadow:

0 40px 80px rgba(15,23,42,.12),

0 20px 35px rgba(15,23,42,.08);

}


/*=========================================
      UNDERLINE ANIMATION
=========================================*/

.underline{

transition:width .35s ease;

}

.service-card:hover .underline{

width:85px;

}


/*=========================================
      PAGE SMOOTHNESS
=========================================*/

html{

scroll-behavior:smooth;

}

::selection{

background:#ff6b00;

color:#fff;

}


/*=================================================
                ROOT
==================================================*/

:root{

--blue:#0B2F6B;
--orange:#FF6B00;
--green:#27C281;
--purple:#8B5CF6;
--sky:#2F80ED;

--text:#5B6475;
--bg:#F7FAFF;

}

body{

font-family:'Plus Jakarta Sans',sans-serif;
background:var(--bg);
overflow-x:hidden;

}


/*=================================================
            SECTION
==================================================*/

.process-section{

padding:110px 0;
position:relative;
overflow:hidden;
background:
radial-gradient(circle at left top,#eef5ff 0%,#f8fbff 45%,#ffffff 100%);

}

.process-section::before{

content:"";
position:absolute;
left:-140px;
top:120px;

width:320px;
height:320px;

border-radius:50%;

background:rgba(56,132,255,.05);

}

.process-section::after{

content:"";
position:absolute;
right:-120px;
bottom:-80px;

width:300px;
height:300px;

border-radius:50%;

background:rgba(255,106,0,.05);

}


/*=================================================
            HEADING
==================================================*/

.section-top{

display:flex;
align-items:center;
justify-content:center;
gap:18px;

margin-bottom:18px;

}

.section-top span{

width:52px;
height:3px;
 background:linear-gradient(
        90deg,
        rgba(255,107,0,0) 0%,
        rgba(255,107,0,.25) 18%,
        rgba(255,107,0,.70) 35%,
        #ff6b00 50%,
        rgba(255,107,0,.70) 65%,
        rgba(255,107,0,.25) 82%,
        rgba(255,107,0,0) 100%
    );
border-radius:20px;

}

.section-top h6{

margin:0;

font-size:20px;

font-weight:800;

letter-spacing:3px;

color:#ff6b00;

}

.process-title{

font-size:70px;

font-weight:800;

line-height:1.08;

margin-bottom:22px;

color:#0B2F6B;

}

.process-title span{

color:#ff6b00;

}

.process-desc{

max-width:760px;

margin:auto;

font-size:18px;

line-height:38px;

color:#5f6878;

margin-bottom:90px;

}


/*=================================================
            TIMELINE
==================================================*/

.process-row{

position:relative;

}

.process-row::before{

content:"";

position:absolute;

left:10%;

right:10%;

top:65px;

height:3px;

background:
repeating-linear-gradient(
90deg,
#c9d8f7 0px,
#c9d8f7 8px,
transparent 8px,
transparent 18px
);

z-index:0;

}


/*=================================================
          ITEM
==================================================*/

.process-item{

position:relative;

text-align:center;

z-index:2;

padding-top:20px;

}


/*=================================================
          STEP CIRCLE
==================================================*/

.step-circle{

width:112px;

height:112px;

margin:auto;

border-radius:50%;

background:#fff;

display:flex;

justify-content:center;

align-items:center;

position:relative;

box-shadow:

0 20px 50px rgba(18,54,108,.10);
z-index: 2;
}

.step-circle h3{

font-size:62px;

font-weight:800;

color:#0B2F6B;

margin:0;

line-height:1;

}

.step-circle::after{

content:"";

position:absolute;

bottom:-36px;

width:4px;

height:36px;

background:currentColor;

}

.step-circle::before{

content:"";

position:absolute;

bottom:-48px;

width:20px;

height:20px;

border-radius:50%;

background:#fff;

border:4px solid currentColor;

}


/*=================================================
      COLOR RING
==================================================*/

.step-circle.blue{

color:#2F80ED;

border-bottom:5px solid #2F80ED;

}

.step-circle.green{

color:#27C281;

border-bottom:5px solid #27C281;

}

.step-circle.orange{

color:#ff9800;

border-bottom:5px solid #ff9800;

}

.step-circle.purple{

color:#8B5CF6;

border-bottom:5px solid #8B5CF6;

}

.step-circle.sky{

color:#2196F3;

border-bottom:5px solid #2196F3;

}


/*=================================================
             CARD
==================================================*/

.process-card{

margin-top:0;

background:#fff;

border-radius:28px;

padding:40px 28px;

min-height:360px;

box-shadow:

0 18px 60px rgba(20,40,90,.08);

position:relative;

transition:.45s;

}


/*=================================================
            ICON
==================================================*/

.process-icon{

width:120px;

height:120px;

margin:auto;

margin-bottom:28px;

border-radius:50%;

background:#F3F8FF;

display:flex;

justify-content:center;

align-items:center;

font-size:50px;

color:#2F80ED;

}

/*=================================================
        CARD CONTENT
==================================================*/

.process-card h4{

    font-size:22px;

    font-weight:800;

    color:#0B2F6B;

    line-height:1.3;

    margin-bottom:18px;

}

.process-card p{

    font-size:16px;

    line-height:30px;

    color:#667085;

    margin:0;

}

/*=================================================
        MINI UNDERLINE
==================================================*/

.mini-line{

    width:60px;

    height:4px;

    border-radius:20px;

    margin:18px auto 22px;

}

.blue-bg{

    background:#2F80ED;

}

.green-bg{

    background:#27C281;

}

.orange-bg{

    background:#FF9800;

}

.purple-bg{

    background:#8B5CF6;

}

.sky-bg{

    background:#00B8FF;

}

/*=================================================
        ICON COLORS
==================================================*/

.step-circle.blue + .connector-line + .process-card .process-icon{

    color:#2F80ED;

    background:#EDF6FF;

}

.step-circle.green + .connector-line + .process-card .process-icon{

    color:#27C281;

    background:#EDFFF5;

}

.step-circle.orange + .connector-line + .process-card .process-icon{

    color:#FF9800;

    background:#FFF6EA;

}

.step-circle.purple + .connector-line + .process-card .process-icon{

    color:#8B5CF6;

    background:#F5F0FF;

}

.step-circle.sky + .process-card .process-icon{

    color:#00B8FF;

    background:#EEF9FF;

}

/*=================================================
        CONNECTOR
==================================================*/

.connector-line{

    height:32px;

}

/*=================================================
        CARD HOVER
==================================================*/

.process-card{

    transition:all .45s cubic-bezier(.22,.61,.36,1);

}

.process-card:hover{

    transform:translateY(-14px);

    box-shadow:

    0 35px 80px rgba(0,0,0,.12),

    0 15px 35px rgba(0,0,0,.08);

}

.process-card:hover .process-icon{

    transform:scale(1.08) rotate(8deg);

}

.process-icon{

    transition:all .45s ease;

}

/*=================================================
        STEP CIRCLE ANIMATION
==================================================*/

.step-circle{

    transition:.4s;

}

.process-item:hover .step-circle{

    transform:translateY(-8px);

}

/*=================================================
        CARD TOP BORDER
==================================================*/

.process-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#FF6B00,#2F80ED);

    transform:scaleX(0);

    transition:.35s;

    border-radius:30px 30px 0 0;

}

.process-card:hover::before{

    transform:scaleX(1);

}

/*=================================================
        BOTTOM INFO BAR
==================================================*/

.process-bottom{

    display:flex;

    align-items:center;

    gap:22px;

    padding:16px 28px;

    background:#eef4fe;

    border-radius:24px;

    box-shadow:0 20px 60px rgba(0,0,0,.08);

}

.bottom-icon{

    width:72px;

    height:72px;

    border-radius:50%;

    background:linear-gradient(135deg,#2F80ED,#0047D4);

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;

    flex-shrink:0;

}

.bottom-text{

    font-size:18px;

    line-height:32px;

    color:#4B5563;

}

.bottom-text span{

    color:var(--orange);

    font-weight:800;

}

/*=================================================
        GLASS EFFECT
==================================================*/

.process-card{

    background:rgba(255,255,255,.92);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    border:1px solid rgba(255,255,255,.5);

}

/*=================================================
        FLOAT ANIMATION
==================================================*/

@keyframes floating{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}

.process-icon{

    animation:floating 4s ease-in-out infinite;

}

/*=================================================
        HOVER GLOW
==================================================*/

.process-card:hover{

    border-color:#d9e8ff;

}

.process-card:hover .mini-line{

    width:90px;

    transition:.35s ease;

}

.mini-line{

    transition:.35s ease;

}

/*=========================================
            LARGE DESKTOP
=========================================*/

@media (min-width:1400px){

.container{

max-width:1320px;

}

.process-title{

font-size:52px;

}

.process-card{

min-height:370px;

padding:45px 35px;

}

}

/*=========================================
              DESKTOP
=========================================*/

@media (max-width:1200px){

.process-title{

font-size:52px;

}

.process-desc{

font-size:17px;

line-height:34px;

}

.process-card{

padding:35px 25px;

min-height:340px;

}

.process-icon{

width:95px;

height:95px;

font-size:42px;

}

.step-circle{

width:95px;

height:95px;

}

.step-circle h3{

font-size:50px;

}

}

/*=========================================
             TABLET
=========================================*/

@media(max-width:991px){

.process-section{

padding:80px 0;

}

.process-row::before{

display:none;

}

.process-item{

margin-bottom:40px;

}

.process-card{

min-height:auto;

}

.connector-line{

display:none;

}

.step-circle::after,

.step-circle::before{

display:none;

}

.process-title{

font-size:42px;

}

.process-desc{

font-size:15px;

line-height:30px;

margin-bottom:50px;

}

.process-bottom{

flex-direction:column;

text-align:center;

padding:30px;

}

.bottom-text{

font-size:16px;

line-height:28px;

}

}

/*=========================================
            MOBILE
=========================================*/

@media(max-width:767px){

.process-section{

padding:60px 15px;

}

.section-top{

gap:12px;

}

.section-top span{

width:30px;

}

.section-top h6{

font-size:15px;

letter-spacing:2px;

}

.process-title{

font-size:30px;

line-height:1.2;

}

.process-desc{

font-size:15px;

line-height:28px;

margin-bottom:40px;

}

.process-item{

margin-bottom:35px;

}

.step-circle{

width:82px;

height:82px;

}

.step-circle h3{

font-size:40px;

}

.process-card{

padding:28px 22px;

border-radius:22px;

}

.process-icon{

width:75px;

height:75px;

font-size:32px;

margin-bottom:20px;

}

.process-card h4{

font-size:22px;

}

.process-card p{

font-size:15px;

line-height:26px;

}

.bottom-icon{

width:60px;

height:60px;

font-size:24px;

}

.bottom-text{

font-size:15px;

line-height:26px;

}

}

/*=========================================
        SMALL MOBILE
=========================================*/

@media(max-width:480px){

.process-title{

font-size:25px;

}

.process-desc{

font-size:15px;

}

.section-top h6{

font-size:13px;

}

.process-card{

padding:24px 18px;

}

.process-icon{

width:65px;

height:65px;

font-size:28px;

}

.step-circle{

width:70px;

height:70px;

}

.step-circle h3{

font-size:34px;

}

.process-card h4{

font-size:20px;

}

.process-card p{

font-size:14px;

line-height:24px;

}

.bottom-text{

font-size:14px;

line-height:24px;

}

}

/*=========================================
      EQUAL CARD HEIGHT
=========================================*/

.process-card{

display:flex;

flex-direction:column;

justify-content:flex-start;

height:100%;

}

/*=========================================
      SMOOTH TRANSITIONS
=========================================*/

.process-card,
.process-icon,
.step-circle,
.process-bottom{

transition:all .45s cubic-bezier(.22,.61,.36,1);

}

/*=========================================
      PREMIUM HOVER
=========================================*/

.process-item:hover .process-card{

transform:translateY(-12px);

}

.process-item:hover .step-circle{

box-shadow:0 25px 60px rgba(47,128,237,.18);

}

.process-item:hover .process-icon{

transform:scale(1.08);

}

/*=========================================
      SCROLL ANIMATION READY
=========================================*/

.fade-up{

opacity:0;

transform:translateY(40px);

transition:all .8s ease;

}

.fade-up.show{

opacity:1;

transform:translateY(0);

}

/*=========================================
      SMOOTH SCROLL
=========================================*/

html{

scroll-behavior:smooth;

}

/*=========================================
      SELECTION
=========================================*/

::selection{

background:#FF6B00;

color:#fff;

}



/*=====================================================================================================
                                                Success Numbers
======================================================================================================*/

:root{

    --blue:#0B2F6B;
    --orange:#FF6B00;
    --green:#19C37D;
    --purple:#7C4DFF;
    --light:#F7FAFF;
    --text:#667085;

}

body{

    font-family:'Plus Jakarta Sans',sans-serif;
    background:#fff;
    overflow-x:hidden;

}

/*=========================================
        SECTION
=========================================*/

.success-section{

    position:relative;
    overflow:hidden;
    padding:110px 0;
    background:
    radial-gradient(circle at top left,#EEF5FF 0%,#ffffff 45%),
    radial-gradient(circle at bottom right,#F7FAFF 0%,#ffffff 60%);

}

.success-section::before{

    content:"";
    position:absolute;
    left:-180px;
    top:-140px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:rgba(60,120,255,.06);

}

.success-section::after{

    content:"";
    position:absolute;
    right:-180px;
    bottom:-150px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:rgba(255,107,0,.05);

}

/*=========================================
            SECTION TOP
=========================================*/

.section-top{

    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;

    margin-bottom:18px;

}

.section-top span{

    width:48px;
    height:3px;
    border-radius:20px;
    background:linear-gradient(
        90deg,
        rgba(255,107,0,0) 0%,
        rgba(255,107,0,.25) 18%,
        rgba(255,107,0,.70) 35%,
        #ff6b00 50%,
        rgba(255,107,0,.70) 65%,
        rgba(255,107,0,.25) 82%,
        rgba(255,107,0,0) 100%
    );

}

.section-top h6{

    margin:0;

    font-size:18px;

    font-weight:800;

    letter-spacing:3px;

    color:var(--orange);

}

/*=========================================
            TITLE
=========================================*/

.success-title{

    font-size:52px;

    font-weight:800;

    line-height:1.08;

    color:var(--blue);

    margin-bottom:22px;

}

.success-title span{

    display:block;

    color:var(--orange);

}

/*=========================================
            DESCRIPTION
=========================================*/

.success-desc{

    max-width:760px;

    margin:auto;

    font-size:18px;

    line-height:38px;

    color:#596273;

    margin-bottom:26px;

}

/*=========================================
        DECORATIVE DOTS
=========================================*/

.heading-dots{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    margin-bottom:70px;

}

.heading-dots span{

    border-radius:50%;

}

.heading-dots .blue{

    width:10px;
    height:10px;
    background:#2F80ED;

}

.heading-dots .orange{

    width:10px;
    height:10px;
    background:#FF6B00;

}

.heading-dots .blue-line{

    width:42px;
    height:4px;
    border-radius:20px;
    background:#2F80ED;

}

/*=========================================
            CARD
=========================================*/

.stat-card{

    background:#fff;

    border-radius:32px;

    padding:42px 30px;

    text-align:center;

    height:100%;

    position:relative;

    overflow:hidden;

    box-shadow:
    0 18px 55px rgba(15,23,42,.08);

    transition:.45s;

}

/*=========================================
            ICON CIRCLE
=========================================*/

.icon-circle{

    width:100px;
    height:100px;

    margin:auto;
    margin-bottom:30px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:48px;

    color:#fff;

    box-shadow:
    0 18px 45px rgba(0,0,0,.12);

}

/*=========================================
            NUMBER
=========================================*/

.stat-card h3{

    font-size:50px;

    font-weight:800;

    margin-bottom:15px;

    line-height:1;

}

/*=========================================
        MINI UNDERLINE
=========================================*/

.mini-line{

    width:55px;

    height:4px;

    border-radius:30px;

    margin:0 auto 22px;

}

/*=========================================
            TITLE
=========================================*/

.stat-card h4{

    font-size:26px;

    font-weight:800;

    color:var(--blue);

    margin-bottom:18px;

    line-height:1.3;

}

/*=========================================
            PARAGRAPH
=========================================*/

.stat-card p{

    color:var(--text);

    font-size:17px;

    line-height:30px;

    margin:0;

}

/*=================================================
            CARD COLOR THEMES
==================================================*/

.stat-card.blue .icon-circle{
    background:linear-gradient(135deg,#2F80ED,#0047D4);
}

.stat-card.green .icon-circle{
    background:linear-gradient(135deg,#22C55E,#16A34A);
}

.stat-card.orange .icon-circle{
    background:linear-gradient(135deg,#FF8A00,#FF5A00);
}

.stat-card.purple .icon-circle{
    background:linear-gradient(135deg,#8B5CF6,#6D28D9);
}

/*=================================================
            NUMBER COLORS
==================================================*/

.stat-card.blue h3{
    color:#2F80ED;
}

.stat-card.green h3{
    color:#16A34A;
}

.stat-card.orange h3{
    color:#FF6B00;
}

.stat-card.purple h3{
    color:#7C3AED;
}

/*=================================================
            MINI LINE COLORS
==================================================*/

.blue-bg{
    background:#2F80ED;
}

.green-bg{
    background:#16A34A;
}

.orange-bg{
    background:#FF6B00;
}

.purple-bg{
    background:#7C3AED;
}

/*=================================================
            CARD HOVER
==================================================*/

.stat-card{
    transition:all .45s cubic-bezier(.22,.61,.36,1);
}

.stat-card:hover{

    transform:translateY(-12px);

    box-shadow:
    0 35px 80px rgba(15,23,42,.12),
    0 15px 35px rgba(15,23,42,.08);

}

/*=================================================
        ICON ANIMATION
==================================================*/

.icon-circle{

    transition:all .45s ease;

}

.stat-card:hover .icon-circle{

    transform:scale(1.08) rotate(8deg);

}

/*=================================================
        TOP GRADIENT BAR
==================================================*/

.stat-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:5px;

    background:linear-gradient(
    90deg,
    #FF6B00,
    #2F80ED);

    transform:scaleX(0);

    transition:.35s;

}

.stat-card:hover::before{

    transform:scaleX(1);

}

/*=================================================
            MINI LINE
==================================================*/

.mini-line{

    transition:.35s ease;

}

.stat-card:hover .mini-line{

    width:90px;

}

/*=================================================
        GLASS EFFECT
==================================================*/

.stat-card{

    background:rgba(255,255,255,.92);

    backdrop-filter:blur(12px);

    -webkit-backdrop-filter:blur(12px);

    border:1px solid rgba(255,255,255,.55);

}

/*=================================================
        ICON SHADOW
==================================================*/

.icon-circle{

    box-shadow:

    0 18px 40px rgba(0,0,0,.14),

    0 6px 14px rgba(0,0,0,.08);

}

/*=================================================
        FLOATING ANIMATION
==================================================*/

@keyframes floating{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}

.icon-circle{

    animation:floating 4s ease-in-out infinite;

}

/*=================================================
        BOTTOM SUCCESS BOX
==================================================*/

.success-bottom{

    display:flex;

    align-items:center;

    gap:24px;

    padding:30px 35px;

    border-radius:28px;

    background:#fff;

    box-shadow:
    0 20px 60px rgba(15,23,42,.08);

}

.success-icon{

    width:75px;

    height:75px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    color:#fff;

    font-size:32px;

    background:linear-gradient(
    135deg,
    #2F80ED,
    #0047D4);

}

.success-content p{

    margin:0 0 6px;

    color:#667085;

    font-size:17px;

}

.success-content h4{

    margin:0;

    font-size:28px;

    font-weight:800;

    color: var(--orange);

}

/*=================================================
        DECORATIVE EFFECT
==================================================*/

.stat-card::after{

    content:"";

    position:absolute;

    right:-35px;
    top:-35px;

    width:120px;
    height:120px;

    border-radius:50%;

    background:rgba(47,128,237,.04);

}

/*=================================================
        SMOOTH EFFECTS
==================================================*/

.stat-card,
.icon-circle,
.mini-line,
.success-bottom{

    transition:all .4s ease;

}

/*=========================================
            LARGE DESKTOP
=========================================*/

@media (min-width:1400px){

.container{
max-width:1320px;
}

.success-title{
font-size:52px;
}

.stat-card{
padding:50px 35px;
min-height:390px;
}

.stat-card h3{
font-size:44px;
}

}

/*=========================================
              DESKTOP
=========================================*/

@media (max-width:1200px){

.success-section{
padding:90px 0;
}

.success-title{
font-size:50px;
}

.success-desc{
font-size:18px;
line-height:34px;
}

.stat-card{
padding:38px 25px;
min-height:360px;
}

.icon-circle{
width:95px;
height:95px;
font-size:40px;
}

.stat-card h3{
font-size:42px;
}

.stat-card h4{
font-size:22px;
}

}

/*=========================================
               TABLET
=========================================*/

@media (max-width:991px){

.success-section{
padding:80px 0;
}

.success-title{
font-size:44px;
}

.success-desc{
font-size:14px;
line-height:30px;
margin-bottom:50px;
}

.stat-card{
min-height:auto;
}

.success-bottom{
flex-direction:column;
text-align:center;
padding:30px;
}

.success-content h4{
font-size:24px;
}

.success-content p{
font-size:16px;
line-height:28px;
}

}

/*=========================================
            MOBILE
=========================================*/

@media (max-width:767px){

.success-section{
padding:60px 15px;
}

.section-top{
gap:12px;
}

.section-top span{
width:30px;
}

.section-top h6{
font-size:15px;
letter-spacing:2px;
}

.success-title{
font-size:32px;
line-height:1.2;
}

.success-desc{
font-size:14px;
line-height:28px;
margin-bottom:40px;
}

.heading-dots{
margin-bottom:40px;
}

.stat-card{
padding:28px 22px;
border-radius:24px;
}

.icon-circle{
width:75px;
height:75px;
font-size:30px;
margin-bottom:22px;
}

.stat-card h3{
font-size:38px;
}

.stat-card h4{
font-size:18px;
}

.stat-card p{
font-size:15px;
line-height:26px;
}

.success-icon{
width:60px;
height:60px;
font-size:24px;
}

.success-content h4{
font-size:20px;
}

.success-content p{
font-size:15px;
line-height:26px;
}

}

/*=========================================
            SMALL MOBILE
=========================================*/

@media (max-width:480px){

.success-title{
font-size:26px;
}

.success-desc{
font-size:13px;
}

.section-top h6{
font-size:13px;
}

.icon-circle{
width:65px;
height:65px;
font-size:26px;
}

.stat-card{
padding:24px 18px;
}

.stat-card h3{
font-size:32px;
}

.stat-card h4{
font-size:16px;
}

.stat-card p{
font-size:14px;
line-height:24px;
}

.success-bottom{
padding:24px 20px;
}

.success-content h4{
font-size:18px;
}

.success-content p{
font-size:14px;
line-height:24px;
}

}

/*=========================================
        EQUAL CARD HEIGHT
=========================================*/

.stat-card{

display:flex;

flex-direction:column;

justify-content:flex-start;

height:100%;

}

/*=========================================
        SMOOTH ANIMATION
=========================================*/

.stat-card,
.icon-circle,
.success-bottom{

transition:all .45s cubic-bezier(.22,.61,.36,1);

}

/*=========================================
        PREMIUM HOVER
=========================================*/

.stat-card:hover{

transform:translateY(-12px);

}

.stat-card:hover .icon-circle{

transform:scale(1.08) rotate(8deg);

}

/*=========================================
        IMAGE QUALITY
=========================================*/

.icon-circle i{

transform:translateZ(0);

backface-visibility:hidden;

}

/*=========================================
        SMOOTH SCROLL
=========================================*/

html{

scroll-behavior:smooth;

}

/*=========================================
        SELECTION
=========================================*/

::selection{

background:#FF6B00;

color:#ffffff;

}


/*==================================================
        TESTIMONIAL SECTION
==================================================*/

.testimonial-section{

    position:relative;
    overflow:hidden;

    padding:110px 0;

    background:
    radial-gradient(circle at top left,#EEF5FF 0%,#ffffff 45%),
    radial-gradient(circle at bottom right,#F7FAFF 0%,#ffffff 70%);

}

.testimonial-section::before{

    content:"";

    position:absolute;

    width:420px;
    height:420px;

    top:-180px;
    left:-180px;

    border-radius:50%;

    background:rgba(47,128,237,.05);

}

.testimonial-section::after{

    content:"";

    position:absolute;

    width:420px;
    height:420px;

    right:-180px;
    bottom:-180px;

    border-radius:50%;

    background:rgba(255,107,0,.05);

}

/*==================================================
        HEADING
==================================================*/

.testimonial-title{

    font-size:52px;

    font-weight:800;

    color:#0B2F6B;

    line-height:1.1;

    margin-bottom:20px;

}

.testimonial-title span{

    display:block;

    color:#FF6B00;

}

.testimonial-desc{

    max-width:760px;

    margin:auto;

    color:#667085;

    font-size:18px;

    line-height:34px;

    margin-bottom:70px;

}

/*==================================================
        SWIPER
==================================================*/

.testimonialSwiper{

padding:70px 0 90px;

overflow:visible;

}

.testimonialSwiper .swiper-wrapper{

align-items:center;

}

.testimonialSwiper .swiper-slide{

width:420px;

height:auto;

transition:.6s;

opacity:.55;

filter:blur(1px);

transform:scale(.88);

}

.testimonialSwiper .swiper-slide-active{

opacity:1;

filter:none;

transform:scale(1);

z-index:100;

}

.testimonialSwiper .swiper-slide-prev,
.testimonialSwiper .swiper-slide-next{

opacity:.88;

filter:none;

transform:scale(.94);

}

@media(max-width:991px){

.testimonialSwiper .swiper-slide{

width:360px;

}

}

@media(max-width:767px){

.testimonialSwiper .swiper-slide{

width:92%;

transform:none;

filter:none;

opacity:1;

}

}

/*==================================================
        CARD
==================================================*/

.testimonial-card{

    position:relative;

    width:100%;

    background:#fff;

    border-radius:30px;

    padding:38px;

    overflow:hidden;

    border:1px solid #EEF2F7;

    box-shadow:

    0 20px 60px rgba(15,23,42,.08);

}

.testimonial-card{

border-radius:32px;

background:#fff;

overflow:hidden;

padding:40px;

box-shadow:

0 20px 45px rgba(0,0,0,.06),

0 8px 18px rgba(0,0,0,.04);

transition:.45s;

border:1px solid #edf2f7;

}

.swiper-slide-active .testimonial-card{

box-shadow:

0 45px 100px rgba(15,23,42,.18),

0 20px 45px rgba(255,107,0,.15);

border:1px solid rgba(255,107,0,.25);

}

.swiper-slide-active .testimonial-card:hover{

transform:translateY(-10px);

}

/*==================================================
        QUOTE ICON
==================================================*/

.quote-icon{

    width:72px;

    height:72px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:22px;

    background:linear-gradient(135deg,#FF8A00,#FF5A00);

    color:#fff;

    font-size:28px;

}

/*==================================================
        STARS
==================================================*/

.stars{

    display:flex;

    gap:5px;

    margin-bottom:22px;

}

.stars i{

    color:#FDBA12;

    font-size:18px;

}

/*==================================================
        REVIEW
==================================================*/

.review{

    color:#4B5563;

    font-size:17px;

    line-height:32px;

    margin-bottom:35px;

}

/*==================================================
        CLIENT
==================================================*/

.client{

    display:flex;

    align-items:center;

    gap:15px;

}

/*==================================================
        AVATAR
==================================================*/

.avatar{

    width:68px;

    height:68px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:22px;

    font-weight:800;

    flex-shrink:0;

}

.avatar-blue{

    background:linear-gradient(135deg,#2F80ED,#0047D4);

}

.avatar-orange{

    background:linear-gradient(135deg,#FF8A00,#FF5A00);

}

.avatar-green{

    background:linear-gradient(135deg,#22C55E,#16A34A);

}

.avatar-purple{

    background:linear-gradient(135deg,#8B5CF6,#6D28D9);

}

.avatar-red{

    background:linear-gradient(135deg,#EF4444,#DC2626);

}

/*==================================================
        CLIENT INFO
==================================================*/

.client h5{

    margin:0;

    font-size:20px;

    font-weight:800;

    color:#0B2F6B;

}

.client span{

    color:#667085;

    font-size:15px;

}

/*==================================================
        VERIFIED
==================================================*/

.verified{

    display:inline-flex;

    align-items:center;

    gap:8px;

    margin-top:24px;

    padding:10px 18px;

    border-radius:50px;

    background:#EEF7FF;

    color:#0B2F6B;

    font-size:14px;

    font-weight:700;

}

.verified i{

    color:#10B981;

}

/*==========================================
        GLASSMORPHISM CARD
==========================================*/

.testimonial-card{

    background:rgba(255,255,255,.92);

    backdrop-filter:blur(12px);

    -webkit-backdrop-filter:blur(12px);

    transition:all .45s cubic-bezier(.22,.61,.36,1);

}

/*==========================================
        TOP GRADIENT BORDER
==========================================*/

.testimonial-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:5px;

    background:linear-gradient(
        90deg,
        #FF6B00,
        #2F80ED
    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.swiper-slide-active .testimonial-card::before{

    transform:scaleX(1);

}

/*==========================================
        ACTIVE CARD
==========================================*/

.swiper-slide{
    opacity:.75;
    transform:scale(.96);
    transition:all .45s ease;
}

.swiper-slide-active{
    opacity:1;
    transform:scale(1.05);
    z-index:5;
}

.swiper-slide-prev,
.swiper-slide-next{
    opacity:.9;
    transform:scale(.98);
}

/*==========================================
        ACTIVE CARD SHADOW
==========================================*/

.swiper-slide-active .testimonial-card{

    box-shadow:

    0 35px 90px rgba(15,23,42,.15),

    0 20px 50px rgba(15,23,42,.08);

}

/*==========================================
        HOVER
==========================================*/

.testimonial-card:hover{

    transform:translateY(-12px);

}

.testimonial-card:hover .avatar{

    transform:scale(1.08);

}

.testimonial-card:hover .quote-icon{

    transform:rotate(12deg);

}

/*==========================================
        TRANSITIONS
==========================================*/

.testimonial-card,
.avatar,
.quote-icon{

    transition:all .4s ease;

}

/*==========================================
        QUOTE FLOAT
==========================================*/

@keyframes quoteFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}

.quote-icon{

animation:quoteFloat 4s ease-in-out infinite;

}

/*==========================================
        AVATAR SHADOW
==========================================*/

.avatar{

box-shadow:

0 15px 35px rgba(0,0,0,.15);

}

/*==========================================
        VERIFIED BADGE
==========================================*/

.verified{

box-shadow:

0 8px 20px rgba(16,185,129,.15);

}

/*==========================================
        SWIPER BUTTONS
==========================================*/

.swiper-button-next,
.swiper-button-prev{

width:56px;

height:56px;

border-radius:50%;

background:#fff;

box-shadow:

0 15px 35px rgba(15,23,42,.12);

color:#0B2F6B;

transition:.35s;

}

.swiper-button-next:hover,
.swiper-button-prev:hover{

background:#FF6B00;

color:#fff;

transform:translateY(-4px);

}

.swiper-button-next:after,
.swiper-button-prev:after{

font-size:20px;

font-weight:700;

}

/*==========================================
        PAGINATION
==========================================*/

.swiper-pagination{

bottom:0 !important;

}

.swiper-pagination-bullet{

width:12px;

height:12px;

background:#D1D5DB;

opacity:1;

transition:.35s;

}

.swiper-pagination-bullet-active{

width:34px;

border-radius:30px;

background:#FF6B00;

}

/*==========================================
        DECORATIVE CIRCLE
==========================================*/

.testimonial-card::after{

content:"";

position:absolute;

right:-45px;

top:-45px;

width:120px;

height:120px;

border-radius:50%;

background:rgba(47,128,237,.05);

}

/*==========================================
        GLOW EFFECT
==========================================*/

.swiper-slide-active .testimonial-card{

border:1px solid rgba(255,107,0,.25);

}

/*==========================================
        IMAGE QUALITY
==========================================*/

.avatar{

backface-visibility:hidden;

transform:translateZ(0);

}

/*==========================================
        CURSOR
==========================================*/

.testimonialSwiper{

cursor:grab;

}

.testimonialSwiper:active{

cursor:grabbing;

}

/*==========================================
        SMOOTH ANIMATION
==========================================*/

.swiper-wrapper{

transition-timing-function:cubic-bezier(.22,.61,.36,1);

}

/*==================================================
        RESPONSIVE DESIGN
==================================================*/

/* ---------- Large Desktop ---------- */

@media (min-width:1400px){

.testimonialSwiper{
padding:30px 20px 80px;
}

.testimonial-card{
padding:45px;
}

.testimonial-title{
font-size:52px;
}

}

/* ---------- Laptop ---------- */

@media (max-width:1199px){

.testimonial-title{
font-size:48px;
}

.testimonial-desc{
font-size:14px;
line-height:32px;
}

.review{
font-size:16px;
line-height:30px;
}

}

/* ---------- Tablet ---------- */

@media (max-width:991px){

.testimonial-section{

padding:90px 0;

}

.testimonial-title{

font-size:42px;

}

.testimonial-desc{

font-size:13px;

line-height:30px;

margin-bottom:50px;

}

.swiper-slide{

opacity:1;

transform:none;

}

.swiper-slide-active{

transform:scale(1);

}

.swiper-button-next,
.swiper-button-prev{

width:50px;
height:50px;

}

.quote-icon{

width:65px;
height:65px;

font-size:24px;

}

.avatar{

width:60px;
height:60px;

font-size:20px;

}

}

/* ---------- Mobile ---------- */

@media (max-width:767px){

.testimonial-section{

padding:70px 0;

}

.testimonial-title{

font-size:30px;

}

.testimonial-title span{

display:inline;

}

.testimonial-desc{

font-size:13px;

line-height:27px;

margin-bottom:35px;

}

.testimonialSwiper{

padding-bottom:65px;

}

.testimonial-card{

padding:25px;

border-radius:22px;

}

.review{

font-size:15px;

line-height:28px;

margin-bottom:25px;

}

.quote-icon{

width:58px;
height:58px;

font-size:20px;

margin-bottom:18px;

}

.client{

gap:12px;

}

.avatar{

width:55px;
height:55px;

font-size:18px;

}

.client h5{

font-size:17px;

}

.client span{

font-size:13px;

}

.verified{

padding:8px 16px;

font-size:13px;

}

.swiper-button-next,
.swiper-button-prev{

display:none;

}

.swiper-pagination{

bottom:10px !important;

}

}

/* ---------- Small Mobile ---------- */

@media (max-width:480px){

.testimonial-section{

padding:60px 0;

}

.testimonial-title{

font-size:26px;

}

.testimonial-desc{

font-size:12px;

line-height:25px;

}

.testimonial-card{

padding:20px;

}

.quote-icon{

width:52px;
height:52px;

font-size:18px;

}

.stars i{

font-size:15px;

}

.review{

font-size:14px;

line-height:25px;

}

.avatar{

width:50px;
height:50px;

font-size:16px;

}

.client h5{

font-size:16px;

}

.client span{

font-size:12px;

}

.verified{

font-size:12px;

padding:8px 14px;

}

}

/*==================================================
        ACTIVE CARD RESPONSIVE
==================================================*/

@media (min-width:992px){

.swiper-slide{

transition:all .45s ease;

}

.swiper-slide-active{

transform:scale(1.08);

z-index:20;

}

.swiper-slide-next,
.swiper-slide-prev{

transform:scale(.94);

}

}

/*==================================================
        EQUAL HEIGHT
==================================================*/

.swiper-wrapper{

align-items:stretch;

}

.swiper-slide{

height:auto;

display:flex;

}

.testimonial-card{

display:flex;

flex-direction:column;

width:100%;

}

.review{

flex-grow:1;

}

.testimonial-card{

background:

rgba(255,255,255,.82);

backdrop-filter:blur(18px);

-webkit-backdrop-filter:blur(18px);

}

/*==================================================
        SMOOTH PERFORMANCE
==================================================*/

.swiper{

overflow:visible;

}

.swiper-slide{

will-change:transform;

}

.avatar,
.quote-icon,
.testimonial-card{

backface-visibility:hidden;

transform:translateZ(0);

}

/*==================================================
        ACCESSIBILITY
==================================================*/

.swiper-button-next:focus,
.swiper-button-prev:focus{

outline:none;

box-shadow:0 0 0 4px rgba(47,128,237,.25);

}

.testimonial-card:focus-within{

outline:2px solid #2F80ED;

outline-offset:4px;

border-radius:30px;

}


.testimonial-section{

position:relative;

}

.testimonial-section:before{

content:"";

position:absolute;

left:50%;

top:45%;

transform:translate(-50%,-50%);

width:750px;

height:750px;

border-radius:50%;

background:

radial-gradient(circle,
rgba(255,107,0,.06),
transparent 70%);

pointer-events:none;

z-index:0;

}


.swiper-button-next,
.swiper-button-prev{

width:58px;

height:58px;

border-radius:50%;

background:#fff;

box-shadow:

0 15px 40px rgba(15,23,42,.12);

color:#0B2F6B;

transition:.35s;

}

.swiper-button-next:hover,
.swiper-button-prev:hover{

background:#FF6B00;

color:#fff;

transform:scale(1.08);

}

.swiper-button-next::after,
.swiper-button-prev::after{

font-size:18px;

font-weight:700;

}

.swiper-pagination-bullet{

width:12px;

height:12px;

background:#D1D5DB;

opacity:1;

transition:.35s;

}

.swiper-pagination-bullet-active{

width:40px;

border-radius:20px;

background:#FF6B00;

}

/*=========================================================
            FINAL CTA SECTION
=========================================================*/

.cta-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:linear-gradient(135deg,#071F4F 0%,#0B2F6B 50%,#123E87 100%);

}

/*=========================================================
            WRAPPER
=========================================================*/

.cta-wrapper{

    position:relative;

    padding:80px;

    border-radius:35px;

    overflow:hidden;

    background:rgba(255,255,255,.03);

    backdrop-filter:blur(15px);

    border:1px solid rgba(255,255,255,.08);

    box-shadow:

    0 40px 90px rgba(0,0,0,.18);

}

/*=========================================================
            CONTENT
=========================================================*/

.cta-content{

    position:relative;

    z-index:5;

}

/*=========================================================
            TAG
=========================================================*/

.cta-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 22px;

    border-radius:50px;

    margin-bottom:28px;

    background:rgba(255,255,255,.12);

    color:#FFD166;

    font-size:14px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

}

.cta-tag i{

    color:#FFB703;

}

/*=========================================================
            HEADING
=========================================================*/

.cta-content h2{

    color:#ffffff;

    font-size:62px;

    font-weight:800;

    line-height:1.15;

    margin-bottom:25px;

}

.cta-content h2 span{

    display:block;

    color:#FFB703;

}

/*=========================================================
            DESCRIPTION
=========================================================*/

.cta-content p{

    color:#D7E3FF;

    font-size:19px;

    line-height:34px;

    max-width:640px;

    margin-bottom:45px;

}

/*=========================================================
            FEATURES
=========================================================*/

.cta-feature{

    display:flex;

    align-items:center;

    gap:16px;

    padding:18px 15px;

    border-radius:20px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    transition:.35s;

}

.feature-icon{

    width:58px;

    height:58px;

    border-radius:18px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#FF8A00,#FF5A00);

    color:#fff;

    font-size:22px;

    flex-shrink:0;

}

.cta-feature h6{

    color:#ffffff;

    margin:0;

    font-size:17px;

    line-height:26px;

    font-weight:700;

}

/*=========================================================
            BUTTONS
=========================================================*/

.cta-buttons{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:18px;

}

.cta-buttons .btn{

    border-radius:60px;

    padding:16px 36px;

    font-size:17px;

    font-weight:700;

    transition:.4s;

}

.cta-buttons .btn-warning{

    background:#FF6B00;

    border:none;

    color:#fff;

}

.cta-buttons .btn-warning:hover{

    background:#FF8A00;

    color:#fff;

}

.cta-buttons .btn-outline-light{

    border:2px solid rgba(255,255,255,.4);

}

.cta-buttons .btn-outline-light:hover{

    background:#ffffff;

    color:#0B2F6B;

}

/*=========================================================
            IMAGE
=========================================================*/

.cta-image-wrapper{

    position:relative;

    min-height:620px;

}

.cta-main-image{

    position:absolute;

    bottom:0;

    right:20px;

    max-width:100%;

    z-index:10;

    filter:drop-shadow(0 30px 60px rgba(0,0,0,.25));

}

/*=========================================================
            FLOATING CARDS
=========================================================*/

.floating-card{

position:absolute;

display:flex;

align-items:center;

gap:14px;

padding:16px 18px;

border-radius:22px;

background:rgba(255,255,255,.14);

backdrop-filter:blur(18px);

-webkit-backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.18);

box-shadow:

0 20px 40px rgba(0,0,0,.18);

color:#fff;

min-width:190px;

transition:.45s cubic-bezier(.22,.61,.36,1);

z-index:20;

}

.floating-card:hover{

transform:translateY(-8px) scale(1.05);

background:rgba(255,255,255,.20);

}

.floating-card .icon{

width:52px;

height:52px;

border-radius:16px;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(135deg,#FF8A00,#FF5A00);

font-size:20px;

color:#fff;

flex-shrink:0;

}

.floating-card h5{

margin:0;

font-size:20px;

font-weight:800;

color:#fff;

}

.floating-card span{

font-size:14px;

color:#D9E6FF;

display:block;

margin-top:3px;

}

/*=========================================================
            CARD POSITIONS
=========================================================*/

.card-loan{

top:30px;

left:-25px;

}

.card-approval{

top:150px;

right:-25px;

}

.card-growth{

top:300px;

left:-40px;

}

.card-bank{

bottom:170px;

right:-30px;

}

.card-msme{

bottom:70px;

left:0;

}

.card-secure{

bottom:10px;

right:40px;

}

/*=========================================================
            IMAGE ANIMATION
=========================================================*/

.cta-main-image{

animation:floatImage 5s ease-in-out infinite;

transition:.5s;

}

.cta-main-image:hover{

transform:scale(1.04);

}

@keyframes floatImage{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0);

}

}

/*=========================================================
            FLOATING CARD ANIMATION
=========================================================*/

@keyframes floatCard{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

.card-loan{

animation:floatCard 4s ease-in-out infinite;

}

.card-approval{

animation:floatCard 5s ease-in-out infinite;

}

.card-growth{

animation:floatCard 4.5s ease-in-out infinite;

}

.card-bank{

animation:floatCard 5.5s ease-in-out infinite;

}

.card-msme{

animation:floatCard 6s ease-in-out infinite;

}

.card-secure{

animation:floatCard 4.8s ease-in-out infinite;

}

/*=========================================================
            BACKGROUND GLOW
=========================================================*/

.cta-glow{

position:absolute;

border-radius:50%;

filter:blur(90px);

pointer-events:none;

}

.glow-one{

width:320px;

height:320px;

background:rgba(255,107,0,.28);

top:-80px;

right:-80px;

}

.glow-two{

width:380px;

height:380px;

background:rgba(47,128,237,.22);

bottom:-120px;

left:-120px;

}

/*=========================================================
            BUTTON SHINE
=========================================================*/

.cta-buttons .btn{

position:relative;

overflow:hidden;

}

.cta-buttons .btn::before{

content:"";

position:absolute;

top:0;

left:-120%;

width:60%;

height:100%;

background:

linear-gradient(

90deg,

transparent,

rgba(255,255,255,.45),

transparent

);

transform:skewX(-25deg);

transition:.8s;

}

.cta-buttons .btn:hover::before{

left:140%;

}

/*=========================================================
            FEATURE HOVER
=========================================================*/

.cta-feature:hover{

transform:translateY(-6px);

background:rgba(255,255,255,.10);

}

.cta-feature:hover .feature-icon{

transform:rotate(8deg) scale(1.08);

}

.feature-icon{

transition:.4s;

}

/*=========================================================
            WRAPPER GLOW
=========================================================*/

.cta-wrapper::before{

content:"";

position:absolute;

top:-40%;

left:-20%;

width:450px;

height:450px;

border-radius:50%;

background:rgba(255,255,255,.03);

filter:blur(100px);

}

.cta-wrapper::after{

content:"";

position:absolute;

bottom:-35%;

right:-15%;

width:420px;

height:420px;

border-radius:50%;

background:rgba(255,107,0,.08);

filter:blur(120px);

}

/*=========================================================
            PARALLAX DEPTH
=========================================================*/

.cta-image-wrapper{

perspective:1200px;

}

.cta-main-image{

transform-style:preserve-3d;

}

/*=========================================================
            PREMIUM SHADOW
=========================================================*/

.cta-main-image{

filter:

drop-shadow(0 45px 70px rgba(0,0,0,.30));

}

/*=========================================================
            SMOOTH TRANSITIONS
=========================================================*/

.cta-main-image,
.floating-card,
.feature-icon,
.cta-feature,
.cta-buttons .btn{

transition:all .45s cubic-bezier(.22,.61,.36,1);

}

/*=========================================================
            RESPONSIVE DESIGN
=========================================================*/

/*=============================
        Large Desktop
=============================*/

@media (min-width:1400px){

.cta-wrapper{

padding:90px;

}

.cta-content h2{

font-size:68px;

}

.cta-main-image{

max-width:540px;

}

}

/*=============================
        Laptop
=============================*/

@media (max-width:1199px){

.cta-wrapper{

padding:70px 50px;

}

.cta-content h2{

font-size:54px;

}

.cta-content p{

font-size:18px;

line-height:32px;

}

.cta-main-image{

max-width:420px;

right:0;

}

.floating-card{

transform:scale(.9);

}

}

/*=============================
        Tablet
=============================*/

@media (max-width:991px){

.cta-section{

padding:80px 0;

}

.cta-wrapper{

padding:60px 35px;

text-align:center;

}

.cta-content{

margin-bottom:60px;

}

.cta-content h2{

font-size:46px;

}

.cta-content p{

margin:auto auto 40px;

}

.cta-buttons{

justify-content:center;

}

.cta-feature{

margin-bottom:20px;

justify-content:center;

}

.cta-image-wrapper{

min-height:500px;

max-width:480px;

margin:auto;

}

.cta-main-image{

position:relative;

right:auto;

left:auto;

bottom:auto;

max-width:380px;

display:block;

margin:auto;

}

.card-loan{

top:10px;

left:0;

}

.card-approval{

top:80px;

right:0;

}

.card-growth{

top:220px;

left:-10px;

}

.card-bank{

bottom:140px;

right:-10px;

}

.card-msme{

bottom:40px;

left:0;

}

.card-secure{

bottom:0;

right:30px;

}

}

/*=============================
        Mobile
=============================*/

@media (max-width:767px){

.cta-section{

padding:60px 0;

}

.cta-wrapper{

padding:45px 25px;

border-radius:25px;

}

.cta-tag{

font-size:12px;

padding:8px 16px;

letter-spacing:1px;

}

.cta-content h2{

font-size:34px;

}

.cta-content p{

font-size:16px;

line-height:28px;

}

.cta-buttons{

flex-direction:column;

align-items:stretch;

gap:15px;

}

.cta-buttons .btn{

width:100%;

padding:15px;

}

.cta-feature{

justify-content:flex-start;

padding:15px;

margin-bottom:15px;

}

.feature-icon{

width:50px;

height:50px;

font-size:18px;

}

.cta-image-wrapper{

min-height:420px;

margin-top:20px;

}

.cta-main-image{

max-width:290px;

}

/* Floating Cards */

.floating-card{

padding:12px 14px;

min-width:150px;

gap:10px;

}

.floating-card .icon{

width:42px;

height:42px;

font-size:16px;

}

.floating-card h5{

font-size:16px;

}

.floating-card span{

font-size:12px;

}

.card-loan{

top:0;

left:-5px;

}

.card-approval{

top:60px;

right:-5px;

}

.card-growth{

top:170px;

left:-5px;

}

.card-bank{

bottom:100px;

right:-5px;

}

.card-msme{

bottom:20px;

left:0;

}

.card-secure{

display:none;

}

}

/*=============================
        Small Mobile
=============================*/

@media (max-width:480px){

.cta-wrapper{

padding:35px 20px;

}

.cta-content h2{

font-size:30px;

}

.cta-content p{

font-size:15px;

line-height:26px;

}

.cta-main-image{

max-width:240px;

}

.floating-card{

transform:scale(.82);

}

.card-growth{

left:-15px;

}

.card-bank{

right:-15px;

}

.glow-one,
.glow-two{

display:none;

}

}

/*=========================================================
        PERFORMANCE
=========================================================*/

.cta-main-image,
.floating-card,
.cta-wrapper{

will-change:transform;

backface-visibility:hidden;

}

/*=========================================================
        ACCESSIBILITY
=========================================================*/

.cta-buttons .btn:focus{

outline:none;

box-shadow:0 0 0 4px rgba(255,255,255,.25);

}

.cta-buttons .btn-warning:focus{

box-shadow:0 0 0 4px rgba(255,107,0,.35);

}

/*=========================================================
        REDUCE MOTION
=========================================================*/

@media (prefers-reduced-motion: reduce){

.cta-main-image,
.floating-card,
.feature-icon{

animation:none !important;

transition:none !important;

}

}