/* ===== Quick Enquiry – aligned to provided global CSS =====
   - Poppins, 14px base, #111827 body text
   - Button + color system per .btn-orange / helpers
   - Radii: 4px (buttons), 6px (cards/inputs)
   --------------------------------------------------------- */

/* Page banner matches your palette */
.title-header-banner{
  background: #e14e26;
  color:#fff;
  padding:56px 0 24px;
}
.title-header-banner .white{ color:#fff; }
.title-header-banner h1{
  font-size:36px;
  font-weight:500;
  letter-spacing:.2px;
}

/* Light grey page bg per .light-GrayBG */
.light-GrayBG{ background-color:#f3f4f6; }

/* Main card */
.rounded-box{
  background:#fff;
  border:1px solid #d9d9d9;
  border-radius:6px;
  padding:16px;
  box-shadow: 0px 4px 5px rgba(0,0,0,.1); /* uses .box-shadow look */
}

/* Centered wrapper + title */
.center-Inquiry-form{
  max-width:760px;
  margin:0 auto;
}
.center-Inquiry-form h1{
  font-size:26px; /* mobile rule below will keep 26; desktop can be 30 if needed */
  font-weight:600;
  margin-bottom:.5rem !important;
}

/* Form card */
.Inquiry-form{
  background:#fff;
  border:1px solid #d9d9d9;
  border-radius:6px;
  padding:16px;
}

/* Labels: align with your typographic scale */
.Inquiry-form label{
  font-weight:600;
  font-size:16px;
  margin-bottom:.35rem;
  color:#111827;
  display:inline-flex;
  align-items:center;
  gap:.25rem;
}
/* Use class="required" on labels to append * */
.Inquiry-form label.required::after{
  content:"*";
  margin-left:.25rem;
  font-weight:700;
  color:#db0000;
}
/* Hide inline <p>* inside labels if present */
.Inquiry-form label p{ display:none; }

/* Inputs */
.form-control{
  font-size:14px;
  color:#111827;
  background:#FFF;
  border:1px solid #d9d9d9;
  border-radius:6px;
  height:50px;               /* consistent with .form-input input */
  padding:.6rem .85rem;
  outline: none;
}
.form-control::placeholder{ color:#aaaaaa; }
.form-control:focus{
  border-color:#e14e26;
  box-shadow: 0 0 0 .2rem rgba(225,78,38,.15);
}

/* Textarea */
textarea.form-control{
  min-height:110px;
  height:auto;               /* allow growth */
  resize: vertical;
}

/* Bootstrap-ish validation colors to match palette */
.was-validated .form-control:invalid,
.form-control.is-invalid{ border-color:#db0000; }
.was-validated .form-control:invalid:focus,
.form-control.is-invalid:focus{ box-shadow:0 0 0 .2rem rgba(219,0,0,.15); }

/* Alerts (errors/success) */
#errors{
  border:1px solid #db0000;
  background:#fae5e5;
  color:#111827;
  border-radius:6px;
  padding:.75rem .9rem;
  font-size:14px;
}
#success{
  border:1px solid #53a625;
  background:#f2fef1;
  color:#111827;
  border-radius:6px;
  padding:.75rem .9rem;
  font-size:14px;
}

/* Captcha */
#captcha canvas, #captcha img{
  max-width:100%;
  height:auto;
  display:block;
}
#cpatchaTextBox{
  width:100%;
  border:1px solid #d9d9d9;
  border-radius:6px;
  height:50px;
  padding:.6rem .85rem;
}
#captchaError{ margin:.35rem 0 0; font-size:13px; color:#db0000; }

/* Buttons — inherits your .btn-orange exactly */
.btn-orange{
  color:#fff;
  background-color:#e14e26;
  border-color:#e14e26;
  border-radius:4px;
  font-size:18px;
  font-weight:500;
  line-height:28px;
  padding:10px 20px;
  border:1px solid #e14e26;
}
.btn-orange:hover{ color:#fff; background-color:#df3d04; border-color:#df3d04; }

/* Secondary (reset) could use .btn-white on dark bg; here keep neutral */
#btnSubmit{ margin-right:.5rem; }

/* Spinner alignment */
#spinner{ margin-top:.75rem; }

/* Breadcrumb colors already in your global; ensure subtle spacing */
.breadcrumb{ padding-left:0; margin-bottom:.75rem; }

/* Spacing harmony with your utilities */
.mt-6{ margin-top:80px; }
.mt-7{ margin-top:100px; }

/* ===== Mobile tweaks (use your existing breakpoints) ===== */
@media only screen and (max-width: 600px), only screen and (max-width: 768px){
  .rounded-box{ padding:12px; }
  .Inquiry-form{ padding:12px; }
  .form-row > .form-group{ margin-bottom:.75rem; }
  .title-header-banner{ padding:44px 0 18px; }
  .center-Inquiry-form h1{ font-size:26px; }
  .Inquiry-form label{ font-size:14px; }
  .btn-orange{ width:100%; margin-bottom:.5rem; }
  #Reset{ width:100%; }
}