style.css

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}
.hero{
  width:100%;
  height:100vh;
  background:linear-gradient(45deg,#010758,#490d61);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
} 
.hero h1{
  font-size:50px;
  font-weight:500;
  margin-top:-50px;
  margin-bottom:50px;
  color:#fff;
}
span{
  background-color: #ff2663;
  border-radius:10px;
  padding-right:10px;
  padding-left:10px;
}
textarea{
  width:600px;
  height:250px;
  background:#403d84;
  color:#fff;
  font-size:15px;
  border:0;
  outline:0;
  padding:20px;
  border-radius:10px;
  resize:none;
  margin-bottom:30px;
}
textarea::placeholder{
  font-size:16px;
  color:#ddd;
}
.row{
  width:600px;
  display:flex;
  align-items:center;
  gap:20px;
}
button{
  background:#ff2663;
  color:#fff;
  border:0;
  outline:0;
  padding:10px 30px;
  border-radius:35px;
  cursor:pointer;
  font-size:16px;
  display:flex;
  align-items:center;

}
button img{
  width:16px;
  margin-right:10px;
}
select{
  flex:1;
  color:#fff;
  background-color:#403d84;
  height:50px;
  padding:0 20px;
  outline:0;
  border:0;
  border-radius:35px;
  appearance:none;
  background-image:url('img/dropdown.png');
  background-repeat:no-repeat;
  background-size:15px;
  background-position-x:calc(100% - 20px);
  background-position-y:20px;

}
@media only screen and (max-width:600px) {
  .hero{
    height:500px;
  }
  .hero h1{
    font-size:30px;
    font-weight:400;
    margin-bottom:30px;
    color:#fff;
  }
  textarea{
    width:90%;
    height:150px;
    font-size:14px;
    padding:10px;
    border-radius:10px;
    margin-bottom:20px;
  }
  .row{
    width:100%;
    display:block;
    align-items:center;
    gap:20px;
    margin:0 auto;
    margin-left:20px;
  
  }
  button{
    padding:10px 20px;
    border-radius:25px;
    margin-top:15px;
    margin-left:10px;
  
  }
  button img{
    width:16px;
    margin-right:10px;
  }
  select{
    width: 320px;
    height: 50px;
  }

}