:root {
  --nc-blue: #1565ff;
  --nc-emerald: #00b894;
  --nc-amber: #ffc107;
  --nc-ink: #1f2937;
  --nc-bg: #0b1220;
  --nc-panel: #0e1630;
  --nc-text: #e5e7eb;
}

html,
body {
  background: var(--nc-bg);
  color: var(--nc-text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu,
    Cantarell, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol", sans-serif;
}

code,
pre,
.mono {
  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco,
    Consolas, "Liberation Mono", "Courier New", monospace;
}
h3,
a {
  color: #9ec5ff;
}
a:hover {
  color: #cfe1ff;
}

.bg-section {
  background: linear-gradient(
    180deg,
    rgba(21, 101, 255, 0.08),
    rgba(0, 184, 148, 0.08)
  );
}
.gradient-hero {
  background: radial-gradient(
      1200px 500px at 10% -20%,
      rgba(21, 101, 255, 0.35),
      transparent
    ),
    radial-gradient(
      900px 400px at 90% -10%,
      rgba(0, 184, 148, 0.35),
      transparent
    ),
    var(--nc-panel);
}

.navbar-dark .navbar-brand {
  color: #fff;
}
.navbar-dark .nav-link {
  color: #cbd5e1;
}
.navbar-dark .nav-link.active,
.navbar-dark .nav-link:focus,
.navbar-dark .nav-link:hover {
  color: #fff;
}

.btn-emerald {
  background: var(--nc-emerald);
  color: #052e2a;
  border: none;
}
.btn-emerald:hover {
  filter: brightness(1.05);
  color: #041f1c;
}

.text-amber {
  color: var(--nc-amber) !important;
}

.card-glass {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 1rem;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

.card-highlight {
  background: linear-gradient(
    180deg,
    rgba(21, 101, 255, 0.15),
    rgba(0, 184, 148, 0.15)
  );
  border: 1px solid rgba(21, 101, 255, 0.35);
  border-radius: 1rem;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

.pricing .display-6 {
  color: #fff;
}

.bg-body-tertiary {
  background: #0d1426 !important;
}

.hp-field {
  position: absolute;
  left: -10000px;
  opacity: 0;
}
