body.form-page{background:var(--ink);--link:var(--paper);--link-hover:var(--tungsten);}

.form-page{
  background:var(--ink);
  --field-radius:8px;
  --field-bg:#F4F3F0;
  --field-bg-focus:#FFFFFF;
  --field-text:#17191D;
  --field-ph:#8A8578;
}
.form-rule{height:3px;background:var(--tungsten);}
.form{max-width:34rem;}

.form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px;}
.form__field{margin-top:22px;}
.form__row .form__field{margin-top:0;}
.form > *:first-child{margin-top:0;}
.form__field label{
  display:block;
  font-family:var(--font-body);
  font-size:15px;font-weight:500;line-height:1.3;
  color:var(--paper);
  margin-bottom:10px;
}

.form input[type="text"],
.form input[type="email"],
.form select,
.form textarea{
  display:block;width:100%;box-sizing:border-box;
  font-family:var(--font-body);font-size:15.5px;line-height:1.5;
  color:var(--field-text);
  background:var(--field-bg);
  border:1px solid transparent;
  border-radius:var(--field-radius);
  padding:14px 16px;
  transition:background-color .18s, border-color .18s, box-shadow .18s;
}

.form ::placeholder{color:var(--field-ph);opacity:1;}

.form textarea{min-height:190px;resize:vertical;}
.form select{
  appearance:none;-webkit-appearance:none;
  padding-right:42px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236B6559' stroke-width='1.6' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
}
.form input:hover,.form select:hover,.form textarea:hover{background-color:var(--field-bg-focus);}
.form select option{
  background-color:var(--field-bg-focus);
  color:var(--field-text);
}
.form select option:checked,
.form select option:hover{
  background:linear-gradient(0deg, var(--tungsten) 0%, var(--tungsten) 100%);
  color:var(--ink);
}
.form input:focus,.form select:focus,.form textarea:focus{
  outline:none;
  background-color:var(--field-bg-focus);
  border-color:var(--tungsten);
  box-shadow:0 0 0 2px var(--tungsten), 0 0 14px 3px rgba(226,99,54,.55);
}
.form__submit{
  margin-top:34px;position:relative;
  display:flex;align-items:center;justify-content:center;
  width:100%;
  font-family:var(--font-display);font-weight:600;font-size:15px;
  color:var(--paper);
  background:var(--tungsten);
  border:0;border-radius:var(--field-radius);
  padding:18px 22px;cursor:pointer;
  transition:background .2s;
}
.form__submit:hover{background:var(--tungsten-lift);}
.form__submit img{
  position:absolute;right:24px;top:50%;transform:translateY(-50%);
  width:62px;height:auto;
}
.form__note{margin-top:18px;font-size:14px;color:var(--body-dk);line-height:1.6;}
.form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form__error{
  max-width:34rem;margin-bottom:30px;padding:16px 18px;
  background:rgba(226,99,54,.10);
  border:1px solid var(--tungsten);border-left-width:3px;
  border-radius:var(--field-radius);
  font-size:14.5px;line-height:1.6;color:var(--paper);
}
.form__error b{font-weight:600;}
.form__error a{color:var(--tungsten);border-bottom:1px solid rgba(226,99,54,.5);}
.thanks{max-width:52ch;}
.thanks .lede{margin-top:18px;}
.thanks__next{
  margin-top:34px;padding-top:26px;border-top:1px solid var(--line-dk);
  display:flex;gap:14px;flex-wrap:wrap;
}

@media (max-width:560px){
  .form__row{grid-template-columns:1fr;gap:0;}
  .form__row .form__field + .form__field{margin-top:22px;}
  .form textarea{min-height:160px;}
  .form__submit{padding-left:16px;padding-right:16px;}
  .form__submit img{width:44px;right:16px;}
}
.form-page .phero .top{grid-template-columns:1fr;}
