/* ==========================================================
   CLUTCH GLOBAL INQUIRY FORM 332
   Functional owner: WPForms ID 332
   Visual owner: THIS FILE

   Any page rendering form 332 receives this same component.
   Page-family CSS may position the surrounding panel only.
   ========================================================== */


/* ----------------------------------------------------------
   ROOT
   ---------------------------------------------------------- */

#wpforms-332,
#wpforms-form-332 {
  box-sizing: border-box !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
}


/* ----------------------------------------------------------
   FIELD GRID
   ---------------------------------------------------------- */

#wpforms-form-332 .wpforms-field-container {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr) !important;

  column-gap: 16px !important;

  width: 100% !important;
  max-width: none !important;
}


/* Name */

#wpforms-332-field_0-container {
  grid-column: 1 / -1 !important;
}


/* Company + Phone */

#wpforms-332-field_5-container {
  grid-column: 1 !important;
}

#wpforms-332-field_6-container {
  grid-column: 2 !important;
}


/* Full-width rows */

#wpforms-332-field_1-container,
#wpforms-332-field_2-container,
#wpforms-332-field_3-container,
#wpforms-332-field_4-container {
  grid-column: 1 / -1 !important;
}


/* ----------------------------------------------------------
   NORMALIZE FIELD CONTAINERS
   ---------------------------------------------------------- */

#wpforms-form-332 .wpforms-field,
#wpforms-332-field_0-container,
#wpforms-332-field_1-container,
#wpforms-332-field_2-container,
#wpforms-332-field_3-container,
#wpforms-332-field_4-container,
#wpforms-332-field_5-container,
#wpforms-332-field_6-container {
  box-sizing: border-box !important;

  float: none !important;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  margin: 0 !important;
}

#wpforms-form-332 .wpforms-field {
  padding: 0 0 18px !important;
}


/* WPForms medium sizing must never narrow the component. */

#wpforms-form-332 .wpforms-field-medium,
#wpforms-form-332 input.wpforms-field-medium,
#wpforms-form-332 textarea.wpforms-field-medium,
#wpforms-form-332 select.wpforms-field-medium {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}


/* ----------------------------------------------------------
   NAME — FIRST / LAST
   ---------------------------------------------------------- */

#wpforms-332-field_0-container .wpforms-field-row {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr) !important;

  gap: 16px !important;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  margin: 0 !important;
}


/*
 * PROVEN BOSS FIX:
 * WPForms clearfix pseudo-elements become grid items when the
 * Name row is converted to CSS Grid.
 */

#wpforms-332-field_0-container .wpforms-field-row::before,
#wpforms-332-field_0-container .wpforms-field-row::after {
  content: none !important;
  display: none !important;
}


#wpforms-332-field_0-container .wpforms-field-row-block {
  display: block !important;

  float: none !important;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;
}


/* ----------------------------------------------------------
   LABELS
   ---------------------------------------------------------- */

#wpforms-form-332 .wpforms-field-label,
#wpforms-form-332 .wpforms-field-sublabel {
  display: block !important;

  color: #ffffff !important;
}

#wpforms-form-332 .wpforms-field-label {
  margin: 0 0 8px !important;

  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

#wpforms-form-332 .wpforms-field-sublabel {
  margin: 7px 0 0 !important;

  color: #aab7c5 !important;

  font-size: 12px !important;
  font-weight: 600 !important;
}

#wpforms-form-332 .wpforms-required-label {
  color: #76a7ff !important;
}

#wpforms-form-332 .wpforms-field-description {
  margin-top: 7px !important;

  color: #9db0c2 !important;

  font-size: 12px !important;
  line-height: 1.45 !important;
}


/* ----------------------------------------------------------
   INPUT SURFACES
   ---------------------------------------------------------- */

#wpforms-form-332 input[type="text"],
#wpforms-form-332 input[type="email"],
#wpforms-form-332 input[type="tel"],
#wpforms-form-332 input[type="url"],
#wpforms-form-332 input[type="number"],
#wpforms-form-332 select,
#wpforms-form-332 textarea {
  box-sizing: border-box !important;

  display: block !important;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  margin: 0 !important;

  background: #111e2c !important;
  background-color: #111e2c !important;

  border: 1px solid rgba(143,181,255,.24) !important;
  border-radius: 6px !important;

  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;

  font-size: 15px !important;
  line-height: 1.4 !important;

  box-shadow: none !important;
  outline: none !important;
}

#wpforms-form-332 input[type="text"],
#wpforms-form-332 input[type="email"],
#wpforms-form-332 input[type="tel"],
#wpforms-form-332 input[type="url"],
#wpforms-form-332 input[type="number"],
#wpforms-form-332 select {
  height: 51px !important;
  min-height: 51px !important;

  padding: 0 14px !important;
}

#wpforms-form-332 textarea {
  min-height: 156px !important;

  padding: 14px !important;

  resize: vertical !important;
}


/* Focus */

#wpforms-form-332 input:focus,
#wpforms-form-332 select:focus,
#wpforms-form-332 textarea:focus {
  border-color: #155eef !important;

  box-shadow:
    0 0 0 3px rgba(21,94,239,.18) !important;
}


/* Autofill */

#wpforms-form-332 input:-webkit-autofill,
#wpforms-form-332 input:-webkit-autofill:hover,
#wpforms-form-332 input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff !important;

  -webkit-box-shadow:
    0 0 0 1000px #111e2c inset !important;

  box-shadow:
    0 0 0 1000px #111e2c inset !important;

  caret-color: #ffffff !important;
}


/* ----------------------------------------------------------
   RADIO CARDS
   ---------------------------------------------------------- */

#wpforms-332-field_2-container ul {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr) !important;

  gap: 8px !important;

  width: 100% !important;

  margin: 8px 0 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

#wpforms-332-field_2-container li {
  position: relative !important;

  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

#wpforms-332-field_2-container input[type="radio"] {
  position: absolute !important;

  width: 1px !important;
  height: 1px !important;

  opacity: 0 !important;

  pointer-events: none !important;
}

#wpforms-332-field_2-container label.wpforms-field-label-inline {
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  min-height: 42px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  background: rgba(255,255,255,.025) !important;

  border: 1px solid rgba(143,181,255,.22) !important;
  border-radius: 6px !important;

  color: #ffffff !important;

  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;

  cursor: pointer !important;

  transition:
    background-color .15s ease,
    border-color .15s ease !important;
}

#wpforms-332-field_2-container
label.wpforms-field-label-inline:hover {
  border-color: rgba(118,167,255,.75) !important;
}

#wpforms-332-field_2-container
input[type="radio"]:checked + label {
  background: rgba(21,94,239,.18) !important;

  border-color: #76a7ff !important;

  color: #ffffff !important;
}


/* ----------------------------------------------------------
   SUBMIT
   ---------------------------------------------------------- */

#wpforms-form-332 .wpforms-submit-container {
  margin-top: 6px !important;
  padding: 0 !important;
}

#wpforms-form-332 .wpforms-submit {
  box-sizing: border-box !important;

  width: 204px !important;
  min-width: 204px !important;

  height: 50px !important;
  min-height: 50px !important;

  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  padding: 2px 18px 0 !important;

  background: #155eef !important;

  border: 1px solid #155eef !important;
  border-radius: 5px !important;

  color: #ffffff !important;

  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  text-align: center !important;
  white-space: nowrap !important;

  cursor: pointer !important;

  transition:
    transform .15s ease,
    background-color .15s ease,
    border-color .15s ease,
    color .15s ease !important;
}

#wpforms-form-332 .wpforms-submit:hover,
#wpforms-form-332 .wpforms-submit:focus-visible {
  transform: translateY(-2px) !important;

  background: transparent !important;

  border-color: #76a7ff !important;

  color: #ffffff !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 600px) {

  #wpforms-form-332 .wpforms-field-container,
  #wpforms-332-field_0-container .wpforms-field-row,
  #wpforms-332-field_2-container ul {
    grid-template-columns: 1fr !important;
  }

  #wpforms-332-field_0-container,
  #wpforms-332-field_1-container,
  #wpforms-332-field_2-container,
  #wpforms-332-field_3-container,
  #wpforms-332-field_4-container,
  #wpforms-332-field_5-container,
  #wpforms-332-field_6-container {
    grid-column: 1 !important;
  }

  #wpforms-form-332 .wpforms-submit {
    width: 100% !important;
  }
}
