body .sdg-btn, body .bricks-button {
  display: grid !important;
  place-items: center;
  width: auto;
  height: 5.6rem;
  font-size: 2rem;
  box-shadow: 0px 1px 2px rgba(59, 81, 169, 0.4);
  border-radius: 1rem;
  font-weight: 500;
}
body .sdg-btn:hover, body .bricks-button:hover {
  color: white;
  background: var(--base);
  box-shadow: 0px 3px 4px rgba(59, 81, 169, 0.37);
}
body .sdg-btn--ghost, body .bricks-button--ghost {
  background: #ffffff;
  border: 2px solid transparent;
  background-clip: padding-box;
  border-radius: 10px;
  position: relative;
  color: var(--primary);
}
body .sdg-btn--ghost::after, body .bricks-button--ghost::after {
  content: '';
  position: absolute;
  inset: -2px;
  background: var(--gradient-1);
  border-radius: 10px;
  z-index: -1;
}
body .sdg-btn--primary, body .bricks-button--primary {
  background: var(--gradient-1);
  color: white;
}
body .sdg-btn--primary a, body .bricks-button--primary a {
  display: grid !important;
  place-items: center;
  width: auto;
  height: 5.6rem;
  background: var(--gradient-1);
  box-shadow: 0px 1px 2px rgba(59, 81, 169, 0.4);
  border-radius: 1rem;
  color: white;
}
body .sdg-btn--primary a:hover, body .bricks-button--primary a:hover {
  color: white;
  background: var(--base);
  box-shadow: 0px 3px 4px rgba(59, 81, 169, 0.37);
}
body .bricks-background-primary {
  background: var(--gradient-1);
  color: white;
}
body .bricks-background-primary a {
  display: grid !important;
  place-items: center;
  width: auto;
  height: 5.6rem;
  background: var(--gradient-1);
  box-shadow: 0px 1px 2px rgba(59, 81, 169, 0.4);
  border-radius: 1rem;
  color: white;
}
body .bricks-background-primary a:hover {
  color: white;
  background: var(--base);
  box-shadow: 0px 3px 4px rgba(59, 81, 169, 0.37);
}