/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 0 20px;
  border-radius: 14px; border: 1px solid var(--line-2); background: transparent; color: var(--strong);
  font-weight: 650; font-size: 14.5px; text-decoration: none; white-space: nowrap;
  transition: background .28s var(--ease), border-color .28s var(--ease), transform .28s var(--ease), box-shadow .28s var(--ease), color .28s var(--ease);
}
.btn:hover { background: var(--hair); border-color: var(--sky); }
.btn:active:not(:disabled) { transform: scale(.98); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn i { font-size: .92em; transition: transform .28s var(--ease); }
.btn:hover i.fa-arrow-right,
.btn:hover i.fa-arrow-up-right-from-square { transform: translateX(3px); }
.btn-primary { background: var(--btn-bg); color: var(--btn-ink); border-color: transparent; box-shadow: 0 10px 30px -12px color-mix(in srgb, var(--sky) 70%, transparent); }
.btn-primary:hover { background: var(--btn-hover); border-color: transparent; box-shadow: 0 14px 40px -10px color-mix(in srgb, var(--sky) 85%, transparent); }
.btn-lg { min-height: 56px; padding: 0 26px; font-size: 16px; border-radius: 16px; }
.btn-ghost { border-color: transparent; color: var(--text); }
.btn-ghost:hover { color: var(--strong); background: var(--hair); border-color: transparent; }
.btn-sm { min-height: 38px; padding: 0 14px; font-size: 13px; border-radius: 12px; }
.icon-btn {
  width: 42px; height: 42px; display: inline-grid; place-items: center; border-radius: 50%; border: 1px solid var(--line);
  background: var(--glass); color: var(--text); transition: all .28s var(--ease);
}
.icon-btn:hover { color: var(--strong); border-color: var(--line-2); transform: translateY(-1px); }
