/* Хеллоуин в духе FEAR (своя графика /images/halloween/*.svg). Режим «Хеллоуин» в админке → Внешний вид → Погодные условия.
   Ветки, деревья и свечение - ЗА содержимым; призраки - только по краям широкого экрана; забор над подвалом; паутинки в углах карточек.
   Кнопка сезонных эффектов (класс ek-ny-off на html) прячет всё. */
.hw-deco { pointer-events: none; }
html.ek-ny-off .hw-deco { display: none !important; }

/* фон за содержимым: прокручивается вместе со страницей, как у FEAR */
.hwx-back { position: absolute; left: 0; top: 0; width: 100%; height: 1500px; overflow: hidden; z-index: -1; }
.hwx-back img { position: absolute; max-width: none; user-select: none; }
.hwx-glow { position: absolute; border-radius: 50%; background: radial-gradient(closest-side, rgba(253,122,35,.14), rgba(253,122,35,.08) 35%, rgba(253,122,35,.03) 65%, rgba(253,122,35,0)); }
.hwx-glow-l { top: -260px; left: -420px; width: 1100px; height: 950px; }
.hwx-glow-r { top: 260px; right: -460px; width: 1050px; height: 1150px; }
.hwx-branch-l { top: -120px; left: 0; width: 320px; } /* выше заголовка страницы, а не на нём */
.hwx-branch-r { top: -120px; right: 0; width: 320px; transform: scaleX(-1); }
.hwx-tree-l { top: 560px; left: 40px; width: 380px; opacity: .85; }
.hwx-tree-r { top: 330px; right: -40px; width: 470px; transform: scaleX(-1); opacity: .85; }

/* призраки по краям: парят. Слой ЗА содержимым: на экранах, где по бокам нет
   свободного места (ноутбуки 1400-1600px), призрак выглядывает из-за карточек, а не
   закрывает их текст. */
.hwx-front { position: absolute; left: 0; top: 0; width: 100%; height: 0; overflow: visible; z-index: -1; }
.hwx-gh { position: absolute; max-width: none; height: auto; animation: hwxFloat 6s ease-in-out infinite; filter: drop-shadow(0 6px 22px rgba(160,190,255,.25)); }
.hwx-gh-calm { top: 120px; right: 36px; width: 150px; }
.hwx-gh-angry { top: 470px; left: 92px; width: 170px; animation-delay: -2s; }
.hwx-gh-pumpkin { top: 700px; right: 54px; width: 140px; animation-delay: -4s; }
.hwx-gh-smile { top: 930px; left: 104px; width: 118px; animation-delay: -1s; animation-duration: 7s; }
@keyframes hwxFloat { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-14px) rotate(2deg); } }
@media (max-width: 1599px) { .hwx-gh-smile, .hwx-gh-pumpkin { display: none; } .hwx-gh-calm, .hwx-gh-angry { width: 110px; } }
@media (max-width: 1399px) { .hwx-front { display: none; } }

/* кладбищенский забор над подвалом каждой страницы */
.hwx-fence { position: absolute; left: 0; right: 0; bottom: 100%; z-index: 2; height: 150px; background: url(/images/halloween/fence.svg) center bottom / auto 150px repeat-x; }
@media (max-width: 700px) { .hwx-fence { height: 96px; background-size: auto 96px; } }

/* паутинки в углах карточек */
.hwx-web { position: absolute; width: 62px; height: 62px; opacity: .45; z-index: 3; }
.hwx-web-tl { top: 0; left: 0; }
.hwx-web-br { right: 0; bottom: 0; transform: scale(-1, -1); }
/* магазин: злой призрак выглядывает из-за карточки */
.hwx-peek { position: absolute; right: -46px; bottom: -88px; width: 130px; z-index: 4; transform: rotate(-12deg); animation: hwxPeek 5s ease-in-out infinite; }
@keyframes hwxPeek { 0%, 100% { transform: rotate(-12deg) translateY(0); } 50% { transform: rotate(-8deg) translateY(-8px); } }

@media (max-width: 900px) { .hwx-branch-l, .hwx-branch-r { width: 220px; } .hwx-tree-l, .hwx-tree-r, .hwx-peek { display: none; } }
@media (prefers-reduced-motion: reduce) { .hwx-gh, .hwx-peek { animation: none; } }

/* Забор встаёт на верхний край подвала и поднимается над ним на свою высоту. Если прямо
   над подвалом стоит контент (плашка сообщества на главной), забор ложился поверх него —
   поэтому, пока забор есть, подвал отодвигаем вниз ровно на высоту забора.
   Убрали Хэллоуин — исчез забор — исчез и отступ. */
.ft:has(> .hwx-fence) { margin-top: 150px; }
@media (max-width: 700px) { .ft:has(> .hwx-fence) { margin-top: 96px; } }
/* паутинка в углу плашки сообщества — за кнопками, а не поверх них */
.hm-cta-box > :not(.hwx-web) { position: relative; z-index: 4; }