/* ==========================================================================
   Componente: form (campo de correo + botón)
   ========================================================================== */
.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-label {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-az-5);
}

.form-input {
  background: var(--color-az-2);
  border: var(--border-hairline);
  color: var(--color-bl);
  font-family: var(--font-sans);
  font-size: 12px;
  padding: 10px 14px;
  outline: none;
  transition: border-color .2s;
  width: 100%;
}

.form-input:focus {
  border-color: var(--color-cu);
}

.form-input::placeholder {
  color: var(--color-az-4);
}

.form-btn {
  background: var(--color-cu);
  border: none;
  color: var(--color-bl);
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 14px 28px;
  cursor: pointer;
  transition: background .2s, transform .15s;
  white-space: nowrap;
}

.form-btn:hover {
  background: var(--color-cu-light);
  transform: translateY(-1px);
}

.form-btn:disabled {
  opacity: .5;
  cursor: default;
  transform: none;
}

/* Honeypot antispam: oculto para personas, visible para bots que ignoran CSS */
.form-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
}

.form-msg {
  font-size: 11px;
  letter-spacing: .5px;
  min-height: 16px;
}

.form-msg--ok {
  color: var(--color-cu-light);
}

.form-msg--error {
  color: #d86a5c;
}
