.pbh-atelier,
.pbh-mission {
  align-items: center;
  text-align: center;
  /* .text,
  .img {
    grid-column: span 6 / span 6;
  } */
  .pbh-btn {
    margin-inline: auto;
  }
  .img {
    img {
      aspect-ratio: 4/3;
    }
  }
  @media (min-width: 40rem) {
    --grid-gap: 0;
    .text {
      grid-column: span 7 / span 7;
    }
    .img {
      grid-column: span 5 / span 5;
    }
  }
  @media (min-width: 60rem) {
    --grid-gap: 0;
    .text,
    .img {
      grid-column: span 6 / span 6;
    }
  }
}
.pbh-atelier {
  @media (min-width: 40rem) {
    .img {
      order: -1;
    }
  }
}
.pbh-coups_de_coeur {
  background-color: var(--neutral-50);
  h2 {
    text-align: center;
  }
  .pbh-grid {
    row-gap: var(--grid-gap);
    & > a {
      aspect-ratio: 1;
      overflow: hidden;
      img {
        aspect-ratio: 1;
        transition: scale var(--transition);
      }
      &:hover img {
        scale: 1.05;
      }
      @media (min-width: 20rem) {
        grid-column: span 6 / span 6;
      }
      @media (min-width: 40rem) {
        grid-column: span 3 / span 3;
      }
    }
  }
  .pbh-btn {
    margin-inline: auto;
  }
}

.pbh-blog {
  h2 {
    text-align: center;
  }
  .pbh-btn {
    margin-inline: auto;
  }
  .pbh-grid {
    row-gap: var(--grid-gap);
    article {
      .text {
        display: flex;
        flex-direction: column;
        gap: var(--element-space);
        justify-content: space-between;
      }
      .img {
        overflow: hidden;
        aspect-ratio: 4/3;
        img {
          aspect-ratio: 4/3;
          transition: scale var(--transition);
        }
      }
      a:hover .img img {
        scale: 1.05;
      }
      .more {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        color: var(--green-a);
      }
      &:first-child {
        grid-row: span 3 / span 3;
        .img {
          margin-bottom: var(--element-space);
        }
      }
      &:not(:first-child) {
        display: grid;
        grid-template-columns: subgrid;
        a {
          grid-column: 1 / -1;
          display: grid;
          grid-template-columns: subgrid;
          /* align-items: flex-end; */
          .img {
            grid-column: 1 / -1;
            margin-bottom: var(--element-space);
            @media (min-width: 40rem) {
              grid-column: span 4 / span 4;
              margin-bottom: unset;
            }
            @media (min-width: 60rem) {
              grid-column: 1 / -1;
              margin-bottom: var(--element-space);
            }
            @media (min-width: 80rem) {
              grid-column: span 2 / span 2;
              margin-bottom: unset;
            }
          }
          .text {
            grid-column: 1 / -1;
            @media (min-width: 40rem) {
              grid-column: span 8 / span 8;
            }
            @media (min-width: 60rem) {
              grid-column: 1 / -1;
            }
            @media (min-width: 80rem) {
              grid-column: span 4 / span 4;
            }
          }
        }
      }
      @media (min-width: 60rem) {
        &:first-child {
          grid-row: span 1 / span 1;
        }
        grid-column: span 6 / span 6;
      }
      @media (min-width: 80rem) {
        &:first-child {
          grid-row: span 4 / span 4;
        }
      }
    }
  }
}