/* =========================================================
  top.css
  - Top page only styles
========================================================= */

/* -----------------------------
  Background gradients
----------------------------- */

.bg-hero-grad{
  background:
    radial-gradient(900px 420px at 50% 0%, rgba(99,102,241,.22), transparent 55%),
    radial-gradient(720px 360px at 70% 20%, rgba(168,85,247,.18), transparent 55%),
    radial-gradient(620px 300px at 30% 35%, rgba(14,165,233,.10), transparent 60%);
}

.bg-soft-grad{
  background:
    radial-gradient(520px 240px at 20% 0%, rgba(99,102,241,.14), transparent 60%),
    radial-gradient(520px 240px at 80% 20%, rgba(168,85,247,.12), transparent 60%);
}

/* -----------------------------
  Buttons
----------------------------- */

.btn-primary{
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  box-shadow: 0 18px 50px rgba(99,102,241,.22);
}

.btn-primary:hover{
  filter: brightness(1.02);
}

/* -----------------------------
  Card shadows
----------------------------- */

.soft-shadow{
  box-shadow: 0 20px 60px rgba(2,6,23,.08);
}

.card-shadow{
  box-shadow: 0 10px 30px rgba(2,6,23,.06);
}

/* -----------------------------
  Section spacing
----------------------------- */

.section-pad{
  padding-top: 5rem;
  padding-bottom: 5rem;
}

@media (min-width: 768px){
  .section-pad{
    padding-top: 6.5rem;
    padding-bottom: 6.5rem;
  }
}