.hero-content--right {
  justify-content: flex-end;

}

.hero-content.hero-content-primary {
  background-color: rgba(1, 33, 105, 0.85);
    border-radius: 4px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: calc(.25rem * 1);

}

.hero-content .hero-content-heading {
  text-align: left;
}

.hero-content.hero-content-primary .hero-content-btn {
  border: 0;
  background-color: white;
  color: #002169;
  font-size: 1rem;
  width: 100%;

}

@media(min-width: 768px) {
  .hero-content.hero-content-primary .hero-content-btn {
    align-self: flex-end;
    width: auto;
  }
}