.accordion-slider__accordion .accordion-slider__header {
  border: solid 1px var(--color-display);
  border-left: none;
  border-right: none;
  border-bottom: none;
  background-color: transparent;
  transition: all .3s ease
}
.accordion-slider__accordion .accordion-slider__header .icon {
  background: var(--base-5);
  color: var(--primary-1);
  border-radius: 100%; 
  padding: .8rem;
  font-size: initial;
/*   line-height: initial; */ 
  transition: .4s all ease-in-out
}
.accordion-slider__accordion .accordion-slider__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height .7s ease-in-out
}
.accordion-slider__accordion .accordion-slider__item.open .headline-sm {
  font-family: var(--headline-m-font-family);
  font-size: var(--headline-m-font-size);
  line-height: var(--headline-m-line-height);
  letter-spacing: var(--headline-m-letter-spacing);
  font-weight: var(--headline-m-weight);
  text-wrap: balance
}
.accordion-slider__accordion .accordion-slider__item.open .accordion-slider__header .icon {
  background: var(--primary-1);
  color: var(--primary-2);
  transform: rotate(180deg);
  font-size: initial;

}
.accordion-slider__accordion .accordion-slider__item.open .accordion-slider__content {
  max-height: 100%
}
.accordion-slider__vehicleimg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 20rem;
  opacity: 0;
  transform: translate(-400px,300px);
  transition: transform .7s ease,opacity .4s ease;
  z-index: -1
}
.accordion-slider__vehicleimg.active-incoming {
  transform: translate(0,0);
  z-index: 2;
  opacity: 1
}
.accordion-slider__vehicleimg.active-outgoing {
  transform: translate(400px,-300px);
  z-index: 1;
  opacity: 0
}
.accordion-slider .dotted-pattern::before {
  content: url("/~/media/Images/I/inchcape/Corp/custom-components/accordion-slider/accorion-slider-dots-pattern.png");
  position: absolute;
  left: 7rem;
  top: -26%
}
.accordion-slider__image-dots {
  position: absolute;
  bottom: 26%;
  left: 60%;
  transform: skew(16deg,-28deg);
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center
}
.accordion-slider__image-dots .dot {
  width: 7px;
  height: 7px;
  background: var(--base-2);
  border-radius: 50%;
  transition: background .3s ease;
  opacity: .6
}
.accordion-slider__image-dots .dot.active-dot {
  width: 10px;
  height: 10px;
  background: var(--primary-1);
  opacity: 1
}
@media (max-width:767.98px) {
  .accordion-slider .vehicleimg.active-incoming {
    transform: translate(100px,-100px) rotate(-20deg)
  }
  .accordion-slider .accordion-slider__image-dots {
    transform: translateX(50%) rotate(-20deg)
  }
}
.section-dark .accordion-slider__item.open .accordion-slider__header .icon {
  background: var(--primary-2);
  color: var(--primary-1);
  font-size: initial;
/*   line-height: initial */ 
}
.section-dark .accordion-slider__image-dots .dot {
  background: var(--light-50)
}
.section-dark .accordion-slider__image-dots .dot.active-dot {
  background: var(--base-5)
}

.accordion-content .accordion-clippath{
clip-path: polygon(0 0, 100% 0, 100% 54%, 97% 100%, 0 100%, 0 35%);
}
.card-dark .accordion-slider__content .cta:focus-visible, .panel-dark .accordion-slider__content .cta:focus-visible,  .section-dark .accordion-slider__content .cta:focus-visible, .theme-dark .accordion-slider__content .cta:focus-visible{
margin-left:1rem;
}
