.block-cards_with_hidden_description_v2 {
   position: relative;
}

.block-cards_with_hidden_description_v2 .title-wrapper {
   margin-bottom: clamp(26px, 84 * (100vw / 1920), 84px);
   color: #000;
}

.block-cards_with_hidden_description_v2 .cards:not(.cards--mobile) {
   display: grid;
   grid-template-columns: repeat(4, minmax(220px, 1fr));
   grid-template-rows: auto auto;
   grid-auto-flow: dense;
}

.block-cards_with_hidden_description_v2 .cards.cards--mobile {
   display: none;
}

.block-cards_with_hidden_description_v2 .card {
   border: 2px solid #D1D1D1;
   padding: clamp(29px, 50 * (100vw / 1920), 50px) clamp(17px, 29 * (100vw / 1920), 29px);
   margin: -1px;
   height: 100%;
   min-height: clamp(218px, 272 * (100vw / 1920), 272px);
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.block-cards_with_hidden_description_v2 .card--image {
   grid-column: span 3;
   grid-row: span 2;
   padding: 0;
   min-height: auto;
   height: calc(100% + 2px);
   margin: -1px;
   position: relative;
}

.block-cards_with_hidden_description_v2 .card--image .card__inner {
   height: 100%;
   display: block;
}

.block-cards_with_hidden_description_v2 .card--image .card__main {
   position: relative;
   inset: unset;
   opacity: 1;
   visibility: visible;
   display: block;
   height: 100%;
}

.block-cards_with_hidden_description_v2 .card--image .card__image {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   position: absolute;
   inset: 0;
}

.block-cards_with_hidden_description_v2 .card--image:hover .card__main,
.block-cards_with_hidden_description_v2 .card--image:hover .card__description {
   opacity: 1;
   visibility: visible;
}

.block-cards_with_hidden_description_v2 .card__inner {
   position: relative;
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.block-cards_with_hidden_description_v2 .card__main,
.block-cards_with_hidden_description_v2 .card__description {
   transition: all 0.3s ease-in-out;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align: center;
}

.block-cards_with_hidden_description_v2 .card__main {
   position: absolute;
   inset: 0;
}

.block-cards_with_hidden_description_v2 .card__main {
   opacity: 1;
   visibility: visible;
   gap: clamp(33px, 84 * (100vw / 1920), 84px);
}

.block-cards_with_hidden_description_v2 .card__description {
   opacity: 0;
   visibility: hidden;
   font-size: 1em;
}

.block-cards_with_hidden_description_v2 .card:not(.card--image):hover .card__main {
   opacity: 0;
   visibility: hidden;
}

.block-cards_with_hidden_description_v2 .card:not(.card--image):hover .card__description {
   opacity: 1;
   visibility: visible;
}

.block-cards_with_hidden_description_v2 .card__title,
.block-cards_with_hidden_description_v2 .card__subtitle,
.block-cards_with_hidden_description_v2 .card__description {
   margin: 0;
   color: #000;
}

.block-cards_with_hidden_description_v2 .card__description * {
   color: inherit;
}

.block-cards_with_hidden_description_v2 .card__subtitle {
   text-transform: uppercase;
}

@media (max-width: 1024px) {
   .block-cards_with_hidden_description_v2 .title-wrapper {
      margin-bottom: 0;
   }

   .block-cards_with_hidden_description_v2 .cards:not(.cards--mobile) {
      display: none;
   }

   .block-cards_with_hidden_description_v2 .cards.cards--mobile {
      display: flex;
      overflow: hidden;
   }

   .block-cards_with_hidden_description_v2 .card {
      background-color: #ededed;
   }

   .block-cards_with_hidden_description_v2 .card__inner {
      gap: 28px;
   }

   .block-cards_with_hidden_description_v2 .card--image {
      grid-column: span 1;
      height: auto;
      display: none;
   }

   .block-cards_with_hidden_description_v2 .card--image .card__image {
      height: auto;
      max-height: 300px;
   }

   .block-cards_with_hidden_description_v2 .card .card__main {
      position: relative;
   }

   .block-cards_with_hidden_description_v2 .card .card__main,
   .block-cards_with_hidden_description_v2 .card .card__description,
   .block-cards_with_hidden_description_v2 .card:hover .card__main,
   .block-cards_with_hidden_description_v2 .card:hover .card__description,
   .block-cards_with_hidden_description_v2 .card:not(.card--image):hover .card__main {
      opacity: 1;
      visibility: visible;
   }

   .block-cards_with_hidden_description_v2 .card {
      margin-right: 0;
   }

}