@use '../utilities';
.elementCardItem[data-ec-49123] {
  .elementCard {
    border: 0px;
    border-radius: 4px;
    min-height: 421px;
    transition: all 0.3s ease-out;
    background-color: var(--ice-blue);
    &:hover {
      box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
      transform: scale(1.02);
    }
    &__photosLength,
    &__date,
    &__title {
      @extend %VFSans-font;
      font-weight: 600;
      color: #004976;
    }
    /*&__date {
      text-transform: uppercase;
      font-size: 15px;
      letter-spacing: 1.25px;
      color: var(--b-medianoche);
    }*/
    &__category {
      @extend %VFSans-font;
      font-size: 16px;
      font-weight: 600;
      line-height: 1.5;
      color: #27251f;
    }
    &__description {
      &,
      &--link {
        font-size: 14px;
        font-weight: 300;
        line-height: 1.57;
        color: var(--a-negro-unops);
      }
      &--link {
        font-weight: 600;
        color: var(--a-azul-unops);
      }
    }

    &__photosLength {
      font-size: 16px;
      line-height: 1.5;
      color: var(--pastel-orange);
    }
    &__title {
      font-size: 20px;
      line-height: 1.5;
      color: #004976;
    }
    &__contentTitle {
      display: flex;
      justify-content: center;
      flex-direction: column;
      align-items: center;
      min-height: 141px;
    }
    &,
    .card-header {
      overflow: hidden;
    }
    .card-header {
      position: relative;
      min-height: 190px;
      border-radius: 0px;

      img.bg-img {
        @extend %img-absolute;
      }
      &::after {
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.65) 100%);
        z-index: 2;
      }
      .cardElement__link {
        position: absolute;
        bottom: 20px;
        right: 20px;
        color: var(--a-blanco);
        z-index: 3;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        &:after {
          content: '';
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' fill='%23fff'%3E%3Cpath d='M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z'/%3E%3C/svg%3E");
          background-position: center;
          background-repeat: no-repeat;
          background-size: contain;
          width: 20px;
          height: 20px;
        }
      }
    }
  }
}