.sidebar {
  @media (width < 1024px) {
    padding-inline: var(--space-md);
  }

  @media (width >= 1024px) {
    padding-inline: var(--space-xl);
  }

  .sidebar__inner {
    display: flex;
    margin-inline: auto;
    max-width: var(--l-max-width);

    @media (width < 1024px) {
      align-items: center;
      flex-direction: column;
      justify-content: flex-start;
      padding-block: var(--space-xl);
      row-gap: var(--space-xl);
    }

    @media (width >= 1024px) {
      align-items: flex-start;
      column-gap: var(--space-2xl);
      flex-direction: row;
      justify-content: space-between;
      padding-block: var(--space-xxl);
    }
  }
}