/* ==========================================================================
   HOMEPAGE HERO · THE WEBSITE ADDRESS — "Fixed plate" (owner's pick of the
   website-field study, Solution 01, 2026-10-10).

   "https://www." used to be grey words in the address's own typeface, 2px
   from the grey hint "yourcompany.com", so the two read as ONE example
   address and visitors typed (or pasted) the whole thing. Here the prefix is a
   pale fixed plate at the left end of the field, mirroring the blue button at
   the right end: the field reads as fixed part · your part · action, and the
   white area after the plate is plainly where typing starts.
   Behaviour (a click on the plate focuses the box; a typed or pasted https:// or
   www. is absorbed; Backspace cannot take the plate): assets/forms/website/website.js,
   attached in assets/home/hero/audit-form.js. Its two moments (.ws-took,
   .ws-press) come from assets/forms/website/website.css.

   The address step only (the field alone). Once the name + mobile step is open
   (.tr-open desktop, .as-open phones) the address is a well and the live rules
   in keyline.css / desktop.css draw it, unchanged. The field's size, position,
   frame, shadow and button are unchanged.
   Colours: plate #EAF1FB = 8% tint of the button blue #0760C6 (the hero's own
   field blue) with a 1px edge at 12%; plate words --ink2 #33425A (8.9:1).
   The button stays the only strong blue.
   Linked last among the hero's styles in index.html; delete that line to undo.
   ========================================================================== */
@media (min-width: 761px) {
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > .hx-fix {
    align-self: stretch; margin: 0; padding: 0 15px; border-radius: 10px;   /* 10 = the field's 16 − its 6px inset, like the button */
    background: #EAF1FB; box-shadow: inset 0 0 0 1px rgba(7, 96, 198, .12);
    font: 500 16px/1 -apple-system, "system-ui", "Helvetica Neue", "Segoe UI", Arial, sans-serif;
    letter-spacing: 0; color: #33425A; cursor: text; -webkit-user-select: none; user-select: none;
  }
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > #hxSite { padding-left: 14px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > .hx-fix { padding: 0 13px; font-size: 15px; }
}

/* phones: the same plate inside the white Straddle field, centred in its 58px row */
@media (max-width: 760px) {
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) { padding-left: 9px; }
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > .hx-fix {
    height: 40px; padding: 0 11px; border-radius: 13px;                     /* 13 = the field's 22 − its 9px inset */
    background: #EAF1FB; box-shadow: inset 0 0 0 1px rgba(7, 96, 198, .12);
    font: 500 15px/1 -apple-system, "system-ui", "Helvetica Neue", "Segoe UI", Arial, sans-serif;
    color: #33425A; cursor: text; -webkit-user-select: none; user-select: none;
  }
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > #hxSite { padding-left: 12px; }
}
@media (max-width: 350px) {
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > .hx-fix { padding: 0 9px; font-size: 14px; }
  html body #hx.hx.hx.hx form#hxForm:not(.tr-open):not(.as-open) > #hxSite { padding-left: 10px; }
}
