.button-group .cmp-container {
  display: grid;
  padding: 0;
  gap: var(--space-16);
}
@media (min-width: 768px) {
  .button-group .cmp-container {
    display: flex;
    flex-wrap: wrap;
  }
}
.button-group .cmp-container > .button:first-child .button__base {
  --button-background-color: var(--color-primary-santander);
  --button-color: var(--color-primary-white);
  --button-border-color: var(--color-primary-santander);
  --button-text-decoration: none;
  --button-border-radius: var(--border-radius-300);
  --button-gap: var(--space-8);
}
.button-group .cmp-container > .button:first-child .button__base:hover {
  --button-background-color: var(--color-primary-bosto);
  --button-text-decoration: none;
}
.button-group .cmp-container > .button:first-child .button__base:active {
  --button-background-color: var(--color-primary-ruby);
  --button-text-decoration: none;
}
.button-group .cmp-container > .button:first-child .button__base:disabled {
  --button-background-color: var(--color-accent-disabled);
  --button-color: var(--color-accent-disabled-text);
}
@media (min-width: 768px) {
  .button-group.button-group--horizontal--left > .cmp-container {
    justify-content: start;
  }
  .button-group.button-group--horizontal--center > .cmp-container {
    justify-content: center;
  }
  .button-group.button-group--horizontal--right > .cmp-container {
    justify-content: end;
  }
}