Hero Background CSS Generator

.hero-bg {
  border-radius: 12px;
  padding: 34px;
  color: white;
  background:
    radial-gradient(circle at 20% 10%, color-mix(in srgb, #0ea5e9 45%, transparent), transparent 45%),
    radial-gradient(circle at 80% 0%, color-mix(in srgb, #1e293b 35%, transparent), transparent 40%),
    linear-gradient(145deg, #1e293b, #0ea5e9);
}

.hero-bg h2 {
  margin: 0;
  font-size: 36px;
  line-height: 1.05;
}

.hero-bg p {
  margin: 12px 0 0;
  max-width: 28rem;
  opacity: 0.85;
}