/* ================================================
   BOTONES
   ================================================ */

/* ── btn-primary ─────────────────────────────── */
.btn-primary {
  background: var(--clr-gold);
  color: #ffffff;
  border: none;
  padding: 14px 32px;
  border-radius: var(--radius-btn);
  font-family: var(--font-sans);
  font-size: 15px; font-weight: 700;
  letter-spacing: 0.6px;
  cursor: pointer;
  transition: all var(--transition-base);
  display: inline-flex;
  align-items: center; gap: 8px;
}

.btn-primary:hover {
  background: var(--clr-gold-dark);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(168, 134, 62, 0.4);
}

.btn-primary:disabled,
.btn-primary[aria-disabled="true"] {
  background: #9E9E9E;
  cursor: not-allowed;
  box-shadow: none; transform: none;
  color: #fff;
}

/* ── btn-secondary ───────────────────────────── */
.btn-secondary {
  display: inline-flex;
  align-items: center; gap: 8px;
  background: var(--clr-gold);
  color: #ffffff;
  border: none;
  padding: 14px 32px;
  border-radius: var(--radius-btn);
  font-family: var(--font-sans);
  font-size: 15px; font-weight: 700;
  letter-spacing: 0.6px;
  text-decoration: none;
  cursor: pointer;
  transition: all var(--transition-base);
}

.btn-secondary:hover {
  background: var(--clr-gold-dark);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(168, 134, 62, 0.4);
  color: #ffffff;
}

.btn-secondary i { color: #ffffff; font-size: 16px; }

/* ── btn-buy ─────────────────────────────────── */
.btn-buy {
  margin-top: auto;
  width: 100%;
  padding: 12px 20px;
  font-family: var(--font-sans);
  font-size: 14px; font-weight: 700;
  letter-spacing: 0.6px;
  border-radius: var(--radius-btn);
  background: var(--clr-green);
  color: #ffffff;
  border: none; cursor: pointer;
  transition: all var(--transition-base);
}

.btn-buy:hover {
  background: var(--clr-gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(168, 134, 62, 0.3);
}

/* ── btn-instagram ───────────────────────────── */
.btn-instagram {
  display: inline-flex;
  align-items: center; gap: 10px;
  background: var(--clr-gold);
  color: #ffffff;
  text-decoration: none;
  padding: 14px 36px;
  border-radius: var(--radius-btn);
  font-family: var(--font-sans);
  font-size: 15px; font-weight: 700;
  letter-spacing: 0.6px;
  transition: all var(--transition-base);
}

.btn-instagram i { font-size: 18px; color: #ffffff; }

.btn-instagram:hover {
  background: var(--clr-gold-dark);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(168, 134, 62, 0.4);
  color: #ffffff;
}