/**
 * Timeline curve: light tip travels with path draw, then ShinyText
 * lingers on the final (featured) year.
 * Overrides the stock --featured year which used flat salon-text (looked drab).
 */

/* Featured year: stay warm — never flat black */
.salon-curve-timeline__item--featured .salon-curve-timeline__year {
  color: var(--salon-accent, #9a3412);
}

/* Soft amber tip that rides the drawing stroke */
.salon-curve-timeline__tip {
  fill: #f3d7a3;
  stroke: var(--salon-accent, #9a3412);
  stroke-width: 1.25;
  filter:
    drop-shadow(0 0 5px rgba(243, 215, 163, 0.95))
    drop-shadow(0 0 12px rgba(154, 52, 18, 0.35));
  pointer-events: none;
  opacity: 0;
}

/* Path gains a slight glow while the tip is traveling */
.salon-curve-timeline.is-drawing .salon-curve-timeline__path {
  stroke: color-mix(in srgb, var(--salon-accent, #9a3412) 78%, #f3d7a3);
  filter: drop-shadow(0 0 1.5px rgba(243, 215, 163, 0.45));
}

/*
 * ShinyText (React Bits–style), tuned for warm cream ground:
 * base terracotta + champagne highlight band.
 */
.salon-curve-timeline__year--shine,
.salon-curve-timeline__year--pass {
  color: transparent !important;
  background-image: linear-gradient(
    115deg,
    var(--salon-accent, #9a3412) 0%,
    var(--salon-accent, #9a3412) 40%,
    #fff1d2 49%,
    #f3d7a3 50.5%,
    var(--salon-accent, #9a3412) 60%,
    var(--salon-accent, #9a3412) 100%
  );
  background-size: 220% 100%;
  background-position: 100% 50%;
  -webkit-background-clip: text;
  background-clip: text;
}

.salon-curve-timeline__year--pass {
  animation: salon-timeline-shine-once 0.85s ease-out 1;
}

/* Arrival: whole year lit in rich gold, glow hugs strokes only */
.salon-curve-timeline__year--shine.salon-curve-timeline__year--linger {
  animation: none;
  color: #e2cc78 !important;
  background-image: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  text-shadow:
    0 0 1px rgba(255, 248, 220, 0.95),
    0 0 3px rgba(230, 205, 130, 0.4);
  font-weight: 700;
}

@keyframes salon-timeline-shine-once {
  0% {
    background-position: 100% 50%;
  }
  100% {
    background-position: -100% 50%;
  }
}

/* Featured node: soft pulse after arrival */
.salon-curve-timeline__item--featured .salon-curve-timeline__node.is-lit {
  box-shadow:
    0 0 0 5px rgba(154, 52, 18, 0.18),
    0 0 14px rgba(243, 215, 163, 0.75);
}

@media (prefers-reduced-motion: reduce) {
  .salon-curve-timeline__tip {
    display: none;
  }

  .salon-curve-timeline__year--pass {
    animation: none;
    color: var(--salon-accent, #9a3412) !important;
    background-image: none;
    -webkit-background-clip: unset;
    background-clip: unset;
  }

  .salon-curve-timeline__year--shine.salon-curve-timeline__year--linger {
    animation: none;
    color: #e2cc78 !important;
    background-image: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    text-shadow: none;
    font-weight: 700;
  }

  .salon-curve-timeline.is-drawing .salon-curve-timeline__path {
    filter: none;
    stroke: var(--salon-accent, #9a3412);
  }
}