/* Apple feedback-style fields with localized floating labels. */
:root {
  --contact-field-bg:#fff;
  --contact-field-text:#1d1d1f;
  --contact-field-border:#d2d2d7;
  --contact-placeholder:#6e6e73;
  --contact-focus:#0071e3;
  --contact-focus-ring:rgba(0,125,250,.6);
}
@media (prefers-color-scheme:dark) {
  :root {
    --contact-field-bg:#1c1c1e;
    --contact-field-text:#f5f5f7;
    --contact-field-border:#3a3a3f;
    --contact-placeholder:#a1a1a6;
    --contact-focus:#5cb8ff;
    --contact-focus-ring:rgba(92,184,255,.5);
  }
}
html body form[data-contact] { width:100%; max-width:640px; margin-inline:auto; }
html body form[data-contact] .form-group { margin-bottom:12px !important; }
html body form[data-contact] .form-control {
  min-height:56px;
  box-sizing:border-box;
  padding:24px 16px 6px;
  border:1px solid var(--contact-field-border) !important;
  border-radius:12px !important;
  background:var(--contact-field-bg) !important;
  color:var(--contact-field-text) !important;
  box-shadow:none !important;
  font:400 17px/1.2353 var(--site-font-sans,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  font-size:17px !important;
}
html body form[data-contact] .contact-field { position:relative; width:100%; }
html body form[data-contact] input.form-control { height:56px; }
html body form[data-contact] .contact-field > label {
  position:absolute;
  inset-inline:17px;
  top:17px;
  margin:0;
  color:var(--contact-placeholder) !important;
  font:400 17px/1.2353 var(--site-font-sans,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  text-align:start;
  pointer-events:none;
  transition:top 150ms ease,font-size 150ms ease;
}
html body form[data-contact] .contact-field > .form-control:is(:focus, :not(:placeholder-shown), :autofill, :-webkit-autofill) + label {
  top:8px;
  font-size:12px;
  line-height:16px;
}
/* Keep a scrolled message beneath the label, not underneath its letters. */
html body form[data-contact] .contact-field > textarea.form-control:is(:focus, :not(:placeholder-shown)) + label {
  top:1px;
  inset-inline:1px;
  padding:7px 15px 4px;
  background:var(--contact-field-bg);
  border-radius:11px 11px 0 0;
}
html body form[data-contact] .form-control::placeholder { color:transparent !important; }
html body form[data-contact] textarea.form-control { min-height:160px; resize:vertical; }
html body form[data-contact] .form-control:focus {
  border-color:var(--contact-focus) !important;
  outline:none !important;
  box-shadow:0 0 0 4px var(--contact-focus-ring) !important;
}
html body form[data-contact] .aftl-section-btn { margin-block:0; }
html body form[data-contact] button[type="submit"] {
  width:100%; min-height:48px; margin:0; padding:13px 20px;
  border-radius:100px;
  font:600 17px/1.3 var(--site-font-sans,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}
html body form[data-contact] .contact-security { padding-inline:12px; margin-block:0 16px; }
html body form[data-contact] .contact-security:has([data-security-status]:empty) { margin-block:0; }
html body form[data-contact] .alert { border-radius:12px; font:400 17px/1.45 var(--site-font-sans); }

@media (prefers-reduced-motion:reduce) {
  html body form[data-contact] .contact-field > label { transition:none; }
}
