/* Skincare by Yudi - Golden section-title reveal (desktop + mobile).
   Replaces ONLY services-scroll-glow.css; works with the existing index.html.
   Duration: 4.6 seconds. Respects Reduced Motion. */

@media (prefers-reduced-motion: no-preference) {
  /* Class applied directly to main section headings by services-scroll-glow.js */
  h2.yudi-section-gold-reveal {
    transform-origin: 50% 50%;
    animation: yudi-section-title-gold-long 4600ms cubic-bezier(.22,.72,.28,1) both;
    will-change: transform, text-shadow, color;
  }

  /* Use the heading's changing color, even where an italic part was separately styled. */
  h2.yudi-section-gold-reveal i,
  h2.yudi-section-gold-reveal em {
    color: inherit !important;
    -webkit-text-fill-color: currentColor;
  }

  .eyebrow.yudi-section-gold-eyebrow {
    animation: yudi-section-eyebrow-gold-long 4400ms ease-in-out both;
  }
}

@keyframes yudi-section-title-gold-long {
  0% {
    transform: translate3d(0, 7px, 0) scale(.992);
    color: inherit;
    text-shadow: none;
    filter: brightness(1);
  }
  16% {
    transform: translate3d(0, 0, 0) scale(1.012);
    color: #a67b35;
    text-shadow: 0 0 7px rgba(255,217,138,.32), 0 0 18px rgba(208,154,52,.18);
    filter: brightness(1.06);
  }
  34% {
    transform: translate3d(0, 0, 0) scale(1.041);
    color: #c99a42;
    text-shadow: 0 0 12px rgba(255,222,146,.77), 0 0 29px rgba(218,162,53,.46);
    filter: brightness(1.12);
  }
  57% {
    transform: translate3d(0, 0, 0) scale(1.041);
    color: #d0a049;
    text-shadow: 0 0 16px rgba(255,225,155,.85), 0 0 37px rgba(221,164,55,.52);
    filter: brightness(1.16);
  }
  72% {
    transform: translate3d(0, 0, 0) scale(1.024);
    color: #b98b38;
    text-shadow: 0 0 12px rgba(255,213,122,.52), 0 0 28px rgba(210,155,57,.32);
    filter: brightness(1.09);
  }
  88% {
    transform: translate3d(0, 0, 0) scale(1.009);
    color: inherit;
    text-shadow: 0 0 4px rgba(240,186,82,.14);
    filter: brightness(1.02);
  }
  100% {
    transform: none;
    color: inherit;
    text-shadow: none;
    filter: none;
  }
}

@keyframes yudi-section-eyebrow-gold-long {
  0% { text-shadow: none; filter: brightness(1); }
  27% { color: #c08d35; text-shadow: 0 0 10px rgba(238,177,67,.42); filter: brightness(1.12); }
  56% { color: #dfb358; text-shadow: 0 0 14px rgba(255,210,113,.7); filter: brightness(1.2); }
  82% { text-shadow: 0 0 5px rgba(234,178,77,.20); filter: brightness(1.03); }
  100% { color: inherit; text-shadow: none; filter: none; }
}

@media (prefers-reduced-motion: reduce) {
  h2.yudi-section-gold-reveal,
  .eyebrow.yudi-section-gold-eyebrow {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    text-shadow: none !important;
  }
}
