.hba-gate {
  margin: 2.5rem 0;
  padding: 2.25rem;
  background: #f4efe8;
  border: 1px solid #ded3c7;
  border-radius: 6px;
  text-align: center;
  color: #24211e;
}

.hba-gate__rule {
  width: 56px;
  height: 4px;
  margin: 0 auto 1.25rem;
  background: #c84b31;
}

.hba-gate h2 { margin: 0 0 .75rem; }
.hba-gate p { margin: 0 auto 1.25rem; max-width: 640px; }

.hba-gate button {
  padding: .85rem 1.35rem;
  border: 0;
  border-radius: 4px;
  background: #c84b31;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
}

.hba-gate button:hover,
.hba-gate button:focus { background: #a63a24; }

.hba-form {
  max-width: 520px;
  margin: 1.5rem auto 0;
  text-align: left;
}

.hba-form[hidden] { display: none; }
.hba-form label { display: block; margin-bottom: 1rem; font-weight: 600; }
.hba-form input[type="text"],
.hba-form input[type="email"] {
  box-sizing: border-box;
  width: 100%;
  margin-top: .35rem;
  padding: .75rem;
  border: 1px solid #8b8178;
  border-radius: 3px;
  background: #fff;
}

.hba-form .hba-form__consent { font-size: .9rem; font-weight: 400; }
.hba-form__status { margin-top: .8rem !important; font-weight: 600; }

@media (max-width: 600px) {
  .hba-gate { padding: 1.5rem 1rem; }
  .hba-gate button { width: 100%; }
}