html {
  scroll-behavior: smooth;
}

/* 
SXKNDZFCMS,DLF,C;SDLFSDFM
*/

.anim-slide-left-exit {
  transform: translateX(-30px);
  opacity: 0;
}
.anim-slide-right-exit {
  transform: translateX(30px);
  opacity: 0;
}
.anim-fade-exit {
  opacity: 0;
}

.anim-slide-left-enter {
  transform: translateX(30px);
  opacity: 0;
}
.anim-slide-right-enter {
  transform: translateX(-30px);
  opacity: 0;
}
.anim-fade-enter {
  opacity: 0;
}

.anim-active {
  transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
/* EXIT */
.exit-slide-left {
  transform: translateX(-18px);
  opacity: 0;
}
.exit-slide-right {
  transform: translateX(18px);
  opacity: 0;
}
.exit-fade {
  opacity: 0;
}

/* ENTER */
.enter-slide-left {
  transform: translateX(18px);
  opacity: 0;
}
.enter-slide-right {
  transform: translateX(-18px);
  opacity: 0;
}
.enter-fade {
  opacity: 0;
}

/* Active transition */
.anim-active {
  transition: all 0.55s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.card-animate {
  transition: transform 0.95s ease, box-shadow 0.95s ease;
}

.shadow-animate {
  transition: transform 0.95s ease, opacity 0.95s ease;
}

.card-container:hover .card-animate {
  transform: translateY(-6px);
}

.card-container:hover .breakdown {
  border: 0 !important;
  padding: 0;
}

.card-container:hover .shadow-animate {
  /* transform: translate(10px, 10px); */
  transition: cubic-bezier(0.075, 0.82, 0.165, 1);
  background-color: #f4c1be;
  opacity: 1;
}

.card-container:hover .started {
  display: block;
}

.content-wrapper {
  position: relative;
  min-height: 180px; /* reserve the space so card height NEVER shrinks */
}

.content-expand,
.started {
  /* position: absolute; */
  /* inset: 0; */
  transition: all 1.4s ease;
}

.group-hover .content-expand {
  opacity: 0;
  transform: translateY(10px);
}

.group-hover .started {
  opacity: 1;
  transform: translateY(0);
}

/* 
sdajdbcknfmcls;c.sacsacsdfcdsbfskjnmdfsdf
sdfnsabdjasd
*/

/* Icon rotation */
.faq-icon {
  display: inline-block;
  transition: transform 0.4s ease;
}

.faq-item.open .faq-icon {
  transform: rotate(135deg);
}

.faq-content {
  max-height: 0;
  opacity: 0;

  padding-top: 0;
  padding-bottom: 0;

  transition: max-height 0.85s ease, opacity 0.85s ease,
    padding 0.45s ease 0.15s; /* delay padding */
}

.faq-item.open .faq-content {
  max-height: 300px;
  margin-bottom: 1rem;
  opacity: 1;
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}
