/* Confirmation only: existing form, pending and error styles are unchanged. */
.form-status.is-success {
  position:relative;
  margin-top:24px;
  padding:22px 24px 22px 70px;
  background:#e3f0f3;
  border:1px solid #b8d5de;
  border-left:4px solid var(--cyan);
  color:var(--ink);
  box-shadow:0 5px 18px #10191c08;
}
.form-status.is-success::before {
  content:'';
  position:absolute;
  left:30px;
  top:29px;
  width:9px;
  height:16px;
  border-right:2px solid #216078;
  border-bottom:2px solid #216078;
  transform:rotate(45deg);
  z-index:1;
}
.form-status.is-success::after {
  content:'';
  position:absolute;
  left:19px;
  top:23px;
  width:32px;
  height:32px;
  border:1px solid #6badbf;
  border-radius:50%;
}
.form-status .form-success-title {
  display:block;
  font-family:var(--display);
  font-size:22px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:-.035em;
  margin-bottom:9px;
  color:#163d49;
}
.form-status .form-success-copy {
  display:block;
  font-size:14px;
  line-height:1.75;
  color:#315665;
  max-width:490px;
}
@media(max-width:480px) {
  .form-status.is-success { padding:20px 18px 20px 60px; }
  .form-status.is-success::after { left:13px; top:20px; width:30px; height:30px; }
  .form-status.is-success::before { left:23px; top:25px; }
  .form-status .form-success-title { font-size:20px; }
  .form-status .form-success-copy { font-size:13px; }
}
