body {
  overflow-x: hidden;
}
.section-header.shopify-section-group-header-group,
.header-wrapper--border-bottom {
  background-color: transparent;
  transition: background-color 300ms ease-out;
}
.scrolled-past-header.shopify-section-header-sticky:not(.shopify-section-header-hidden),
.scrolled-past-header.shopify-section-header-sticky:not(.shopify-section-header-hidden) .header-wrapper--border-bottom {
  background-color: var(--sticky-spine);
}
.header__menu-item {
  color: var(--sticky-spine);
}
.scrolled-past-header.shopify-section-header-sticky:not(.shopify-section-header-hidden) .header__menu-item {
  color: var(--sticky-agave) !important;
}
.header__inline-menu li:last-child .header__menu-item {
  color: var(--sticky-agave) !important;
  background: #fff !important;
}
.header-wrapper--border-bottom {
  border-bottom: 1px solid var(--sticky-spine) !important;
}

main {
  margin-block-start: calc(-1 * var(--header-height));
}
.article-template__hero-container {
  max-width: unset;
  position: relative;
}

.article-template__hero-container,
.article-template__hero-container .media,
.article-template__hero-container .media > img {
  max-height: 70vh;
  background-color: transparent;
}

.client-logo-container {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;

  .client-logo {
    min-height: 20vh;
    width: auto;
    aspect-ratio: 1/1;
  }
}

.article-template header {
  display: flex;
}
.article-template__title {
  font-size: 48px;
}
.header-subtitle {
  text-transform: uppercase;
  font-family: Montserrat;
  font-size: 13px;
  font-weight: 700;
  line-height: 13px;
  letter-spacing: 0.2em;
  text-align: left;
}
.header-brief-results {
  flex: 1 1 66%;
  font-family: Mate;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  text-align: left;
  margin-inline-end: 1rem;
}

.header-services-provided {
  flex: 1 1 33%;
  max-width: 30rem;
  font-family: Mate;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  text-align: left;

  .services-content {
    position: relative;
    min-height: 20rem;
  }

  ul {
    position: absolute;
    width: 80rem;
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: 1rem;

    li {
      line-height: 2;

      a {
        color: unset;
        text-decoration: unset;
      }
    }

    &:after,
    li:after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      height: 1.5px;
      background-image: linear-gradient(to right, var(--sticky-agave) 16%, rgba(255, 255, 255, 0) 0%);
      background-size: 15px 8px;
    }
  }
}

section.portfolio-carousel-set:not(.partners-carousel-container) {
  margin-block-start: 3rem;

  .main__container {
    overflow-x: scroll;
    scrollbar-width: none;
    height: 740px;
  }

  ul.portfolio {
    justify-content: unset;
  }

  .portfolio__item--image,
  .placeholder {
    height: 580px;
    object-fit: cover;
  }
}

@media screen and (max-width: 749px) {
  .article-template header {
    flex-direction: column;
  }
  .article-template__title {
    font-size: 26px;
  }

  .header-services-provided {
    ul {
      position: relative;
      width: calc(100vw - 1.5rem);

      &:after,
      li:after {
        background-size: 10px 8px;
      }
    }
  }

  section.portfolio-carousel-set:not(.partners-carousel-container) {
    padding: 0;
    margin: unset;
    max-width: unset;

    .main__container {
      height: unset;
      margin: 0;
    }
    ul.portfolio {
      position: relative;
      margin-inline-end: 1.5rem;
    }
    .portfolio__item {
      max-width: calc(100vw - 12rem);
    }

    li {
      &.portfolio__item:first-child {
        margin-inline-start: 1.5rem;
      }
      &.padding-element {
        min-width: 1px;
        margin-inline-start: -10px;
      }
    }
    .portfolio__item--image,
    .placeholder {
      height: 338px;
      object-fit: cover;
    }
  }
}