/* boton.css — `.btn`. Dos variantes: `fantasma` (borde, sin relleno) y
   `pequeno`. Todo lo que se pulsa y no es un chip usa esto. */

.btn{
  display:inline-block; border:1px solid var(--brand); background:var(--brand);
  color:var(--brand-ink); font:inherit; font-weight:600; font-size:.95rem;
  padding:.6rem 1.15rem; border-radius:999px; cursor:pointer; text-decoration:none;
}
.btn:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.5; cursor:not-allowed; filter:none}
.btn.fantasma{background:transparent; color:var(--brand)}
.btn.pequeno{padding:.35rem .8rem; font-size:.85rem}