/* Softer page background */

}

/* Remove box styling from inputs + selects + textarea */
.elq-form input[type="text"],
.elq-form select,
.elq-form textarea {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #c7ced6 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 10px 4px !important;
  font-size: 15px;
  color: #1f2a37;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Make selects match clean style */
.elq-form select {
  appearance: none;
  -webkit-appearance: none;
  background-image: none;
}

/* Focus state (subtle darker underline) */
.elq-form input[type="text"]:focus,
.elq-form select:focus,
.elq-form textarea:focus {
  outline: none !important;
  border-bottom: 1.5px solid #1f2a37 !important;
}

/* Remove heavy textarea box feel */
.elq-form textarea {
  resize: vertical;
  min-height: 80px;
}

/* Softer label color */
.elq-form .elq-label {
  color: #5f6b7a;
  font-size: 13px;
  font-weight: 500;
}

/* Required asterisk color refinement */
.elq-form .elq-required {
  color: #e04b4b !important;
}

/* Optional: soften button to match current demo page vibe */
#fe282 {
  background-color: #1f2a37;
  color: #ffffff;
  border: none;
  padding: 10px 28px;
  font-size: 14px;
  border-radius: 24px;
  transition: background-color 0.25s ease;
}

#fe282:hover {
  background-color: #111827;
}
#fe282 {
  display: block;
  margin: 30px auto 0 auto; /* centers horizontally */
}
#form23 {
  max-width: 620px;
  margin: 0 auto;
}

.elq-form .elq-field-style {
  padding-bottom: 12px !important;
}

.elq-form input[type="text"],
.elq-form select,
.elq-form textarea {
  width: 95% !important;
}

/* HERO SECTION */
.demo-hero {
  text-align: center;
  padding: 80px 20px 40px 20px;
}

.demo-hero-icon {
  width: 120px;
  margin-bottom: 30px;
}

.demo-hero h1 {
  font-size: 42px;
  letter-spacing: 1px;
  color: #1f2a37;
  margin-bottom: 16px;
}

.demo-hero p {
  font-size: 16px;
  color: #5f6b7a;
  margin-bottom: 40px;
}

.demo-wrapper {
  padding-bottom: 80px;
}

.demo-hero {
  text-align: center;
  padding: 80px 20px 40px 20px;
  background: transparent;  /* important */
}

#form23 {
  background: transparent;  /* important */
}

/* Make the whole module use the page background */
.demo-wrapper,
.demo-hero,
#form23,
#form23 .layout.container-fluid {
  background: transparent !important;
}

/* ===== SOFT ENTERPRISE FIELD STYLE ===== */

#form23 input.elq-item-input,
#form23 select.elq-item-select,
#form23 textarea.elq-item-textarea {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #d6dde6 !important;   /* softer line */
  border-radius: 0 !important;
  box-shadow: none !important;

  padding: 10px 2px !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #2f3b4a !important;   /* softer navy */
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  transition: border-color 0.25s ease;
}

/* Softer placeholder */
#form23 input.elq-item-input::placeholder,
#form23 textarea.elq-item-textarea::placeholder {
  color: #8a96a3 !important;
  font-weight: 400;
}

/* Focus state (clean, not aggressive) */
#form23 input.elq-item-input:focus,
#form23 select.elq-item-select:focus,
#form23 textarea.elq-item-textarea:focus {
  outline: none !important;
  border-bottom: 1.5px solid #2f3b4a !important;
}

/* Remove wrapper styling */
#form23 .field-control-wrapper {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Labels - softer tone */
#form23 .elq-label {
  color: #6f7c8a !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

/* ===== Soften Select Dropdown Appearance ===== */

#form23 select.elq-item-select {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #d6dde6 !important;
  color: #6f7c8a !important;          /* softer text tone */
  font-weight: 400 !important;
  font-size: 15px !important;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

/* When user has selected an actual value */
#form23 select.elq-item-select:valid {
  color: #2f3b4a !important;          /* same as input text */
}

/* Focus state */
#form23 select.elq-item-select:focus {
  outline: none !important;
  border-bottom: 1.5px solid #2f3b4a !important;
}

/* Remove default dropdown arrow styling where possible */
#form23 select.elq-item-select::-ms-expand {
  display: none;
}