.btn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--tap-min);
  padding: 0 var(--space-6);
  border: none; border-radius: var(--radius-full);
  font: inherit; font-weight: var(--font-weight-semibold); letter-spacing: .01em;
  background: var(--gradient-primary); color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 18px -8px rgba(158,62,52,.6);
  transition: transform var(--transition-base), box-shadow var(--transition-base), filter var(--transition-base);
}
/* brillo superior sutil */
.btn::before {
  content: ""; position: absolute; inset: 0; background: var(--gradient-sheen); pointer-events: none;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 14px 26px -10px rgba(158,62,52,.7); filter: brightness(1.03); }
.btn:active { transform: translateY(0); }

.btn--ghost {
  background: var(--color-surface); color: var(--color-primary-dark);
  border: 1px solid var(--color-border-strong);
  box-shadow: var(--shadow-xs);
}
.btn--ghost::before { display: none; }
.btn--ghost:hover { background: var(--color-surface-2); border-color: var(--color-primary); filter: none; }

.btn--gold { background: var(--gradient-gold); color: #4A2F0C; box-shadow: var(--shadow-gold); }

.field { display: flex; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-4); }
.field label { font-weight: var(--font-weight-semibold); font-size: var(--font-size-sm); color: var(--color-text-primary); }
.field input, .field select, .field textarea {
  min-height: var(--tap-min);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-md);
  font: inherit; color: var(--color-text-primary);
  background: var(--color-surface);
  transition: border-color var(--transition-base), box-shadow var(--transition-base);
}
.field textarea { min-height: 84px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: var(--color-text-soft); }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--color-primary); box-shadow: var(--ring-focus);
}
