/* =========================================================
   LG Caguana Construction — Contact Form Widget
   Kept separate from style.css: this widget is typically
   swapped for a 3rd-party form embed (CRM / lead capture).
   Presentation modifiers: .form-widget--hero / .form-widget--aside
   ========================================================= */

.form-widget{ width:100%; }

.form-widget .form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.form-widget .form-row.full{ grid-template-columns:1fr; }
.form-widget .form-row.three{ grid-template-columns:1fr 1fr 1fr; }

.form-field{
  position:relative;
  margin-bottom:16px;
}
.form-field input,
.form-field select,
.form-field textarea{
  width:100%;
  padding:18px 16px 8px;
  border:1.5px solid #E2E1E1;
  border-radius:8px;
  font-family:"Open Sans",Arial,sans-serif;
  font-size:14.5px;
  color:#1A1A1A;
  background:#FBFAFA;
  outline:none;
  transition:border-color .3s ease, background .3s ease;
  appearance:none;
}
.form-field textarea{ min-height:110px; resize:vertical; padding-top:22px; }
.form-field textarea.h-80{ height:80px; min-height:80px; }

.form-field label{
  position:absolute;
  left:16px;
  top:18px;
  font-size:14.5px;
  color:#8A8888;
  pointer-events:none;
  transition:all .2s ease;
  background:transparent;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color:#E50613;
  background:#fff;
}

.form-field input:focus ~ label,
.form-field input:not(:placeholder-shown) ~ label,
.form-field textarea:focus ~ label,
.form-field textarea:not(:placeholder-shown) ~ label,
.form-field select:focus ~ label,
.form-field select.has-value ~ label{
  top:6px;
  font-size:11px;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:#E50613;
  font-weight:600;
}

.form-field select{ padding-top:20px; cursor:pointer; }
.form-field .select-caret{
  position:absolute;
  right:16px; top:20px;
  color:#8A8888;
  pointer-events:none;
  font-size:13px;
}

.form-field .fa-check-circle,
.form-consent{
  font-size:12.5px;
  color:#8A8888;
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-bottom:18px;
}
.form-consent input{ margin-top:3px; }

.form-widget button[type="submit"]{
  width:100%;
  border:none;
  cursor:pointer;
}

/* Hero presentation: compact, sits on white card over hero image */
.form-widget--hero .form-field input,
.form-widget--hero .form-field select,
.form-widget--hero .form-field textarea{
  background:#F6F6F7;
}

/* Aside presentation: used in Get In Touch section, roomier spacing */
.form-widget--aside .form-row{ gap:20px; }
.form-widget--aside .form-field input,
.form-widget--aside .form-field select,
.form-widget--aside .form-field textarea{
  padding:20px 18px 10px;
}

@media (max-width:576px){
  .form-widget .form-row,
  .form-widget .form-row.three{ grid-template-columns:1fr; }
}