/* ===== FoxPVP Halloween / Herbst – rein dekorativ, keine Texte ===== */
:root{
  --orange:#f08a24;
  --orange-deep:#c2570f;
  --bg-alt:#f3d3a4;
  --red:#b9402a;
  --hw-purple:#5b2f86;
}

/* Dämmerungs-Schleier über dem Hero */
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(ellipse at 80% 12%, rgba(255,214,120,0.22), transparent 45%),
    linear-gradient(180deg, rgba(70,24,100,0.34) 0%, rgba(150,60,20,0.16) 55%, rgba(30,10,40,0.34) 100%);
}
.join::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(70,24,100,0.32), rgba(240,120,20,0.16));
}

/* Deko-Ebenen */
.hw-layer{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:3;}
.hw-layer svg{display:block;shape-rendering:crispEdges;}
footer{position:relative;}
footer .hw-layer{z-index:5;}

/* Mond */
.hw-moon{position:absolute;right:9%;top:120px;width:92px;height:92px;
  filter:drop-shadow(0 0 22px rgba(255,226,140,.75)) drop-shadow(0 0 60px rgba(255,190,80,.35));
  animation:hwMoon 7s ease-in-out infinite;}
@keyframes hwMoon{0%,100%{opacity:.92;}50%{opacity:1;}}

/* Kürbisse */
.hw-pumpkin{position:absolute;filter:drop-shadow(0 0 10px rgba(255,170,40,.65)) drop-shadow(0 4px 4px rgba(0,0,0,.35));
  animation:hwFlicker 3.4s steps(1) infinite;}
.hw-pumpkin.p2{animation-delay:-1.3s;}
.hw-pumpkin.p3{animation-delay:-2.1s;}
@keyframes hwFlicker{
  0%{filter:drop-shadow(0 0 10px rgba(255,170,40,.65)) drop-shadow(0 4px 4px rgba(0,0,0,.35));}
  18%{filter:drop-shadow(0 0 16px rgba(255,190,60,.95)) drop-shadow(0 4px 4px rgba(0,0,0,.35));}
  31%{filter:drop-shadow(0 0 8px rgba(255,150,30,.5)) drop-shadow(0 4px 4px rgba(0,0,0,.35));}
  57%{filter:drop-shadow(0 0 14px rgba(255,185,55,.85)) drop-shadow(0 4px 4px rgba(0,0,0,.35));}
  80%{filter:drop-shadow(0 0 9px rgba(255,160,35,.6)) drop-shadow(0 4px 4px rgba(0,0,0,.35));}
}
.hero .hw-pumpkin{bottom:26px;}
footer .hw-pumpkin{bottom:calc(100% - 2px);}

/* Geist */
.hw-ghost{position:absolute;left:7%;top:42%;width:64px;opacity:.82;
  filter:drop-shadow(0 0 12px rgba(220,200,255,.7));
  animation:hwGhost 6.5s ease-in-out infinite;}
@keyframes hwGhost{
  0%,100%{transform:translate(0,0);opacity:.82;}
  25%{transform:translate(14px,-16px);opacity:.5;}
  50%{transform:translate(0,-26px);opacity:.82;}
  75%{transform:translate(-14px,-12px);opacity:.55;}
}

/* Spinnennetze + Spinne */
.hw-web{position:absolute;top:0;width:150px;height:150px;opacity:.7;
  filter:drop-shadow(0 0 1px rgba(0,0,0,.7));}
.hw-web.l{left:0;}
.hw-web.r{right:0;transform:scaleX(-1);}
footer .hw-web{top:0;opacity:.55;}
.hw-spider-wrap{position:absolute;top:0;left:15%;display:flex;flex-direction:column;align-items:center;
  animation:hwDangle 5s ease-in-out infinite;transform-origin:top center;}
.hw-spider-wrap i{display:block;width:1px;height:70px;background:rgba(255,255,255,.7);}
@keyframes hwDangle{0%,100%{transform:translateY(-6px);}50%{transform:translateY(34px);}}

/* Fledermäuse (fliegen im Blätter-Container, hängen also an der Blätter-Einstellung) */
.hw-bat{position:absolute;left:0;display:block;line-height:0;will-change:transform;
  animation:hwBatFly linear forwards;filter:drop-shadow(0 0 4px rgba(255,150,40,.55));}
.hw-bat.rev{animation-name:hwBatFlyRev;}
.hw-bat span{display:block;animation:hwBatBob 1.1s ease-in-out infinite;}
.hw-bat svg{display:block;transform-origin:center;animation:hwFlap .32s steps(2) infinite;shape-rendering:crispEdges;}
@keyframes hwBatFly{from{transform:translateX(-90px);}to{transform:translateX(calc(100vw + 90px));}}
@keyframes hwBatFlyRev{from{transform:translateX(calc(100vw + 90px)) scaleX(-1);}to{transform:translateX(-90px) scaleX(-1);}}
@keyframes hwBatBob{0%,100%{transform:translateY(0);}50%{transform:translateY(-16px);}}
@keyframes hwFlap{0%{transform:scaleY(1);}100%{transform:scaleY(.55);}}

/* Bodennebel */
.hw-fog{position:fixed;left:-10%;right:-10%;bottom:0;height:22vh;pointer-events:none;z-index:39;
  background:
    radial-gradient(ellipse 40% 60% at 20% 100%, rgba(200,170,230,.22), transparent 70%),
    radial-gradient(ellipse 45% 55% at 65% 100%, rgba(255,190,120,.18), transparent 70%);
  animation:hwFog 18s ease-in-out infinite alternate;}
@keyframes hwFog{from{transform:translateX(-4%);}to{transform:translateX(4%);}}

@media(max-width:900px){
  .hw-moon{width:60px;height:60px;top:90px;right:6%;}
  .hw-ghost{width:44px;}
  .hw-web{width:90px;height:90px;}
  .hw-spider-wrap{left:22%;}
}
@media(max-width:600px){ .hero .hw-pumpkin.p2{display:none;} .hw-ghost{display:none;} }

body.reduce-motion .hw-bat,
body.reduce-motion .hw-fog,
body.reduce-motion .hw-ghost,
body.reduce-motion .hw-spider-wrap{display:none !important;}