/* ==========================================================
   ANIMATION HALLOWEEN GLOBALE — BAS DE TOUTES LES PAGES
   Injectée depuis footer.tpl ; aucun élément n'est cliquable.
   ========================================================== */
.gh-hw-bottom-scene {
  position: relative;
  height: 155px;
  overflow: hidden;
  isolation: isolate;
  pointer-events: none;
  user-select: none;
  background:
    radial-gradient(ellipse at 50% 105%, rgba(111,45,189,.18), transparent 55%),
    linear-gradient(180deg, rgba(6,4,9,0) 0%, rgba(8,5,13,.65) 42%, #050307 100%);
  border-top: 1px solid rgba(255,122,0,.08);
}

.gh-hw-ground {
  position: absolute;
  z-index: 5;
  left: -3%;
  right: -3%;
  bottom: -28px;
  height: 74px;
  border-radius: 50% 50% 0 0 / 38% 38% 0 0;
  background: linear-gradient(180deg, #100b16 0%, #050307 70%);
  box-shadow: 0 -8px 30px rgba(154,77,255,.10);
}

.gh-hw-graveyard {
  position: absolute;
  z-index: 4;
  inset: 0;
}

.gh-hw-tomb {
  position: absolute;
  bottom: 27px;
  width: 34px;
  height: 53px;
  border: 1px solid rgba(211,196,224,.22);
  border-radius: 17px 17px 4px 4px;
  background: linear-gradient(145deg, #292131, #151019 70%);
  box-shadow: inset -5px -5px 10px rgba(0,0,0,.35), 0 0 18px rgba(154,77,255,.08);
  transform-origin: bottom center;
  animation: ghHwTombSway 5.5s ease-in-out infinite;
}
.gh-hw-tomb::before {
  content: "RIP";
  position: absolute;
  top: 16px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 9px;
  letter-spacing: 1px;
  font-weight: 800;
  color: rgba(239,228,245,.42);
}
.gh-hw-tomb i {
  position: absolute;
  width: 16px;
  height: 4px;
  left: 8px;
  bottom: -4px;
  border-radius: 50%;
  background: rgba(0,0,0,.52);
}
.gh-hw-tomb-1 { left: 7%; transform: rotate(-6deg); animation-delay: -.9s; }
.gh-hw-tomb-2 { left: 26%; width: 39px; height: 62px; transform: rotate(4deg); animation-delay: -2.1s; }
.gh-hw-tomb-3 { left: 48%; width: 30px; height: 47px; transform: rotate(-3deg); animation-delay: -3.4s; }
.gh-hw-tomb-4 { right: 25%; width: 42px; height: 66px; transform: rotate(5deg); animation-delay: -1.6s; }
.gh-hw-tomb-5 { right: 7%; width: 33px; height: 51px; transform: rotate(-5deg); animation-delay: -4.2s; }

.gh-hw-pumpkin,
.gh-hw-ghost {
  position: absolute;
  z-index: 8;
  display: block;
  line-height: 1;
  filter: drop-shadow(0 0 10px rgba(255,122,0,.35));
}
.gh-hw-pumpkin { bottom: 24px; font-size: 29px; animation: ghHwPumpkinGlow 2.8s ease-in-out infinite; }
.gh-hw-pumpkin-1 { left: 16%; animation-delay: -.8s; }
.gh-hw-pumpkin-2 { right: 15%; font-size: 25px; animation-delay: -1.9s; }

.gh-hw-ghost {
  font-size: 27px;
  opacity: .72;
  filter: grayscale(.25) drop-shadow(0 0 12px rgba(205,170,255,.35));
}
.gh-hw-ghost-1 { left: 36%; bottom: 52px; animation: ghHwGhostFloat1 6.5s ease-in-out infinite; }
.gh-hw-ghost-2 { right: 34%; bottom: 62px; font-size: 22px; animation: ghHwGhostFloat2 7.4s ease-in-out infinite -2.8s; }

.gh-hw-scene-fog {
  position: absolute;
  z-index: 7;
  left: -20%;
  width: 140%;
  height: 42px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(198,174,215,.14) 0%, rgba(120,82,146,.08) 45%, transparent 72%);
  filter: blur(8px);
}
.gh-hw-scene-fog-1 { bottom: 20px; animation: ghHwBottomFog 9s ease-in-out infinite alternate; }
.gh-hw-scene-fog-2 { bottom: 48px; opacity: .55; animation: ghHwBottomFog2 12s ease-in-out infinite alternate-reverse; }

.gh-hw-fence {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 23px;
  height: 44px;
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
  opacity: .28;
}
.gh-hw-fence::before,
.gh-hw-fence::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  background: #4c3b55;
  box-shadow: 0 0 6px rgba(154,77,255,.12);
}
.gh-hw-fence::before { bottom: 11px; }
.gh-hw-fence::after { bottom: 27px; }
.gh-hw-fence span {
  position: relative;
  width: 3px;
  height: 42px;
  background: #5b4865;
}
.gh-hw-fence span::before {
  content: "";
  position: absolute;
  top: -6px;
  left: -3px;
  width: 9px;
  height: 9px;
  background: #5b4865;
  transform: rotate(45deg);
}

@keyframes ghHwGhostFloat1 {
  0%,100% { transform: translate(0, 8px) rotate(-5deg); opacity: .38; }
  35% { transform: translate(24px, -18px) rotate(4deg); opacity: .82; }
  70% { transform: translate(48px, 2px) rotate(-2deg); opacity: .52; }
}
@keyframes ghHwGhostFloat2 {
  0%,100% { transform: translate(0, 5px) scale(.92); opacity: .3; }
  45% { transform: translate(-34px, -22px) scale(1.08); opacity: .7; }
  75% { transform: translate(-58px, -4px) scale(.98); opacity: .46; }
}
@keyframes ghHwPumpkinGlow {
  0%,100% { transform: translateY(0) rotate(-2deg); filter: drop-shadow(0 0 7px rgba(255,122,0,.22)); }
  50% { transform: translateY(-4px) rotate(2deg); filter: drop-shadow(0 0 16px rgba(255,122,0,.62)); }
}
@keyframes ghHwBottomFog {
  from { transform: translateX(-7%) scaleX(.94); opacity: .45; }
  to { transform: translateX(9%) scaleX(1.08); opacity: .8; }
}
@keyframes ghHwBottomFog2 {
  from { transform: translateX(5%) scaleX(1.04); opacity: .28; }
  to { transform: translateX(-10%) scaleX(.92); opacity: .62; }
}
@keyframes ghHwTombSway {
  0%,100% { margin-bottom: 0; }
  50% { margin-bottom: 2px; }
}

@media (max-width: 767.98px) {
  .gh-hw-bottom-scene { height: 120px; }
  .gh-hw-tomb-2,
  .gh-hw-tomb-4,
  .gh-hw-ghost-2 { display: none; }
  .gh-hw-tomb { transform: scale(.82); transform-origin: bottom center; }
  .gh-hw-ghost-1 { left: 52%; bottom: 43px; font-size: 23px; }
  .gh-hw-pumpkin { font-size: 23px; }
  .gh-hw-fence { opacity: .20; }
}

@media (prefers-reduced-motion: reduce) {
  .gh-hw-bottom-scene *,
  .gh-hw-bottom-scene *::before,
  .gh-hw-bottom-scene *::after {
    animation: none !important;
  }
}
