.elementor-463 .elementor-element.elementor-element-bd5b987{--display:flex;--margin-top:500px;--margin-bottom:-40px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-463 .elementor-element.elementor-element-579631a{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-82px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-463 .elementor-element.elementor-element-abd2a1e{width:100%;max-width:100%;margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + -0px) -10px;padding:0px 0px 0px -0px;}.elementor-463 .elementor-element.elementor-element-3cb9b9b{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:-10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-463 .elementor-element.elementor-element-8e7dbb5{--spacer-size:50px;}.elementor-463 .elementor-element.elementor-element-51bc5c6{--spacer-size:75px;width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;border-style:solid;border-width:0px 0px 2px 0px;border-color:#000000;}.elementor-463 .elementor-element.elementor-element-3c1f8ca{--spacer-size:75px;}.elementor-463 .elementor-element.elementor-element-b1e608f{--spacer-size:75px;width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;border-style:solid;border-width:0px 0px 2px 0px;border-color:#000000;}.elementor-463 .elementor-element.elementor-element-aedb6df{--spacer-size:75px;}.elementor-463 .elementor-element.elementor-element-4fd3c5a{--spacer-size:50px;}.elementor-463 .elementor-element.elementor-element-5f8365c > .elementor-widget-container{margin:-25px 0px 0px 0px;padding:0px 30px 0px 0px;}.elementor-463 .elementor-element.elementor-element-5f8365c.elementor-element{--align-self:flex-start;}@media(max-width:1024px){.elementor-463 .elementor-element.elementor-element-579631a{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-463 .elementor-element.elementor-element-579631a{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for wpforms, class: .elementor-element-5f8365c *//* ============================================================
   METTLE FLOW — "Order Support" WPForms Styling
   Targeted to form #wpforms-556 (Simple Contact Form)
   Matches the design concept: thin underline fields,
   light placeholders, and a painterly pink brushstroke
   SUBMIT button in the brand red.
   ============================================================ */

/* ---- Brand tokens (kept inline for portability) ----
   Brand red (deep):     #a2231c
   Brand red (button):   #c74545
   Brush pink (soft):    #e9a8a6
   Field underline:      #d9d9d9
   Placeholder gray:     #9a9a9a
   Input text:           #2b2b2b
--------------------------------------------------------- */

/* =========================================================
   1. CONTAINER
   On this markup the container element IS #wpforms-556,
   so we style it directly (not a child).
   margin-top keeps a clean gap below the "We're here to
   support you." subheading so the form never overlaps it.
   ========================================================= */
#wpforms-556.wpforms-container {
  padding: 0 !important;
  margin: 30px 0 0 0 !important;   /* <- restores space under the subheading */
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  max-width: 100%;
}

#wpforms-556 form {
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* =========================================================
   2. FIELD WRAPPERS — vertical rhythm
   ========================================================= */
#wpforms-556 .wpforms-field {
  padding: 0 !important;
  margin: 0 0 26px 0 !important;
}

#wpforms-556 .wpforms-field-container {
  margin: 0 !important;
}

/* =========================================================
   3. INPUTS + TEXTAREA — underline-only style

   Astra sets form text via --ast-form-input-text (#475569)
   and placeholders via --ast-form-field-color (#9CA3AF), and
   the WPForms modern theme sets --wpforms-field-text-color.
   We reset ALL of those at the container so nothing wins
   over our darker values.
   ========================================================= */
#wpforms-556 {
  --ast-form-input-text: #111111 !important;
  --ast-form-input-focus-text: #111111 !important;
  --ast-form-field-color: #6f6f6f !important;       /* placeholder */
  --wpforms-field-text-color: #111111 !important;
  --wpforms-field-border-color: #9a9a9a !important; /* underline */
  --wpforms-label-color: #111111 !important;
}

#wpforms-556 input[type="text"],
#wpforms-556 input[type="email"],
#wpforms-556 input[type="tel"],
#wpforms-556 input[type="url"],
#wpforms-556 input[type="number"],
#wpforms-556 input[type="password"],
#wpforms-556 textarea,
#wpforms-556 select {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 100% !important;
  border: 0 !important;
  border-bottom: 1.5px solid #9a9a9a !important;   /* darker underline */
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 6px 2px 10px 2px !important;
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 500 !important;                      /* slightly bolder */
  line-height: 1.5 !important;
  color: #111111 !important;                         /* near-black text */
  transition: border-color 0.25s ease !important;
}

/* Single-line input heights stay compact */
#wpforms-556 input[type="text"],
#wpforms-556 input[type="email"],
#wpforms-556 input[type="tel"],
#wpforms-556 input[type="url"],
#wpforms-556 input[type="number"],
#wpforms-556 input[type="password"] {
  height: auto !important;
}

/* Textarea — taller, no manual resize handle distraction */
#wpforms-556 textarea {
  min-height: 70px !important;
  resize: vertical !important;
  line-height: 1.5 !important;
}

/* =========================================================
   4. FOCUS — darken the underline to brand red, keep text dark
   ========================================================= */
#wpforms-556 input:focus,
#wpforms-556 textarea:focus,
#wpforms-556 select:focus {
  border-bottom-color: #a2231c !important;
  border-bottom-width: 1.5px !important;
  outline: 0 !important;
  box-shadow: none !important;
  color: #111111 !important;
}

/* Kill the browser autofill background tint */
#wpforms-556 input:-webkit-autofill,
#wpforms-556 input:-webkit-autofill:hover,
#wpforms-556 input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
  -webkit-text-fill-color: #111111 !important;
  transition: background-color 9999s ease-in-out 0s !important;
}

/* =========================================================
   5. PLACEHOLDERS — readable medium gray (not too light)
   ========================================================= */
#wpforms-556 input::placeholder,
#wpforms-556 textarea::placeholder {
  color: #6f6f6f !important;
  opacity: 1 !important;
  font-weight: 500 !important;
}
#wpforms-556 input::-webkit-input-placeholder,
#wpforms-556 textarea::-webkit-input-placeholder { color: #6f6f6f !important; font-weight: 500 !important; }
#wpforms-556 input::-moz-placeholder,
#wpforms-556 textarea::-moz-placeholder { color: #6f6f6f !important; opacity: 1 !important; font-weight: 500 !important; }
#wpforms-556 input:-ms-input-placeholder,
#wpforms-556 textarea:-ms-input-placeholder { color: #6f6f6f !important; }

/* =========================================================
   6. LABELS — hidden (design relies on placeholders)
   ========================================================= */
#wpforms-556 .wpforms-field-label,
#wpforms-556 .wpforms-label-hide {
  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;
}

/* The little red required asterisk — keep it on-brand if shown */
#wpforms-556 .wpforms-required-label {
  color: #a2231c !important;
}

/* =========================================================
   7. ERROR STATES — on-brand red, underline only
   ========================================================= */
#wpforms-556 input.wpforms-error,
#wpforms-556 textarea.wpforms-error {
  border-bottom-color: #d63637 !important;
  background: transparent !important;
}
#wpforms-556 label.wpforms-error,
#wpforms-556 .wpforms-field-error-message {
  color: #d63637 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  margin-top: 6px !important;
}

/* =========================================================
   8. SUBMIT — organic "blob" button
   Uses the asymmetric border-radius technique so the button
   reads as a hand-shaped blob, with a smooth morph + scale on
   hover. Poppins 700 is already enqueued site-wide.

   COLOR: defaults to solid brand red / white text (the site
   button style). To switch to the soft-pink "Order Support"
   swatch look instead, see the commented block below.
   ========================================================= */
#wpforms-556 .wpforms-submit-container {
  margin-top: 22px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

#wpforms-556 button.wpforms-submit,
#wpforms-556 .wpforms-submit {
  display: inline-block !important;
  position: relative !important;

  /* shape + animation */
  border: none !important;
  border-radius: 60% 40% 55% 45% / 45% 55% 40% 60% !important;
  box-shadow: none !important;
  transition: border-radius 0.4s ease, transform 0.2s ease,
              background-color 0.2s ease !important;

  /* color — solid brand red, white text */
  background: #a2231c !important;
  background-color: #a2231c !important;
  background-image: none !important;
  color: #ffffff !important;

  /* type */
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  text-decoration: none !important;

  /* sizing */
  padding: 16px 46px !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  cursor: pointer !important;
}

/* Hover — morph the blob to a new asymmetric shape + slight grow */
#wpforms-556 button.wpforms-submit:hover,
#wpforms-556 .wpforms-submit:hover {
  border-radius: 45% 55% 40% 60% / 60% 40% 55% 45% !important;
  transform: scale(1.04) !important;
  background: #a2231c !important;
  background-color: #a2231c !important;
  color: #ffffff !important;
}

#wpforms-556 button.wpforms-submit:focus,
#wpforms-556 .wpforms-submit:focus {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #a2231c !important;
  color: #ffffff !important;
}

#wpforms-556 button.wpforms-submit:active,
#wpforms-556 .wpforms-submit:active {
  transform: scale(0.99) !important;
}

#wpforms-556 button.wpforms-submit:disabled {
  opacity: 0.55 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* ---- OPTIONAL: soft-pink "Order Support" swatch variant ----
   To use the pink-with-dark-red-text look from the mockup
   instead of solid red, replace the color lines above with:

   background: #e9a8a6 !important;
   background-color: #e9a8a6 !important;
   color: #a2231c !important;

   ...and in the :hover rule:

   background: #e9a8a6 !important;
   background-color: #e9a8a6 !important;
   color: #a2231c !important;
------------------------------------------------------------ */

/* Submit spinner sits beside the button */
#wpforms-556 .wpforms-submit-spinner {
  width: 22px !important;
  height: 22px !important;
  margin-left: 14px !important;
}

/* =========================================================
   9. HIDE HONEYPOT / ANTI-SPAM DECOYS
   (fields 5 & 6 are decoys in this form)
   ========================================================= */
#wpforms-556 #wpforms-556-field_5-container,
#wpforms-556 #wpforms-556-field_6-container {
  position: absolute !important;
  left: -9999px !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
}

/* =========================================================
   10. SUCCESS / CONFIRMATION MESSAGE
   ========================================================= */
.wpforms-confirmation-container-full {
  background: #fff6f5 !important;
  border: 1px solid #e9a8a6 !important;
  border-radius: 6px !important;
  color: #a2231c !important;
  padding: 18px 20px !important;
}

/* =========================================================
   11. RESPONSIVE
   ========================================================= */
@media (max-width: 767px) {
  #wpforms-556 .wpforms-field {
    margin-bottom: 22px !important;
  }
  #wpforms-556 input[type="text"],
  #wpforms-556 input[type="email"],
  #wpforms-556 textarea {
    font-size: 16px !important; /* keeps iOS from zooming on focus */
  }
  #wpforms-556 button.wpforms-submit,
  #wpforms-556 .wpforms-submit {
    padding: 20px 40px !important;
    min-width: 150px !important;
    font-size: 13px !important;
  }
}/* End custom CSS */