/* Home-page embed of the contact-form section (extracted from the old
   contact page css; hero rules omitted -- home has its own hero). */
/* 880, not 740: the home page's form is laid out on the 880px canvas and its
   lowest control sits at 779px. The five-page rebuild set 740 to suit ITS own
   form (patterns.css carries that value for those pages), and since the
   section does not clip, the submit button simply rendered 39px below the
   section and the footer painted over it. */
.sec-contact-form { --h: 880px; background: rgba(247,247,247,1); }
.z-contact-form_1 { left: 60px; top: 589px; width: 510px; line-height: 1.4; font-size: 15px; white-space: nowrap; }
.z-contact-form_2 { left: 60px; top: 558px; width: 510px; font-size: 17px; font-family: 'Poppins'; font-weight: 400; font-style: normal; white-space: nowrap; }
.z-contact-form_3 { left: 60px; top: 188px; width: 462px; line-height: 1.2; font-size: 50px; }
.z-contact-form_4 { left: 60px; top: 114px; width: 510px; text-align: left; white-space: nowrap; }
/* MOBILE (additive layer; see style.css) */

@media (max-width: 900px) {

  .sec-contact-form .cv { display: flex; flex-direction: column; padding: 60px 22px 70px; }
  .sec-contact-form .z-contact-form_4 { order: 1; font-size: 17px; }
  .sec-contact-form .z-contact-form_3 { order: 2; font-size: 28px; margin-top: 14px; }
  .sec-contact-form .z-contact-form_2 { order: 3; font-size: 16px; margin-top: 26px; }
  .sec-contact-form .z-contact-form_1 { order: 4; margin-top: 4px; }
  .sec-contact-form .contact-form { order: 5; margin-top: 34px; }
  /* form fields carry inline geometry → !important to neutralize */
  .sec-contact-form .cf-view:not([hidden]) { position: static; display: flex;
      flex-direction: column; gap: 20px; }
  /* rebuilt flow form: rows dissolve into the column on a phone */
  .sec-contact-form .cf-form .form-row { display: contents; }
  .sec-contact-form .field { position: static !important; left: auto !important;
      top: auto !important; width: 100% !important; }
  /* The add-on fieldset carries inline canvas geometry like the fields do, so it
     needs the same neutralising. Restored: the five-page rebuild dropped this
     rule because its own pages handle .addon-picks elsewhere, but the home page
     still carries the fieldset, and without this it kept desktop coordinates on
     mobile and pushed the contact section to 1142px against a 390px screen. */
  .sec-contact-form .addon-picks { position: static !important; left: auto !important;
      top: auto !important; width: 100% !important; }
  .sec-contact-form .cf-form .btn { position: static !important; left: auto !important;
      top: auto !important; width: 100% !important; max-width: 340px; height: 50px;
      margin-top: 8px; align-self: flex-start; }
  .sec-contact-form .cf-success > * { position: static !important; left: auto !important;
      top: auto !important; width: auto !important; }
}


/* ============ CONTACT FORM: DESKTOP FLOW (2026-08-13) ============
   The form's controls carried inline canvas coordinates, locking the portal
   form editor to reword-only. Flow markup now (pairs in .form-row divs) and
   this block reproduces the measured live geometry: 19px gaps from y113,
   addons -2/-17.5 (its bottom sat 1.5px above the textarea on live; in some
   Google-Fonts builds the canvas actually OVERLAPPED there, which flow makes
   impossible), button +1, 101px bottom gap, section 880 floor. Mechanism per
   the PBLA conversion: .cv is the flex root (block-chain margin collapse),
   decor left column stays pinned, button keeps sizing inline so the mobile
   height:50 keeps losing to it exactly as before. */
@media (min-width: 901px) {
  .sec-contact-form, .sec-contact-form .cv { height: auto; min-height: 880px; }
  .sec-contact-form .cv { display: flex; flex-direction: column; align-items: flex-start; }
  .sec-contact-form .contact-form { position: static; width: 510px;
      margin: 113px 60px 101px 630px; }
  .sec-contact-form .cf-view.cf-form:not([hidden]) { position: static; display: flex;
      flex-direction: column; gap: 19px; }
  .sec-contact-form .cf-form .field { position: static; width: 100%; }
  .sec-contact-form .cf-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
  /* a field left alone on a shared row spans the full line (owner rule) */
  .sec-contact-form .cf-form .form-row > :only-child { grid-column: 1 / -1; }
  .sec-contact-form .cf-form .addon-picks { position: static; width: 510px;
      margin: -2px 0 -17.5px 2px; }
  .sec-contact-form .cf-form .btn { margin-top: 1px; }
  .sec-contact-form .cf-form .cf-error { position: static; width: auto; }
}