.sparkle-text {
    margin-bottom:10px;
    font-size: 1.75em;
    font-weight: bold;
    color: #f90404;
    position: relative;
    display: inline-block;
    overflow: hidden;
  }

  /* Main shimmer effect */
  .sparkle-text::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    height: 100%;
    width: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.8), transparent);
    animation: shimmer 2s ease-out forwards;
  }

  /* Spark particles for the twinkle effect */
  .sparkle-text span {
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    opacity: 0;
    animation: spark-flash 1s ease-in-out infinite;
  }

  /* Keyframes for the main shimmer animation */
  @keyframes shimmer {
    0% { left: -100%; }
    50% { left: 100%; }
    100% { left: 100%; }
  }

  /* Flash effect for individual sparks */
  @keyframes spark-flash {
    0%, 100% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1); opacity: 1; }
  }

  /* Positioning sparks randomly with different delays */
  .spark1 { top: 30%; left: 10%; animation-delay: 0.1s; }
  .spark2 { top: 70%; left: 20%; animation-delay: 0.2s; }
  .spark3 { top: 50%; left: 40%; animation-delay: 0.3s; }
  .spark4 { top: 20%; left: 70%; animation-delay: 0.4s; }
  .spark5 { top: 80%; left: 90%; animation-delay: 0.5s; }
  .spark6 { top: 40%; left: 80%; animation-delay: 0.6s; }
  .spark7 { top: 10%; left: 50%; animation-delay: 0.7s; }
  .spark8 { top: 60%; left: 30%; animation-delay: 0.8s; }