.pageSection {
  margin: var(--spacing-m) auto;
  padding: var(--spacing-m) 0;
  border-top: var(--border-s);
  position: relative;

  &:nth-of-type(1) {
    margin-top: var(--spacing-l);
  }

  &:nth-of-type(3n+1) {
    .icon {
      background: var(--color-neufPink);
    }
  }

  &:nth-of-type(3n+2) {
    .icon {
      background: var(--color-goldenBeige);
    }
  }

  &:nth-of-type(3n+3) {
    .icon {
      background: var(--color-goldenOrange);
    }
  }
}

.anchor {
  position: absolute;
  top: -4rem;
}

.sectionHeader {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  align-items: center;
  gap: 1.6rem;
  margin-bottom: var(--spacing-section-bottom);

  h2 {
    font-size: var(--font-size-h2);
    grid-column: span 11;
  }
}

.icon {
  flex: none;
  width: var(--size-icon-large);
  height: var(--size-icon-large);
  background: var(--color-goldenBeige);
  border-radius: 100%;
  position: relative;

  img, svg {
    width: var(--page-section-icon-scale, 100%);
    height: var(--page-section-icon-scale, 100%);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}