body {
  font-family: "Montserrat", sans-serif;
  background: #07090f;
  color: white;
}

/* Brand */

.brand-text {
  font-weight: 700;
  font-size: 20px;
}

.dojo-red {
  color: #ff4a3d;
}

/* Hero Logo */

.hero-logo {
  width: 15em;
  margin-bottom: 15px;
}

/* Hero Brand */

.hero-brand {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 10px;
}

/* Hero Title */

.hero-title {
  font-size: 54px;
  font-weight: 800;
  margin-bottom: 20px;
}

/* NAVBAR */

.custom-navbar {
  background: #0b0d12;
  border-bottom: 1px solid #1f1f1f;
}

.nav-link {
  color: #aaa !important;
}

.nav-link:hover {
  color: #ff4a3d !important;
}

.btn-login {
  background: linear-gradient(90deg, #ff3b2f, #ff5b4a);
  border: none;
  color: white;
}

/* HERO */

.hero {
  /* padding: 120px 20px; */
  background: radial-gradient(circle at center, #12152b, #07090f);
}

.hero-title {
  font-size: 30px;
  font-weight: 800;
}

.hero-title span {
  color: #ff4a3d;
}

.hero-sub {
  max-width: 650px;
  margin: auto;
  color: #aaa;
  margin-top: 20px;
}

/* BUTTONS */

.btn-primary-custom {
  background: linear-gradient(90deg, #ff3b2f, #ff5b4a);
  border: none;
  color: white;
  padding: 12px 28px;
}

.btn-outline-custom {
  border: 1px solid #ff4a3d;
  color: #ff4a3d;
}

.btn-outline-custom:hover {
  background: #ff4a3d;
  color: white;
}

/* FEATURES */

.features {
  padding: 100px 0;
}

.text-muted-light {
  color: #aaa;
}

.feature-card {
  background: #0d0f15;
  border: 1px solid #242424;
  border-radius: 14px;
  padding: 30px;
  height: 100%;
  transition: 0.25s;
}

.feature-card:hover {
  transform: translateY(-6px);
  border-color: #ff4a3d;
  box-shadow: 0 10px 30px rgba(255, 70, 60, 0.15);
}

.feature-card p {
  color: #aaa;
}

/* ROADMAP */

.roadmap {
  padding: 100px 0;
  background: #0b0d12;
}

.roadmap-text {
  color: #aaa;
  max-width: 600px;
  margin: auto;
  margin-bottom: 25px;
}

/* FOOTER */

.footer {
  padding: 20px 0;
  color: #fff;
  font-weight: 400;
}

.footer-credit {
  margin-top: 20px;
}

.credit-text {
  color: #aaa;
  font-size: 14px;
  margin-bottom: 10px;
}

.footer-logo {
  width: 110px;
  margin-bottom: 8px;
}