.sv-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sv-space-2);
  padding: 0.9rem 1.4rem;
  font-family: var(--sv-font-sans);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 2px;
  border: 1px solid var(--sv-color-gold);
  transition: background-color var(--sv-duration) var(--sv-ease), color var(--sv-duration) var(--sv-ease);
}

.sv-button--primary {
  background: var(--sv-color-gold);
  color: #fff;
}

.sv-button--primary:hover,
.sv-button--primary:focus-visible {
  background: #876539;
  border-color: #876539;
  color: #fff;
}

.sv-button--secondary,
.sv-button--ghost {
  background: transparent;
  color: var(--sv-color-ink);
}

.sv-button--ghost:hover,
.sv-button--ghost:focus-visible {
  border-color: var(--sv-color-gold);
  color: var(--sv-color-gold);
}