/* BEM double-dash modifiers, matching the sister theme's convention
   (.btn--gold, .btn--block) rather than a single-dash variant. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--st-space-xs);
  min-height: var(--st-button-min-height);
  padding: 0 var(--st-space-xl);
  border-radius: var(--st-radius-button);
  font-family: var(--st-font-body);
  font-size: var(--st-button-font-size);
  font-weight: var(--st-button-font-weight);
  letter-spacing: 0.01em;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn--gold {
  background: var(--st-button-bg);
  color: var(--st-button-fg);
}
.btn--gold:hover { background: var(--st-gold-light); color: var(--st-navy); }
.btn--outline {
  background: transparent;
  color: var(--st-white);
  border-color: var(--st-white-20);
}
.btn--outline:hover { border-color: var(--st-gold); color: var(--st-gold-light); }
.btn--ghost {
  background: transparent;
  color: var(--st-gold);
  min-height: auto;
  padding: 0;
}
.btn--ghost:hover { color: var(--st-gold-light); }
.btn--block { width: 100%; }
.btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--st-space-md);
}