@keyframes fade-up {
  0% {
    opacity: 0;
    transform: translateY(2rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade-right {
  0% {
    opacity: 0;
    transform: translateX(2rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fade-left {
  0% {
    opacity: 0;
    transform: translateX(-2rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
/* /right bounce */

:root{
  --multipler:1;
}
/*
*   Add a base delay.
*/
.aos {
  animation-delay: calc(0.5s * var(--multiplier))!important;
}

/*
*   Add the default state of each element before it is animated.
*   This should be the same as the 0% keyframes CSS
*/
.aos.fade-up {
  opacity: 0;
  transform: translateY(2rem);
}
.aos.fade-right {
  opacity: 0;
  transform: translateX(-2rem);
}
.aos.fade-left {
  opacity: 0;
  transform: translateX(2rem);
}

/*
*   Trigger the animation
*/
.animate.aos.fade-up {
  animation: fade-up 1s both;
}
.animate.aos.fade-left {
  animation: fade-left 1s both;
}
.animate.aos.fade-right {
  animation: fade-right 1s both;
}

/*
*   Set some delays.
*/
.animation-delay-1,
.animation-delay-stagger .aos:nth-child(1) {
  --multiplier: 1.1;
  /*animation-delay: calc(var(--baseDelay, 0.5s) + 0.25s) !important;*/
}
.animation-delay-2,
.animation-delay-stagger .aos:nth-child(2) {
    --multiplier: 1.2;
}
.animation-delay-3,
.animation-delay-stagger .aos:nth-child(3) {
   --multiplier: 1.3;
}
.animation-delay-4,
.animation-delay-stagger .aos:nth-child(4) {
   --multiplier: 1.4;
}
.animation-delay-5,
.animation-delay-stagger .aos:nth-child(5) {
   --multiplier: 1.5;
}
.animation-delay-6,
.animation-delay-stagger .aos:nth-child(6) {
   --multiplier:1.75;
}

/*
 * Respect user's reduced motion preference
 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .aos {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Opt-in the whole page to animating to/from intrinsic sizing keywords */
:root {
    interpolate-size: allow-keywords; /* 👈 */
}

.wp-block-accordion-panel{
  transition: height 300ms ease, display 250ms;
  transition-behavior: allow-discrete;
}

.wp-block-accordion-panel[inert]{
    height: 0;

}


.wp-block-accordion-panel:not([inert]){
  height: fit-content;
  height: calc-size(fit-content, size + 1em); /* 👈 Only calc-size() can do this */
}
