/* --- BUTTONS --- */
.btn-primary {
  background: linear-gradient(135deg, var(--clr-purple), var(--clr-blue));
  color: #fff;
  font-family: var(--font-head);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 14px 32px;
  border-radius: var(--radius-sm);
  border: none;
  cursor: pointer;
  transition: var(--transition);
  position: relative;
  overflow: hidden;
}
.btn-primary::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--clr-blue), var(--clr-purple));
  opacity: 0;
  transition: var(--transition);
}
.btn-primary:hover::before { opacity: 1; }
.btn-primary:hover { box-shadow: var(--glow-purple); transform: translateY(-2px); }
.btn-primary span { position: relative; z-index: 1; }
.btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.btn-outline {
  background: transparent;
  color: var(--clr-text);
  font-family: var(--font-head);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .08em;
  padding: 13px 28px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255,255,255,.25);
  cursor: pointer;
  transition: var(--transition);
}
.btn-outline:hover {
  border-color: var(--clr-purple-neon);
  color: var(--clr-purple-neon);
  box-shadow: var(--glow-purple);
}
