.block-imagetext {
  --marging-neg: -2.5rem;
  display: grid;
  grid-template-columns: subgrid;
  min-height: min(50vh, 700px);
  grid-template-areas: "image image image image" ". text text .";

  figure {
    grid-area: image;
    padding: 0;
    margin: 0;
  }

  &.width-box {
    grid-template-areas: "image image" "text text";
  }

  > div {
    padding: 2.5rem 0 2rem 0;
  }

  @media (width > 800px) {
    grid-template-areas: "image image text .";

    > div {
      padding: 2rem 0 2rem 2rem;
    }

    &.width-box {
      grid-template-areas: "image text";
    }
  }

  img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  > div {
    grid-area: text;
    align-self: center;
  }
}

.block-imagetext:nth-child(even) {
  @media (width > 800px) {
    grid-template-areas: ". text image image";

    &.width-box {
      grid-template-areas: "text image";
    }

    > div {
      padding: 2rem 2rem 2rem 0;
    }
  }
}