@keyframes fade-in {
  from {
    opacity: 0;
    transform: scale(0.9);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

:is(
  .post-cards, 
  .rw_testimonials,
  .customers_all_cards
).js-method {
  position: relative;
  --spinner-size: 2em;
}

:is(
  .post-cards, 
  .rw_testimonials
).js-method {
  display: flex;
  overflow: hidden;
}
.rw_testimonials.js-method {
  flex-direction: column;
}

:is(
  .post-cards, 
  .rw_testimonials,
  .customers_all_cards
).js-method.loading::before {
  content: '';
  flex-shrink: 0;
  position: sticky;
  z-index: 100;
  left: 50%;
  top: calc(var(--spinner-size) * 2);
  width: var(--spinner-size);
  height: var(--spinner-size);
  border-top: 2px solid #d33;
  border-right: 2px solid #d33;
  border-radius: calc(var(--spinner-size) / 2);
  animation: spin 0.9s linear infinite;
}

:is(
  .post-cards, 
  .rw_testimonials,
  .customers_all_cards
).js-method :is(
  .post-card,
  .section-type-testimonials,
  .section-type-calltoaction,
  .testim-wrapper
) {
  opacity: 0;
  transform: scale(0.9);
}

:is(
  .post-cards, 
  .rw_testimonials,
  .customers_all_cards
).js-method:not(.loading) :is(
  .post-card,
  .section-type-testimonials,
  .section-type-calltoaction,
  .testim-wrapper
) {
  animation: fade-in 0.25s ease-out forwards;
}