.field select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding-right:58px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23122238' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 20px center;
  background-size:18px;
}

.file-picker{
  min-height:74px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 16px;
}
.file-picker__button{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 13px;
  border:1px solid #7f8792;
  border-radius:7px;
  background:#f7f7f7;
  color:#111;
  font-weight:600;
  cursor:pointer;
}
.file-picker__button:hover{background:#efefef}
.file-picker__input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.selected-files{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:7px;
}
.selected-file,
.file-empty{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--ink);
}
.selected-file span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.file-empty{color:var(--muted)}
.selected-file__remove{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#a82f2f;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.selected-file__remove:hover{background:#fff0f0;color:#7f1f1f}

.form-status{margin-top:14px;font-weight:750;min-height:1.5em}
.form-status.success{color:#2f6b4f}
.form-status.error{color:#a83a35}
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@media(max-width:700px){
  .file-picker{align-items:flex-start;flex-direction:column}
  .selected-files{width:100%}
  .field select{background-position:right 16px center;padding-right:50px}
}

/* Keep the contact grid and its controls inside the available viewport. */
.contact-grid,
.contact-grid > *,
.contact-grid .form-grid,
.contact-grid .field,
.contact-grid .file-picker,
.contact-grid .selected-files {
  min-width: 0;
  max-width: 100%;
}

.contact-grid .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contact-grid .field input:not([type="file"]),
.contact-grid .field select,
.contact-grid .field textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.contact-grid .contact-panel h2 {
  overflow-wrap: break-word;
}

@media (max-width: 900px) {
  .contact-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  /* The inline heading size on the contact page was forcing the grid wider. */
  .contact-grid .contact-panel h2 {
    font-size: clamp(1.75rem, 5vw, 2.7rem) !important;
  }
}

@media (max-width: 620px) {
  .contact-grid .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .contact-grid .contact-panel,
  .contact-grid .form {
    padding: clamp(20px, 6vw, 34px);
  }

  .contact-grid .form button[type="submit"] {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
}