.hero-animated:has(+ .our-experts) {
  >div {
    user-select: none;

    :not(:last-child) {
      margin-bottom: var(--baseline);
    }

    @media (min-width: 75rem) {
      >div {
        width: 50%;
      }
    }
  }

  .button {
    border: 1px solid var(--color-white);
    color: var(--color-white);
  }
}

.our-experts {
  margin-top: var(--space-xxl);
  column-gap: var(--gutter);
  display: grid;

  @media (min-width: 0) {
    .col {
      grid-column: span 4;
    }
  }

  @media (min-width: 40rem) {
    .col {
      grid-column: span 8;
    }
  }

  @media (min-width: 64rem) {
    .col {
      grid-column: span 12;
    }
  }

  @media (min-width: 75rem) {
    .col {
      grid-column: 2 / span 8;
    }
  }

  >.col {
    >div {
      >h2 {
        margin-top: var(--space-lg);
        margin-bottom: var(--space-lg)
      }
    }
  }
}

@media (min-width: 0) {
  .our-experts {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 40rem) {
  .our-experts {
    grid-template-columns: repeat(8, 1fr);
  }
}

@media (min-width: 64rem) {
  .our-experts {
    grid-template-columns: repeat(12, 1fr);
  }
}