/* Helovyno tema (helovynas.js). Sluoksnis #hv — virš puslapio, bet po langais (z-index 35: virš antraštės 30, po apatiniu meniu 40
   ir visais iššokančiais langais), pro jį spaudžiama kiaurai. Juodi piešiniai — su oranžiniu „mėnulio" kraštu, kitaip juodame fone nesimatytų. */
/* ---------------------------------------------------------------- fonas — paveikslėlis už viso puslapio (z-index -1: po turiniu), lėtai „kvėpuoja" */
#hv-fonas { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background: #05070f; }
/* scena — tikslių paveikslėlio proporcijų dėžė, uždengianti ekraną (kaip cover), kad švytėjimai sėdėtų savo vietose */
.hv-scena { --w: max(100vw, calc(100vh * 1673 / 940)); position: absolute; top: 50%; left: calc((100vw - var(--w)) / 2); width: var(--w); aspect-ratio: 1673 / 940;
  transform: translateY(-50%); background: url(/helovynas/fonas.webp?v=1) center / 100% 100% no-repeat; animation: hvFoto 40s ease-in-out infinite alternate; }
/* telefone — matosi raitelis su degančiu moliūgu */
@media (max-aspect-ratio: 1/1) { .hv-scena { left: calc((100vw - var(--w)) * .27); } }
@keyframes hvFoto { from { scale: 1; } to { scale: 1.06; } }
.hv-ug { position: absolute; border-radius: 50%; mix-blend-mode: screen; pointer-events: none; transform: translate(-50%, -50%);
  background: radial-gradient(closest-side, rgba(255, 170, 60, .75), rgba(255, 110, 20, .35) 45%, rgba(255, 80, 0, 0)); animation: hvUgnis 2.2s steps(20) infinite; }
.hv-ug-ranka { left: 24.4%; top: 13.5%; width: 11%; height: 17%; }
.hv-ug-liepsna { left: 24.6%; top: 6%; width: 7%; height: 12%; background: radial-gradient(closest-side, rgba(255, 210, 90, .8), rgba(255, 90, 0, .3) 55%, rgba(255, 60, 0, 0));
  transform-origin: 50% 100%; animation: hvLiezuvis .55s ease-in-out infinite alternate, hvUgnis 2.2s steps(20) infinite; }
.hv-ug-zibintas { left: 88.7%; top: 40.5%; width: 6%; height: 11%; animation-delay: -.7s; }
.hv-ug-m1 { left: 8%; top: 81%; width: 16%; height: 20%; animation-delay: -1.3s; }
.hv-ug-m2 { left: 18.5%; top: 82%; width: 12%; height: 16%; animation-delay: -.4s; }
.hv-ug-pilis { left: 62%; top: 35%; width: 9%; height: 16%; background: radial-gradient(closest-side, rgba(255, 190, 90, .4), rgba(255, 140, 40, 0)); animation-duration: 3.3s; animation-delay: -1s; }
@keyframes hvUgnis { 0% { opacity: .55; } 10% { opacity: .9; } 18% { opacity: .6; } 27% { opacity: 1; } 35% { opacity: .7; } 46% { opacity: .95; } 52% { opacity: .5; }
  63% { opacity: .85; } 71% { opacity: .65; } 80% { opacity: 1; } 90% { opacity: .6; } 100% { opacity: .55; } }
@keyframes hvLiezuvis { from { transform: translate(-50%, -50%) scale(1, 1); } to { transform: translate(-50%, -56%) scale(.85, 1.2); } }
/* turiniui — pritemdymas, kad tekstas liktų įskaitomas */
.hv-tamsa { position: absolute; inset: 0; background: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .5)); }
body.hv { background: #000; }
body.hv .side { background: rgba(0, 0, 0, .55); }

#hv { position: fixed; inset: 0; z-index: 35; pointer-events: none; overflow: hidden; }
#hv > div { position: absolute; left: 0; top: 0; }
#hv svg { display: block; width: 100%; height: auto; overflow: visible; }

/* ---------------------------------------------------------------- voratinkliai ir voras */
#hv .hv-tinklas { width: 150px; }
#hv .hv-tinklas.hv-d { left: auto; right: 0; transform: scaleX(-1); }
#hv .hv-tinklas.hv-k { width: 96px; }
#hv.tel .hv-tinklas.hv-d { width: 84px; }
#hv.tel .hv-tinklas.hv-k { display: none; }
#hv .hv-voras { left: auto; right: 58px; top: -320px; width: 26px; animation: hvVoras 16s ease-in-out infinite; }
#hv.tel .hv-voras { right: 30px; width: 20px; }
#hv .hv-siulas { display: block; width: 1px; height: 330px; margin: 0 auto -6px; background: rgba(235, 235, 235, .45); }
#hv .hv-voras svg { animation: hvSupasi 3s ease-in-out infinite; transform-origin: 50% 0; }
@keyframes hvVoras { 0%, 12% { transform: translateY(0); } 30%, 62% { transform: translateY(140px); } 70% { transform: translateY(120px); } 88%, 100% { transform: translateY(0); } }
#hv.tel .hv-voras { animation-name: hvVorasT; }
@keyframes hvVorasT { 0%, 12% { transform: translateY(0); } 30%, 62% { transform: translateY(96px); } 88%, 100% { transform: translateY(0); } }
@keyframes hvSupasi { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }

/* ---------------------------------------------------------------- moliūgai ir žvakės */
#hv .hv-kampas { display: flex; align-items: flex-end; gap: 2px; width: 150px; height: 62px; }
#hv .hv-kampas[hidden], #hv [hidden] { display: none; }
#hv .hv-m { flex: none; width: 52px; filter: drop-shadow(0 0 10px rgba(255, 120, 20, .35)); }
#hv .hv-m2 { width: 44px; }
#hv .hv-z { flex: none; width: 15px; margin: 0 3px; }
#hv .hv-svytejimas { position: absolute; left: -10%; right: -10%; bottom: -16px; height: 70px;
  background: radial-gradient(ellipse at 50% 70%, rgba(255, 130, 30, .32), rgba(255, 90, 0, 0) 68%); animation: hvSvyti 2.6s ease-in-out infinite; }
#hv .hv-veidas { animation: hvVeidas 3.1s linear infinite; }
#hv .hv-m2 .hv-veidas { animation-duration: 2.3s; animation-delay: -1s; }
#hv .hv-liepsna { transform-box: fill-box; transform-origin: 50% 100%; animation: hvLiepsna .9s ease-in-out infinite alternate; }
#hv .hv-z2 .hv-liepsna { animation-duration: .7s; }
@keyframes hvSvyti { 0%, 100% { opacity: .75; } 40% { opacity: 1; } 55% { opacity: .6; } 70% { opacity: .95; } }
@keyframes hvVeidas { 0%, 100% { fill: #ffe27a; } 18% { fill: #ffc640; } 22% { fill: #fff09e; } 50% { fill: #ffd25a; } 63% { fill: #ffb52e; } 66% { fill: #ffeb8a; } }
@keyframes hvLiepsna { 0% { transform: scale(1, 1) rotate(-3deg); } 50% { transform: scale(.9, 1.12) rotate(2deg); } 100% { transform: scale(1.05, .92) rotate(4deg); } }
/* telefone — maži, antraštėje */
#hv.tel .hv-kampas { width: 96px; height: 40px; gap: 0; }
#hv.tel .hv-m { width: 34px; }
#hv.tel .hv-m2 { width: 29px; }
#hv.tel .hv-z { width: 10px; margin: 0 2px; }
#hv.tel .hv-svytejimas { height: 44px; bottom: -14px; }
#hv.tel .hv-kampas.vienas { width: 44px; }
#hv.tel .hv-kampas.vienas .hv-m2, #hv.tel .hv-kampas.vienas .hv-z2 { display: none; }

/* ---------------------------------------------------------------- vaiduoklis prie logotipo */
#hv .hv-vaid-sonas { width: 50px; animation: hvPlaukia 4.5s ease-in-out infinite; opacity: .95; }
#hv .hv-vaid-sonas .hv-akys, #hv .hv-vaid .hv-akys { transform-box: fill-box; transform-origin: 50% 50%; animation: hvMirksi 5s infinite; }
#hv .hv-vaid-sonas .hv-burna { transform-box: fill-box; transform-origin: 50% 50%; animation: hvBurna 4.5s ease-in-out infinite; }
@keyframes hvPlaukia { 0%, 100% { transform: translateY(0) rotate(-5deg); } 50% { transform: translateY(-12px) rotate(5deg); } }
@keyframes hvMirksi { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes hvBurna { 0%, 100% { transform: scale(1); } 50% { transform: scale(.75, 1.15); } }

/* ---------------------------------------------------------------- praskrendantys */
#hv .hv-skrenda { will-change: transform; }
#hv .hv-sp .hv-sp-k, #hv .hv-sp .hv-sp-d { transform-box: view-box; transform-origin: 40px 18px; animation: hvSparnas .2s ease-in-out infinite alternate; }
@keyframes hvSparnas { from { transform: scaleY(1); } to { transform: scaleY(-.35); } }
#hv .hv-sp { filter: drop-shadow(0 0 4px rgba(255, 120, 30, .35)); }

#hv .hv-ragana { filter: drop-shadow(0 0 10px rgba(190, 140, 255, .22)); }
#hv .hv-ragana .hv-plaukai { transform-box: fill-box; transform-origin: 100% 30%; animation: hvPlaukai .35s ease-in-out infinite alternate; }
#hv .hv-ragana .hv-apsiaustas { transform-box: fill-box; transform-origin: 100% 0; animation: hvPlaukai .45s ease-in-out infinite alternate; }
@keyframes hvPlaukai { from { transform: skewY(-4deg) scaleX(1); } to { transform: skewY(5deg) scaleX(1.06); } }
#hv .hv-zvaigzde { position: absolute; font-size: 13px; line-height: 1; text-shadow: 0 0 6px currentColor; animation: hvZvaigzde 1s ease-out forwards; }
@keyframes hvZvaigzde { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: translateY(14px) scale(.3) rotate(90deg); } }

#hv .hv-katinas { display: flex; flex-direction: column; justify-content: flex-end; }
#hv .hv-katinas .hv-k-beg { animation: hvSuolis .32s ease-in-out infinite alternate; }
#hv .hv-katinas .hv-k-isg { display: none; }
#hv .hv-katinas.issigando .hv-k-beg { display: none; }
#hv .hv-katinas.issigando .hv-k-isg { display: block; transform-origin: 50% 100%; animation: hvIsgastis .12s linear infinite alternate; }
@keyframes hvIsgastis { from { transform: translateX(-1px) scale(1.02); } to { transform: translateX(1px) scale(1.06, 1.04); } }
#hv .hv-katinas .hv-koja { transform-box: view-box; animation: hvKoja .32s ease-in-out infinite alternate; }
#hv .hv-katinas .hv-koja:nth-child(odd) { animation-direction: alternate-reverse; }
#hv .hv-katinas .hv-uodega { transform-box: view-box; transform-origin: 36px 40px; animation: hvUodega .64s ease-in-out infinite alternate; }
#hv .hv-katinas { filter: drop-shadow(0 0 6px rgba(255, 120, 30, .3)); }
@keyframes hvSuolis { from { transform: translateY(0) rotate(-2deg); } to { transform: translateY(-6px) rotate(2deg); } }
@keyframes hvKoja { from { transform: rotate(-32deg); } to { transform: rotate(32deg); } }
@keyframes hvUodega { from { transform: rotate(-8deg); } to { transform: rotate(10deg); } }

#hv .hv-vaid { filter: drop-shadow(0 0 14px rgba(255, 255, 255, .25)); }

/* ---------------------------------------------------------------- ARTOFHOOD logotipas: skrybėlė, oranžinis švytėjimas, kartais „sumirga" */
.hv-skrybele { position: absolute; z-index: 2; pointer-events: none; transform: rotate(16deg); transform-origin: 50% 90%; animation: hvSkrybele 3.2s ease-in-out infinite; }
.hv-skrybele[hidden] { display: none; }
.hv-skrybele svg { display: block; width: 100%; height: auto; }
@keyframes hvSkrybele { 0%, 100% { transform: rotate(16deg); } 50% { transform: rotate(9deg) translateY(-2px); } }
/* tik dideli logotipai (kompiuterio kairysis meniu); maži telefono / Battles antraštėse lieka įprasti — ten švytėjimas netelpa */
body.hv .side-logo, body.hv .ba-logo img { animation: hvLogo 7s ease-in-out infinite; mix-blend-mode: normal; }   /* juodą permatoma daro filtras */
@keyframes hvLogo { 0%, 85%, 87.5%, 91%, 100% { filter: url(#hv-logo-o); opacity: 1; } 86% { filter: url(#hv-logo-z); opacity: .45; } 89% { filter: url(#hv-logo-z); opacity: .6; } }
.hv-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  #hv-fonas * { animation: none !important; }
  #hv *, .hv-skrybele { animation: none !important; }
  body.hv .side-logo, body.hv .ba-logo img { animation: none; filter: url(#hv-logo-o); mix-blend-mode: normal; }
  #hv .hv-voras { transform: translateY(80px); }
}
