/* ==========================================================================
   ShinyText — Pure CSS implementation
   Applied to .section-title and .hero-title .shiny-text
   ========================================================================== */

@keyframes shiny-sweep {
  0%   { background-position: 200% center; }
  100% { background-position: -100% center; }
}

/* ---- Section titles (all h2.section-title) ---- */
.section-title {
  background-image: linear-gradient(
    120deg,
    #999 0%,
    #999 30%,
    #ffffff 50%,
    #999 70%,
    #999 100%
  );
  background-size: 250% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shiny-sweep 3s linear infinite;
}

/* ---- Hero title shiny spans ---- */
.shiny-text {
  display: inline-block;
  background-image: linear-gradient(
    120deg,
    #c0c0c0 0%,
    #c0c0c0 30%,
    #ffffff 50%,
    #c0c0c0 70%,
    #c0c0c0 100%
  );
  background-size: 250% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shiny-sweep 3s linear infinite;
}

/* Ensure hero-title child spans inherit font styles */
.hero-title .shiny-text {
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

/* Second span is offset so the two lines don't shimmer in sync */
.hero-title .shiny-text:nth-of-type(2) {
  animation-delay: -1.2s;
}
