.hero h1 span {
  border-radius: 32px 33px 33px 0px;
  padding-bottom: 2px;
}

[data-card="hipotecario"] {
  .marca {
    .bg-custom {
      background-color: #75CAFC;
    }
  }
  .info-block:not(*:first-child),
  .condiciones {
    border-top: 1px solid #75CAFC;
  }
}
[data-card="automotriz"] {
  .marca {
    .bg-custom {
      background-color: #C7AEE9;
    }
  }
  .info-block:not(*:first-child),
  .condiciones {
    border-top: 1px solid #C7AEE9;
  }
}
[data-card="seguros"] {
  .marca {
    .bg-custom {
      background-color: #FC4242;
    }
  }
  .info-block:not(*:first-child),
  .condiciones {
    border-top: 1px solid #FC4242;
  }
}

.slick-track {
  display: flex !important;
}
.slick-slide {
  height: inherit !important;
}
.promociones {
  .slider-counter {
    margin-bottom: 1rem;
    .icon--arrow {
      width: 40px;
      cursor: pointer;
    }
    .icon--arrow:hover {
      svg {
        transform: scale(1.1);
      }
    }
  }
  .slide {
    .content {
      height: 100%;
      border-radius: 1rem;
      margin-inline: .5rem !important;
      .marca {
        flex-direction: column;
        .h3 {
          flex-shrink: 0;
          max-width: 150px;
        }
        .logo-marca {
          border-radius: .8rem;
          aspect-ratio: 229/101;
          flex-shrink: 1;
        }
      }
      .listado-promociones {
        gap: 1.25ch;
        strong {
          font-weight: 600;
          text-rendering: geometricprecision;
        }
        .info-block {
          font-size: 13px;
          line-height: 1.1;
          .condicion {
            font-size: 10px;
            p {
              margin: 0;
            }
          }
          strong {
            line-height: 1.1;
            span {
              font-size: 1.2rem;
              line-height: 1.2;
              display: inline-block;
            }
          }
        }
      }
      .button {
        width: fit-content;
        padding-inline: 2rem;
        transform: translateY(-50%);
        margin-top: -1rem;
      }
      .condiciones {
        font-size: 10px;
        p {
          margin: 0;
        }
      }
    }
  }
}
.promociones:has(.slick-cloned) .slick-current {
  .content {
   
  }
}
.promociones:not(:has(.slick-cloned)) .slider-counter {
  display: none !important;
}
.chip-icon {
  border-radius: 10px;
  padding: 3px 6px;
  display: grid;
  object-position: center;
  margin-top: 1px;
  width: max-content;
  svg {
    width: 10px;
    height: unset;
  }
}
.products {
  .d-flex {
    gap: 1rem;
  }
  .card + .card {
    margin-top: 1rem;
  }
  .col-md-6 + .col-md-6:has(.card .card-body.open) {
    .card {
      height: 100%;
    }
  }
  .row:has(.col-md-6.open + .col-md-6.open) {
    .card {
      height: 100%;
    }
  }
  .product-item {
    flex: 1 1 calc(50% - 1rem);
    text-align: center;
    border-radius: 48px;
    .h2 {
      margin-bottom: 0;
    }
  }
}
.card {
  border-radius: 40px;
  border: 0;
  /* min-height: 100%; */
  img {
    border-radius: 24px;
    /* aspect-ratio: 6/3; */
  }
  .link {
    font-size: 1.25rem;
    font-weight: bold;
    text-decoration: none;
    color: inherit;
  }
  .card-title {
    font-size: 1.8rem;
    /* font-weight: bold; */
    letter-spacing: 1%;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    width: 100%;
  }
  .link {
    border-top: 1px solid lightgray;
  }
  .card-body {
    padding-inline: 0;
    overflow: hidden;
    padding-bottom: 0;
  }
  .card-body.open {
    padding-bottom: 1rem;
  }
  .card-text {
    font-size: 1.25rem;
    max-width: 480px;
    display: none;
  }
  .card-body.open .card-text {
    display: block;
  }
  .card-text.bold {
    font-weight: 600;
  }
}
.legales {
  .legal {
    .content p {
      animation: height .2s ease, display .2s ease;
      transition: height .25s ease, display .2s ease;
      height: 0;
      overflow-y: clip; 
    }
    * {
      max-width: unset;
    }
    strong {
      span {
        font-size: 1.3rem;
      }
    }
  }
}
.legales .legal.active .content p {
  height: max-content;
}
.legales .legal svg {
  transition: transform .2s;
}
.legales .legal.active svg {
  transform: rotate(90deg);
}