.template-index .category-heading-motion {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 8px;
}
.category-heading-motion > .category-heading-copy {
  position: relative;
  z-index: 2;
}
.category-heading-motion::before,
.category-heading-motion::after {
  content: '';
  position: absolute;
  pointer-events: none;
  z-index: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 100%;
  width: 132px;
  left: -142px;
  background: #ff8a00;
  clip-path: polygon(0 0, 65% 0, 100% 50%, 65% 100%, 0 100%, 35% 50%);
  opacity: 0;
}
.category-heading-motion::after {
  width: 60px;
  clip-path: polygon(0 0, 50% 0, 100% 50%, 50% 100%, 0 100%, 50% 50%);
}
.category-heading-motion.is-heading-sweeping::before {
  animation: category-heading-sweep 3.6s cubic-bezier(.3, .05, .4, 1) 2;
}
.category-heading-motion.is-heading-sweeping::after {
  animation: category-heading-echo 3.6s cubic-bezier(.3, .05, .4, 1) 2;
}
@keyframes category-heading-sweep {
  0%, 5% { left: -142px; opacity: 0; }
  12% { opacity: .27; }
  58% { left: calc(100% - 122px); opacity: .27; }
  72%, 100% { left: 100%; opacity: 0; }
}
@keyframes category-heading-echo {
  0%, 9% { left: -114px; opacity: 0; }
  17% { opacity: .15; }
  58% { left: calc(100% - 195px); opacity: .15; }
  76%, 100% { left: 100%; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .category-heading-motion.is-heading-sweeping::before,
  .category-heading-motion.is-heading-sweeping::after { animation: none; }
}
