/* =========================================
   BROKERS TOP — FINTECH DARK THEME
   =========================================
   Premium dark navy / glassmorphism design
   Overrides the Forexy template palette
   ========================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400&display=swap');

/* ─────────────────────────────────────────
   ROOT VARIABLE OVERRIDE
   Remaps every original template token to
   the fintech navy/cyan palette so all
   selectors using var(--theme-colorX) etc.
   automatically inherit the new colors.
───────────────────────────────────────── */
:root {
  /* ── Fintech palette tokens ── */
  --ft-navy:           #0B1F2A;
  --ft-navy-mid:       #0F2535;
  --ft-navy-card:      #112230;
  --ft-navy-deep:      #071520;
  --ft-accent:         #3FD1FF;
  --ft-accent-dim:     rgba(63, 209, 255, 0.15);
  --ft-accent-border:  rgba(63, 209, 255, 0.18);
  --ft-text:           #FFFFFF;
  --ft-text-muted:     #8BA8BB;
  --ft-card-bg:        rgba(17, 34, 48, 0.75);
  --ft-card-shadow:    0 8px 40px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(63, 209, 255, 0.07) inset;
  --ft-radius-lg:      20px;
  --ft-radius-pill:    100px;

  /* ── Remap original Forexy variables ── */
  /* theme-color1 was lime #ddff93  → cyan accent */
  --theme-color1:      #3FD1FF;
  --theme-color1-rgb:  63, 209, 255;
  --theme-color1-text-color: #071520;

  /* theme-color2 was dark green #003f2f → navy (used as heading/bg base) */
  --theme-color2:      #0F2535;
  --theme-color2-rgb:  15, 37, 53;
  --theme-color2-text-color: #FFFFFF;

  /* theme-color3 was teal #018599 → mid blue */
  --theme-color3:      #1a90d4;
  --theme-color3-rgb:  26, 144, 212;
  --theme-color3-text-color: #FFFFFF;

  /* theme-color4 was muted green-gray #a0b1ac → muted blue */
  --theme-color4:      #8BA8BB;
  --theme-color4-rgb:  139, 168, 187;

  /* theme-color5 was light gray #f1f3f3 → dark card bg */
  --theme-color5:      #112230;
  --theme-color5-rgb:  17, 34, 48;

  /* theme-color6 was bright green #45DA00 → cyan */
  --theme-color6:      #3FD1FF;

  /* ── Semantic tokens ── */
  --text-color:                    #8BA8BB;     /* was green-gray #62736f */
  --gray-color:                    rgba(63, 209, 255, 0.12);
  --headings-color:                #FFFFFF;     /* was var(--theme-color2) = dark green */
  --link-color:                    #3FD1FF;     /* was dark green */
  --link-hover-color:              #FFFFFF;     /* was lime */
  --gradient-1:                    linear-gradient(to right, #071520 0%, rgba(7, 21, 32, 0) 100%);
  --theme-light-background:        #112230;     /* was light gray #f1f3f3 */
  --theme-light-background-text-color: #FFFFFF;
  --theme-black:                   #071520;
  --theme-white-bg:                #0F2535;     /* was white — now dark card bg */
  --sec-title-subtitle-color:      #3FD1FF;     /* was var(--text-color) = green-gray */
  --sec-title-color:               #FFFFFF;

  /* keep white tokens as white (used for button/icon text on dark bg) */
  --theme-color-white:             #FFFFFF;
  --theme-color-white-rgb:         255, 255, 255;
  --theme-color-light:             #FFFFFF;
  --theme-color-dark:              #071520;
}

/* ─────────────────────────────────────────
   INLINE SVG ICONS (.si)
   Replaces Font Awesome — self-contained,
   no CDN dependency, no 404s
───────────────────────────────────────── */
.si {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  overflow: visible;
  flex-shrink: 0;
}
.si-lg {
  width: 1.75em;
  height: 1.75em;
  vertical-align: -0.35em;
}
.si-2x {
  width: 2em;
  height: 2em;
  vertical-align: -0.4em;
}
/* Star ratings (Unicode ★★★★★ text) */
.banner-rating,
.testimonial-block .rating {
  color: #FFCF40;
  font-size: 14px;
  letter-spacing: 2px;
  display: inline-flex;
  align-items: center;
  gap: 1px;
}
/* Social icon sizing in footer / mobile */
.footer_socials .si,
.social-links .si {
  width: 1em;
  height: 1em;
}


*,
body,
.page-wrapper {
  font-family: 'Inter', sans-serif !important;
}

body,
.page-wrapper {
  background-color: var(--ft-navy) !important;
  color: var(--ft-text-muted) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', sans-serif !important;
  color: var(--ft-text) !important;
}

h1 { font-weight: 800 !important; letter-spacing: -0.03em !important; }
h2 { font-weight: 700 !important; letter-spacing: -0.03em !important; }
h3 { font-weight: 700 !important; letter-spacing: -0.02em !important; }
h4 { font-weight: 700 !important; }
h5 { font-weight: 600 !important; }
h6 { font-weight: 600 !important; }

p, .text, li, span {
  font-family: 'Inter', sans-serif !important;
}

a {
  color: var(--ft-accent) !important;
  transition: color 0.2s ease !important;
}
a:hover { color: #fff !important; }

/* ─────────────────────────────────────────
   SECTION TITLES
───────────────────────────────────────── */
.sec-title .sub-title,
.sec-title .sub-title.style-three,
.sub-title {
  color: var(--ft-accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
  font-family: 'Inter', sans-serif !important;
}

.sec-title h2,
.sec-title h3 {
  color: var(--ft-text) !important;
  text-shadow: 0 0 60px rgba(63, 209, 255, 0.12) !important;
}

.sec-title .text {
  color: var(--ft-text-muted) !important;
}

/* ─────────────────────────────────────────
   BUTTONS — Pill shaped with glow
───────────────────────────────────────── */
.theme-btn {
  border-radius: var(--ft-radius-pill) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  transition: all 0.3s ease !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
}

.theme-btn .btn-title {
  font-family: 'Inter', sans-serif !important;
}

/* Primary button */
.theme-btn.btn-style-one,
.theme-btn.btn-style-four {
  background: linear-gradient(135deg, var(--ft-accent) 0%, #1a90d4 100%) !important;
  color: var(--ft-navy-deep) !important;
  border: none !important;
  padding: 14px 34px !important;
  box-shadow: 0 4px 20px rgba(63, 209, 255, 0.35) !important;
}
.theme-btn.btn-style-one:hover,
.theme-btn.btn-style-four:hover {
  box-shadow: 0 8px 36px rgba(63, 209, 255, 0.55) !important;
  transform: translateY(-2px) !important;
  color: var(--ft-navy-deep) !important;
}
.theme-btn.btn-style-one .btn-title,
.theme-btn.btn-style-four .btn-title,
.theme-btn.btn-style-one .icon-left,
.theme-btn.btn-style-one .icon-right,
.theme-btn.btn-style-four .icon-left,
.theme-btn.btn-style-four .icon-right {
  color: var(--ft-navy-deep) !important;
}

/* Ghost / Outline button */
.theme-btn.btn-style-six {
  background: transparent !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: var(--ft-text) !important;
  border-radius: var(--ft-radius-pill) !important;
  padding: 12px 28px !important;
}
.theme-btn.btn-style-six:hover {
  background: var(--ft-accent-dim) !important;
  border-color: var(--ft-accent) !important;
  color: var(--ft-accent) !important;
}

/* Crypto / Market card button */
.theme-btn.btn-style-eight {
  background: transparent !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: var(--ft-accent) !important;
  padding: 8px 22px !important;
  font-size: 11px !important;
  border-radius: var(--ft-radius-pill) !important;
}
.theme-btn.btn-style-eight:hover {
  background: var(--ft-accent-dim) !important;
  border-color: var(--ft-accent) !important;
}
.theme-btn.btn-style-eight .btn-title {
  color: var(--ft-accent) !important;
}

/* Text link button */
.theme-btn.btn-style-five {
  background: transparent !important;
  color: var(--ft-accent) !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  font-size: 12px !important;
}
.theme-btn.btn-style-five:hover {
  color: #fff !important;
}
.theme-btn.btn-style-five .btn-title { color: inherit !important; }

/* ─────────────────────────────────────────
   MAIN HEADER — Glassmorphism
───────────────────────────────────────── */
.main-header,
.main-header.fixed-header {
  background: rgba(7, 21, 32, 0.85) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid rgba(63, 209, 255, 0.08) !important;
  box-shadow: 0 4px 40px rgba(0, 0, 0, 0.4) !important;
}

.main-header .navigation > li > a,
.main-header .main-menu .navigation > li > a {
  color: rgba(255, 255, 255, 0.75) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0.01em !important;
}
.main-header .navigation > li > a:hover,
.main-header .navigation > li.current > a {
  color: var(--ft-accent) !important;
}

.main-header .header-lower {
  background: transparent !important;
}

/* Sticky header */
.sticky-header,
.sticky-header.fixed-header {
  background: rgba(7, 21, 32, 0.97) !important;
  backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid rgba(63, 209, 255, 0.1) !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5) !important;
}

/* Nav toggler / hamburger */
.mobile-nav-toggler .icon,
.mobile-nav-toggler span {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* ─────────────────────────────────────────
   BANNER SECTION
───────────────────────────────────────── */
.banner-section {
  background: linear-gradient(145deg, var(--ft-navy-deep) 0%, var(--ft-navy) 50%, var(--ft-navy-mid) 100%) !important;
  position: relative;
  overflow: hidden;
}

/* Ambient glow behind hero */
.banner-section::before {
  content: '';
  position: absolute;
  top: -10%;
  left: 50%;
  transform: translateX(-50%);
  width: 900px;
  height: 600px;
  background: radial-gradient(ellipse at center, rgba(63, 209, 255, 0.07) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}

.banner-section .inner-container {
  position: relative;
  z-index: 1;
}

/* Hero title — big glow text */
.banner-section .title,
.banner-slide .title {
  font-size: clamp(40px, 5.5vw, 75px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  color: #fff !important;
  text-shadow: 0 0 80px rgba(63, 209, 255, 0.18) !important;
  letter-spacing: -0.03em !important;
  font-family: 'Inter', sans-serif !important;
}

.banner-section .title span,
.banner-slide .title span {
  color: var(--ft-accent) !important;
  text-shadow: 0 0 50px rgba(63, 209, 255, 0.45) !important;
}

.banner-section > * .text,
.banner-slide .text {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}

/* Banner info pill (top bar) */
.banner-info {
  background: rgba(17, 34, 48, 0.65) !important;
  border: 1px solid var(--ft-accent-border) !important;
  backdrop-filter: blur(12px) !important;
  border-radius: 50px !important;
}
.banner-info .text,
.banner-info .left-box .text {
  color: rgba(255, 255, 255, 0.75) !important;
}
.banner-info .right-box {
  color: #fff !important;
}
.banner-info .banner-rating .fa-star {
  color: #FFCF40 !important;
}
.banner-info .right-box i {
  color: var(--ft-text-muted) !important;
  font-size: 12px !important;
}

/* Rotating ring */
.text-circle-box .outer-circle {
  border-color: var(--ft-accent-border) !important;
  background: rgba(17, 34, 48, 0.8) !important;
  box-shadow: 0 0 60px rgba(63, 209, 255, 0.15), inset 0 0 40px rgba(63, 209, 255, 0.04) !important;
}
.text-circle-box svg text,
.text-circle-box svg textPath,
.text-circle-box svg textpath {
  fill: rgba(63, 209, 255, 0.7) !important;
  font-size: 14px !important;
  letter-spacing: 5px !important;
}
.text-circle-box .center-icon {
  color: var(--ft-accent) !important;
  background: rgba(17, 34, 48, 0.6) !important;
  border-radius: 50% !important;
  padding: 6px !important;
}
/* Company logo inside rotating ring */
.text-circle-box .center-icon .circle-logo {
  width: 48px;
  height: 48px;
  object-fit: contain;
  display: block;
  filter: brightness(0) invert(1);
}

/* Banner nav arrows */
.nav-box .swiper-button-prev,
.nav-box .swiper-button-next {
  background: rgba(17, 34, 48, 0.8) !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: var(--ft-accent) !important;
  border-radius: 50% !important;
}
.nav-box .swiper-button-prev .icon,
.nav-box .swiper-button-next .icon {
  color: var(--ft-accent) !important;
}

/* Bottom stat box */
.banner-section .bottom-box {
  background: rgba(17, 34, 48, 0.75) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(12px) !important;
}
.banner-section .bottom-box .totals {
  color: var(--ft-accent) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
}
.banner-section .bottom-box .text {
  color: var(--ft-text-muted) !important;
}

/* ─────────────────────────────────────────
   ABOUT SECTION
───────────────────────────────────────── */
.about-section {
  background: var(--ft-navy-deep) !important;
}

.about-section .title_box {
  background: linear-gradient(180deg, var(--ft-navy-deep) 0%, var(--ft-navy-mid) 100%) !important;
}

.about-section .sec-title.light h2 {
  color: #fff !important;
  text-shadow: 0 0 60px rgba(63, 209, 255, 0.12) !important;
}

.about-section .sec-title.light .sub-title {
  color: var(--ft-accent) !important;
}

/* Circle border on about image */
.about-section .circle-border,
.image-column .circle-border {
  border-color: var(--ft-accent) !important;
  box-shadow: 0 0 30px rgba(63, 209, 255, 0.2), 0 0 60px rgba(63, 209, 255, 0.08) !important;
}

.about-one_text {
  color: var(--ft-text-muted) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  margin-bottom: 20px !important;
}

/* Right column inner padding for about section */
.about-section .col-lg-7 .inner-column {
  padding-left: 20px;
}
@media (max-width: 991.98px) {
  .about-section .col-lg-7 .inner-column {
    padding-left: 0;
    margin-top: 30px;
  }
}

/* Bulleted lists */
.list-style-two li {
  color: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(63, 209, 255, 0.08) !important;
  font-family: 'Inter', sans-serif !important;
}
.list-style-two li .fa-check,
.list-style-two li i {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   INVESTOR PROFILE CARDS (About sidebar)
───────────────────────────────────────── */
.investor-profile-cards {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
/* 2-column grid when inside content column */
.investor-profile-cards.ipc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 0;
  margin-bottom: 0;
}
@media (max-width: 575.98px) {
  .investor-profile-cards.ipc-grid {
    grid-template-columns: 1fr;
  }
}
.investor-profile-cards li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(63,209,255,0.12);
  border-radius: 14px;
  backdrop-filter: blur(10px);
  transition: border-color 0.25s, background 0.25s, transform 0.2s;
}
.investor-profile-cards li:hover {
  background: rgba(63,209,255,0.07);
  border-color: rgba(63,209,255,0.35);
  transform: translateX(4px);
}
.ipc-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(63,209,255,0.1);
  border: 1px solid rgba(63,209,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ft-accent);
  font-size: 18px;
}
.ipc-icon .si {
  width: 18px;
  height: 18px;
}
.ipc-body {
  min-width: 0;
}
.ipc-label {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ipc-desc {
  font-size: 11.5px;
  color: rgba(255,255,255,0.50);
  margin-top: 2px;
  line-height: 1.4;
}
/* Gold card accent */
.ipc-gold {
  border-color: rgba(255,207,64,0.25) !important;
  background: rgba(255,207,64,0.05) !important;
}
.ipc-gold:hover {
  background: rgba(255,207,64,0.1) !important;
  border-color: rgba(255,207,64,0.5) !important;
}
.ipc-gold .ipc-icon {
  background: rgba(255,207,64,0.12);
  border-color: rgba(255,207,64,0.3);
  color: #FFCF40;
}
.ipc-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 20px;
  background: rgba(255,207,64,0.15);
  color: #FFCF40;
  border: 1px solid rgba(255,207,64,0.3);
  letter-spacing: 0.3px;
}

.list-style-three {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: var(--ft-card-shadow) !important;
}
.list-style-three li {
  color: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(63, 209, 255, 0.08) !important;
}
.list-style-three li .fa-check,
.list-style-three li i {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   FUNFACT / COUNTERS
───────────────────────────────────────── */
.funfact-section {
  background: linear-gradient(180deg, var(--ft-navy-mid) 0%, #0A1C28 100%) !important;
  position: relative;
}
.funfact-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(63, 209, 255, 0.06) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.funfact-section .auto-container {
  position: relative;
  z-index: 1;
}

/* Fix: style.css uses theme-color1 (now cyan) as bg — override everything */
.funfact-section .inner-container {
  background: transparent !important;
  border-radius: 0 !important;
  padding-top: 40px !important;
  padding-bottom: 50px !important;
}

/* Title — was dark-on-cyan (invisible). Now: white heading with cyan accent */
.funfact-section .funfact-title,
.funfact-title {
  background: none !important;
  background-color: transparent !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  letter-spacing: -0.5px !important;
  text-transform: none !important;
  padding: 0 0 14px !important;
  margin: 0 0 40px !important;
  display: block !important;
  border-bottom: 2px solid rgba(63, 209, 255, 0.2) !important;
  border-radius: 0 !important;
}
.funfact-section .funfact-title::after {
  content: '';
  display: block;
  width: 48px;
  height: 3px;
  background: var(--ft-accent);
  border-radius: 2px;
  margin-top: 10px;
}

.counter-block .inner-box {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(63, 209, 255, 0.12) !important;
  border-radius: 18px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3) !important;
  padding: 28px 24px 22px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
}
.counter-block .inner-box:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(63, 209, 255, 0.35) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 40px rgba(63,209,255,0.1) !important;
}
/* Icon */
.counter-block .icon-box {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(63,209,255,0.1);
  border: 1px solid rgba(63,209,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  color: var(--ft-accent);
}
.counter-block .icon-box .si {
  width: 20px !important;
  height: 20px !important;
}
/* Number */
.counter-block .count-box,
.counter-block .count-text {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 40px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -1px !important;
}
/* Label */
.counter-block .text {
  color: rgba(255,255,255,0.55) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.counter-block .text .si {
  color: var(--ft-accent) !important;
  width: 12px !important;
  height: 12px !important;
  flex-shrink: 0;
}

/* ─────────────────────────────────────────
   CRYPTO / MARKET SECTION
───────────────────────────────────────── */
.market-section {
  background: linear-gradient(180deg, #0A1C28 0%, var(--ft-navy) 100%) !important;
  position: relative;
}
.market-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 30%, rgba(63, 209, 255, 0.05) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}
.market-section .auto-container,
.market-section .sec-title {
  position: relative;
  z-index: 1;
}

/* ─── LIVE CRYPTO DASHBOARD ─── */
.crypto-dashboard {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(63,209,255,0.15);
  border-radius: 20px;
  backdrop-filter: blur(18px);
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.05);
  max-width: 980px;
  margin: 0 auto;
}

/* Top bar */
.cd-topbar {
  background: rgba(63,209,255,0.04);
  border-bottom: 1px solid rgba(63,209,255,0.1);
  padding: 18px 28px 0;
}
.cd-topbar-left {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
.cd-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(63,209,255,0.1);
  border: 1px solid rgba(63,209,255,0.3);
  border-radius: 20px;
  padding: 5px 14px;
  font-size: 11px;
  font-weight: 700;
  color: var(--ft-accent);
  letter-spacing: 2px;
}
.cd-pulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ft-accent);
  display: inline-block;
  animation: cd-pulse-anim 1.4s ease infinite;
  box-shadow: 0 0 6px var(--ft-accent);
}
@keyframes cd-pulse-anim {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:0.35; transform:scale(0.65); }
}
.cd-subtitle {
  font-size: 11.5px;
  color: rgba(255,255,255,0.3);
}
/* Column header */
.cd-header-cols {
  display: grid;
  grid-template-columns: 2.2fr 1.6fr 1fr 1.4fr 0.8fr;
  padding: 10px 0 10px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  border-top: 1px solid rgba(255,255,255,0.05);
}

/* Data rows */
.cd-row {
  display: grid;
  grid-template-columns: 2.2fr 1.6fr 1fr 1.4fr 0.8fr;
  align-items: center;
  padding: 15px 28px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.2s;
}
.cd-row:last-child { border-bottom: none; }
.cd-row:hover { background: rgba(63,209,255,0.035); }

@keyframes flash-up {
  0%   { background: transparent; }
  25%  { background: rgba(63,220,130,0.1); }
  100% { background: transparent; }
}
@keyframes flash-down {
  0%   { background: transparent; }
  25%  { background: rgba(255,80,80,0.08); }
  100% { background: transparent; }
}
.cd-row.flash-up   { animation: flash-up   0.5s ease; }
.cd-row.flash-down { animation: flash-down 0.5s ease; }

/* Asset column */
.c-asset { display: flex; align-items: center; gap: 12px; }
.cd-logo {
  width: 42px; height: 42px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; font-weight: 700;
  flex-shrink: 0;
}
.cd-logo.btc  { background:rgba(247,147,26,0.13); color:#F7931A; border:1px solid rgba(247,147,26,0.25); }
.cd-logo.eth  { background:rgba(98,126,234,0.13); color:#627EEA; border:1px solid rgba(98,126,234,0.25); }
.cd-logo.sol  { background:rgba(153,69,255,0.13); color:#9945FF; border:1px solid rgba(153,69,255,0.25); }
.cd-logo.xrp  { background:rgba(0,170,228,0.13);  color:#00AAE4; border:1px solid rgba(0,170,228,0.25); }
.cd-logo.doge { background:rgba(194,166,51,0.13);  color:#C2A633; border:1px solid rgba(194,166,51,0.25); }
.cd-name strong { display:block; font-size:14px; font-weight:600; color:#fff; }
.cd-name span   { font-size:11.5px; color:rgba(255,255,255,0.38); }

/* Price */
.c-price .cd-val {
  font-size:15px; font-weight:600; color:#fff;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.3px;
}

/* % badges */
.cd-pct {
  font-size:12.5px; font-weight:600;
  padding:4px 10px; border-radius:20px;
  display: inline-block;
}
.cd-pct.up   { background:rgba(63,220,130,0.1);  color:#3FDC82; border:1px solid rgba(63,220,130,0.22); }
.cd-pct.down { background:rgba(255,80,80,0.1);   color:#FF5050; border:1px solid rgba(255,80,80,0.22); }

/* Trend sparkline */
.c-trend canvas { display:block; }

/* Trade button */
.cd-btn {
  display:inline-block;
  padding:8px 18px;
  background:rgba(63,209,255,0.09);
  border:1px solid rgba(63,209,255,0.22);
  border-radius:9px;
  font-size:13px; font-weight:600;
  color:var(--ft-accent);
  text-decoration:none;
  transition:background 0.2s, border-color 0.2s, transform 0.15s;
  white-space:nowrap;
}
.cd-btn:hover {
  background:rgba(63,209,255,0.18);
  border-color:rgba(63,209,255,0.5);
  transform:translateY(-1px);
  color:var(--ft-accent);
}

/* Footer */
.cd-footer {
  display:flex; align-items:center; justify-content:space-between;
  padding:13px 28px;
  background:rgba(0,0,0,0.18);
  border-top:1px solid rgba(255,255,255,0.05);
  gap:16px; flex-wrap:wrap;
}
.cd-footer > span { font-size:10.5px; color:rgba(255,255,255,0.28); flex:1; }
.cd-cta-link {
  font-size:13px; font-weight:600; color:var(--ft-accent);
  text-decoration:none; display:flex; align-items:center;
  gap:6px; white-space:nowrap; transition:gap 0.2s;
}
.cd-cta-link:hover { gap:10px; color:var(--ft-accent); }
.cd-cta-link .si   { width:14px; height:14px; }

/* Responsive */
@media (max-width:767.98px) {
  .cd-header-cols { display:none; }
  .cd-topbar { padding:16px 16px 0; }
  .cd-row {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap:6px; padding:14px 16px;
  }
  .c-trend, .c-action { display:none; }
  .c-price { text-align:right; }
  .c-change { grid-column:1; }
  .cd-footer { padding:12px 16px; }
}

/* ─────────────────────────────────────────
   PLATFORM / SERVICES SECTION
───────────────────────────────────────── */
.platform-section {
  background: var(--ft-navy-deep) !important;
}

.platform-block_one-inner {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: var(--ft-card-shadow) !important;
  transition: transform 0.3s ease, border-color 0.3s ease !important;
}
.platform-block_one-inner:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(63, 209, 255, 0.3) !important;
}
.platform-block_one-inner .icon,
.platform-block_one-inner .icon i {
  color: var(--ft-accent) !important;
}
.platform-block_one-inner .icon {
  background: rgba(63, 209, 255, 0.1) !important;
  border-radius: 14px !important;
}
.platform-block_one h5.title,
.platform-block_one .title {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
}
.platform-block_one .text {
  color: var(--ft-text-muted) !important;
}
/* Protection guarantee checkmarks */
.platform-block_one-inner .fa-check {
  color: var(--ft-accent) !important;
}
.platform-block_one-inner li {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* Image overlay card */
.platform-section .guide-outer,
.platform-section .image .guide-outer {
  background: rgba(7, 21, 32, 0.82) !important;
  border: 1px solid var(--ft-accent-border) !important;
  backdrop-filter: blur(16px) !important;
  border-radius: var(--ft-radius-lg) !important;
}
.platform-section .guide-outer h4 {
  color: #fff !important;
}

/* ─────────────────────────────────────────
   STEPS / HOW IT WORKS
───────────────────────────────────────── */
.steps-section {
  background: linear-gradient(180deg, var(--ft-navy-deep) 0%, var(--ft-navy-mid) 100%) !important;
  position: relative;
}
.steps-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 75% 50%, rgba(63, 209, 255, 0.05) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.steps-section .auto-container {
  position: relative;
  z-index: 1;
}

.step-block_one .inner-box {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: var(--ft-card-shadow) !important;
}
.step-block_one.active .inner-box {
  border-color: rgba(63, 209, 255, 0.4) !important;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.4), 0 0 40px rgba(63, 209, 255, 0.12) !important;
}
.step-block_one .post-number span {
  color: rgba(63, 209, 255, 0.18) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 900 !important;
}
.step-block_one .icon,
.step-block_one .icon i {
  color: var(--ft-accent) !important;
}
.step-block_one h4.title a {
  color: #fff !important;
}
.step-block_one .text {
  color: var(--ft-text-muted) !important;
}
.step-block_one .content-box-hover {
  background: linear-gradient(135deg, rgba(63, 209, 255, 0.12) 0%, rgba(27, 143, 208, 0.08) 100%) !important;
  border-radius: var(--ft-radius-lg) !important;
}
.step-block_one .content-box-number {
  color: rgba(63, 209, 255, 0.07) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 900 !important;
}
.step-block_one .content-box-hover .title a {
  color: #fff !important;
}

/* Steps section title */
.steps-section .sec-title h2 {
  color: #fff !important;
}
.steps-section .sec-title .text {
  color: var(--ft-text-muted) !important;
}

/* ─────────────────────────────────────────
   TESTIMONIAL SECTION
───────────────────────────────────────── */
.testimonial-section {
  background: var(--ft-navy) !important;
}
.testimonial-section .testimonial-bg_color.bg {
  background: transparent !important;
}

.testimonial-block .inner-box {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: var(--ft-card-shadow) !important;
  transition: transform 0.3s ease !important;
}
.testimonial-block .inner-box:hover {
  transform: translateY(-4px) !important;
}
.testimonial-block .rating .fa-star {
  color: #FFCF40 !important;
}
.testimonial-block .text {
  color: rgba(255, 255, 255, 0.72) !important;
  font-style: italic !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
}
.testimonial-block h5.name {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
}
.testimonial-block .designation {
  color: var(--ft-accent) !important;
  font-size: 11px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}
.testimonial-section .swiper-button-prev,
.testimonial-section .swiper-button-next,
.testi-swiper .swiper-button-prev,
.testi-swiper .swiper-button-next {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: var(--ft-accent) !important;
  border-radius: 50% !important;
}
.testimonial-section .swiper-button-prev .icon,
.testimonial-section .swiper-button-next .icon {
  color: var(--ft-accent) !important;
}
.testimonial-section .swiper-pagination-bullet {
  background: rgba(63, 209, 255, 0.25) !important;
}
.testimonial-section .swiper-pagination-bullet-active {
  background: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   FAQ SECTION
───────────────────────────────────────── */
.faq-section {
  background: var(--ft-navy-deep) !important;
}

.accordion-box .accordion.block {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(12px) !important;
  margin-bottom: 12px !important;
  overflow: hidden;
}
.accordion-box .acc-btn {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}
.accordion-box .acc-btn .icon-outer {
  color: var(--ft-accent) !important;
  background: rgba(63, 209, 255, 0.1) !important;
  border-radius: 50% !important;
}
.accordion-box .acc-btn .icon-outer .icon {
  color: var(--ft-accent) !important;
}
.accordion-box .acc-content .text {
  color: var(--ft-text-muted) !important;
  line-height: 1.75 !important;
}
.accordion-box .accordion.block.active-block .acc-btn {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   APP / TRADING-TWO SECTION
───────────────────────────────────────── */
.trading-two {
  background: linear-gradient(180deg, var(--ft-navy-mid) 0%, var(--ft-navy-deep) 100%) !important;
}

.trading-two .sec-title h2 {
  color: #fff !important;
}
.trading-two .sec-title .text {
  color: var(--ft-text-muted) !important;
}

.trading-block_two-inner {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: var(--ft-card-shadow) !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  transition: transform 0.3s ease !important;
}
.trading-block_two-inner:hover {
  transform: translateY(-3px) !important;
}
.trading-block_two-inner .icon {
  background: rgba(63, 209, 255, 0.12) !important;
  border-radius: 50% !important;
}
.trading-block_two-inner .icon .fa-check {
  color: var(--ft-accent) !important;
}
.trading-block_two-inner .text {
  color: var(--ft-text-muted) !important;
}

/* ─────────────────────────────────────────
   PARTNERS / CLIENT SECTION
───────────────────────────────────────── */
.client-section {
  background: var(--ft-navy-deep) !important;
  border-top: 1px solid rgba(63, 209, 255, 0.06) !important;
  border-bottom: 1px solid rgba(63, 209, 255, 0.06) !important;
}
.client-section .outer-box {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(10px) !important;
}
.client-section .title-box h5 {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
}
.client-section .title-box .icon {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   NEWS SECTION
───────────────────────────────────────── */
.news-section {
  background: var(--ft-navy) !important;
}

.news-block_one .inner-box {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: var(--ft-card-shadow) !important;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}
.news-block_one .inner-box:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(63, 209, 255, 0.32) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 30px rgba(63, 209, 255, 0.08) !important;
}

.news-block_one .content-box {
  background: transparent !important;
}
.news-block_one h4.title a {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
}
.news-block_one h4.title a:hover {
  color: var(--ft-accent) !important;
}
.news-block_one .text {
  color: var(--ft-text-muted) !important;
  font-size: 14px !important;
}
.news-block_one .date {
  background: rgba(63, 209, 255, 0.1) !important;
  color: var(--ft-accent) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
}
.news-block_one .date span {
  color: var(--ft-text-muted) !important;
}
.news-block_one .meta li {
  color: var(--ft-text-muted) !important;
  font-size: 12px !important;
}
.news-block_one .meta li i {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   CONTACT SECTION
───────────────────────────────────────── */
#contact.faq-section {
  background: linear-gradient(180deg, var(--ft-navy-mid) 0%, var(--ft-navy-deep) 100%) !important;
}

#contact .sec-title .sub-title {
  color: var(--ft-accent) !important;
}
#contact h2 {
  color: #fff !important;
}

#contact input,
#contact textarea,
#contact select {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-family: 'Inter', sans-serif !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}
#contact input:focus,
#contact textarea:focus {
  border-color: rgba(63, 209, 255, 0.45) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(63, 209, 255, 0.1) !important;
}
#contact input::placeholder,
#contact textarea::placeholder {
  color: var(--ft-text-muted) !important;
}
#contact strong {
  color: #fff !important;
}
#contact .fa-phone,
#contact .fa-envelope,
#contact .fa-map-marker-alt {
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   FOOTER
───────────────────────────────────────── */
.main-footer {
  background: var(--ft-navy-deep) !important;
  border-top: 1px solid rgba(63, 209, 255, 0.07) !important;
}

.main-footer .upper-box {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: var(--ft-radius-lg) !important;
  backdrop-filter: blur(12px) !important;
}
.main-footer .upper-box h4 {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

/* Newsletter form */
.newsletter-box .form-group {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: 50px !important;
  overflow: hidden;
}
.newsletter-box input[type="email"] {
  background: transparent !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
}
.newsletter-box input[type="email"]::placeholder {
  color: var(--ft-text-muted) !important;
}
.newsletter-box button,
.newsletter-box .theme-btn {
  background: linear-gradient(135deg, var(--ft-accent), #1a90d4) !important;
  color: var(--ft-navy-deep) !important;
  border-radius: 50% !important;
}

.footer-text {
  color: var(--ft-text-muted) !important;
  font-family: 'Inter', sans-serif !important;
}

.footer-title {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}

.footer-list li a {
  color: var(--ft-text-muted) !important;
  font-family: 'Inter', sans-serif !important;
}
.footer-list li a:hover {
  color: var(--ft-accent) !important;
}
.footer-list li {
  border-color: rgba(63, 209, 255, 0.06) !important;
}

.footer-contact_list li,
.footer-contact_list li a {
  color: var(--ft-text-muted) !important;
  font-family: 'Inter', sans-serif !important;
}
.footer-contact_list li a:hover {
  color: var(--ft-accent) !important;
}
.footer-contact_list li i {
  color: var(--ft-accent) !important;
}

.footer-bottom {
  background: rgba(7, 21, 32, 0.85) !important;
  border-top: 1px solid rgba(63, 209, 255, 0.06) !important;
}
.footer-bottom .copyright,
.footer-bottom .copyright a {
  color: var(--ft-text-muted) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}
.footer-bottom .copyright a:hover {
  color: var(--ft-accent) !important;
}

.footer-bottom .footer_socials a {
  color: var(--ft-text-muted) !important;
  background: rgba(17, 34, 48, 0.8) !important;
  border: 1px solid var(--ft-accent-border) !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s ease !important;
  margin: 0 3px !important;
}
.footer-bottom .footer_socials a:hover {
  background: var(--ft-accent-dim) !important;
  color: var(--ft-accent) !important;
  border-color: rgba(63, 209, 255, 0.5) !important;
}

/* ─────────────────────────────────────────
   MOBILE MENU
───────────────────────────────────────── */
.mobile-menu .menu-box {
  background: #071520 !important;
  border-right: 1px solid rgba(63, 209, 255, 0.1) !important;
}
.mobile-menu .menu-backdrop {
  background: rgba(7, 21, 32, 0.92) !important;
}
.mobile-menu .upper-box {
  border-bottom: 1px solid rgba(63, 209, 255, 0.08) !important;
}
.mobile-menu .close-btn .icon {
  color: var(--ft-text-muted) !important;
}
.mobile-menu .navigation li a {
  color: rgba(255, 255, 255, 0.8) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
}
.mobile-menu .navigation li a:hover {
  color: var(--ft-accent) !important;
}
.mobile-menu .contact-list-one li .icon {
  color: var(--ft-accent) !important;
}
.mobile-menu .contact-list-one .title {
  color: var(--ft-text-muted) !important;
}
.mobile-menu .contact-list-one .text a {
  color: #fff !important;
}
.mobile-menu .social-links a {
  background: rgba(63, 209, 255, 0.08) !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: var(--ft-text-muted) !important;
}
.mobile-menu .social-links a:hover {
  background: var(--ft-accent-dim) !important;
  color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   SEARCH POPUP
───────────────────────────────────────── */
.search-popup {
  background: rgba(7, 21, 32, 0.97) !important;
  backdrop-filter: blur(24px) !important;
}
.search-popup .form-group input {
  background: var(--ft-card-bg) !important;
  border: 1px solid var(--ft-accent-border) !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-family: 'Inter', sans-serif !important;
}
.search-popup .form-group button {
  color: var(--ft-accent) !important;
}
.search-back-drop {
  background: rgba(7, 21, 32, 0.85) !important;
}
.close-search {
  color: var(--ft-text-muted) !important;
}

/* ─────────────────────────────────────────
   PRELOADER
───────────────────────────────────────── */
.preloader {
  background: var(--ft-navy-deep) !important;
}

/* ─────────────────────────────────────────
   HARDCODED COLOR OVERRIDES
   These selectors in style.css have colors
   that can't be fixed via variable remapping
───────────────────────────────────────── */

/* ── Body & page default ── */
body {
  background-color: var(--ft-navy) !important;
  color: var(--ft-text-muted) !important;
}

/* ── Nav dropdown menus ── */
.main-menu .navigation > li > ul,
.main-menu .navigation > li > ul > li > ul,
.main-menu .navigation > li > ul li a,
.sticky-header .navigation > li > ul {
  background-color: #071520 !important;
  border: 1px solid var(--ft-accent-border) !important;
}
.main-menu .navigation > li > ul li a {
  color: rgba(255, 255, 255, 0.8) !important;
}
.main-menu .navigation > li > ul li a:hover {
  color: var(--ft-accent) !important;
  background-color: rgba(63, 209, 255, 0.06) !important;
}

/* ── Testimonial bg color block ── */
.testimonial-section .testimonial-bg_color,
.testimonial-section .testimonial-bg_color.bg {
  background-color: transparent !important;
  background: transparent !important;
}

/* ── Market blocks — icon bg was #f1f3f3 light gray ── */
.market-block_one .left-box .icon {
  background-color: rgba(63, 209, 255, 0.1) !important;
  color: var(--ft-accent) !important;
}
.market-block_one .left-box .down {
  color: #FF6B6B !important;
  background-color: rgba(255, 107, 107, 0.1) !important;
}

/* ── Footer title underline — was lime→green gradient ── */
.main-footer .footer-title::before,
.main-footer .footer-title:before {
  background-image: linear-gradient(to right, #3FD1FF, #1a90d4, #0F2535) !important;
}

/* ── Accordion / FAQ ── */
.accordion-box .accordion.block .acc-btn {
  background-color: transparent !important;
}
.accordion-box .accordion.block .acc-content {
  background-color: rgba(17, 34, 48, 0.5) !important;
}

/* ── Steps section number hover text ── */
.step-block_one .inner-box .content-box-hover .title a,
.step-block_one .inner-box .content-box-hover h4 a {
  color: #ffffff !important;
}

/* ── Search, form inputs global ── */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="number"],
textarea,
select {
  background-color: rgba(17, 34, 48, 0.7) !important;
  border-color: var(--ft-accent-border) !important;
  color: #fff !important;
}
input::placeholder,
textarea::placeholder {
  color: var(--ft-text-muted) !important;
}

/* ── Social icons ── */
.social-icon-two li a {
  background-color: rgba(17, 34, 48, 0.9) !important;
  border: 1px solid var(--ft-accent-border) !important;
}
.social-icon-two li a:hover::before {
  background-color: var(--ft-accent) !important;
}

/* ── News block date ── */
.news-block_one .info-box .date {
  background: rgba(63, 209, 255, 0.1) !important;
  color: var(--ft-accent) !important;
}

/* ── Swiper pagination dots ── */
.swiper-pagination-bullet {
  background: rgba(63, 209, 255, 0.25) !important;
  opacity: 1 !important;
}
.swiper-pagination-bullet-active {
  background: var(--ft-accent) !important;
}

/* ── Progress bars ── */
.progress-bar,
.skill-bar .bar-inner .bar {
  background-color: var(--ft-accent) !important;
}

/* ─────────────────────────────────────────
   FIX 404 MISSING IMAGES FROM STYLE.CSS
───────────────────────────────────────── */

/* Banner slide backgrounds — fintech trading photos with dark navy overlay */
.banner-section .bg-slide-1 {
  background-image: url(../images/banner/slide-1.jpg) !important;
  background-size: cover !important;
  background-position: center !important;
}
.banner-section .bg-slide-2 {
  background-image: url(../images/banner/slide-2.jpg) !important;
  background-size: cover !important;
  background-position: center !important;
}
.banner-section .bg-slide-1::before,
.banner-section .bg-slide-2::before {
  background-image: none !important;
  background: linear-gradient(100deg, rgba(4,15,30,0.88) 0%, rgba(4,15,30,0.70) 60%, rgba(4,15,30,0.45) 100%) !important;
}

/* vector.png — decorative underline behind hero title span */
.banner-section .outer-box .content-column .inner-column .title span::before,
.banner-section .outer-box .content-column .inner-column .title span:before {
  background-image: none !important;
  display: none !important;
}

/* Testimonial mask image — removes wavy clipping mask */
.testimonial-block .inner-box {
  -webkit-mask-image: none !important;
          mask-image: none !important;
}

/* exchange.svg — all occurrences (pricing, market name span) */
.pricing-block_one .upper-box .name span::before,
.pricing-block_one .upper-box .name span:before,
.market-block_one .left-box .name span::before,
.market-block_one .left-box .name span:before {
  background: none !important;
  display: none !important;
}

/* lines.svg — decorative beside platform guide icon */
.platform-section .guide-outer .icon::before,
.platform-section .guide-outer .icon:before {
  background: none !important;
  display: none !important;
}

/* ─────────────────────────────────────────
   BUTTON ICON BOXES (icon-left / icon-right)
   The template makes <i class="icon-left/right">
   into 28×28px colored squares — they show as
   rectangles in the fintech pill button style.
   Hide them; buttons display just the text.
───────────────────────────────────────── */
.theme-btn .icon-left,
.theme-btn .icon-right {
  display: none !important;
}
/* Keep btn-title normally positioned without the animated translate */
.theme-btn .btn-title {
  transform: none !important;
  -webkit-transform: none !important;
}
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: var(--ft-navy-deep);
}
::-webkit-scrollbar-thumb {
  background: rgba(63, 209, 255, 0.3);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(63, 209, 255, 0.6);
}

/* ─────────────────────────────────────────
   TEXT SELECTION
───────────────────────────────────────── */
::selection {
  background: var(--ft-accent) !important;
  color: var(--ft-navy-deep) !important;
}
::-moz-selection {
  background: var(--ft-accent) !important;
  color: var(--ft-navy-deep) !important;
}