.pbh-a-propos,
.pbh-mission {
  row-gap: var(--grid-gap);
  align-items: center;
  .img img {
    aspect-ratio: 4/3;
  }
  /* @media (min-width: 40rem) {
    .text {
      grid-column: span 7 / span 7;
    }
    .img {
      grid-column: span 5 / span 5;
    }
  } */
  @media (min-width: 60rem) {
    .text,
    .img {
      grid-column: span 6 / span 6;
    }
  }
}
@media (min-width: 60rem) {
  .pbh-a-propos {
    padding-block: 0;
    .img {
      order: -1;
    }
  }
  .pbh-mission {
    padding-block: 0;
  }
}

.pbh-valeurs {
  background-color: var(--neutral-50);
  .pbh-grid-text {
    @media (min-width: 40rem) {
      text-align: center;
    }
    .pbh-prose {
      & > * {
        margin-inline: auto;
      }
      @media (min-width: 40rem) {
        grid-column: 2 / -2;
      }
      @media (min-width: 60rem) {
        grid-column: 3 / -3;
      }
    }
  }
  .illus {
    position: relative;
    height: 6rem;
    margin-bottom: var(--element-space);
    img {
      position: inherit;
      z-index: 1;
      height: inherit;
      width: auto;
      margin-inline: auto;
    }
    &::before {
      content: "";
      position: absolute;
      display: block;
      inset: 0;
      height: 100%;
      aspect-ratio: 1;
      background-color: var(--green-s-1);
      border-radius: 99rem;
      margin-inline: auto;
    }
  }
  .pbh-grid-valeur {
    row-gap: var(--grid-gap);
  }
  .valeur {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3 / span 3;
    text-align: center;
    row-gap: 0;
  }
  @media (min-width: 40rem) {
    .valeur {
      grid-column: span 6 / span 6;
      &:last-child {
        grid-column-start: 4;
      }
    }
  }
  @media (min-width: 60rem) {
    .valeur {
      grid-column: span 4 / span 4;
      &:last-child {
        grid-column-start: unset;
      }
    }
  }
}

.pbh-cta {
  row-gap: var(--grid-gap);
  align-items: center;
  .img img {
    aspect-ratio: 4/3;
  }
  .pbh-prose {
    font-size: 1.25rem;
    color: var(--green-a);
    font-weight: 600;
    @media (min-width: 40rem) {
      font-size: 1.375rem;
    }
    @media (min-width: 60rem) {
      font-size: 1.5rem;
    }
    @media (min-width: 80rem) {
      font-size: 1.625rem;
    }
  }
  @media (min-width: 60rem) {
    padding-top: 0;
    .text,
    .img {
      grid-column: span 6 / span 6;
    }
    .img {
      order: -1;
    }
  }
}