#contact { --inquiry-accent: #5a59ec; --inquiry-text: #fff; }
#contact [hidden] { display: none !important; }
#contact .inquiry-form, #contact .inquiry-form * { box-sizing: border-box; }
#contact .inquiry-form { width: 100%; margin: 0; color: var(--inquiry-text); font-family: "Neue Montreal", Arial, sans-serif; }
#contact .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-bottom: 22px; }
#contact .form-field { display: flex; flex-direction: column; min-width: 0; margin: 0 0 22px; }
#contact .form-row .form-field { margin: 0; }
#contact .form-field > label, #contact .inquiry-services > legend { display: block; margin: 0 0 9px; color: #fff; font: 500 15px/1.35 "Neue Montreal", Arial, sans-serif; }
#contact .inquiry-input {
  display: block; width: 100%; max-width: 100%; min-height: 50px; margin: auto 0 0;
  border: 1px solid rgb(255 255 255 / 65%); border-radius: 26px; background: transparent;
  padding: 13px 20px; color: #fff; font: 400 16px/1.4 "Neue Montreal", Arial, sans-serif; box-shadow: none;
}
#contact .inquiry-input::placeholder { color: rgb(255 255 255 / 65%); opacity: 1; }
#contact .inquiry-input:-webkit-autofill { -webkit-text-fill-color: #111; }
#contact select.inquiry-input { cursor: pointer; color-scheme: dark; }
#contact select.inquiry-input option { background: #151515; color: #fff; }
#contact textarea.inquiry-input { min-height: 124px; border-radius: 22px; resize: vertical; }
#contact .inquiry-services { min-width: 0; border: 0; padding: 0; margin: 0 0 22px; }
#contact .service-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 22px; row-gap: 2px; }
#contact .service-option { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding: 10px 0; font: 400 15px/1.45 "Neue Montreal", Arial, sans-serif; cursor: pointer; }
#contact .service-option input { flex: 0 0 20px; appearance: auto; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--inquiry-accent); cursor: pointer; }
#contact .service-option span { min-width: 0; }
#contact .field-note { margin: 0 0 8px; color: rgb(255 255 255 / 80%); font: 400 14px/1.5 "Neue Montreal", Arial, sans-serif; }
#contact .field-error { margin: 8px 0 0; color: #ffb8c0; font: 400 14px/1.45 "Neue Montreal", Arial, sans-serif; }
#contact .inquiry-form[data-attempted] .inquiry-input:invalid { border-color: #ffb8c0; }
#contact .form-actions { margin: 24px 0 0; }
#contact #form-submit, #contact #form-retry, #contact .email-fallback {
  display: inline-flex; align-items: center; justify-content: center; min-width: 160px; min-height: 50px;
  border: 1px solid transparent; border-radius: 100px; padding: 15px 30px; background: #5a59ec;
  color: #fff; font: 500 16px/1.3 "Neue Montreal", Arial, sans-serif; text-align: center;
  text-decoration: none; cursor: pointer; box-shadow: none; transition: background-color 160ms ease;
}
#contact #form-submit:hover, #contact #form-retry:hover { background: #4847ce; }
#contact .email-fallback { background: transparent; border-color: rgb(255 255 255 / 65%); }
#contact .email-fallback:hover { background: #242424; }
#contact .email-fallback-note { margin: 10px 0 0; font-size: 14px; line-height: 1.5; }
#contact #form-submit:disabled, #contact #form-retry:disabled { opacity: .6; cursor: wait; }
#contact :is(input, select, textarea, button, a):focus-visible { outline: 3px solid #d4d4ff; outline-offset: 4px; }
#contact #form-loading, #contact #form-error { margin: 20px 0; color: #fff; font: 400 16px/1.5 "Neue Montreal", Arial, sans-serif; }
#contact #form-error p { margin: 0 0 16px; }
#contact #form-error:focus, #contact #form-success:focus { outline: 3px solid #d4d4ff; outline-offset: 6px; }
#contact .submitted-message { box-sizing: border-box; min-width: 0; padding: clamp(24px, 4vw, 48px); border: 1px solid #393939; border-radius: 24px; background: #141414; color: #fff; font-family: "Neue Montreal", Arial, sans-serif; scroll-margin-block: 100px 32px; }
#contact .confirmation-status { display: flex; align-items: center; gap: 12px; margin-bottom: 30px; color: #ceceff; font-size: 14px; font-weight: 500; }
#contact .confirmation-check { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%; background: #5a59ec; color: #fff; }
#contact .confirmation-check svg { width: 24px; height: 24px; }
#contact #success-title { margin: 0 0 18px; font-size: clamp(32px, 3.7vw, 50px); font-weight: 500; line-height: 1.08; letter-spacing: -.035em; }
#contact .confirmation-copy { max-width: 34ch; margin: 0; color: #d0d0d0; font-size: 18px; line-height: 1.55; }
#contact .confirmation-details { display: grid; gap: 20px; margin: 30px 0; padding: 24px 0; border-block: 1px solid #393939; }
#contact .confirmation-details div { min-width: 0; }
#contact .confirmation-details dt { margin-bottom: 6px; color: #adadad; font-size: 13px; line-height: 1.4; }
#contact .confirmation-details dd { margin: 0; overflow-wrap: anywhere; font-size: 17px; line-height: 1.45; }
#contact .confirmation-work { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 50px; padding: 14px 24px; border-radius: 100px; background: #5a59ec; color: #fff; font-size: 16px; font-weight: 500; text-decoration: none; }
#contact .confirmation-work:hover { background: #4847ce; }
#contact .confirmation-followup { margin: 24px 0 0; color: #bcbcbc; font-size: 14px; line-height: 1.55; }
#contact .confirmation-followup a { display: inline-flex; align-items: center; min-height: 44px; color: #fff; text-underline-offset: 4px; }
#contact .confirmation-followup span { display: block; color: #999; font-size: 12px; }
#contact[data-form-state="submitted"] .contact-copy > p:first-of-type,
#contact[data-form-state="submitted"] .contact-copy > .email-fallback,
#contact[data-form-state="submitted"] .email-fallback-note { display: none; }
#contact[data-form-state="submitted"] #form-loading { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#contact .form-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) {
  #contact .form-row, #contact .service-options { grid-template-columns: minmax(0, 1fr); }
  #contact .form-row { gap: 20px; margin-bottom: 20px; }
  #contact .form-field > label, #contact .inquiry-services > legend, #contact .service-option { font-size: 16px; }
  #contact #form-submit { width: 100%; }
  #contact .confirmation-work { width: 100%; box-sizing: border-box; }
}
@media (prefers-reduced-motion: reduce) {
  #contact #form-submit, #contact #form-retry, #contact .email-fallback { transition: none; }
}