/* =========================================
   FORMS — formulário de contato
   Estados: default, focus, error, success, loading
   ========================================= */

/* Campo base */
.fg { margin-bottom: 16px; }

.fg input,
.fg textarea {
  width: 100%;
  padding: 13px 15px;
  border: 1px solid #dde3ea;
  border-radius: var(--radius-sm);
  font-family: var(--font);
  font-size: .9rem;
  color: #1a2a3a;
  outline: none;
  background: #fff;
  transition: border-color .3s, box-shadow .3s;
}
.fg input:focus,
.fg textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(30, 144, 214, .1);
}

/* Erro */
.fg input.error,
.fg textarea.error {
  border-color: #e53e3e;
  box-shadow: 0 0 0 3px rgba(229, 62, 62, .1);
}
.fg .error-msg {
  display: block;
  font-size: .76rem;
  color: #e53e3e;
  margin-top: 4px;
}

/* Textarea */
.fg textarea { resize: vertical; min-height: 114px; }

/* Botão enviar */
.btn-send {
  width: 100%;
  padding: 14px;
  background: var(--blue); color: #fff;
  border: none;
  font-family: var(--font);
  font-size: .82rem; font-weight: 700;
  letter-spacing: .15em; text-transform: uppercase;
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background .3s, transform .3s, box-shadow .3s;
}
.btn-send:hover {
  background: var(--navy);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(11, 31, 58, .2);
}

/* Estado: enviando */
.btn-send.loading {
  opacity: .7;
  cursor: not-allowed;
  pointer-events: none;
}

/* Estado: sucesso */
.btn-send.success {
  background: #28a745;
  cursor: default;
  pointer-events: none;
}