:root {
  --fx-navy: #12213a;
  --fx-navy-light: #1c3457;
  --fx-orange: #e8792f;
  --fx-orange-dark: #cf6821;
  --fx-ink: #2c3e50;
  --fx-muted: #5a6b81;
  --fx-bg-soft: #f5f7fa;
}

body {
  font-family: "Segoe UI", Arial, sans-serif;
  color: var(--fx-ink);
}

.navbar-brand img { height: 40px; }

.btn-nav-cta {
  white-space: nowrap;
}
@media (max-width: 380px) {
  .btn-nav-cta {
    font-size: 0.8rem;
    padding: 0.4rem 0.6rem;
  }
}

.btn-fx {
  background-color: var(--fx-orange);
  border-color: var(--fx-orange);
  color: #ffffff;
  font-weight: 600;
}
.btn-fx:hover, .btn-fx:focus {
  background-color: var(--fx-orange-dark);
  border-color: var(--fx-orange-dark);
  color: #ffffff;
}

.btn-fx-outline {
  border: 2px solid #ffffff;
  color: #ffffff;
  font-weight: 600;
}
.btn-fx-outline:hover {
  background-color: rgba(255,255,255,0.12);
  color: #ffffff;
}

.hero {
  background: linear-gradient(135deg, var(--fx-navy) 0%, var(--fx-navy-light) 100%);
  color: #ffffff;
  padding: 6rem 0 5rem;
}
.hero p.lead { color: #c9d4e3; }

.section-title {
  font-weight: 700;
  color: var(--fx-navy);
  margin-bottom: 0.75rem;
}
.section-subtitle {
  color: var(--fx-muted);
  max-width: 620px;
  margin: 0 auto 3rem;
}

.bg-soft { background-color: var(--fx-bg-soft); }

.step-number {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: var(--fx-orange);
  color: #ffffff;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.feature-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background-color: rgba(18,33,58,0.06);
  color: var(--fx-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}

.proof-card {
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  padding: 2rem;
}

.cta-band {
  background-color: var(--fx-navy);
  color: #ffffff;
}

footer {
  background-color: #0d1830;
  color: #8fa3bf;
}
footer a { color: #c9d4e3; }