.shopify-section--article-header {
  & zag-section {
    display: block;
    position: relative;
    inline-size: 100%;
    max-inline-size: var(--max-width, 80rem);
    margin-inline: auto;
    padding-inline: var(--mobile-gutter, 1rem);
    padding-top: var(--mobile-section-padding-top, 16rem);
    padding-bottom: var(--mobile-section-padding-bottom, 3rem);

    @media (width >= 48rem) {
      padding-bottom: var(--desktop-section-padding-bottom, 4rem);
    }
  }

  & > [data-modifiers*="full-width"] {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  & .content-wrapper {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    block-size: 100%;
    inline-size: 100%;
    max-inline-size: 85rem;
    margin-inline: auto;
    padding-block: 0rem;
    inset: 0;

    --navigation-bar-margin-inline-start: 8.5rem;
    --container-max-inline-size: 56.25rem; /* 900px */
    --container-margin-inline-end: 0;

    @media (width >= 60rem) {
      inline-size: calc(100% - 2 * var(--zag-gutter));
      justify-content: flex-end;
      padding-block: 3.5rem;

      --navigation-bar-margin-inline-start: 11.75rem;
      --wrapper-justify: flex-end;
      --container-margin-inline-end: max(
        0rem,
        (
            min(100vw - var(--scrollbar-width) - 2 * var(--zag-gutter), 85rem) -
              var(--navigation-bar-margin-inline-start)
          ) - var(--container-max-inline-size)
      );
    }

    @media (width >= 70rem) {
      --navigation-bar-margin-inline-start: 16.75rem;
    }

    @media (width >= 80rem) {
      --navigation-bar-margin-inline-start: 28.75rem;
    }
  }

  & .content-container {
    display: block;
    position: relative;
    gap: 1rem;
    inline-size: 100%;
    max-inline-size: var(--container-max-inline-size);
    margin-inline-end: 0;
  }

  & .article-header_title {
    margin-block-end: 4rem;
  }

  & .article-header_tags {
    display: flex;
    max-block-size: 1rem;
    margin-block-end: 2rem;
    gap: 0.5rem;

    & svg {
      inline-size: 0.625rem;
      block-size: 0.625rem;
    }
  }

  & .article-header_tag-separator {
    display: inline-block;
    height: -webkit-fill-available;
    width: 1px;
    background-color: var(--black-color);
    margin-inline: 0rem;
  }

  & .article-header_tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
  }

  .article-header_author {
    margin-block-start: 0.5rem;
    margin-block-end: 1rem;
  }
}
