/* VSW-TC-01 · Hero - song vo (Q109 d, kieu A) */
@media (max-width: 1023px) {
  .hero-nen { position: relative; }
}
.hero-song {
  position: absolute;
  inset: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: .7;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2254' height='1000'%3E%3Cdefs%3E%3CradialGradient id='song' gradientUnits='objectBoundingBox' cx='0' cy='0' r='1' gradientTransform='translate(.421 .82) scale(.3 .46)'%3E%3Cstop offset='.55'/%3E%3Cstop offset='1' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='2254' height='1000' fill='url(%23song)'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2254' height='1000'%3E%3Cdefs%3E%3CradialGradient id='song' gradientUnits='objectBoundingBox' cx='0' cy='0' r='1' gradientTransform='translate(.421 .82) scale(.3 .46)'%3E%3Cstop offset='.55'/%3E%3Cstop offset='1' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='2254' height='1000' fill='url(%23song)'/%3E%3C/svg%3E");
  -webkit-mask-size: cover;
  mask-size: cover;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: right bottom;
  mask-position: right bottom;
}
.hero-song-dai {
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(105deg, transparent 0 38%, var(--vs-ink) 47% 53%, transparent 62% 100%);
  mask-image: linear-gradient(105deg, transparent 0 38%, var(--vs-ink) 47% 53%, transparent 62% 100%);
  -webkit-mask-size: 260% 100%;
  mask-size: 260% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  animation: hero-song 5.5s cubic-bezier(.45, 0, .25, 1) infinite;
}
.hero-song-anh { filter: brightness(1.12) saturate(1.2); }
.hero-song--dung .hero-song-dai { animation-play-state: paused; }
@keyframes hero-song {
  0% { -webkit-mask-position: 100% 0; mask-position: 100% 0; }
  70%, 100% { -webkit-mask-position: 0% 0; mask-position: 0% 0; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .hero-song { -webkit-mask-position: 60% bottom; mask-position: 60% bottom; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-song { display: none; }
}
@media print {
  .hero-song { display: none; }
}