:root{
  --phoenix-grad: radial-gradient(1200px circle at 15% 10%, rgba(74, 222, 128, .18), transparent 45%),
                 radial-gradient(900px circle at 80% 20%, rgba(59, 130, 246, .18), transparent 40%),
                 radial-gradient(700px circle at 40% 80%, rgba(244, 63, 94, .12), transparent 45%);
}

.brand-logo{
  width: 28px;
  height: 28px;
  object-fit: contain;
  border-radius: 8px;
}

.hero{
  background: var(--phoenix-grad);
}

.hero-glow{
  position:absolute;
  inset:-60px;
  pointer-events:none;
  filter: blur(40px);
  opacity: .55;
  background: radial-gradient(closest-side, rgba(99, 102, 241, .15), transparent 60%);
}

.glass{
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(10px);
}

.icon-bubble{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display:grid;
  place-items:center;
  font-size: 1.1rem;
}

.feature-card{
  transition: transform .18s ease, box-shadow .18s ease;
}

.feature-card:hover{
  transform: translateY(-3px);
}

.stat{
  transition: transform .18s ease;
}

.stat:hover{
  transform: translateY(-2px);
}

.step{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  font-weight: 700;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}

code{
  word-break: break-word;
}