.section-title {
  &::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    margin: var(--space-m) 0 var(--space-m);
    background: var(--color-primary-3);
  }

  &.section-title--smaller-border {
    &::after {
      margin-left: var(--space-3xl);
      width: calc(100% - var(--space-3xl) * 2);
    }
  }

  .section-title__content:has(a.button) {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: var(--space-s);
    justify-content: space-between;

    @media screen and (min-width: 768px) {
      align-items: center;
      flex-direction: row;
    }
  }
}