.c-home-better-together {
  padding: var(--wa-space-l);
  border-start-start-radius: var(--wa-border-radius-l);
  border-start-end-radius: var(--wa-border-radius-l);

  @media (width >= 64rem) {
    padding: var(--wa-space-3xl);
  }
}

.c-home-better-together__inner {
  width: 100%;
  margin-inline: auto;
}

.c-home-better-together__title {
  width: fit-content;
  margin: 0;
  color: var(--wr-color-text-primary);
  font-size: var(--wa-font-size-xl);
  font-weight: 900;
  line-height: var(--wa-line-height-condensed);
  text-transform: uppercase;
}

.c-home-better-together__title::after {
  content: "";
  display: block;
  inline-size: 65%;
  block-size: 0.4rem;
  margin-block-start: var(--wa-space-2xs);
  background: var(--wr-color-brand-secondary);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10'%3E%3Cpath d='M3 7C50 3 150 2 197 5' fill='none' stroke='black' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E")
    center / 100% 100% no-repeat;
}

.c-home-better-together__features {
  display: grid;
  gap: var(--wa-space-l);
  width: 100%;
  max-width: 40rem;
  margin-block-start: var(--wa-space-xl);
  margin-inline: auto;

  @media (width >= 48rem) {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    max-width: none;
    margin-block-start: var(--wa-space-2xl);
  }
}

.c-home-better-together__feature {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--wa-space-m);
  align-items: center;
  min-width: 0;

  @media (width >= 48rem) {
    grid-template-columns: none;
    gap: 0;
    align-content: start;
    justify-items: center;
    text-align: center;
    padding-inline: var(--wa-space-s);
    border-inline-start: var(--wa-border-width-s, 1px) solid var(--wa-color-surface-border);
  }

  @media (width >= 64rem) {
    padding-inline: var(--wa-space-l);
  }
}

.c-home-better-together__feature:first-child {
  @media (width >= 48rem) {
    border-inline-start: 0;
  }
}

.c-home-better-together__image {
  inline-size: 4.5rem;
  max-inline-size: 100%;
  block-size: auto;

  @media (width >= 48rem) {
    inline-size: 10rem;
  }
}

.c-home-better-together__copy {
  display: grid;
  min-width: 0;
  gap: var(--wa-space-xs);
}

.c-home-better-together__copy h3,
.c-home-better-together__copy p {
  margin: 0;
}

.c-home-better-together__copy h3 {
  color: var(--wr-color-text-primary);
  font-family: var(--wa-font-family-body);
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-bold);
  letter-spacing: 0.04em;
  line-height: var(--wa-line-height-condensed);
  text-transform: uppercase;
}

.c-home-better-together__copy p {
  color: var(--wr-color-text-primary);
  font-size: var(--wa-font-size-s);
  line-height: var(--wa-line-height-normal);
  text-wrap: balance;
}
