body {
  background-color: var(--white);
}
.header {
  background-color: var(--white);
}
.page-wrapper {
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
  margin-top: 120px;
  font-family: "DM Sans", sans-serif;
}
.demo-form-wrapper {
  background-color: var(--background-second-color);
  color: var(--white);
}
.contact-form-wrapper {
  background-color: var(--backgorund-color);
  color: var(--black);
}
.page-wrapper h1 {
  font-size: 60px;
  line-height: 0.9;
  width: 440px;
  letter-spacing: 1px;
  margin-bottom: 35px;
  margin-top: 85px;
}

.page-wrapper p.para {
  font-size: 25px;
  width: 440px;
  letter-spacing: 0px;
}

.demo-form-wrapper h1 {
  color: var(--white);
}

.contact-form-wrapper h1 {
  color: var(--black);
}

.page-wrapper .left-section {
  flex: 1;
}

.page-wrapper .right-section {
  flex: 0.75;
}

.form-wrapper {
  padding: 175px 0 130px;
  border-bottom: 1px solid var(--primary-bonafied-night);
  justify-content: space-between;
}

.page-wrapper .cf7-dark-form {
  padding: 116px 50px 90px;
  border-radius: 10px;
}

.demo-form-wrapper .cf7-dark-form {
  background: var(--background-fifth-color);
}

.contact-form-wrapper .cf7-dark-form {
  background: var(--background-fourth-color);
}

.parnter-form-wrapper .cf7-dark-form {
  background: var(--background-sixth-color);
}

.demo-form-wrapper input[type="text"],
.demo-form-wrapper input[type="email"] {
  border-bottom: 0.75px solid var(--white);
  color: var(--white)
}

.contact-form-wrapper input[type="text"],
.contact-form-wrapper input[type="email"] {
  border-bottom: 1px solid var(--primary-bonafied-night);
  color: var(--black);
}

.parnter-form-wrapper input[type="text"],
.parnter-form-wrapper input[type="email"] {
  border-bottom: 1px solid var(--background-second-color);
  color: var(--black);
}

.cf7-dark-form .form-group {
  position: relative;
  margin-bottom: 32px;
}

/* Input */
.cf7-dark-form .form-input {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  padding: 14px 0 6px;
  color: #fff;
  font-size: 15px;
  outline: none;
}

/* Label - DEFAULT (inside input) */
.cf7-dark-form .label-text {
  position: absolute;
  left: 0;
  top: 14px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  pointer-events: none;
  transition: 0.25s ease;
}

/* FLOAT ONLY ON FOCUS OR VALUE */
.cf7-dark-form .form-input:focus+.label-text,
.cf7-dark-form .form-input:not(:placeholder-shown)+.label-text {
  top: -8px;
  font-size: 12px;
  color: #4fc3f7;
}

/* Focus underline */
.cf7-dark-form .form-input:focus {
  border-bottom: 2px solid #4fc3f7;
}

/* Textarea */
.cf7-dark-form textarea.form-input {
  resize: none;
  min-height: 70px;
}

/* Submit */
.cf7-dark-form input[type="submit"] {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.demo-form-wrapper .cf7-dark-form input[type="submit"] {
  color: var(--white)
}

.contact-form-wrapper .cf7-dark-form input[type="submit"] {
  color: var(--black)
}

.parnter-form-wrapper .cf7-dark-form input[type="submit"] {
  color: var(--background-second-color)
}

.wpcf7 p {
  margin: 0;
}

.form-group p {
  position: relative;
}

.form-wrapper {
  padding: 175px 0 130px;
  border-bottom: 1px solid #4C647C;
}

.floating-field {
  position: relative;
}

.demo-form-wrapper .floating-label-input {
  border-bottom: 1px solid var(--white);
}

.contact-form-wrapper .floating-label-input {
  border-bottom: 1px solid var(--primary-bonafied-night);
}

.parnter-form-wrapper .floating-label-input {
  border-bottom: 1px solid var(--primary-bonafied-night);
}

.floating-label-input {
  width: 100%;
  padding: 12px 0 6px;
  border: none;
  background: transparent;
  outline: none;
  font-size: 20px;
  line-height: 20px;
  font-family: 'DM Sans';
}

/* Label default */
.floating-label {
  position: absolute;
  left: 0;
  top: 14px;
  font-size: 25px;
  line-height: 1;

  pointer-events: none;
  transition: 0.25s ease;
}

.demo-form-wrapper .floating-label {
  color: var(--primary-bonafied-blue);
}

.contact-form-wrapper .floating-label {
  color: var(--primary-bonafied-night)
}

.parnter-form-wrapper .floating-label {
  color: var(--primary-bonafied-night)
}

/* FLOAT when focused OR filled */
.demo-form-wrapper .floating-field:focus-within .floating-label,
.demo-form-wrapper .floating-field.is-filled .floating-label {
  color: var(--primary-bonafied-blue);
}

.contact-form-wrapper .floating-field:focus-within .floating-label,
.contact-form-wrapper .floating-field.is-filled .floating-label {
  color: var(--primary-bonafied-night);
}

.floating-field:focus-within .floating-label,
.floating-field.is-filled .floating-label {
  top: -12px;
  font-size: 14px;

}

@media (max-width: 768px) {
  .form-wrapper {
    flex-direction: column;
    padding: 46px 0 82px;
    gap: 55px;
  }

  .contact-form-wrapper .form-wrapper {
    border-bottom: none
  }

  .wpcf7-not-valid-tip {
    font-size: 14px;
  }

  .page-wrapper h1 {
    width: auto;
    font-size: 50px;
    margin-top: 62px;
    margin-bottom: 18px;
  }

  .page-wrapper p.para {
    width: auto;
  }

  .page-wrapper {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    padding-bottom: 30px;
    margin-top: 80px;
  }

  .page-wrapper .cf7-dark-form {
    padding: 84px 30px 50px
  }

  .floating-label,
  .cf7-dark-form input[type="submit"] {
    font-size: 14px;
  }

  .floating-label-input {
    font-size: 14px;
    padding: 0.5rem 0 0.150rem;
  }
  .page-wrapper .left-section img{
      width: 50px;
      height: 50px;
  }   

}