html{
  scroll-behavior:smooth;
}

/* HERO ANIMADO */
.hero{
  height:100vh;
  position:relative;
  overflow:hidden;
  background: linear-gradient(270deg,#0d6efd,#6610f2,#198754,#0dcaf0);
  background-size:800% 800%;
  animation: gradientMove 18s ease infinite;
}

@keyframes gradientMove{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}

/* Partículas */
#particles-js{
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  z-index:1;
}

/* Texto hero */
.hero .container{
  z-index:2;
}

.hero h1{
  font-size:3rem;
  font-weight:700;
  text-shadow:0 4px 15px rgba(0,0,0,.4);
}

.hero p{
  text-shadow:0 2px 10px rgba(0,0,0,.3);
}

/* Fallback botones si Bootstrap falla */
.btn{
  padding:10px 20px;
  border-radius:30px;
  font-weight:600;
  text-decoration:none;
  display:inline-block;
}

.btn-primary{background:#0d6efd;color:#fff;}
.btn-success{background:#198754;color:#fff;}
.btn-warning{background:#ffc107;color:#000;}
.btn:hover{opacity:.85}

/* Secciones */
section h2{
  font-weight:700;
}