.block-revues-precedentes {
  @apply bg-carhop-blue-50 py-32;
  .block-revues-precedentes__header {
  }
  &__inner {
    @apply max-w-screen-2xl mx-auto;
  }

  &__header {
    @apply flex flex-col justify-center items-center gap-4;

    .block-title {
      @apply text-base mb-6 font-bold tracking-wider uppercase nunito;
    }

    .block-subtitle {
      @apply text-5xl font-normal uppercase;
    }
  }

  &__slider-content {
    @apply py-16 pt-32;
  }

  .card-revue {
    @apply grid  gap-y-12 2xl:gap-y-16 pb-24 gap-x-12 2xl:gap-x-24;
    grid-template-columns: 61.8fr 38.2fr;

    .content-meta {
      @apply col-span-2 w-full max-w-full mb-0;
    }
    &__image {
      @apply w-full h-full object-cover;
    }

    &__content {
      h4.title {
        @apply uppercase text-7xl font-normal pb-8;
      }
      h5.edito-title {
        @apply text-2xl font-bold uppercase pb-8;
      }
    }

    &__issue-thumbnail-wrapper {
      @apply relative w-full;
      .card-background {
        @apply absolute  border-primary border bg-white top-20 left-8;
        height: 94%;
        width: 104%;
        transform: perspective(800px) rotateY(10deg)
          skewX(1deg) rotateZ(4deg) rotateX(1deg)
          scale(0.98) translateY(-2px);
        z-index: 0;

        &::before {
          @apply content-[''] absolute inset-0 bg-carhop-purple-100 w-full h-full;
          width: calc(100% - 42px);
          height: calc(100% - 42px);
          left: 21px;
          top: 21px;

          z-index: 0;
        }
      }
    }

    &__issue-thumbnail {
      @apply bg-white border-primary border relative;
      /* transform: perspective(800px) rotateY(10deg) skewX(2deg); */
      height: 330px;
      position: relative;
      z-index: 10;

      img {
        width: calc(100% - 42px);
        height: calc(100% - 42px);
        left: 21px;
        top: 21px;
        object-fit: cover;
        position: relative;
        z-index: 2;
      }
    }
  }
}