.primary-cta {
  display: inline-block;
  padding: var(--sp-space-4) var(--sp-space-8);
  background: linear-gradient(135deg, var(--sp-brand-600), var(--sp-brand-800));
  color: var(--sp-color-text-on-primary);
  font-family: var(--sp-font-brand);
  font-size: 0.9rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
  border-radius: var(--sp-radius-round);
  transition: all var(--sp-transition-normal);
  box-shadow: 0 4px 20px rgba(10, 10, 10, 0.17);
}

.primary-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(10, 10, 10, 0.22);
  text-decoration: none;
}

.secondary-cta {
  display: inline-block;
  padding: var(--sp-space-4) var(--sp-space-8);
  background: transparent;
  color: var(--sp-color-primary);
  font-family: var(--sp-font-brand);
  font-size: 0.9rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
  border: 1px solid var(--sp-color-primary);
  border-radius: var(--sp-radius-round);
  transition: all var(--sp-transition-normal);
}

.secondary-cta:hover {
  background: rgba(10, 10, 10, 0.06);
  text-decoration: none;
}