/* Bridge form. Premium solid white card with soft shadow. Large tap friendly inputs.
   Sits inside the hero, roomy padding, rounded corners, high contrast on the dark image. */
.bridge-form{
  max-width:680px;
  margin:2rem auto 1.75rem;
  padding:22px;
  background:#ffffff;
  border:1px solid rgba(255,255,255,.35);
  border-radius:12px;
  -webkit-box-shadow:0 20px 40px rgba(0,0,0,.15), 0 40px 80px -30px rgba(0,0,0,.35);
          box-shadow:0 20px 40px rgba(0,0,0,.15), 0 40px 80px -30px rgba(0,0,0,.35);
  opacity:0;-webkit-transform:translateY(18px);transform:translateY(18px);
  -webkit-animation:heroFade .9s ease .5s forwards;animation:heroFade .9s ease .5s forwards;
  text-align:left;
}

.bridge-form__row{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
@media(min-width:760px){
  .bridge-form__row{
    grid-template-columns:1fr 1fr auto;
    gap:12px;
    -webkit-box-align:end;-ms-flex-align:end;align-items:end;
  }
}

.bridge-form__field{position:relative}

.bridge-form__input{
  width:100%;
  padding:16px 20px 16px 20px;
  background:#fff;
  color:var(--rjw-ink);
  border:1.5px solid #d0d0d0;
  border-radius:8px;
  font-family:var(--font-body);
  font-weight:500;
  font-size:16px;
  line-height:1.25;
  min-height:56px;
  -webkit-appearance:none;appearance:none;
  -webkit-transition:border-color .2s ease,-webkit-box-shadow .2s ease,background .2s ease;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.bridge-form__input::-webkit-input-placeholder{color:transparent}
.bridge-form__input::-moz-placeholder{color:transparent;opacity:1}
.bridge-form__input:-ms-input-placeholder{color:transparent}
.bridge-form__input::-ms-input-placeholder{color:transparent}
.bridge-form__input::placeholder{color:transparent}
.bridge-form__input:focus{
  outline:0;
  border-color:var(--rjw-accent);
  -webkit-box-shadow:0 0 0 4px rgba(200,16,46,.15);
          box-shadow:0 0 0 4px rgba(200,16,46,.15);
}
.bridge-form__input:invalid:not(:placeholder-shown){
  border-color:#d94141;
  -webkit-box-shadow:0 0 0 3px rgba(217,65,65,.14);
          box-shadow:0 0 0 3px rgba(217,65,65,.14);
}

.bridge-form__label{
  position:absolute;
  top:17px;left:20px;
  color:#7a7a7a;
  font-family:var(--font-body);
  font-weight:500;
  font-size:16px;
  line-height:1;
  pointer-events:none;
  background:#fff;
  padding:0 4px;
  -webkit-transition:-webkit-transform .18s ease,color .18s ease;
  transition:transform .18s ease,color .18s ease;
  -webkit-transform-origin:left top;
  transform-origin:left top;
}
.bridge-form__input:focus + .bridge-form__label,
.bridge-form__input:not(:placeholder-shown) + .bridge-form__label{
  -webkit-transform:translateY(-24px) scale(.78);
  transform:translateY(-24px) scale(.78);
  color:var(--rjw-accent);
  font-weight:600;
}

.bridge-form__submit{
  display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;
  -webkit-box-align:center;-ms-flex-align:center;align-items:center;
  -webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;
  gap:.5rem;
  min-height:56px;
  padding:16px 24px;
  background:var(--rjw-accent);
  color:#fff;
  border:0;
  border-radius:8px;
  font-family:var(--font-body);
  font-weight:700;
  font-size:16px;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  -webkit-appearance:none;appearance:none;
  -webkit-box-shadow:0 12px 30px -12px rgba(200,16,46,.6);
          box-shadow:0 12px 30px -12px rgba(200,16,46,.6);
  -webkit-transition:-webkit-transform .25s ease,background .2s ease,-webkit-box-shadow .25s ease;
  transition:transform .25s ease,background .2s ease,box-shadow .25s ease;
}
.bridge-form__submit svg{width:18px;height:18px;-webkit-transition:-webkit-transform .25s ease;transition:transform .25s ease}
.bridge-form__submit:hover{background:var(--rjw-accent-dark);-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 18px 40px -12px rgba(200,16,46,.75);box-shadow:0 18px 40px -12px rgba(200,16,46,.75)}
.bridge-form__submit:hover svg{-webkit-transform:translateX(4px);transform:translateX(4px)}
.bridge-form__submit:active{-webkit-transform:translateY(0);transform:translateY(0)}
.bridge-form__submit:disabled{opacity:.6;cursor:wait;-webkit-transform:none;transform:none}

.bridge-form__hint{
  margin:14px 0 0;
  text-align:center;
  color:#6a6a6a;
  font-size:.85rem;
  letter-spacing:.01em;
}

@media(max-width:760px){
  .bridge-form{padding:18px;margin-top:1.75rem;border-radius:12px}
  .bridge-form__submit{width:100%}
  .bridge-form__input{font-size:16px}
}