.intro-with-cards .full-width-mobile-tablet::before {
  content: url(../~/media/Images/I/inchcape/Corp/custom-components/intro-with-stats/group-dotted-pattern);
  position: absolute;
  left: 0;
  top: 38%
}
.intro-with-cards__bottom-bg {
  height: 17.6rem;
  margin-top: -19.9rem
}
.intro-with-cards__cards-container {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  height: 44.2rem;
  margin-top: var(--md-2);
  scrollbar-width: none;
}
.intro-with-cards__cards-container::-webkit-scrollbar {
  display: none
}
.intro-with-cards .config-text {
  margin-bottom: var(--sm-2)
}
.intro-with-cards__card {
  position: relative;
  margin: 0 10px;
  padding: 0;
  transition: width .5s ease,height .5s ease;
  z-index: 1;
  height: 28.4rem;
  width: 18rem;
}


.intro-with-cards__card.active {
  height: 45.3rem;
  width: 30rem ; 
}
.intro-with-cards__card.active .intro-with-cards__card-image {
  height: 30rem
}
.intro-with-cards__card.active .intro-with-cards__card-content {
  height: calc(100% - 300px);
  transition: width .5s ease,height .5s ease
}
.intro-with-cards__card.active .intro-with-cards__card-text {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: .3s
}
.intro-with-cards__card-text {
  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
  transition: opacity .5s ease,transform .5s ease
}
.intro-with-cards__card-image {
  height: 18rem;
  width: 100%;
  transition: width .5s ease,height .5s ease
}
.intro-with-cards__card-content {
  width: 100%;
  height: calc(100% - 180px);
  transition: width .5s ease,height .5s ease;

}
@media (min-width:992px) {
  .intro-with-cards::after {
    content: url('../~/media/Images/I/inchcape/Corp/custom-components/intro-with-stats/dotted-pattern');
    position: absolute;
    right: 0;
    bottom: 18.5rem
  }
}
@media (min-width:768px) {
  .intro-with-cards .full-width-mobile-tablet::before {
    content: url('../~/media/Images/I/inchcape/Corp/custom-components/intro-with-stats/group-dotted-pattern');
    position: absolute;
    left: -8%;
    top: -28%;
  }
}

.intro-with-cards .config-text__content p{
  color: var(--primary-1);
}
.intro-with-cards__card.active:focus-visible{
outline-offset: 0px;
}

.intro-with-cards .intro-with-cards__card-image img{
  display: inline-block;
}

@media (max-width:1199px) {
.intro-with-cards__cards-container {
overflow-x : scroll;
overflow-y : hidden;
}
}
@media (min-width:1199px) and (max-width:1399px){
.intro-with-cards__card {
width: 17rem;
margin: 0 6px;
}
}