.form-field {
  --gap: 0.5333333333vw;
}
@media (min-width: 720px) {
  .form-field {
    --gap: 0.3125vw;
  }
}
@media (min-width: 1281px) {
  .form-field {
    --gap: 0.2083333333vw;
  }
}
@media (min-width: 2400px) {
  .form-field {
    --gap: 5px;
  }
}
.form-field {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}
.form-field__label {
  --side-padding: 4.2666666667vw;
  --color: var(--color-wetty-asphalt);
}
@media (min-width: 720px) {
  .form-field__label {
    --side-padding: 1.875vw;
  }
}
@media (min-width: 720px) {
  .form-field__label {
    --color: var(--color-dark-water);
  }
}
@media (min-width: 1281px) {
  .form-field__label {
    --side-padding: 1.25vw;
  }
}
@media (min-width: 1281px) {
  .form-field__label {
    --color: var(--color-dark-water);
  }
}
@media (min-width: 2400px) {
  .form-field__label {
    --side-padding: 30px;
  }
}
@media (min-width: 2400px) {
  .form-field__label {
    --color: var(--color-dark-water);
  }
}
.form-field__label {
  display: block;
  padding: 0 var(--side-padding);
  color: var(--color);
}