.card-spotlight { position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: inherit; opacity: 0; background: radial-gradient(260px circle at var(--glow-x, 50%) var(--glow-y, 50%), rgba(193,140,255,.14), transparent 75%); transition: opacity .25s ease; }
.service-dialog .card-spotlight { display: none; }
.hero-waveform { position: absolute; z-index: 0; inset: auto 0 42px; height: 125px; display: flex; align-items: center; justify-content: center; gap: clamp(3px, .7vw, 10px); pointer-events: none; opacity: .22; mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent); }
.hero-waveform span { flex: 0 1 4px; height: var(--bar-height); border-radius: 4px; background: linear-gradient(var(--purple-bright), var(--pink)); transform-origin: center; animation: waveform-pulse 4s ease-in-out infinite; animation-delay: var(--bar-delay); }
.hero-waveform.is-paused span, .hero-waveform.tab-paused span { animation-play-state: paused; }
.reading-progress { position: fixed; z-index: 30; top: 0; left: 0; width: 100%; height: 3px; background: linear-gradient(90deg, var(--purple), var(--pink)); transform: scaleX(0); transform-origin: left; pointer-events: none; }
.button { transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.button-primary:hover { box-shadow: 0 8px 30px rgba(164,92,255,.35); }
.button > span[aria-hidden], .text-link > span[aria-hidden] { display: inline-block; transition: translate .2s ease; }
.button:hover > span[aria-hidden], .text-link:hover > span[aria-hidden] { translate: 2px -2px; }
.button:active { transform: translateY(1px); }
.service-grid .service-more:active { transform: none; }
.gear-feature img { transition: filter .4s ease; }
.gear-feature:hover img { filter: brightness(.78) saturate(.85); }
@media (hover: hover) and (pointer: fine) {
  .service-card:hover > .card-spotlight, .more-card:hover > .card-spotlight { opacity: 1; }
}
@keyframes waveform-pulse {
  0%, 100% { transform: scaleY(.45); }
  50% { transform: scaleY(1); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-waveform span { animation: none; }
  .card-spotlight { display: none; }
  .button, .button > span[aria-hidden], .text-link > span[aria-hidden], .gallery-item img, .gear-feature img { transition: none; }
  .button:hover, .button:active, .service-card:hover { transform: none; }
  .button:hover > span[aria-hidden], .text-link:hover > span[aria-hidden] { translate: none; }
}