/* Global CSS Variables */
:root {
    /* Font Variables */
    --font-primary: 'Inter', 'Segoe UI', Roboto, Arial, sans-serif;
    --font-mono: 'Inter';
  
    /* Font Sizes */
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 20px;
    --font-size-2xl: 24px;
    --font-size-3xl: 30px;
    --font-size-4xl: 36px;
    --font-size-5xl: 48px;
  
    /* Font Weights */
    --font-weight-thin: 100;
    --font-weight-light: 300;
    --font-weight-normal: 400 ;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --font-weight-black: 900;
  
    /* Letter Spacing */
    --letter-spacing-tight: -0.02em;
    --letter-spacing-normal: 0em;
    --letter-spacing-wide: 0.05em;
  
    /* Colors */
    --text-color-primary: #212529;
    --text-color-secondary: #6c757d;
    --text-color-muted: #adb5bd;
    --text-color-light: #f8f9fa;
  
    /* Button Variables */
    --btn-primary-bg: #ffd11a;
    --btn-primary-text: #000;
  
    --btn-secondary-bg: #6c757d;
    --btn-secondary-hover: #5c636a;
    --btn-secondary-border: #6c757d;
    --btn-secondary-text: #fff;
  
    --btn-success-bg: #198754;
    --btn-success-hover: #157347;
    --btn-success-border: #198754;
    --btn-success-text: #fff;
  
    --btn-danger-bg: #dc3545;
    --btn-danger-hover: #bb2d3b;
    --btn-danger-border: #dc3545;
    --btn-danger-text: #fff;
  
    /* Sizes */
    --btn-padding-sm: 4px 8px;
    --btn-padding-lg: 8px 16px;
    --btn-padding-xl: 12px 24px;
  
    /* Border Radius */
    --btn-border-radius: 6px;
    --btn-border-radius-sm: 4px;
    --btn-border-radius-lg: 10px;
  
    /* Headings */
    --heading-line-height: 1.2;
    --heading-margin-bottom: 8px;
  
    --heading-color-primary: #000;
    --heading-color-secondary: #454545;
    --heading-color-success: #ffd11a;
    --heading-color-danger: #dc3545;
  
    /* Line Heights */
    --line-height-tight: 1.1;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
  }
  
  /* Global Styles */
  body {
    font-family: var(--font-primary);
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
    color: var(--text-color-primary);
  }

  .btn-custom.btn-secondary {
    background-color: var(--btn-secondary-bg);
    border-color: var(--btn-secondary-border);
    color: var(--btn-secondary-text);
  }
  
  .btn-custom.btn-secondary:hover {
    background-color: var(--btn-secondary-hover);
    border-color: var(--btn-secondary-hover);
  }
  
  /* Button Sizes */
  .btn-custom.btn-sm { padding: var(--btn-padding-sm); font-size: var(--font-size-sm); }
  .btn-custom.btn-lg { padding: var(--btn-padding-lg); font-size: var(--font-size-lg); }
  .btn-custom.btn-xl { padding: var(--btn-padding-xl); font-size: var(--font-size-xl); }
  
  /* Headings */
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-primary);
    line-height: var(--heading-line-height);
    margin-bottom: var(--heading-margin-bottom);
    color: var(--heading-color-primary);
    letter-spacing: var(--letter-spacing-tight);
  }
  
  h1 {
    font-size: 48px !important;
    font-weight: var(--font-weight-black) !important;
    font-family: var(--font-mono) !important;
  }
  h2 { font-size: var(--font-size-4xl); font-weight: var(--font-weight-extrabold); }
  h3 { font-size: var(--font-size-3xl); font-weight: var(--font-weight-bold); }
  h4 { font-size: var(--font-size-2xl); font-weight: var(--font-weight-semibold); }
  h5 { font-size: var(--font-size-xl); font-weight: var(--font-weight-medium); }
  h6 { font-size: var(--font-size-lg); font-weight: var(--font-weight-medium); }
  

  .custom-container-header{
    max-width: 100% !important;
    padding-left: 96px !important;
    padding-right: 96px !important;
  }
 
/* comman button css start */
.btn.try-free-demo-btn {
  background-color: #000 !important; 
  display: flex;
  align-items: center;      
  justify-content: flex-start; 
  gap: 8px;                
  padding: 9px 15px;
  font-size: 14px;
  font-weight: 500;
  font-family: 'Inter';
  max-width: 160px;
  cursor: pointer;
  overflow: hidden;
  border-radius: 8px;
  align-items: flex-start;
}

/* Image icon */
.btn.try-free-demo-btn .btn-icon {
  width: 20px;
  height: 20px;
  display: inline-block;
  transition: transform 1s ease;
}

/* Rotate on hover */
.btn.try-free-demo-btn:hover .btn-icon {
  transform: rotate(180deg);
}

.text-wrap {
  position: relative;
  display: inline-block;
  line-height: 1; 
}

.text-gradient-free-demo,
.text-white-free-demo {
  position: absolute;
  left: 0;
  top: 2px;
  white-space: nowrap;
  pointer-events: none;
}

.text-gradient-free-demo {
  background: linear-gradient(90deg, #FFD11A 0%, #FFD11A 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-white-free-demo {
  color: #fff;
  clip-path: inset(0 0 0 0);
  transition: clip-path 200ms linear;
}

/* Hover animation for text */
.btn.try-free-demo-btn:hover .text-white-free-demo {
  clip-path: inset(0 0 0 100%);
}

/* end comman button css   */
a.btn.try-free-demo-btn.next-level-btn {
    position: absolute;
    bottom: 20px;
    left: 41px;
    right: 0;
    z-index: 9;
}

  /* ticker */ 
  .ticker{ 
    color: var(--heading-color-success); 
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xl);
    font-family: var(--font-primary);
    }

              
.comman-title{
  font-size: 48px;
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-primary);
  color: #2D3139;
  margin-bottom: 16px;
}

.comman-title span{
  font-size: 48px;
  font-weight: var(--font-weight-light);
  font-family: 'Inter';
  color: #2D3139;
  margin-bottom: 16px;
}

.comman-title-description{
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  font-family: var(--font-primary);
  color: #454545;
  margin-bottom: 16px;
}

/* Custom Buttons */
.btn-custom.btn-primary {
  background: linear-gradient(180deg, #000000 -0.23%, #000000 99.77%);
  border: 3px solid #F0F0F0;
  color: #fff;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  font-family: var(--font-primary);
  padding: 10px 20px;
  transition: all 0.3s ease;
  text-decoration: none;
  border-radius: var(--btn-border-radius-lg);
}

.btn-custom.btn-primary:hover {
  background-color: #ffbf00;
}


/* banner css */


.sp-words-wrapper {
  display: inline-block;
  position: relative;
  text-align: left;
  width: 100% !important; 
  }
  .sp-words-wrapper b {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
  left: 0;
  top: 0;
    width: auto !important;
  }
  .sp-words-wrapper b.is-visible {
  position: relative;
  }
  .no-js .sp-words-wrapper b {
  opacity: 0;
  }
  .no-js .sp-words-wrapper b.is-visible {
  opacity: 1;
  }
  
  .sp-headline.slide span {
  display: inline-block;
  padding: 0;
  padding-bottom: 2px;
  }
  .sp-headline.slide .sp-words-wrapper {
  overflow: hidden;
  vertical-align: bottom;
  }
  .sp-headline.slide b {
  opacity: 0;
  top: .2em;
  }
  .sp-headline.slide b.is-visible {
  top: 0;
  opacity: 1;
  -webkit-animation: slide-in 0.6s;
  -moz-animation: slide-in 0.6s;
  animation: slide-in 0.6s;
  }
  .sp-headline.slide b.is-hidden {
  -webkit-animation: slide-out 0.6s;
  -moz-animation: slide-out 0.6s;
  animation: slide-out 0.6s;
  }
  @-webkit-keyframes slide-in {
    0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
    }
    60% {
    opacity: 1;
    -webkit-transform: translateY(-20%);
    }
    100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    }
    }
    @-moz-keyframes slide-in {
    0% {
    opacity: 0;
    -moz-transform: translateY(100%);
    }
    60% {
    opacity: 1;
    -moz-transform: translateY(-20%);
    }
    100% {
    opacity: 1;
    -moz-transform: translateY(0);
    }
    }
    @keyframes slide-in {
    0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
    }
    60% {
    opacity: 1;
    -webkit-transform: translateY(-20%);
    -moz-transform: translateY(-20%);
    -ms-transform: translateY(-20%);
    -o-transform: translateY(-20%);
    transform: translateY(-20%);
    }
    100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    }
    }
    @-webkit-keyframes slide-out {
    0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    }
    60% {
    opacity: 0;
    -webkit-transform: translateY(-120%);
    }
    100% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    }
    }
    @-moz-keyframes slide-out {
    0% {
    opacity: 1;
    -moz-transform: translateY(0);
    }
    60% {
    opacity: 0;
    -moz-transform: translateY(-120%);
    }
    100% {
    opacity: 0;
    -moz-transform: translateY(-100%);
    }
    }
    @keyframes slide-out {
    0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    }
    60% {
    opacity: 0;
    -webkit-transform: translateY(-120%);
    -moz-transform: translateY(-120%);
    -ms-transform: translateY(-120%);
    -o-transform: translateY(-120%);
    transform: translateY(-120%);
    }
    100% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    }
    
   
  }
  @media (min-width : 668px) and (max-width : 1024px) {
  .sp-intro h4, .sp-intro b, .sp-intro i, .sp-intro p, .sp-intro span {
  line-height: 46px !important;
  font-size: 38px !important;
  font-weight: 400 !important;
  }
  }
  @media (max-width : 667px) {
  .sp-intro h4, .sp-intro b, .sp-intro i, .sp-intro span, .sp-intro p {
  line-height: 36px !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  }
  }


  /* text change animation css */


.section-banner {
    position: relative;
    background: linear-gradient(180deg, #FFFFFF 0%, #F2F2F2 100%);
    color: #fff;
    min-height: 600px;
    overflow: hidden; /* keep pseudo-elements contained */
  }
  
  .section-banner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('https://.d24group.com/wp-content/uploads/2025/09/gradient_bg.svg') no-repeat;
    background-size: contain;
    z-index: 0;
  }
  
  .light-shadow {
    position: relative;
    height: 100%; /* force same height as section */
    min-height: inherit; /* inherit section-banner min-height */
  }

  .light-shadow .logo-stripe-wrapper-new{
    background: #FBFBFB;
  }
  
  /* .light-shadow::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 280px;
    height: 100%;
    z-index: 2;
    background: linear-gradient(270deg, rgb(23 24 21) 29%, rgba(11, 12, 8, 0) 93%);
  }
   */
  /* .section-banner::before {
    content: '';
    position: absolute;
    top: 60px;
    right: 16px;
    width: 100%;
    height: 460px;
    background: url('https://dev.d24group.com/wp-content/uploads/2025/09/banner-screens.png') no-repeat right center;
    background-size: contain;
    z-index: 2 !important; 
  }
   */

  .section-banner .badge {
    background: #1a1a1a;
    color: #ffcc00;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 14px;
  }
  
  /* .section-banner h1 {
   color: #fff;
  } */
  
  .section-banner p {
    color: #5B5E65;
    margin-bottom: 30px;
    font-size: var(--font-size-sm);
    font-family: var(--font-mono);
    max-width: 550px;
    padding-top: 5px;
    line-height: 24px;
  }
  
  .section-banner .banner-form input {
    max-width: 250px;
  }
  
  .section-banner .image-wrapper {
    width: 100%;
    height: 450px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

/* Make pseudo-elements non-interactive but visible */
.section-banner::before,
.section-banner::after {
    pointer-events: none;
    z-index: 0;
}

/* Ensure text content is above background images */
.section-banner .container {
    position: relative;
    z-index: 1;
}

/* Center left-content horizontally and vertically */
.section-banner .left-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
    height: 100%;
    min-height: 540px;
}
.section-banner .left-content  h1{
  color: #000;
}

/* Logo Stripe inside Banner */
.section-banner .logo-strip {
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    background: transparent;
    padding: 24px 0;
  }
  
  .section-banner .logo-track {
    display: inline-flex;
    align-items: center;
    gap: 60px;
    width: max-content;  
    backface-visibility: hidden;
    animation: scroll 55s linear infinite;
    transform: translate3d(0,0,0);
  }
  
  .section-banner .logo-track img {
    height: 17px; 
  }
  
  .section-banner .logo-track span {
    color: #fff;
    font-weight: 500;
    margin-right: 40px;
  }
  
  @keyframes scroll {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(-50%);
    }
  }
  
/* Logo strip styling */
.logo-strip {
    position: relative;
    padding: 40px 0;
    background-color: #f8f9fa;
    overflow: hidden;
}

.logo-strip span {
    display: block;
    text-align: center;
    font-size: 14px;
    color: #6c757d;
    margin-bottom: 20px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}


.logo-track img {
    height: 40px;
    width: auto;
    opacity: 1;
    transition: opacity 0.3s ease;
    flex-shrink: 0;
}

/* .logo-track img:hover {
    opacity: 1;
} */


/* Updated Logo strip styling for col-4 and col-8 layout */
.logo-strip {
    position: relative;
    padding: 40px 0;
    background-color: #f8f9fa;
    overflow: hidden;
}

.trusted-text {
    display: block;
    font-size: 14px;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}


.logo-track img {
    height: 35px;
    width: auto;
    opacity: 1;
    transition: opacity 0.3s ease;
    flex-shrink: 0;
    filter: grayscale(0%);
}

/* .logo-track img:hover {
    opacity: 1;
    filter: grayscale(0%);
} */

.section-banner .logo-strip-text span{
    font-size: var(--font-size-xs);
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: #B6B6B6;
    letter-spacing: var(--letter-spacing-tight);
    margin-bottom: 20px;
    padding-right: 20px;
}


/* Demo Request Section */
.section-banner .demo-request-section {
  background: #0a0a0a;
  padding: 80px 0;
  position: relative;
}


.section-banner .demo-form-wrapper {
  position: relative;
  z-index: 1;
}

.section-banner .demo-form {
  display: flex;
  background:rgb(255 255 255 / 43%);
  border-radius: 50px;
  border: 0.93px solid #FFFFFFFC;
  overflow: hidden;
  box-shadow: 0px 4px 4px 0px #E5DAAC30;
  max-width: 600px;
  margin: 0 auto;
}

.section-banner .demo-input {
  flex: 1;
  background: transparent;
  border: none;
  padding: 12px 24px;
  color: #000;
  font-size: 16px;
  font-family: var(--font-primary);
  outline: none;
  font-size: 14px;
}

.section-banner .demo-input::placeholder {
  color: #888;
  font-weight: 300;
}

.section-banner .demo-button {
  background: #E8E8E8;
  border: 1px solid #E8E8E8;
  color: #ffd700;
  padding: 10px 28px;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--font-mono);
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 50px;
  height: 40px;
  margin: 4px 4px;
  text-decoration: none;
}
.section-banner .demo-button:hover{
  background: #000;
  border: 1px solid #000;
  color: #fff;
  transition: all 0.3s ease;
}
.section-banner .demo-button:hover span{
  color: #fff !important;
  transition: all 0.3s ease;
}



.section-banner .demo-button span{
  color: #000;
  font-size: 12px;
  font-weight: 600;
  font-family: var(--font-mono);
}


.section-banner .demo-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

/* Welcome Ticker */
.section-banner .welcome-ticker {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

.section-banner .ticker-content {
  display: flex;
  align-items: center;
  background: linear-gradient(90deg, #010101 0%, #1F1E1E 47.5%, #010101 100%);
  border-radius: 25px;
  padding: 8px 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  border: 1px solid #323232;
}

.section-banner .ticker-dot {
  width: 6px;
  height: 6px;
  background: #ffd700;
  border-radius: 50%;
  margin: 0 12px;
  flex-shrink: 0;
}

.section-banner .ticker-text {
  color: #CFCDCD;
  font-size: 14px;
  font-weight: 400;
  font-family: 'Noto Sans';
  white-space: nowrap;
}

.logo-text-box {
    flex: 0 0 10%;   /* fixed 20% width */
    max-width: 10%;
  }
  
  .logo-logos-box {
    flex: 0 0 90%;   /* fixed 80% width */
    max-width: 90%;
  }

/* Enhanced logo track for smooth infinite loop */


/* Trading Infrastructure Section */

/* Trading Infrastructure Section */
.trading-infrastructure-section {
  padding: 80px 0;
  background-color: #ffffff;
  position: relative;
}
.trading-infrastructure-section .title-wrapper-max-width{
  max-width: 534px;
}

.trading-infrastructure-section .container {
  position: relative;
  z-index: 1;
}

.trading-infrastructure-section .btn.try-free-demo-btn{
  max-width: 140px;
}

/* Left Content */
.left-content-wrapper {
  padding-right: 40px;
}

.section-badge {
  display: inline-block;
  background-color: #ffc107;
  color: #000;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 16px;
}

.section-title {
  font-size: 48px;
  font-weight: 700;
  color: #333;
  margin-bottom: 24px;
  line-height: 1.2;
}

.section-description {
  font-size: 16px;
  color: #666;
  line-height: 1.6;
  margin-bottom: 32px;
}

.btn-demo {
  background-color: #000;
  color: #fff;
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.btn-demo:hover {
  background-color: #333;
  color: #fff;
  transform: translateY(-2px);
}

.demo-icon {
  font-size: 16px;
}
/* Outer gradient border around both buttons */

.features-box {
background: #ffffff;
padding: 30px 48px;
position: relative;
min-height: 530px;
}
#highlights{
margin-top: 20px;
}
.features-box::after {
content: '';
position: absolute;
top: -175px;
left: 0;
right: 0;
bottom: 0;
background-image: url("https://dev.d24group.com/wp-content/uploads/2025/09/dot_bg.svg");
background-position: center;
background-repeat: no-repeat;
z-index: 0;
pointer-events: none;
overflow: hidden;
height: 822px;
}

/* .features-box .nav-tabs .nav-item.show .nav-link{

} */

.features-box  .nav-tabs .nav-link.active{
  box-shadow: 0px 2px 8px 0px #0000001F !important;
  font-weight: 500;
}


.features-wrapper .nav-tabs .nav-link {
border: none !important;
border-radius: 999px;
background: transparent;            
padding: 8px 26px;
font-weight: 300;
color: #111827;     
font-size: var(--font-size-xs);               
box-shadow: none !important;
transition: all 0.3s ease;
}

.features-wrapper .top-border {
position: absolute;
top: -1px;
left: -60px;
height: 1px;
width: 120%;
background: linear-gradient(90deg, rgba(242, 196, 64, 0) 0%, #F2C440 22.12%, rgba(21, 43, 121, 0.42) 75%, rgba(21, 43, 121, 0) 97.6%);
}

.features-wrapper .bottom-border {
position: absolute;
bottom: -1px;
left: -60px;
height: 1px;
width: 120%;
background: linear-gradient(90deg, rgba(242, 196, 64, 0) 0%, #F2C440 22.12%, rgba(21, 43, 121, 0.41) 75%, rgba(21, 43, 121, 0) 97.6%);
}

.features-wrapper .left-border {
position: absolute;
top: -50px;
left: -1px;
width: 1px;
height: 120%;
background: linear-gradient(180deg, rgba(242, 196, 64, 0) 0%, #F2C440 22.12%, #13B4F8 75%, rgba(19, 180, 248, 0) 97.6%);
}

.features-wrapper .right-border {
content: "";
position: absolute;
top: -50px;
right: -1px;
width: 1px;
height: 120%;
background: linear-gradient(180deg, rgba(242, 196, 64, 0) 0%, #F2C440 22.12%, #13B4F8 75%, rgba(19, 180, 248, 0) 97.6%);
}

.features-wrapper .compare-content{
background-color:  #FFFFFF;
border-radius: 16px;
border: 3px solid #FFFFFF;
position: relative;
z-index: 1;
padding: 0px 16px 0px 16px;
}

.features-wrapper .compare-content thead th{
font-size: var(--font-size-sm);
font-weight: 600;
color:#08090ACC;
text-align: left;
border-bottom: 0 !important;
}
.features-wrapper .compare-content tbody th{
font-weight: 400;
font-size: 13px;
color: #000000;
text-align: left;
font-family: var(--font-mono);
}

.features-wrapper .compare-content tbody td{
text-align: left;
font-size: 12px;
font-weight: 300;
font-family: var(--font-mono);
}
.features-wrapper .compare-content tbody td img{
flex-shrink: 0;
}

.features-wrapper .compare-content table>:not(caption)>*>* {
border-bottom: 0.5px solid #328DAD57;
padding-top: 15px;
padding-bottom: 15px;
}


.features-wrapper .nav-tabs .nav-link.show.active {
background: #ffffff !important;
color: #000 !important;
font-weight: 600;
font-size: var(--font-size-xs);
box-shadow: 0px 2px 8px 0px #0000001F !important;
font-family: var(--font-mono);
}

/* Remove all focus and hover effects that might cause unwanted shadows */
.features-wrapper .nav-tabs .nav-link:focus,
.features-wrapper .nav-tabs .nav-link:hover,
.features-wrapper .nav-tabs .nav-link:active {
outline: none !important;
box-shadow: none !important;
background: transparent !important;
color: #111827 !important;
}

/* Only active state should have shadow */
.features-wrapper .nav-tabs .nav-link.active:focus,
.features-wrapper .nav-tabs .nav-link.active:hover,
.features-wrapper .nav-tabs .nav-link.active:active {
background: #ffffff !important;
color: #000 !important;
box-shadow: 0px 2px 8px 0px #0000001F !important;
border-radius: 40px !important;
}

#infraTabs {
display: inline-flex;
padding: 4px;
border-radius: 50px; 
border: 1px solid transparent;
background:
  linear-gradient(#ffffff, #ffffff) padding-box,
  linear-gradient(90deg, #F2C74B 0%, #43B7D0 100%) border-box;
-webkit-background-clip: padding-box, border-box;
background-clip: padding-box, border-box;
position: absolute;
top: -23px;
left: 50%;
transform: translateX(-50%);
z-index: 1;
min-width: 270px;
}


/* Card Styling */
.feature-card {
background: #fff;
border-radius: 10px;
padding: 16px;
text-align: left;
box-shadow: 0px 6px 6px 0px #0000000A;
transition: 0.3s;
font-size: 14px;
min-height: 78px;
border: 1px solid #EEEAEAEB;
position: relative;
z-index: 9;
}

.feature-card p{
margin-bottom: 0;
font-size: 15px;
font-weight: var(--font-weight-medium);
font-family: var(--font-mono);
}
.feature-card span{
font-size: 13px;
font-weight: 300;
font-family: var(--font-primary);
}

.feature-card strong {
font-size: 15px;
}
.feature-card:hover {
transform: translateY(-3px);
box-shadow: 0px 5px 12px rgba(0,0,0,0.1);
}
@media (max-width: 1024px) {
#infraTabs{
  position: relative;
  transform: translateX(-0%);
  left: 0%;
  top: -55px;
}
}

/* Institutional MT5 Platform Section */
.Institutional-mt5-features-box {
  border: 1px solid transparent;
  background: linear-gradient(#ffffff, #ffffff) padding-box, 
              linear-gradient(90deg, #F2C74B 0%, #43B7D0 100%) border-box;
  -webkit-background-clip: padding-box, border-box;
  background-clip: padding-box, border-box;
}

.Institutional-mt5-tabs {
  background: linear-gradient(#ffffff, #ffffff) padding-box, 
              linear-gradient(90deg, #F2C74B 0%, #43B7D0 100%) border-box;
  -webkit-background-clip: padding-box, border-box;
  background-clip: padding-box, border-box;
}

.Institutional-mt5 .nav-pills .nav-link.active {
  background-color: #ffffff !important;
  color: #000 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.Institutional-mt5 .nav-pills .nav-link {
  background-color: transparent;
  color: #666;
  border: none;
}

.Institutional-mt5 .nav-pills .nav-link:hover {
  background-color: transparent;
  color: #000;
}

/* Feature cards with dotted line effect */
.Institutional-mt5-icon {
  position: relative;
}

.Institutional-mt5-icon::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 30px;
  background: repeating-linear-gradient(
    to bottom,
    #dee2e6 0px,
    #dee2e6 4px,
    transparent 4px,
    transparent 8px
  );
}

/* MT5-Platform */
.MT5-Platform{
  background: #FBFBFB;
}

.MT5-Platform .btn {
  border-radius: 8px;
  padding: 10px 20px;
}

.MT5-Platform .text-wrapper h6{
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-mono);
  color: #2D3139;
  margin-top: 16px;
}

.MT5-Platform .text-wrapper p{
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-light);
  font-family: var(--font-mono);
}
.MT5-Platform .feature-box-wrapper{
  max-width: 1050px;
  margin: 0 auto;

}

.MT5-Platform .bg-white-box{
  background: linear-gradient(90deg, #FBFBFB 0%, #FFFFFF 49.52%, rgba(251, 251, 251, 0) 100%);
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0.24) -11.62%, rgba(49, 49, 49, 0.0672) 47.36%, rgba(255, 255, 255, 0) 111.05%);
  border-image-slice: 1;
  padding: 22px 0px;
}

.MT5-Platform .btn.try-free-demo-btn{
  max-width: 186px;
}

/* Crypto Trading Section */
.crypto-trading-section {
  background-color: #f8f9fa;
  padding-bottom: 0px !important;
}
.crypto-trading-section .trading-interface-wrapper {
  position: relative;
  float: right;
}

.crypto-trading-section .trading-interface-container{
  max-width: 724px;
}

.crypto-trading-section .trading-interface-container img {
  width: 100%;
  height: 100%;
  display: block;
  min-height: 300px;
}

.crypto-trading-section .features-list {
  position: relative;
  max-width: 530px;
  height: 300px;
  padding: 48px;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 40%, #fbfbfb 108%);
  overflow: hidden;
}

.crypto-trading-section .features-list .btn.try-free-demo-btn{
  max-width: 210px;
}

/* gradient border only on top + sides */
.crypto-trading-section .features-list::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 16px;
  border: 1px solid transparent;
  border-bottom: none;
  background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.12) 24%,
      rgba(255, 255, 255, 0) 120%
    )
    border-box;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 1;
}

/* fade top */
.crypto-trading-section .features-list::after {
  content: "";
  position: absolute;
  top: 0;
  height: 80px;
  width: 100%;
  border-radius: 16px 16px 0 0;
  background: linear-gradient(180deg, #ffffff 85%, rgba(255, 255, 255, 0) 100%);
  z-index: 2;
  pointer-events: none;
}

/* fade bottom */
.crypto-trading-section .features-list .bottom-fade {
  content: "";
  position: absolute;
  bottom: 0;
  height: 78px;
  width: 100%;
  border-radius: 0 0 16px 16px;
  background: linear-gradient(0deg, #ffffff 70%, rgba(255, 255, 255, 0) 100%);
  z-index: 2;
  pointer-events: none;
}

/* auto scroll track */
.crypto-trading-section .features-track {
  display: flex;
  flex-direction: column;
  animation: scrollUp 20s linear infinite;
}

.crypto-trading-section .features-list:hover .features-track {
  animation-play-state: paused;
}

@keyframes scrollUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-40%);
  }
}

/* typography */
.crypto-trading-section .feature-title-list {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-mono);
  color: #000;
  margin-bottom: 0;
}

.crypto-trading-section .features-list p {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-light);
  font-family: var(--font-mono);
  color: #67748a;
  margin-bottom: 6px;
}

.crypto-trading-section .features-track {
  position: relative; /* ensures fades can overlay */
  z-index: 0;
}

.crypto-trading-section .features-list::after,
.crypto-trading-section .features-list .bottom-fade {
  z-index: 0; /* make sure above content */
  left: 0;
}

.features-list .btn.btn-custom{
  position: absolute;
  bottom: 15px;
  left: 41px;
  right: 0;
  z-index: 9;
  max-width: 175px;
}

.crypto-trading-section .features-list::after {
  background: linear-gradient(180deg, #ffffff 60%, rgba(255, 255, 255, 0) 100%);
}

.crypto-trading-section .box-wrap:first-child {
  flex: 0 0 43%;
  max-width: 43%;
}

.crypto-trading-section .box-wrap:last-child {
  flex: 0 0 57%;
  max-width: 57%;
}

/* Our Solutions Section */

.our-solutions-section{
  background-color: #FBFBFB;
}

.our-solutions-section .max-width-custom{
  max-width: 1111px;
   margin: 0 auto;
}
/* .our-solutions-section {
  background-color: #FBFBFB;
  padding: 80px 0;
} */
.solution-card {
  position: relative;
  border-radius: 12px;
  padding: 20px 24px 15px;
  border: 1px solid rgb(0 0 0 / 4%);
  /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); */
  transition: background 0.6s ease, box-shadow 0.6s ease, transform 0.6s ease;
  overflow: hidden;
  background: #fff;
  /* background: linear-gradient(180deg, #F3F3F6 -13.28%, #FFFFFF 73.73%); */
}

.solution-card:hover {
  background: #ffffff;
  box-shadow:0px -6px 14px rgb(0 0 0 / 8%);
  /* transform: translateY(-2px); */
}

.wpcf7-form-control.wpcf7-textarea.form-control{
  height: 90px !important;
}

.our-solutions-section .max-width-custom{
max-width: 1111px;
margin: 0 auto;
}

/* Gradient top border */
.solution-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(90deg, #1C379C 0%, #FFD11A 100%);
  transition: height 0.3s ease;
}

/* Hover effect: increase top border height */
.solution-card:hover::before {
  height: 4px;
}

/* Title */
.solution-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #000;
  font-family: var(--font-primary, sans-serif);
}

/* Description */
.solution-description {
  font-size: 14px;
  color: #67748A;
  line-height: 1.6;
  margin-bottom: 0;
  font-family: var(--font-primary, sans-serif);
  font-weight: 300;
  
}

/* Explore button (hidden initially) */
.explore-btn {
  display: inline-block;
  margin-top: 16px;
  padding: 8px 0px;
  font-size: 14px;
  font-weight: 400;
  color: #000000;
  border-radius: 8px;
  text-decoration: none;
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.3s ease;
}

/* Show button on hover */
.solution-card:hover .explore-btn {
  opacity: 1;
  transform: translateY(0);
}


/* Custom Tab Styling */

.our-discover-products .custom-tabs .nav-link {
  border: none;
  color: #6c757d;
  font-weight: 600;
  padding: 1rem 1rem;
  margin: 0px 12px;
  margin-bottom: 0; 
  transition: color 0.2s ease-in-out;
  font-weight: 300;
  font-family: 'Noto Sans';
  font-size: 14px;
}

.our-discover-products .custom-tabs .nav-link:hover {
  color: #212529;
}

.our-discover-products .btn.try-free-demo-btn{
  max-width: 116px;
}

/* Active tab with gradient border */
.our-discover-products .custom-tabs .nav-link.active,
.our-discover-products .custom-tabs .nav-item.show .nav-link {
  color: #212529;
  background-color: transparent;
  border: none;
  font-family: 'Noto Sans';
  border-bottom: 2px solid;
  font-weight: 600;
  border-image: linear-gradient(to left, #FFD11A, #1C379C) 1;
}

/* Custom list */
.our-discover-products .custom-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
  margin-bottom: 32px;
}

.our-discover-products .custom-list li {
  padding-left: 0;
  position: relative;
  margin-bottom: 12px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-light);
  font-family: var(--font-mono);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}

.our-discover-products .custom-list li::before {
  display: none;
}

/* Custom bullet */
.our-discover-products .custom-list li::before {
  content: '';
  position: absolute;
  left: 0.25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background-color: #212529;
  border-radius: 50%;
}

/* Image container */
.our-discover-products .image-container img {
  position: relative;
  margin: 0; /* no extra spacing */
}

.image-container .img-fluid {
  border-radius: 0.5rem;
}


.our-discover-products .border-outer-box {
  position: relative;
  background: #fff; /* inner background */
  border-radius: 0 0 12px 12px;
  z-index: 1;  min-height: 490px;
}

.our-discover-products {
  position: relative;
  padding: 60px 0px 60px;
}

.our-discover-products .image-badge-2 {
  position: absolute;
  top: 0;
  right: 3px;
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: capitalize;
}

.our-discover-products .image-badge-2 .badge-bg {
  display: block;
  width: 80px; 
  height: auto;
  border-radius: 0px 8px 0px 0px;
}

.our-discover-products .image-badge-2 .badge-text {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000;
  z-index: 2;
  font-size: 0.8rem;
  font-weight: 400;
}

.our-discover-products .border-outer-box::before {
  content: "";
  position: absolute;
  inset: 0; /* shorthand for top/right/bottom/left 0 */
  border-radius: 0 0 12px 12px;
  padding: 1px; /* border thickness */
  background: linear-gradient(180.12deg, rgba(255,255,255,0.22) -23.09%, rgba(102,102,102,0.22) 99.9%);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0); 
  -webkit-mask-composite: xor;
  mask-composite: exclude; 
  pointer-events: none;
  z-index: -1;
}


.our-discover-products .border-outer-box .title-wrapper{
  max-width: 480px;
}

.our-discover-products .border-top-gray{
  border-top: 1px solid #e0e0e0;
}

.our-discover-products .title-wrapper h2{
  font-size: 27px;
  font-weight: 500;
  font-family: var(--font-primary);
}
.btn-explore-more{
  border: 1px solid #000000;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-light);
  font-family: var(--font-mono);
  padding: 10px 20px;
  border-radius: 8px;
  color: #000000;
  background: #fff;
  text-decoration: none !important;
  transition: all 0.3s ease-in-out;
}
.our-discover-products .btn-explore-more:hover{
  background: #000000;
  color: #fff;
  border: 1px solid #000000;
}
.our-discover-products .image-container{
  position: relative;
}

/* Sachin our-integrated start*/
.our-integrated{
  background-color: #161616;
  padding-top: 128px;
  padding-bottom: 128px;
}
.our-integrated-wrapper{
  max-width: 1100px;
  margin: 0 auto;
}

.our-integrated h3{
  font-size: var(--font-size-5xl);
  font-weight: var(--font-weight-semibold);
}
.our-integrated h3 span {
  font-weight: var(--font-weight-light);
  background: linear-gradient(90deg, #FFD11A 0%, #13B4F8 100%);
  -webkit-background-clip: text;   /* Safari/Chrome */
  -webkit-text-fill-color: transparent; /* Safari/Chrome */
  background-clip: text; /* Standard */
  color: transparent; /* fallback */
}

.our-integrated p{
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal); 
  color: #F6F9FB;
  font-family: var(--font-mono);
}
.our-integrated .border-cell {
  border-right: 1px solid;
  border-bottom: 1px solid;
  padding: 20px 0;
  border-image-source: linear-gradient(
    90deg, 
    rgba(16, 17, 19, 0) -18.83%, 
    rgba(255, 255, 255, 0.2) 47.68%, 
    rgba(16, 17, 19, 0) 115.48%
  );
  border-image-slice: 1;
}
.our-integrated .row > .col-6:nth-child(6n) .border-cell {
  border-right: 0;
}
.our-integrated .row > .col-6:nth-last-child(-n+6) .border-cell {
  border-bottom: 0;
}
@media (max-width: 1024px) {
  .our-integrated{
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (max-width: 768px) {
  .our-integrated .ipadborder{
    border-right: none;
  }
  .our-integrated  .ipadborderb{
    border-bottom: none;
  }
  .our-integrated .ipadrightb{
    border-right: 1px solid!important;
  }
  .our-integrated .row > .col-6:nth-last-child(n+3) .border-cell{
    border-bottom: 1px solid;
  }
  }
@media (max-width: 576px) {
  .our-integrated .mborder{
   border-right: none!important;
  }
  .our-integrated .row > .col-6:nth-last-child(n+3) .border-cell {
    border-bottom: 1px solid;
  }
  .our-integrated{
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .our-integrated h3{
    font-size: 32px;
    line-height: 45px;
  }
}
/* our-integrated end*/
/*get in touch now start*/


.getintouch .custom-textarea-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  font-family: 'inter';
  margin-bottom: 22px;
}

.footer-logo-img img{
  max-width: 180px;
}
/* Label */
.getintouch .custom-textarea-wrapper label {
  font-size: 14px;
  font-weight: 600;
  color: #333;
}

/* Textarea styling */
.getintouch .custom-textarea {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #D1D5DB;
  font-size: 14px;
  background: #fff;
  resize: none;
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

/* Placeholder */
.getintouch .custom-textarea::placeholder {
    font-size: 16px;
    font-weight: 300;
    color: #999999;
    font-family: 'inter';
}

/* Focus state */
.custom-textarea:focus {
  border-color: #FFD11A;
  box-shadow: none;
  outline: none;
}

.getintouch{
   background: #FBFBFB;
   padding-top: 128px;
   padding-bottom: 128px;
 }
.getintouch-wrapper{
  max-width: 930px;
  margin: 0 auto;
}
 
.getintouch .form-layout{
  background-color: #FFFFFF;
  padding: 40px;
  position: relative;
  border: 1px solid transparent;
  }
.getintouch .bg-radialgradient {
  position: absolute;
  top: -20px;
  left: -20px;
  right: -20px;
  bottom: -20px;
  z-index: -1;
  background: radial-gradient(100% 284.13% at 0% 93.46%, #FFFFFF 0%, #F2C440 61.61%);
  backdrop-filter: blur(112.6500015258789px)
}
.getintouch .form-layout .right-border {
  content: "";
  position: absolute;
  top: -50px;
  right: 0;
  width: 1px;
  height: 130%;
  background: linear-gradient(
    180deg,
    rgba(242, 196, 64, 0) 0%,
    #F2C440 22.12%,
    rgba(21, 43, 121, 0.44) 75%,
    rgba(21, 43, 121, 0) 97.6%
  );
}
.getintouch .form-layout .left-border {
  content: "";
  position: absolute;
  top: -50px;
  left: 0;
  width: 1px;
  height: 130%;
  background: linear-gradient(
    180deg,
    rgba(242, 196, 64, 0) 0%,
    #F2C440 22.12%,
    rgba(21, 43, 121, 0.42) 75%,
    rgba(21, 43, 121, 0) 97.6%
  );
}
.getintouch .form-layout .top-border {
  content: "";
  position: absolute;
  top: 0;
  left:-60px;
  height: 1px;
  width: 120%;
  background: linear-gradient(
    90deg,
    rgba(242, 196, 64, 0) 0%,
    #F2C440 22.12%,
    rgba(21, 43, 121, 0.42) 75%,
    rgba(21, 43, 121, 0) 97.6%
  );
}
.getintouch .form-layout .bottom-border {
  content: "";
  position: absolute;
  bottom: 0;
  left:-60px;
  height: 1px;
  width: 120%;
  background: linear-gradient(
    90deg,
    rgba(242, 196, 64, 0) 0%,
    #F2C440 22.12%,
    rgba(21, 43, 121, 0.41) 75%,
    rgba(21, 43, 121, 0) 97.6%
  );
}
.getintouch .form-layout .form-control{
  height: 56px;
  border: 1px solid #D1D5DB;
  border-radius: 8px;
  padding: 18px 17px 18px 17px;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-normal); 
}
.getintouch .form-layout .form-control, .getintouch .form-layout .form-select{
  box-shadow: none;
}
.getintouch .form-layout .form-control::placeholder{
  color: #999999;
  opacity: 1;
}
.getintouch .form-layout .form-label{
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: #2D3139;
  text-transform: uppercase;
  letter-spacing: 1.28px;
  line-height: 24px;
}
.getintouch .form-layout .form-select{
  height: 52px  ;
  color: #999999;
}
.getintouch .form-layout .btn-primary{
  background: linear-gradient(180deg, #000000 -0.23%, #000000 99.77%);
  border: 3px solid #F0F0F0;
  border-radius: 10px;
  height: 53px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal); 
  color: #FFFFFF;
}
@media (max-width: 1024px) {
  .getintouch{
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (max-width: 768px) {
  .getintouch .form-layout .top-border, .getintouch .form-layout .bottom-border{
    left: 0px;
    width: 100%;
  }
}
@media (max-width: 576px) {
  .getintouch .form-layout{
    border: 0.5px solid  #CDD2D7;
    border-radius:16px;
    padding: 16px;
  }
  .getintouch{
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .getintouch .form-layout .right-border,  .getintouch .form-layout .left-border, .getintouch .form-layout .top-border, .getintouch .form-layout .bottom-border,  .getintouch .bg-radialgradient{
    display: none;
  }
}
/*get in touch now end*/
/*consulting start*/
.consulting{
  padding-top: 96px;
  padding-bottom: 96px;
}

.consulting .consulting-wrapper{
  max-width: 1160px;
  margin: 0 auto;
}

.consulting .card-content{
  padding: 24px;
  margin-left: 16px;
  margin-right: 16px;
  background: linear-gradient(
    255deg, #F3F3F6 -46.28%, #FFFFFF 25.73%);
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  position: relative;
  margin-top: -65px;
  overflow: hidden;
  height: 180px;
  border:none;
  transition: all 0.5s ease-in-out;
  }

  .consulting .card-content:hover{
    box-shadow: 0px -6px 14px rgb(0 0 0 / 8%);
    transition: all 0.5s ease-in-out;
  }

.consulting .card-content::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, #1C379C 0%, #FFD11A 100%);
  border-radius: 12px 12px 0 0;
  transition: all 0.5s ease-in-out;
}
 .consulting .card-content h4{
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold); 
  color: #000000;
}
 .consulting .card-content p{
  font-size: var(--font-size-sm);
  color:#67748A;
  margin-bottom: 0px;
}
 .consulting .explore-btn{
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-normal); 
  color: #000000;
  opacity: 0;
  transform: translateY(30px);
  display: inline-flex;
  align-items: center;
  pointer-events: none;
  transition: all 0.8s ease-in-out;
}
.card-content:hover .explore-btn {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition: all 0.5s ease-in-out;
}
.card-content:hover::after {
  height: 5px;
  transition: all 0.5s ease-in-out;
}
/* .card-content:hover{
  box-shadow: 0px -19px 20px 2px #00000014;
} */
@media (max-width: 1024px) {
  .consulting{
    padding-top: 80px;
    padding-bottom: 80px;
  }
   .consulting .card-content{
    margin-left:0px;
    margin-right:0px;
    border-width: 1px;
    border-style: solid;
    border-color: #CDD2D780;
    border-radius: 16px;
  }
}
@media (max-width: 768px) {
  .consulting .explore-btn{
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 576px) {
  .consulting{
    padding-top: 48px;
    padding-bottom: 0px;
  }
 .consulting .card-content{
    margin-left: 8px;
    margin-right: 8px;
}
}
/*consulting end*/


/*FAQs CSS*/

.faq-section {
  background-color: #FBFBFB;
  text-align: center;
  padding: 60px 0;
}

.faq-section .faq-subtitle p {
  color: #FFD11A;
  font-weight: 700;
  font-size: 20px;
  line-height: 20px;
  font-family: 'Inter';
  margin-bottom: 8px;
}

.faq-section .faq-subtitle h2 {
  color: #2D3139;
  font-weight: 600;
  font-size: 48px;
  font-family: 'Inter';
}

.faq-section .faq-sub-para p { 
  font-weight: 300;
  font-size: 16px;
  font-family: 'Inter', sans-serif;
  line-height: 26px;
  color: #454545;
  margin-top: 16px;
}

.faq-section .accordion-button {
  font-weight: 500;
  font-size: 16px;
  font-family: 'inter';
  position: relative;
  color: #3A404A;
  background-color: #fff;
  box-shadow: none;
  border-radius: 8px;
  transition: all 0.4s ease-in-out;
}

.faq-section .accordion-button:not(.collapsed) {
  color: #000000;
  font-size: 16px;
  font-weight: 500;
  background-color: #fff !important;
  box-shadow: none !important;
  transition: all 0.3s ease-in-out;
}
.faq-section .accordion-button::after {
  flex-shrink: 0;
  content: "";
  background-image: url('https://d24group.com/wp-content/uploads/2025/09/icon-1.svg');
  background-size: 16px 16px;
  background-repeat: no-repeat;
  transition: all 0.3s ease-in-out;
  transform: none !important;
}

.faq-section .accordion-button:not(.collapsed)::after {
  flex-shrink: 0;
  background-image: url('https://d24group.com/wp-content/uploads/2025/09/icon-2.svg');
  transform:none !important;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  transition: all 0.3s ease-in-out;
}
/* Gradient background only when expanded */
.faq-section .accordion-button:not(.collapsed)::before {
  content: "";
  position: absolute;
  right: 10px;   /* adjust to position behind icon */
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: radial-gradient(285.11% 100.42% at 0% 93.46%, rgba(19, 180, 248, 0.40) 0%, rgba(146, 235, 190, 0.40) 33.98%, rgba(242, 196, 64, 0.40) 61.61%);
filter: blur(56.32257843017578px);
  z-index: 1; /* keep behind icon */
  transition: all 0.6s ease-in-out;
}

/* Accordion body */
.faq-section .accordion-body {
  text-align: start;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #67748A;
  padding: 10px 20px;
  padding-top: 0px;
  transition: all 0.3s ease-in-out;
}

.faq-section .accordion-body p {
  max-width: 704px;
  font-size: 14px;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: #67748A;
  margin-bottom: 0px;
}

/* Accordion item */
.faq-section .accordion-item {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  margin-bottom: 15px;
  overflow: hidden;
}

/* Remove focus outline */
.faq-section .accordion-button:focus {
  border: none !important;
  box-shadow: none !important;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .faq-section .faq-subtitle h2 {
    font-size: 32px;
  }
  .faq-section .faq-subtitle p {
    font-size: 20px;
  }
  .faq-section .faq-sub-para p {
    font-size: 16px;
        font-family: 'Inter';
        font-weight: 300;
  }
  .faq-section .accordion-button:not(.collapsed){
    font-weight: 500;
    font-size: 16px;
    font-family: 'Noto Sans';
    color: #3A404A;
    background-color: #fff;
    box-shadow: none;
    border-radius: 10px;
    transition: all 0.3s ease-in-out;

  } 
  .faq-section .accordion-button {
    font-weight: 400;
    font-size: 16px;
    font-family: 'Noto Sans';
    color: #3A404A;
    background-color: #fff;
    box-shadow: none;
    border-radius: 10px;
    transition: all 0.3s ease-in-out;
}
}

/* home page media query */

/* Small devices (landscape phones, <768px) */
@media (max-width: 767.98px) {  
  .section-banner .left-content{
    margin-top: 31px;
    align-items: flex-start;
    justify-content: unset;
    min-height: 440px;
  }
  .section-banner::before{
    display: none;
  }
  .section-banner .demo-button{
    padding: 10px 15px;
  }
  .banner-image-for-mobile-view{
    margin: 26px 0px 0px;
  }
  .banner-image-for-mobile-view img{
    width: 100%;
  }
  .logo-text-box{
    flex: 0 0 40%;
    max-width: 40%;
  }
  .logo-logos-box {
    flex: 0 0 80%;
    max-width: 80%;
}
.section-banner .logo-strip-text span{
  padding-right: 0;
}
.mobile-view-strip-hide{
  background: #010101;
  padding: 12px;
}
.section-banner::after{
  background-size: inherit !important;
}
.left-content h1{
  max-width: 100% !important;
}
.section-banner::after{
  display: none
}

.mobile-view-strip-hide p{
  line-height: normal;
    margin-bottom: 0;
    font-size: 10px;
    position: relative;
}
.section-banner p{
  width: 100%;
  max-width: 100% !important;
}

.mobile-view-strip-hide span{
  position: absolute;
  margin-bottom: 0;
  top: 0;
  right: -9px;
}
.mobile-view-strip-hide .logo-text-box{
  flex: 0 0 28%;
  max-width: 28%;
  margin-right: 10px;
}

.left-content-wrapper{
  padding-right: 0;
}
.feature-card strong {
  font-size: 14px !important;
}

.features-wrapper .compare-content{
  padding: 2px;
}
.feature-card p{
  font-size: 14px;
}
.feature-card span{
  font-size: 12px;
}
.features-wrapper .compare-content tbody th{
  font-size: 12px;
}
.features-wrapper .compare-content thead th{
  padding: 0px 3px;
  font-weight: 400;
  font-size: 13px;
}
.MT5-Platform .text-center img{
  padding: 0px 0px 0px;
}
.crypto-trading-section .box-wrap:first-child{
  width: 100% !important;
  max-width: 100% !important;
}
.crypto-trading-section{
  padding-bottom: 0px !important;
}
.crypto-trading-section .box-wrap:last-child{
  width: 100% !important;
  max-width: 100% !important;
}
.crypto-trading-section .features-list{
  height: 300px;
}
.our-discover-products{
  padding: 0px 0px 60px;
}

.custom-tabs .nav-tabs {
  overflow-x: auto;
  overflow-y: hidden;
  flex-wrap: nowrap;         /* Prevent wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
}

.custom-tabs .nav-item {
  flex: 0 0 auto;            /* Keep items side by side */
}
.our-discover-products .custom-list{
  margin-bottom: 40px;
}

.custom-tabs .nav-link {
  white-space: nowrap;       /* Prevent text wrapping */
}
.our-discover-products .image-container img {
  position: relative;
  margin: 44px 0px 0px !important;
}

.our-discover-products .image-badge-2 .badge-text{
  top: 70%;
}
.solution-card{
  margin-bottom: 28px;
}


.our-discover-products .image-badge-2{
  right: 0;
}

.mobile-logo{
  width: 117px !important;
}
.main-header .btn-warning {
  padding: 4px 10px !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  transition: all 0.3s ease-in-out;
}


.trading-infrastructure-section .features-wrapper{
  max-width: 100%;
}
.trading-infrastructure-section .feature-card{
  margin: 0px 5px !important;
}
.features-wrapper .right-border,.features-wrapper .left-border, .features-wrapper .top-border, .features-wrapper .bottom-border{
  display: none !important;
}
.custom-container-header{
  padding-left: 10px !important;
        padding-right: 10px !important;
}
.mobile-logo{
  width: 116px;
}
#highlights {
  margin: 0px 0px !important;
}
.crypto-trading-section .btn.try-free-demo-btn{
  margin-bottom: 0 !important;
}
.section-banner .logo-track {
  display: inline-flex;
  align-items: center;
  gap: 60px;
  animation: scroll 55s linear infinite;
}
.section-banner .demo-button span{
  font-size: 12px !important;
}
}

/* Medium devices (tablets, <992px) */
@media (max-width: 991.98px) { 
  .custom-container-header{
    padding-left: 16px;
    padding-right: 16px;
  }
  .light-shadow::after{
    display: none;
  }
  .trading-infrastructure-section .title-wrapper-max-width{
    max-width: 100%;
  }
  h1{
    font-size: 32px !important;
  }
  .section-banner .demo-button{
    padding: 10px 9px;
  }
  .section-banner .demo-button span{
    font-size: 9px;
    
  }
  .mobile-logo{
    width: auto;
  }
  .main-header .btn-warning {
    padding: 6px 14px ;
    border-radius: 4px ;
    font-size: 12px ;
    margin-right: 10px;
  }
  /* .section-banner::before{
    height: 316px !important;
    right: -175px !important;
    top: 115px !important;
  } */
  .left-content h1{
    max-width: 350px;
  }
  .section-banner p{
    max-width: 300px;
  }
  .logo-text-box{
    flex: 0 0 18%;
    max-width: 18%;
  }
  .btn.try-free-demo-btn{
    margin-bottom: 50px;
  }
              
.comman-title{
  font-size: 32px !important;
}

.comman-title span{
  font-size: 32px !important;
}

.comman-title-description{
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  font-family: var(--font-primary);
  color: #454545;
  margin-bottom: 16px;
}

.trading-infrastructure-section .features-wrapper{
  width: 674px;
  margin: 0 auto;
}
.trading-infrastructure-section  .feature-card{
  margin: 0px 0px;
}

.features-box{
  padding: 0px 0px 0px 0px;
  min-height: 530px;

}
.features-wrapper .right-border,.features-wrapper .left-border, .features-wrapper .top-border, .features-wrapper .bottom-border{
  display: block;
}
.features-wrapper .top-border{
  width: 100%;
}
.features-wrapper .bottom-border{
  width: 100%;
}

#highlights {
  margin: 0px 36px;
}

.features-box::after{
  top:-73px !important;
  height: 660px;
}
.feature-card{
  min-height: unset;
  padding: 8px;
}
#infraTabs{
  top:-24px !important;
}
.trading-infrastructure-section{
  padding: 40px 0;
}
.crypto-trading-section .box-wrap:first-child{
  width: 100% !important;
  max-width: 100% !important;
}
.crypto-trading-section{
  padding-bottom: 50px !important;
}
.crypto-trading-section .box-wrap:last-child{
  width: 100% !important;
  max-width: 100% !important;
}
.our-discover-products .custom-tabs .nav-link{
  font-size: 13px;
  padding: 0.75rem 0rem;
  margin: 0px 12px;
}

.our-discover-products .image-container img{
  width: 100%;
}
.our-discover-products .image-badge-2{
  right: 0;
}
.explore-btn{
  opacity: 1;
  transform: translateY(0px);
}
.future-ready-btn .btn.try-free-demo-btn{
  margin-bottom: 10px;
}
.getintouch .form-layout .top-border{
  width: 100% !important;
}
.getintouch .form-layout .bottom-border{
  width: 100% !important;
}
.MT5-Platform .text-wrapper h6{
  margin-top: 0;
}
 }

 @media (min-width: 992px) and (max-width: 1199px) {
  .comman-title{
    font-size: 32px !important;
  }
  .comman-title span{
    font-size: 32px !important;
  }
  .section-banner::before{
    height: 300px !important;
    top: 100px !important;
    right: -42px !important;
  }
  h1{
    font-size: 32px !important;
  }
  .section-banner{
    min-height: 450px;
  }
  .section-banner .left-content{
    min-height: 450px;
  }
  .logo-text-box{
    flex: 0 0 30%;
    max-width: 30%;
  }
  .MT5-Platform .text-wrapper h6{
    margin-top: 0;
  }
  .section-banner::before{
    height: 350px !important;
    top: 100px !important;
    right: -42px !important;
  }
  .left-content h1{
    max-width: 480px;
  }
  .features-wrapper .compare-content table>:not(caption)>*>*{
    padding-top: 8px;
    padding-bottom: 8px;
  }
 }


 @media (min-width: 1199px) and (max-width: 1399px){
  /* .section-banner::before{
    height: 350px !important;
    top: 100px !important;
    right: -42px !important;
  } */
  .left-content h1{
    max-width: 480px;
  }
  .section-banner p{
    max-width: 460px;
  }
  /* .logo-text-box {
    flex: 0 0 26%;
    max-width: 26%;
  } */
  .section-banner p{
    max-width: 350px;
  }
  .features-box{
    padding: 30px 12px;
  }
  .features-wrapper .compare-content table>:not(caption)>*>*{
    padding-top: 13px;
    padding-bottom: 13px;
  }
 }


/* @media (min-width: 1399px) and (max-width: 1490px) { 
  .section-banner::before{
    height: 450px !important;
    right: -80px !important;
  }
 } */


 /* @media (max-width: 1499px){
  .section-banner::before{
    height: 440px !important;
  }
 } */

/* Large devices (desktops, <1200px) */
@media (max-width: 1199.98px) {
  .custom-container-header{
    padding-left: 40px;
    padding-right: 40px;
  }
  
.comman-title{
  font-size: 42px;
}

.comman-title span{
  font-size: 42px;
}

.comman-title-description{
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  font-family: var(--font-primary);
  color: #454545;
  margin-bottom: 16px;
}
.feature-card{
  padding: 8px 8px;
}
.features-box{
  padding: 30px 10px;
}
.feature-card p{
  font-size: 14px;
}
.feature-card span{
  font-size: 12px;
}

}



