@use '../../../../src/scss/utilities.scss';
.bannerLarge[data-bl-3312] {
  //border-bottom: solid 1px var(--f-aire);
  //max-width: 1320px;
  height: 100%;
  margin: auto;
  .titleBanner {
    @extend %VFSans-font;
    font-size: 35px;
    font-weight: 600;
    line-height: 1.37;
    text-align: center;
    color: var(--a-negro-unops);
  }
  .bannerLarge {
    position: relative;
    min-height: 450px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    .img-absolute {
      z-index: -1;
      @extend %img-absolute;
    }
    &::after {
      content: "";
      width: 100%;
      height: 100%;
      left: 0%;
      position: absolute;
      top: 0%;
      z-index: -1;
      background: rgb(13, 30, 47);
      background: linear-gradient(
        0deg,
        rgba(13, 30, 47, 0.75) 0%,
        rgba(13, 30, 47, 0) 150%
      );
    }
    &__content {
      .title {
        @extend %VFSans-font;
        font-size: 30px;
        font-weight: 600;
        line-height: 1.37;
        color: var(--a-blanco);
        p {
          margin-top: 0rem;
          margin-bottom: 0rem;
        }
        @media (max-width: 991.98px) {
          font-size: 25px;
        }
      }
    }
    &__description{
      @extend %custom-redactor-white;
      h2,h3,p{
        margin-bottom: 0.4rem;
      }
    }
    &__cta{
      background-color: var(--b-cereza);
      color: var(--a-blanco);
      font-size: 1rem;
      border: none;
      width: fit-content;
    }
  }
}