.latest-posts-block {
  --items-repeat: 1;
  --items-gap-cols: 0;
  --items-gap-rows: 4;
  --item-radius: 2;
  --item-padding: 0;
  --figure-radius: 2;
  --infos-pad-top: 3;
  --infos-gap: 2;
  --heading-pad-top: 2;
  --heading-pad-bottom: 0;
  --abstract-pad-top: 2;
  --abstract-pad-bottom: 0;
  --actions-pad-top: 2;

  @media screen and (min-width: 480px) {
  --items-repeat: 2;
  }
  @media screen and (min-width: 960px) {
    --items-repeat: 4;
    --heading-pad-top: 3;
    --infos-gap: 3;
  }
  @media screen and (min-width: 1040px) {}
  @media screen and (min-width: 1181px) {}

  .inner-wrapper {
    gap: 0;
  }

  .block-header {
    padding-top: calc(var(--baseline) * var(--header-pad-top));
    padding-bottom: calc(var(--baseline) * var(--header-pad-bottom));
  }
  .block-heading {}

  .block-items {
    display: grid;
    grid-template-columns: repeat(var(--items-repeat), 1fr);
    gap: calc(var(--baseline) * var(--items-gap-rows)) calc(var(--baseline) * var(--items-gap-cols));
  }
  .block-item {}
  .item-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: calc(var(--baseline) * var(--item-radius));
    padding: calc(var(--baseline) * var(--item-padding));
  }
  .item-figure {
    display: inline-block;
    border-radius: calc(var(--baseline) * var(--figure-radius));
    background-color: var(--beige-50);
    background-image: var(--img-placeholder);
  }
  // .item-infos {
  //   display: flex;
  //   align-items: flex-start;
  //   justify-content: space-between;
  //   gap: calc(var(--baseline) * var(--infos-gap));
  //   padding-top: calc(var(--baseline) * var(--infos-pad-top));
  //   padding-bottom: calc(var(--baseline) * var(--infos-pad-bottom));
  // }
  // .item-tags {
  //   display: flex;
  //   align-items: center;
  //   flex-wrap: wrap;
  //   gap: calc(var(--baseline) * (var(--infos-gap) / 2));
  // }
  // .item-tag {
  //   padding: calc(var(--baseline) * 1);
  // }
  // .item-date {
  //   padding: calc(var(--baseline) * 1) 0;
  // }

  .item-heading {
    margin-top: 0;
    padding-top: calc(var(--baseline) * var(--heading-pad-top));
    padding-bottom: calc(var(--baseline) * var(--heading-pad-bottom));
  }
  .item-abstract {
    padding-top: calc(var(--baseline) * var(--abstract-pad-top));
    padding-bottom: calc(var(--baseline) * var(--abstract-pad-bottom));
  }
  .item-actions {
    /*margin-top: auto;*/
    padding-top: calc(var(--baseline) * var(--actions-pad-top));
    padding-bottom: calc(var(--baseline) * var(--actions-pad-bottom));
  }
  .item-action {}
}
