.form-page {
  padding: 140px 8%;
  text-align: center;
}

.premium-form {
  max-width: 500px;
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-top: 30px;
}

.premium-form input,
.premium-form select,
.premium-form textarea {
  padding: 14px;
  border-radius: 10px;
  border: 1px solid #222;
  background: #111;
  color: white;
}

.premium-form textarea {
  min-height: 100px;
}

.premium-form input:focus,
.premium-form select:focus,
.premium-form textarea:focus {
  border-color: #7c3aed;
  outline: none;
  box-shadow: 0 0 10px #7c3aed33;
}


.premium-form button {
  margin-top: 10px;
  cursor: pointer;
}


/* FADE UP BASE */
.fade-up {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeUp 0.6s ease forwards;
}

/* DELAYS */
.delay-1 { animation-delay: 0.1s; }
.delay-2 { animation-delay: 0.2s; }
.delay-3 { animation-delay: 0.3s; }
.delay-4 { animation-delay: 0.4s; }
.delay-5 { animation-delay: 0.5s; }
.delay-6 { animation-delay: 0.6s; }
.delay-7 { animation-delay: 0.7s; }

/* KEYFRAME */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.btn {
  transition: 0.3s;
}

.btn:hover {
  box-shadow: 0 0 20px #7c3aed;
  transform: translateY(-2px);
}

.premium-form input,
.premium-form select,
.premium-form textarea {
  transition: all 0.3s ease;
}

.premium-form input:hover,
.premium-form select:hover {
  transform: scale(1.02);
}

@media (max-width: 768px) {

  .form-page {
    padding: 100px 20px 40px; /* top space fix */
    text-align: center;
  }

  .premium-form {
    width: 100%;
    max-width: 400px;
    margin: auto;
  }

  .premium-form input,
  .premium-form select,
  .premium-form textarea {
    width: 100%;
  }

  .premium-form .btn {
    width: 100%;
  }

}

@media (max-width: 768px) {

  .navbar {
    padding: 10px 15px;
  }

  .nav-center {
    font-size: 16px;
  }

}