.banner-bottom_box_inner {
    background: #fff;
    padding: 40px;
    box-shadow: 0 0 44px 0 #0000001A;
    border-radius: 20px;
    margin-top: -60px;
    z-index: 1;
    position: relative;
}


.stat .icon svg {
    width: 60px;
    height: 60px;
    object-fit:contain;
}

/* ============================
* * OUR SERVICES Start 
============================ **/

a.final-cta__btn:focus {
    background: #b71c1c !important;
    color: #fff !important;
}

/********* Chart wrap start ************/

.chart-wrap {
    width: 100%;
    height: 80px;
    overflow: hidden;
    top: 0;
    position: absolute;
}

.chart{
    width:200%;
    height:100%;
    opacity:.05;
    animation: scroll 20s linear infinite;
}

.trading-platform-section .center-txt h2,
.trading-platform-section .center-txt p {
    text-align: center;
}

@keyframes scroll{
    from { transform:translateX(0); }
    to   { transform:translateX(-50%); }
}

.candle{
    animation:bob 2.4s ease-in-out infinite;
    transform-box:fill-box;
    transform-origin:center;
}

.candle:nth-child(2){ animation-delay:.3s; }
.candle:nth-child(3){ animation-delay:.6s; }
.candle:nth-child(4){ animation-delay:.9s; }

@keyframes bob{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-3px); }
}

/******** chart wrap end ***************/

/* ACCORDION */

.accordion{ display:flex; height:500px; overflow:hidden; align-items:center; }

.panel{ position:relative; flex:.8; border-radius:28px; cursor:pointer; overflow:hidden; transition:all .6s cubic-bezier(.4,0,.2,1); display:flex; align-items:flex-end; color:white; }

.panel.active{ flex:6; z-index:10 !important; height:100% !important }
.panel:not(:first-child){
    margin-left:-25px !important;
}
/* COLORS */

.panel:nth-child(1){ background:linear-gradient(135deg,#f4b400,#d89c00); height:80% }

.panel:nth-child(2){ background:linear-gradient(135deg,#19c463,#0f9d47); height:90% }

.panel:nth-child(3){ background:linear-gradient(135deg,#2563eb,#1d4ed8); height:90% }

.panel:nth-child(4){ background:linear-gradient(135deg,#ff1744,#d50032); height:90%; z-index:2 }

.panel:nth-child(5){ background:linear-gradient(135deg,#24126d,#130749); height:80% }


/* CLOSED STATE */

.small-content{ position:absolute; top:30px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; width:100%; transition:.4s; }

.panel.active .small-content{ opacity:0; pointer-events:none; }

.number{ font-size:38px; font-weight:800; opacity:.35; }

.vertical-title{ writing-mode:vertical-rl; transform:rotate(180deg); margin-top:30px; font-size:16px; font-weight:500; text-align:center; }

/* OPEN CONTENT */

.content{ padding:60px; width:100%; opacity:0; transform:translateY(30px); transition:.5s; display:flex; justify-content:space-between; gap:60px; }

.panel.active .content{ opacity:1; transform:translateY(0); transition-delay:.25s; max-width: 100%  !important; }

.left{ width:45%; }

 
.left h2 {
    font-size: 26px;
    line-height: 1.4;
    margin-bottom: 20px;
    font-weight: 700;
}

.left p{ font-size:18px; line-height:1.8; opacity:.95; }

.right{ width:50%; }

.right ul{ list-style:none; }

.right li{ font-size:18px; margin-bottom:18px; padding-left:35px; position:relative; }

.right li::before{ content:"✓"; position:absolute; left:0; font-weight:bold; }

/* WATERMARK */

.watermark{ position:absolute; right:20px; top:50%; transform:translateY(-50%) rotate(-90deg); font-size:90px; font-weight:800; color:rgba(255,255,255,.06); letter-spacing:10px; pointer-events:none; }

/* MOBILE */

@media(max-width:991px){

.small-content{ flex-direction:row; gap:15px; left:30px; transform:none; }

.vertical-title{ writing-mode:horizontal-tb; transform:none; margin-top:0; }

.content{ padding:16px; flex-direction:column; gap:20px }

.left,.right{ width:100%; }

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

.watermark{ display:none; }


/*************************/
 
.panel.active{
    flex:6;
    animation:floatCard 4s ease-in-out infinite;
}

@keyframes floatCard{
    0%,100%{
        transform:translateY(0px);
    }
    50%{
        transform:translateY(-10px);
    }
}


.panel{
    background-size:300% 300%;
    animation:gradientMove 8s ease infinite;
}

@keyframes gradientMove{
    0%{
        background-position:0% 50%;
    }
    50%{
        background-position:100% 50%;
    }
    100%{
        background-position:0% 50%;
    }
}

.watermark{
    animation:watermarkMove 8s linear infinite;
}

@keyframes watermarkMove{

    0%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(-10px);
    }

    50%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(10px);
    }

    100%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(-10px);
    }
}


.panel.active li{
    opacity:0;
    transform:translateX(30px);
    animation:featureIn .6s forwards;
}

.panel.active li:nth-child(1){animation-delay:.2s;}
.panel.active li:nth-child(2){animation-delay:.3s;}
.panel.active li:nth-child(3){animation-delay:.4s;}
.panel.active li:nth-child(4){animation-delay:.5s;}
.panel.active li:nth-child(5){animation-delay:.6s;}
.panel.active li:nth-child(6){animation-delay:.7s;}

@keyframes featureIn{
    to{
        opacity:1;
        transform:translateX(0);
    }
}
 
@keyframes pulseIcon{

    0%{
        box-shadow:0 0 0 0 rgba(255,255,255,.6);
    }

    70%{
        box-shadow:0 0 0 25px rgba(255,255,255,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(255,255,255,0);
    }
}

} 


/********* Start animations ***********/

.panel.active{
    flex:6;
    /* animation:floatCard 4s ease-in-out infinite; */
}

@keyframes floatCard{
    0%,100%{
        transform:translateY(0px);
    }
    50%{
        transform:translateY(-10px);
    }
}


.panel{
    background-size:300% 300%;
    animation:gradientMove 8s ease infinite;
}

@keyframes gradientMove{
    0%{
        background-position:0% 50%;
    }
    50%{
        background-position:100% 50%;
    }
    100%{
        background-position:0% 50%;
    }
}

.watermark{
    animation:watermarkMove 8s linear infinite;
}

@keyframes watermarkMove{

    0%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(-10px);
    }

    50%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(10px);
    }

    100%{
        transform:
        translateY(-50%)
        rotate(-90deg)
        translateX(-10px);
    }
}


.panel.active li{
    opacity:0;
    transform:translateX(30px);
    animation:featureIn .6s forwards;
}

.panel.active li:nth-child(1){animation-delay:.2s;}
.panel.active li:nth-child(2){animation-delay:.3s;}
.panel.active li:nth-child(3){animation-delay:.4s;}
.panel.active li:nth-child(4){animation-delay:.5s;}
.panel.active li:nth-child(5){animation-delay:.6s;}
.panel.active li:nth-child(6){animation-delay:.7s;}

@keyframes featureIn{
    to{
        opacity:1;
        transform:translateX(0);
    }
}


@keyframes pulseIcon{

    0%{
        box-shadow:0 0 0 0 rgba(255,255,255,.6);
    }

    70%{
        box-shadow:0 0 0 25px rgba(255,255,255,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(255,255,255,0);
    }
}


/*********************/

.panel.active::before{
content:'';
position:absolute;
inset:0;
background:
radial-gradient(
circle at 30% 30%,
rgba(255,255,255,.15),
transparent 50%
);
animation:
glowMove 8s linear infinite;
}

@keyframes glowMove{

0%{
transform:translateX(-50px);
}

50%{
transform:translateX(50px);
}

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

}


.wave-container{
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:220px;
    overflow:hidden;
    pointer-events:none;
}

.wave{
    position:absolute;
    left:-20%;
    width:140%;
    border-radius:50%;
}

.wave1 {
    bottom: -100px;
    height: 180px;
    background: rgba(255,255,255,.12);
    animation: waveLeft 12s ease-in-out infinite;
}

.wave2 {
    bottom: -30px;
    height: 160px;
    background: rgba(255,255,255,.08);
    animation: waveRight 10s ease-in-out infinite;
}

.wave3 {
    bottom: -20px;
    height: 130px;
    background: rgb(233 229 229 / 20%);
    animation: waveLeft 8s ease-in-out infinite;
    filter: blur(3px);
}

.wave4 {
    bottom: -10px;
    height: 100px;
    background: rgba(255,255,255,.05);
    animation: waveRight 10s ease-in-out infinite;
    filter: blur(10px);
}


@keyframes waveLeft{

    0%,100%{
        transform:
        translateX(-30px);
    }

    50%{
        transform:
        translateX(30px);
    }

}

@keyframes waveRight{

    0%,100%{
        transform:
        translateX(30px);
    }

    50%{
        transform:
        translateX(-30px);
    }

}

/************ End animations ***********/

/* ============================
* * OUR SERVICES End 
============================ **/


/* ============================
* * orbit-section Start 
============================ **/

.orbit-wrapper {
    height: 600px;
    position: relative;
}
  
.ring{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    border-radius:50%;
    border:1px solid rgba(80,130,255,.15);
}

.ring1{
    width:410px;
    height:410px;
}

.ring2{
    width:480px;
    height:480px;
}

.ring3 {
    width: 550px;
    height: 550px;
}
 

.center-circle{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);

    width:350px;
    height:350px;
    border-radius:50%;

    background:#fff;

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

    box-shadow:0 0 60px rgba(60,110,255,.12);
}

.center-circle span {
    font-size: 12px;
    letter-spacing: 5px;
    font-weight: 700;
    color: #221a7b;
    margin-bottom: 15px;
}

.center-circle h2 {
    text-align: center;
    line-height: 1.4;
    font-size: 40px;
    font-weight: 700;
    color: #221a7b;
}

.gold {
    color: #E8AF09 !important;
    font-size: 40px !important;
    letter-spacing: 0 !important;
}
 

.orbit{
    position:absolute;
    top:50%;
    left:50%;
    width:500px;
    height:500px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    z-index: -1;
    animation:orbitRotate 40s linear infinite;
}

@keyframes orbitRotate{
    from{
        transform:translate(-50%,-50%) rotate(0deg);
    }
    to{
        transform:translate(-50%,-50%) rotate(360deg);
    }
}
 

.orbit .node{
    position:absolute;
    top:50%;
    left:50%;
}
 
.orbit .node2{ transform:rotate(60deg) translateX(260px); }
.orbit .node3{ transform:rotate(220deg) translateX(220px); }
.orbit .node4{ transform:rotate(140deg) translateX(240px); } 



.icon-inner{
    width:20px;
    height:20px;
    border-radius:50%;

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

    color:#fff;
    font-size:34px;
}
 
.red .icon-inner{background:#ff2d3d;}
.green .icon-inner{background:#18bf53;}
.yellow .icon-inner{background:#e7af00;} 
 

.orbit-wrapper .label{
    position:absolute;
    font-size:20px;
    font-weight:600;
    white-space:nowrap;
    display: flex;
    align-items: center;
    gap: 10px;
}
 
.label.crypto{
    top:100px;
    left:130px; 
}
 
.label.stock{
    top:100px;
    right:140px; 
}
 
.label.forex{
    top:280px;
    left:90px; 
}
 
.label.futures{
    top:280px;
    right:50px; 
}
 
.label.hft{
    bottom:80px;
    left:50px; 
}
 
.label.latency{
    bottom:80px;
    right:80px; 
}


.label .icon-in {
    align-items: center;
    text-align: center;
    justify-content: center;
    display: flex;
    width: 90px;
    height: 90px;
    border-radius: 50%;
}
 
/* ============================
* * orbit-section End 
============================ **/

/* ============================
* * KEY FEATURES Start 
============================ **/
 
.features-section .feature-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:35px;
}
 
.features-section .feature-card{
    background:#fff;
    border-radius:15px;
    overflow:hidden; 
    transition:.4s ease;
    position:relative;
}

.features-section .feature-card:hover{
    transform:translateY(-10px);
    box-shadow:
    0 20px 40px rgba(0,0,0,.12);
}

.features-section .blue {
    box-shadow: 0px 16px 20px 0px #1F61E833; 
    border-image-source: linear-gradient(180deg, #1F61E8 -81.65%, rgba(255, 255, 255, 0) 149.37%);
}

.features-section .green{
    border:1px solid #bce8c7;
}

.features-section .yellow{
    border:1px solid #f6d57b;
}

.features-section .red{
    border:1px solid #ffb2b2;
}

.features-section .purple{
    border:1px solid #bcb6ff;
}
 

.features-section .card-header {
    padding: 15px 10px;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0px 4px 4px 0px #1F61E81A;
    margin: 0;
}

.features-section .card-body{
    position:relative;
    min-height:145px;
    padding:15px 10px;
}

.features-section .card-body p{
    font-size:15px;
    line-height:1.8;
    color:#222;
    max-width:85%;
}

.features-section .blue .card-body {
    background: #DDE8FF;
}

.features-section .green .card-body {
    background: #D9F2E1;
}

.features-section .yellow .card-body {
    background: #F9F0D7;
}

.features-section .red .card-body {
    background: #F5E1E2;
}

.features-section .purple .card-body {
    background: #E8E6F6;
}

 
.features-section .watermarks{
    position:absolute;
    bottom:-10px;
    left:10px;
    font-size:28px;
    font-weight:700;
    opacity:.09;
    text-transform:uppercase;
}

 

.features-section .blue .watermarks { 
    color: #5777b7;
}

.features-section .green .watermarks { 
    color: #19b04c;
}

.features-section .yellow .watermarks { 
    color: #e4a600;
}
.features-section .red .watermarks { 
    color: #613a3c;
}

.features-section .purple .watermarks { 
    color: #6e6895;
}

.card-footer {
    padding: 20px;
}
 

.features-section .icon-box {
    position: absolute;
    right: 20px;
    bottom: -20px;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;  
}

.features-section .icon-box img {
    width: 30px;
    height: 30px;
}
 

.features-section .feature-card:hover .icon-box{
    transform:rotate(10deg) scale(1.08);
    transition:.4s;
}

 

@media(max-width:1199px){

    .features-section .feature-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .features-section .section-title{
        font-size:42px;
    }
}

@media(max-width:768px){

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

    .features-section .feature-grid{
        grid-template-columns:1fr;
    }

    .features-section .section-title{
        font-size:32px;
    }

    .features-section .section-tag{
        font-size:14px;
        letter-spacing:4px;
    }
}




/*****************
* * KEY FEATURES End 
*****************/

/** ============================
* * WHY YOU NEED AI TRADING BOTS Start 
==============================**/
 

.aitb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.aitb-card{
position:relative;min-height:250px;background:#fff;border-radius:24px;
overflow:hidden;padding:30px;box-shadow: 0px 0px 24px 0px #1F61E81A;
transition:.5s transform,.5s box-shadow;
transform-style:preserve-3d;
}
.aitb-card:hover{transform:translateY(-12px);box-shadow:0 25px 60px rgba(0,0,0,.15)}
.aitb-num{z-index:4; position:absolute;left:12px;top:-18px;font-size:70px;font-weight:800;color:rgba(0,0,0,.05)}
.aitb-blob{
position:absolute;width:220px;height:220px;border-radius:50%;
right:-60px;top:-60px;filter:blur(30px);opacity:.5;
animation:blob 8s ease-in-out infinite;
}
@keyframes blob{50%{transform:translate(-40px,30px) scale(1.1)}}
.aitb-wave,.aitb-wave2,.aitb-wave3{
position:absolute;left:-15%;width:130%;border-radius:50%;
}
.aitb-wave{height:110px;top:-55px;background:rgba(255,255,255,.9)}
.aitb-wave2{height:90px;top:-30px;background:rgba(255,255,255,.6)}
.aitb-wave3{height:70px;top:-10px;background:rgba(255,255,255,.35)}
.aitb-icon{
z-index: 6;  
position:absolute;right:0;top:25px;width:60px;height:60px;
display:flex;align-items:center;justify-content:center; 
animation:floats 4s ease-in-out infinite !important;
}
@keyframes floats{
50% {
    transform: translateY(-20px) scale(1.05);
}
}

@keyframes float{50%{transform:translateY(-10px) rotate(8deg)}}
.aitb-content{position:relative;z-index:5;margin-top:95px}
.aitb-content h3{font-size:20px; font-weight:600; margin:0 0 10px;}
.aitb-content p{line-height:1.8;color:#555}
.particle{position:absolute;width:6px;height:6px;border-radius:50%;background:#2f63ff;opacity:.6}
.p1{left:15%;bottom:25%;animation:p 6s infinite}
.p2{left:70%;bottom:20%;animation:p 8s infinite}
.p3{left:50%;bottom:10%;animation:p 7s infinite}
@keyframes p{50%{transform:translateY(-25px)}}
.shine:after{
content:'';position:absolute;top:0;left:-120%;height:100%;width:70px;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);
transform:skewX(-25deg);
}
.shine:hover:after{animation:shine 1.2s}
@keyframes shine{100%{left:140%}}
 
.bbg{background:radial-gradient(circle,#7aa4ff,#2f63ff)}
.gbg{background:radial-gradient(circle,#7df0a8,#19bf58)}
.rbg{background:radial-gradient(circle,#ff8aa0,#ff244f)}
.pbg{background:radial-gradient(circle,#8e7cff,#2d1b8f)}
.ybg{background:radial-gradient(circle,#ffe27c,#e8b100)}
@media(max-width:1000px){.aitb-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.aitb-grid{grid-template-columns:1fr}.aitb-head h2{font-size:34px}}

.aitb-card:hover .aitb-top-layer path{
  transform:translateX(-35px);
}
 

.aitb-top-layer{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:110px;
  overflow:hidden;
  z-index:1;
}

.aitb-top-layer svg{
  width:100%;
  height:100%;
}

.aitb-top-layer path{
  fill:#f7f7f7;
  animation:waveFloat 8s ease-in-out infinite;
  transform-origin:center;
}

/* Candlestick Pattern */

.aitb-chart-pattern{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100px;
  opacity:.0;
  background-image:
  repeating-linear-gradient( 90deg, transparent 0px, transparent 12px, rgba(0,0,0,.4) 12px, rgba(0,0,0,.4) 14px, transparent 14px, transparent 26px );
  animation:chartMove 8s linear infinite;
}

/* Shine */

.aitb-top-layer::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:120px;
  height:100%;
  background: linear-gradient( 90deg, transparent, rgba(255,255,255,.5), transparent );
  animation: topShine 7s linear infinite; 
}

/* Wave Motion */

@keyframes waveFloat{
  0%,100%{ transform:translateX(0px); }
  50%{ transform:translateX(-25px); }
}

@keyframes chartMove{
  from{ background-position:0 0; }
  to{ background-position:250px 0; }
}

@keyframes topShine{
  0%{ left:-120%; }
  100%{ left:150%; }
}

/** ============================
* * WHY YOU NEED AI TRADING BOTS End 
==============================**/


/** ============================
* * AI Trading Bot Section Start 
==============================**/

.ai-trading-section {
    background: #f8f8f8;
    padding: 80px 0;
    overflow: hidden;
    width: 100%;
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size:contain;
}
 
.ai-trading-section .ai-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

.ai-trading-section .ai-content {
    flex: 0 0 45%;
    width: 50%;
}

.ai-trading-section .ai-underline svg {
    width: 350px;
}

.ai-trading-section .ai-subtitle {
    font-size: 24px;
    font-weight: 700;
    color: #000;
    margin-bottom: 15px;
    line-height: 1.3;
}

.ai-trading-section .ai-title {
    font-size: 50px;
    font-weight: 700;
    color: #2f66e8;
    line-height: 1;
    margin-bottom: 20px;
    position: relative;
}

.ai-trading-section .ai-underline {
    display: block;
    width: 100%; 
    border-radius: 20px; 
}

.ai-trading-section .ai-description {
    font-size: 20px;
    line-height: 1.8;
    color: #222;
    margin-bottom: 35px;
    max-width: 650px;
}

.ai-trading-section .ai-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ai-trading-section .ai-features li {
    position: relative;
    padding-left: 35px;
    margin-bottom: 25px;
    font-size: 18px;
    font-weight: 600;
    color: #111;
}

.ai-trading-section .ai-features li::before {
    content: "➤";
    position: absolute;
    left: 0;
    top: 0;
    color: #2f66e8;
    font-size: 24px;
}

.ai-trading-section .ai-image {
    flex: 0 0 50%;
    text-align: right;
}

.ai-trading-section .ai-image img {
    width: 100%;
    max-width: 850px;
    height: auto;
    display: block;
}

/* Responsive */
 

@media (max-width: 991px) {
    .ai-trading-section { 
        background-position: bottom; 
        background-size: cover;
    }

    .ai-trading-section .ai-container {
        flex-direction: column;
        text-align: center;
    }

    .ai-trading-section .ai-content,
    .ai-trading-section .ai-image {
        flex: 0 0 100%;
    }

    .ai-trading-section .ai-title {
        font-size: 40px;
    }

    .ai-trading-section .ai-description {
        max-width: 100%;
    }

    .ai-trading-section .ai-features li {
        text-align: left;
    }

    
}

@media (max-width: 768px) {

    .ai-trading-section .ai-content {
        flex: 0 0 45%;
        width: 100%;
    }
}


@media (max-width: 576px) {
    .ai-trading-section .ai-subtitle {
        font-size: 18px;
    }

    .ai-trading-section .ai-title {
        font-size: 32px;
    }

    .ai-trading-section .ai-description {
        font-size: 16px;
    }
}

/** ============================
* * AI Trading Bot Section End 
==============================**/



/* =====================================
   Why Choose SECTION START
===================================== */

.why-choose-section{
    position:relative;
    padding:60px 0;
    overflow:hidden;
}
 
.why-choose-section::before {
    content: "";
    position: absolute;
    left: 0;
    top: 140px;
    width: 100%;
    height: 350px;
    z-index: 1;
    background: url('https://media.itechnolabs.ca/wp-content/uploads/2026/06/why_choose-bg.webp');
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    animation: bgPulse 2s ease-in-out infinite;
}

@keyframes bgPulse{
    0%,100%{
        transform:scale(1);
    }
    50%{
        transform:scale(1.02);
    }
}

 

.why-choose-section .why-choose-inner{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
} 

.why-choose-section .why-choose-content{
    flex:1;
    animation:slideLeft 1s ease forwards;
}

@keyframes slideLeft{
    from{
        opacity:0;
        transform:translateX(-80px);
    }
    to{
        opacity:1;
        transform:translateX(0);
    }
}

.why-choose-section .why-subtitle{
    color:#fff;
    font-size:40px;
    font-weight:600;
    margin-bottom:10px;
}

.why-choose-section .why-title{
    color:#f3b700;
    font-size:55px;
    font-weight:700;
    line-height:1.2;
    margin:0;

    text-shadow:0 8px 12px rgba(0,0,0,.35);
    animation:titleGlow 3s ease-in-out infinite;
}

@keyframes titleGlow{

    0%,100%{
        text-shadow:
        0 8px 12px rgba(0,0,0,.35);
    }

    50%{
        text-shadow:
        0 8px 12px rgba(0,0,0,.35),
        0 0 15px rgba(243,183,0,.4),
        0 0 30px rgba(243,183,0,.25);
    }
}

.why-choose-section .why-bottom-title{
    color:#fff;
    font-size:40px;
    font-weight:600;
    margin-top:10px;
}
 

.why-choose-section .why-card{
    flex:0 0 550px;
    background:#f7f7f7;
    border-radius:20px;
    padding:20px;
    box-shadow:0 0 54px rgba(31,97,232,.15);
    transition:.5s ease;
    animation:
    slideRight 1s ease forwards,
    floatingCard 4s ease-in-out infinite;
}

@keyframes slideRight{
    from{
        opacity:0;
        transform:translateX(80px);
    }
    to{
        opacity:1;
        transform:translateX(0);
    }
}

@keyframes floatingCard{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-10px);
    }
}

.why-choose-section .why-card:hover{
    box-shadow:
    0 0 30px rgba(31,97,232,.20),
    0 0 60px rgba(31,97,232,.15),
    0 0 90px rgba(31,97,232,.10);
}

 

.why-choose-section .why-item{
    position:relative;
    overflow:hidden;
    color: #000;
    display:flex;
    align-items:center;
    gap:16px;
    padding:15px 20px;
    border-radius:10px;
    font-size:18px;
    font-weight:600;
    margin-bottom:15px;
    cursor:pointer;
    transition:all .4s ease;
    opacity:0;
    animation:fadeUp .8s ease forwards;
}

.why-choose-section .why-item:last-child{
    margin-bottom:0;
}

.why-choose-section .why-item:nth-child(1){
    animation-delay:.2s;
}

.why-choose-section .why-item:nth-child(2){
    animation-delay:.4s;
}

.why-choose-section .why-item:nth-child(3){
    animation-delay:.6s;
}

.why-choose-section .why-item:nth-child(4){
    animation-delay:.8s;
}

.why-choose-section .why-item:nth-child(5){
    animation-delay:1s;
}

.why-choose-section .why-item:nth-child(6){
    animation-delay:1.2s;
}

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(40px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

.why-choose-section .why-item:hover{
    transform:translateX(12px);
}
 

.why-choose-section .why-item::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:80px;
    height:100%;
    background:rgba(255,255,255,.45);
    transform:skewX(-25deg);
    transition:.8s;
}

.why-choose-section .why-item:hover::before{
    left:130%;
}
 

.why-choose-section .why-icon{
    font-size:24px;
    font-weight:bold;
    transition:.4s ease;
}
.why-choose-section .why-icon {
    width: 35px !important;
    height: 35px !important; 
    margin-bottom: 0px !important;
}

.why-choose-section .why-item:hover .why-icon{
    transform:
    translate(6px,-6px)
    scale(1.15);
}
 

.why-choose-section .blue{
    background:linear-gradient( 90deg, #EFF4FD 0%, #FFFFFF 100% );
}

.why-choose-section .blue:hover{
    box-shadow:0 10px 25px rgba(41,98,255,.15);
}

.why-choose-section .yellow{
    background:linear-gradient( 90deg, #FBF4E0 0%, #FFFFFF 100% );
}

.why-choose-section .yellow:hover{
    box-shadow:0 10px 25px rgba(229,168,0,.15);
}

.why-choose-section .green{
    background:linear-gradient( 90deg, #EFFEF4 0%, #FFFFFF 100% );
}

.why-choose-section .green:hover{
    box-shadow:0 10px 25px rgba(34,197,94,.15);
}

.why-choose-section .red{
    background:linear-gradient( 90deg, #FFEEEF 0%, #FFFFFF 100% );
}

.why-choose-section .red:hover{
    box-shadow:0 10px 25px rgba(225,29,72,.15);
}

 

@media(max-width:1199px){

    .why-choose-section .why-choose-inner{
        flex-direction:column;
    }
    .why-choose-section::before { 
        top: 0%; 
    }

    .why-choose-section .why-card{
        flex:auto;
        width:100%;
    }

   .why-choose-section .why-subtitle{
        font-size:36px;
        margin-bottom: 0px;
    }

    .why-choose-section .why-title{
        font-size:48px;
    }

    .why-choose-section .why-bottom-title{
        font-size:36px;
        margin-top: 0px;
    }

}

@media(max-width:768px){

    
    
    .why-choose-section .why-choose-inner {
        gap: 20px;
    }
    
    .why-choose-section {
        padding: 30px 0; 
    }
    
    .why-choose-section .why-subtitle {
        font-size: 26px; 
    }
    .why-choose-section .why-title {
        font-size: 28px;
    }
    
    .why-choose-section .why-bottom-title {
        font-size: 26px; 
    }


    .why-choose-section .why-card{
        padding:20px;
    }

    .why-choose-section .why-item{
        padding:16px;
        font-size:16px;
    }
}


/* =====================================
   Why Choose SECTION END
===================================== */




/*==============================
  Trading Platform Section start
==============================*/

.trading-platform-section *{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

.trading-platform-section{
    font-family:'Poppins',sans-serif;
    background:#f5f7fb;
}

.trading-platform-section .tp-section{
    position:relative;
    overflow:hidden;
    padding:100px 20px 140px;
    background:linear-gradient(135deg,#2352d8,#2c66ff);
}

/* Background Glow */
.trading-platform-section .tp-section::before{
    content:"";
    position:absolute;
    width:700px;
    height:700px;
    background:radial-gradient(circle,
    rgba(255,255,255,.12) 0%,
    transparent 70%);
    top:-250px;
    left:-150px;
}

.trading-platform-section .container{
    max-width:1200px;
    margin:auto;
    position:relative;
    z-index:2;
}
 
/* Floating Arrows */
.trading-platform-section .arrow{
    position:absolute;
    color:rgb(255 255 255 / 38%);
    font-size:80px;
    animation:floatArrow 10s linear infinite;
}

.trading-platform-section .arrow:nth-child(1){
    left:20%;
    top:20%;
}

.trading-platform-section .arrow:nth-child(2){
    left:38%;
    top:50%;
    animation-delay:2s;
}

.trading-platform-section .arrow:nth-child(3) {
    right: 45%;
    top: 15%;
    animation-delay: 4s;
}

.trading-platform-section .arrow:nth-child(4){
    right:35%;
    top:55%;
    animation-delay:1s;
}

@keyframes floatArrow{
    0%{
        transform:translateY(40px);
        opacity:0;
    }
    50%{
        opacity:1;
    }
    100%{
        transform:translateY(-80px);
        opacity:0;
    }
}

/* Animated Chart Bars */
.trading-platform-section .chart_bar{
    position:absolute;
    right:100px;
    bottom:130px;
    display:flex;
    gap:18px;
    align-items:flex-end;
}

.trading-platform-section .bar{
    width:40px;
    border-radius:10px 10px 0 0;
    background:linear-gradient(
    to top,
    rgba(255,255,255,.15),
    rgba(255,255,255,.55));
    animation:grow 3s ease-in-out infinite;
}

.trading-platform-section .bar:nth-child(1){height:80px;}
.trading-platform-section .bar:nth-child(2){height:140px;animation-delay:.3s;}
.trading-platform-section .bar:nth-child(3){height:260px;animation-delay:.6s;}
.trading-platform-section .bar:nth-child(4){height:180px;animation-delay:.9s;}
.trading-platform-section .bar:nth-child(5){height:90px;animation-delay:1.2s;}
.trading-platform-section .bar:nth-child(6){height:320px;animation-delay:1.5s;}

.trading-platform-features{position:relative; z-index:2	}

.features-wrapper{
padding:40px 60px;
border-radius:40px;
box-shadow: 0px 0px 44px 0px #0000001A;
background:white;
margin-top:-140px; 
}

.features-wrapper .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.features-wrapper .fts{display:flex; gap:16px; align-items:center}
@keyframes grow{
    0%,100%{
        transform:scaleY(.8);
    }
    50%{
        transform:scaleY(1);
    }
}

/* Feature Box */
 
.trading-platform-section .features{
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(20px);
    border-radius:40px;
    padding:60px 70px;
    box-shadow:0 30px 60px rgba(0,0,0,.18);
    margin-top:60px;
}

.trading-platform-section .grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:35px 100px;
}

.trading-platform-section .fts{
    display:flex;
    align-items:center;
    gap:22px;
    transition:.35s;
}

.trading-platform-section .fts:hover{
    transform:translateX(8px);
}

.trading-platform-section .fts .icon{
    width:54px;
    height:54px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
}

 
.fts h3{
    font-size:18px;
    font-weight:600;
    color:#111;
}

/* Responsive */
@media(max-width:992px){
.accordion{
height:66vh;
}
.features-wrapper{
padding:20px;
}

.features-wrapper .grid {
    grid-template-columns: repeat(1, 1fr);
}
    .trading-platform-section .heading h1{
        font-size:50px;
    }

    .trading-platform-section .grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .trading-platform-section .features{
        padding:40px;
    }

    .trading-platform-section .chart{
        display:none;
    }

    .label.crypto { top: 60px; left: 20%; flex-direction: column-reverse; gap: 0; z-index: 1; font-size: 16px; }
    .label.stock { top: 60px; right: 20%; gap: 0; flex-direction: column; z-index: 1; font-size: 16px; }
    .label.forex { top: 280px; left: 10%; flex-direction: column-reverse; gap: 0; z-index: 1; font-size: 16px; }
    .label.futures { top: 280px; right: 10%; flex-direction: column; gap: 0; z-index: 1; font-size: 16px; }
    .label.hft { bottom: 20px; left: 18%; flex-direction: column-reverse; gap: 0; font-size: 16px; }
    .label.latency { bottom: 30px; right: 18%; flex-direction: column; gap: 0; font-size: 16px; }

}
@media(max-width:768px){
.orbit{height:200px; width:200px}
 
.orbit .node4 { transform: rotate(140deg) translateX(175px); }
.orbit .node3 { transform: rotate(220deg) translateX(175px); }
.orbit .node2 { transform: rotate(60deg) translateX(130px); }

.center-circle{height:250px; width:250px}
.center-circle span{font-size:10px; text-align:center;}
.center-circle h2{font-size:20px; text-align:center;line-height:1.2}
.gold{font-size:24px !important;}

.label.stock {width:180px;  left:0; right:auto; top:0; font-size:16px;text-align:center;white-space:normal;}
.label .icon-in {height:60px; width:60px;}
.label.crypto {width:180px;  left:auto; right:0; top:0; font-size:16px;text-align:center;white-space:normal;}
.label.latency {width:180px; left:0; right:auto; bottom:0; font-size:16px;text-align:center;white-space:normal;}
.label.hft {width:180px; left:auto; right:0; bottom:0; font-size:16px;text-align:center;white-space:normal;}
.label.futures { top: 400px; right: 30%; justify-content: center;  z-index: 1; font-size: 15px; }
.label.forex { top: 110px; left: 30%; justify-content: center;  z-index: 1; font-size: 15px; }


.ring1{height:290px; width:290px}
.ring2{height:320px; width:320px}
.ring3{height:350px; width:350px}


.accordion {
    height: 60vh;
}
 
.panel {
    align-items: center;
}
 
 
.panel:not(:first-child) {
    margin-left: 0px !important;
}
 
.icon svg {
    width: 60px;
    height: 60px;
}
 
.left h2 {
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 10px;
}
.left p {
    font-size: 15px;
    line-height: 1.4;
    opacity: 1;
}
 
.right li {
    font-size: 15px;
    margin-bottom: 0px;
    padding-left: 20px;
    position: relative;
}
 
 

.ai-trading-section .ai-underline svg {
    width: 100%;
}

}
@media(max-width:576px){



    .trading-platform-section .tp-section{
        padding:80px 15px 120px;
    }

    .trading-platform-section .heading .small{
        font-size:20px;
    }

    .trading-platform-section .heading h1{
        font-size:38px;
    }

    .trading-platform-section .heading p{
        font-size:16px;
    }

    .trading-platform-section .features{
        padding:30px 25px;
        border-radius:25px;
    }

    .trading-platform-section .fts h3{
        font-size:16px;
    }

    .panel.active { 
        animation: none;
    }
    .icon {
        animation: unset;
    }

    .icon svg {
        width: 50px;
        height: 50px;
    }
    .fts h3 {
        font-size: 16px;
        font-weight: 500; 
    }
    .features-wrapper .grid { 
        gap: 10px;
    }
    .features-wrapper { 
        border-radius: 20px; 
    }
    .trading-platform-section .chart_bar { 
        right: 30px;
        bottom: 110px; 
        gap: 30px; 
    }
    .trading-platform-section .bar {
        width: 25px; 
        background: linear-gradient(to top, rgb(255 255 255 / 0%), rgb(255 255 255 / 18%)); 
    }

    .tech__content {
        padding: 24px; 
        border-radius: 20px;
        margin-left: 0;
    }
    .why-choose-section .why-icon {
        font-size: 18px;
        font-weight: 600; 
    }
    .why-choose-section .why-item {
        padding: 10px;
        font-size: 15px;
        line-height: 1.4;
        gap: 6px;
        font-weight: 400;
    }
    .aitb-num {  
        top: 0px;
        font-size: 50px;
        font-weight: 800; 
    }
    .final-cta__btn { 
        padding: 10px 40px; 
        font-size: 16px; 
    }

}


/** =========================
*  Trading Platform Section end
==============================*/