/* Components - Buttons, Forms, Modal */

/* FORM STYLES */
.form-field{margin-bottom:20px}
.form-field label{display:block;font-size:12px;color:var(--blue);letter-spacing:.26px;margin-bottom:6px}
.form-field input,.form-field textarea{
  width:100%;padding:16px;
  border:1px solid var(--border);border-radius:10px;
  font-family:'Inter',sans-serif;font-size:15px;color:var(--dark);
  background:#fff;outline:none;transition:border-color .15s;
}
.form-field input:focus,.form-field textarea:focus{border-color:var(--gold)}
.form-field textarea{height:148px;resize:vertical}
.form-check{display:flex;align-items:flex-start;gap:10px;margin-bottom:20px}
.form-check input{width:15px;height:15px;min-width:15px;margin-top:2px;accent-color:var(--gold)}
.form-check label{font-size:12px;color:var(--blue);line-height:1.5;letter-spacing:.26px}
.btn-send{
  width:100%;padding:18px;background:var(--gold);color:#fff;
  font-family:'Inter',sans-serif;font-size:18px;font-weight:400;
  border:none;border-radius:10px;cursor:pointer;
  position:relative;display:flex;align-items:center;justify-content:center;
  transition:background .15s,transform .1s;
}
.btn-send:hover{background:var(--gold-hover);transform:translateY(-1px)}
.btn-send svg{width:18px;height:16px;flex-shrink:0;position:absolute;right:10px;top:50%;transform:translateY(-50%)}

/* MODAL */
.modal-overlay{
  display:none;position:fixed;inset:0;z-index:500;
  background:rgba(26,38,59,.55);backdrop-filter:blur(3px);
  align-items:center;justify-content:center;padding:20px;
}
.modal-overlay.open{display:flex}
.modal{
  background:#fff;border-radius:16px;width:100%;max-width:520px;
  box-shadow:0 24px 64px rgba(26,38,59,.2);
  animation:modalIn .22s ease;overflow:hidden;
}
@keyframes modalIn{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}
.modal-head{
  padding:24px 28px 0;display:flex;justify-content:space-between;align-items:flex-start;
}
.modal-title{
  font-family:'Bai Jamjuree',sans-serif;
  font-weight:700;font-size:24px;color:var(--dark);letter-spacing:-.3px;
}
.modal-sub{font-size:14px;color:var(--blue);margin-top:4px;letter-spacing:-.15px}
.modal-close{
  width:32px;height:32px;border:none;background:var(--wb);
  border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;margin-left:12px;transition:background .15s;
}
.modal-close:hover{background:var(--border)}
.modal-close svg{width:16px;height:16px;stroke:var(--dark);fill:none;stroke-width:2}
.modal-body{padding:20px 28px 28px}
.modal-body .form-field{margin-bottom:14px}
.modal-body .form-field input{padding:12px 14px;font-size:14px}
.modal-body .form-field textarea{height:100px;font-size:14px}
.modal-body .form-check label{font-size:12px}
.modal-body .btn-send{padding:14px;font-size:16px}