.site-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  padding: 12px 20px;
  border: 1px solid color-mix(in srgb, var(--secondary) 32%, transparent);
  border-radius: var(--site-button-radius, 6px);
  background: color-mix(in srgb, var(--site-hero, #101e2a) 24%, #03080c);
  color: var(--secondary);
  box-shadow: var(--site-button-shadow, 0 3px 10px #0006);
  font: inherit;
  font-size: 15px;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.site-button:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--secondary) 70%, transparent);
  background: color-mix(in srgb, var(--site-hero, #101e2a) 46%, #03080c);
  color: var(--secondary);
  transform: translateY(-1px);
}
.site-button:focus-visible {
  outline: 2px solid var(--site-focus, var(--secondary));
  outline-offset: 4px;
}
.site-button:active { transform: translateY(0); }
.site-button:disabled { cursor: wait; opacity: .65; transform: none; }
.site-button svg { display: block; width: 23px; height: 23px; flex: 0 0 auto; color: inherit; }
.contact-profiles .site-button { width: 48px; min-height: 48px; padding: 0; }
@media (forced-colors: active) {
  .site-button { border-color: ButtonText; color: ButtonText; background: ButtonFace; box-shadow: none; }
  .site-button:is(:hover, :focus-visible) { border-color: Highlight; color: ButtonText; background: ButtonFace; }
}
