/* Headline Wrapper - for headline with actions
 * -------------------------------------------------------------------------- */

.headline-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.headline-wrapper .headline {
  margin: 0;
  flex: 1 1 auto;
}

.headline-wrapper .button-group {
  flex: 0 0 auto;
}

/* On mobile, stack vertically */
@media (max-width: 640px) {
  .headline-wrapper {
    flex-direction: column;
    align-items: stretch;
  }

  .headline-wrapper .headline {
    text-align: center;
    margin-bottom: 1rem;
  }

  .headline-wrapper .button-group {
    justify-content: center;
  }
}