/* Homepage design system applied to every inner page */
body.csl-shared-header {
  --gp-bg: #070b14;
  --gp-bg-2: #0a1020;
  --gp-panel: rgba(14, 21, 37, 0.96);
  --gp-line: rgba(245, 166, 35, 0.14);
  --gp-cyan: #f5a623;
  --gp-blue: #1b3a6b;
  --gp-green: #4dd8c0;
  --gp-text: #f0f4ff;
  --gp-muted: rgba(240, 244, 255, 0.58);
  background: #070b14 !important;
  color: #f0f4ff !important;
}

body.csl-shared-header .ln-about-wrapper {
  min-height: 0;
  padding: 0 !important;
  background:
    radial-gradient(ellipse 58% 80% at 78% 42%, rgba(27, 58, 107, 0.34), transparent 65%),
    #070b14 !important;
}

body.csl-shared-header .ln-about-wrapper::before,
body.csl-shared-header .ln-about-wrapper::after {
  display: none !important;
}

body.csl-shared-header .ln-section.ln-container {
  width: min(94%, 1760px) !important;
  max-width: none !important;
  margin: 0 auto !important;
  border-color: rgba(245, 166, 35, 0.1) !important;
}

body.csl-shared-header .ln-section.ln-hero {
  box-sizing: border-box !important;
  position: relative;
  min-height: 520px !important;
  padding: 76px 50% 58px 0 !important;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start !important;
  justify-content: center !important;
  overflow: hidden;
  text-align: left !important;
  background: transparent !important;
}

body.csl-shared-header .ln-section.ln-hero::before {
  content: "";
  position: absolute !important;
  z-index: 0;
  inset: 0 0 0 48% !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border: 0 !important;
  background:
    linear-gradient(90deg, #070b14 0%, transparent 18%),
    url("./cybersmart-dashboard-clean-dark.png") right center / contain no-repeat !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  animation: none !important;
  box-shadow: none !important;
  pointer-events: none;
}

body.csl-shared-header .ln-section.ln-hero::after {
  content: "";
  position: absolute !important;
  z-index: 0;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border: 0 !important;
  background: radial-gradient(circle at 70% 50%, rgba(77, 216, 192, 0.06), transparent 36%) !important;
  pointer-events: none;
}

body.csl-shared-header .ln-hero > * {
  position: relative;
  z-index: 2;
}

body.csl-shared-header .ln-hero .ln-badge {
  margin: 0 0 18px !important;
  padding: 6px 11px !important;
  border: 1px solid rgba(245, 166, 35, 0.3) !important;
  border-radius: 999px !important;
  background: rgba(245, 166, 35, 0.07) !important;
  color: #f5a623 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.03em;
}

body.csl-shared-header .ln-hero .ln-badge svg {
  stroke: #f5a623 !important;
}

body.csl-shared-header .ln-hero h1,
body.csl-shared-header .ln-hero h2 {
  max-width: 680px !important;
  margin: 0 0 20px !important;
  color: #fff !important;
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: clamp(2.45rem, 4vw, 4rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  text-align: left !important;
}

body.csl-shared-header .ln-gradient-text {
  background: linear-gradient(90deg, #f5a623 0%, #ffd56a 48%, #4dd8c0 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

body.csl-shared-header .ln-hero .ln-hero-sub {
  max-width: 610px !important;
  margin: 0 0 24px !important;
  color: rgba(240, 244, 255, 0.62) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
  text-align: left !important;
}

body.csl-shared-header .forex-hero-points {
  max-width: 620px;
  margin: 0 0 26px !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-start !important;
  gap: 8px !important;
  list-style: none;
}

body.csl-shared-header .forex-hero-points li {
  margin: 0 !important;
  padding: 7px 12px !important;
  border: 1px solid rgba(77, 216, 192, 0.18) !important;
  border-radius: 999px !important;
  background: rgba(77, 216, 192, 0.05) !important;
  color: rgba(240, 244, 255, 0.7) !important;
  font-size: 0.76rem !important;
}

body.csl-shared-header .forex-hero-cta {
  margin: 0 !important;
}

body.csl-shared-header .ln-hero .button,
body.csl-shared-header .forex-hero-cta .button {
  border: 0 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #f5a623, #e85d04) !important;
  box-shadow: 0 5px 24px rgba(245, 166, 35, 0.3) !important;
  color: #fff !important;
}

body.csl-shared-header .ln-hero .button-text {
  color: #fff !important;
  font-weight: 700 !important;
}

body.csl-shared-header .hero-scroll-down--ln,
body.csl-shared-header .ln-cross-bottom-left,
body.csl-shared-header .ln-cross-bottom-right {
  display: none !important;
}

body.csl-shared-header .fx-dashboard,
body.csl-shared-header .tools-dashboard,
body.csl-shared-header .calendar-dashboard {
  background: #080d18 !important;
  border-top: 1px solid rgba(245, 166, 35, 0.1) !important;
}

body.csl-shared-header .fx-card,
body.csl-shared-header [class*="feature-card"],
body.csl-shared-header [class*="tool-card"],
body.csl-shared-header [class*="platform-card"],
body.csl-shared-header .ln-card {
  border-color: rgba(245, 166, 35, 0.13) !important;
  background:
    radial-gradient(circle at 0 0, rgba(77, 216, 192, 0.06), transparent 35%),
    #0e1525 !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.24) !important;
}

body.csl-shared-header .fx-dashboard-title,
body.csl-shared-header .ln-section h2,
body.csl-shared-header .ln-section h3 {
  color: #fff;
}

body.csl-shared-header .premium-footer {
  border-top-color: rgba(245, 166, 35, 0.13) !important;
  background: linear-gradient(180deg, #090e19, #05070c) !important;
}

@media (max-width: 860px) {
  body.csl-shared-header .ln-section.ln-hero {
    min-height: 0 !important;
    padding: 70px 0 56px !important;
  }

  body.csl-shared-header .ln-section.ln-hero::before {
    display: none;
  }

  body.csl-shared-header .ln-hero h1,
  body.csl-shared-header .ln-hero h2 {
    font-size: clamp(2.2rem, 9vw, 3.25rem) !important;
  }
}