:root{
  --bg0:#0b0f19;
  --bg1:#0f172a;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.12);
  --muted:#cdd3df;
  --text:#e6e8ee;
  --accent:#ff3b30; /* keep a strong accent */
}

html, body { height: 100%; }
body{
  background: radial-gradient(1200px 600px at 15% 10%, rgba(255,59,48,.18), transparent 60%),
              radial-gradient(900px 500px at 90% 25%, rgba(0,160,255,.14), transparent 55%),
              linear-gradient(180deg, var(--bg0), var(--bg1));
  color: var(--text);
}

.navbar{
  background: rgba(10, 14, 26, .65) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}

.brand-badge{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.35rem .7rem; border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  font-weight: 600;
}

.hero{
  padding: 72px 0 28px;
}

.hero h1{
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.hero p{
  color: var(--muted);
  font-size: 1.1rem;
}

.glow{
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
  border: 1px solid var(--border);
  background: var(--card);
  border-radius: 20px;
}

.kpi{
  border: 1px solid var(--border);
  background: rgba(255,255,255,.05);
  border-radius: 18px;
  padding: 16px;
}

.kpi .label{ color: var(--muted); font-size: .9rem; }
.kpi .value{ font-size: 1.3rem; font-weight: 700; }

.card-soft{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
}

.card-soft:hover{
  background: var(--card2);
  transform: translateY(-2px);
  transition: 160ms ease;
}

.btn-accent{
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.btn-accent:hover{
  filter: brightness(.95);
  color:#fff;
}

.badge-soft{
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  color: var(--text);
}

.footer{
  border-top: 1px solid var(--border);
  color: var(--muted);
  padding: 24px 0;
  margin-top: 56px;
}

.small-muted{ color: var(--muted); }

a { color: #9dd1ff; }
a:hover { color: #bfe5ff; }