/* Halloween — soirée du 30 octobre */
.hw-banner{position:relative;z-index:60;background:linear-gradient(90deg,#120a05,#3a1c08 50%,#120a05);color:#f6e7d3;font-family:var(--sans);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;display:flex;justify-content:center;align-items:center;gap:.9rem;padding:.55rem 2.6rem .55rem 1rem;text-align:center;border-bottom:1px solid #e07b24}
.hw-banner a{color:#ffb066;text-decoration:none;border-bottom:1px solid #ffb066;white-space:nowrap}
.hw-banner .pk{width:26px;height:23px;flex:none;animation:hw-wobble 2.4s ease-in-out infinite}
.hw-banner .pk svg,.pk svg{width:100%;height:100%;display:block;overflow:visible}
.hw-banner button{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);background:none;border:0;color:#f6e7d3;font-size:1.4rem;line-height:1;cursor:pointer;opacity:.7}
.hw-banner button:hover{opacity:1}

/* araignées suspendues */
.hw-spider{position:absolute;top:100%;width:0;z-index:3;pointer-events:none;transform-origin:50% 0;animation:hw-swing 4s ease-in-out infinite}
.hw-spider.s1{left:36%}.hw-spider.s2{left:65%;animation-delay:-1.7s}
.hw-spider i{display:block;width:1px;height:var(--len);background:rgba(255,255,255,.55);margin-left:0;transform-origin:50% 0;animation:hw-dangle 5s ease-in-out infinite}
.hw-spider.s2 i{animation-delay:-2s}
.hw-spider svg{position:absolute;left:-14px;top:calc(var(--len) - 4px);width:28px;overflow:visible;animation:hw-dangle-svg 5s ease-in-out infinite}
.hw-spider.s2 svg{animation-delay:-2s}
@keyframes hw-swing{0%,100%{rotate:-7deg}50%{rotate:7deg}}
@keyframes hw-dangle{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.45)}}
@keyframes hw-dangle-svg{0%,100%{translate:0 0}50%{translate:0 calc(var(--len) * .45)}}

/* ciel */
.hw-sky{position:fixed;inset:0;pointer-events:none;z-index:45;overflow:hidden;transition:opacity .6s}
.hw-sky.calm{opacity:0}
.hw-fly{position:absolute;left:0;will-change:transform}
.hw-fly svg{display:block;width:100%;overflow:visible}
.hw-bob{animation:hw-bob 2.4s ease-in-out infinite}
.hw-wave{animation:hw-wave 2.8s ease-in-out infinite alternate}
.hw-bat .wl,.hw-bat .wr,.sil-bat .wl,.sil-bat .wr{animation:hw-flap-l .3s ease-in-out infinite alternate}
.hw-bat .wr,.sil-bat .wr{animation-name:hw-flap-r}

.hw-witch{top:15vh;width:300px;animation:hw-fly 30s linear infinite 2s;transform:translateX(-380px)}
.hw-witch2{top:44vh;width:260px;--dress1:#1f8f86;--dress2:#0c4a49;--cape1:#0d3b3a;--cape2:#051e1e;--hat1:#2b2b44;--hat2:#101020;--skin:#a3b86a;animation:hw-fly-back 38s linear infinite 14s;transform:translateX(calc(100vw + 400px))}
.flip .hw-bob{scale:-1 1}
.flip .trail{left:auto;right:30px;transform:scaleX(-1)}
.hw-witch svg{filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}
.trail{position:absolute;left:30px;top:128px}
.sp{position:absolute;left:0;top:0;width:calc(var(--s) * .6);height:calc(var(--s) * .6);border-radius:50%;background:#ffe9a0;box-shadow:0 0 5px 1.5px #ff9a2e,0 0 10px 3px rgba(190,110,255,.4);opacity:0;animation:hw-spark 1.2s ease-out infinite;animation-delay:var(--d)}
.sp:nth-child(3n){background:#e6c8ff}
.hw-bat{width:56px;animation:hw-fly 22s linear infinite;transform:translateX(-140px)}
.hw-bat.b1{top:9vh;animation-delay:6s}
.hw-bat.b2{top:28vh;width:40px;animation-duration:26s;animation-delay:10s}
.hw-bat.b3{top:21vh;width:48px;animation-duration:24s;animation-delay:16s}
.hw-ghost{width:108px;animation:hw-fly-back 46s linear infinite;transform:translateX(110vw);opacity:.9;filter:drop-shadow(0 0 14px rgba(255,255,255,.55))}
.hw-ghost.g1{top:58vh;animation-delay:4s}
.hw-ghost.g2{top:76vh;width:84px;animation:hw-fly 52s linear infinite 24s;transform:translateX(-300px)}

@keyframes hw-fly{0%{transform:translateX(-400px)}50%,100%{transform:translateX(calc(100vw + 400px))}}
@keyframes hw-fly-back{0%{transform:translateX(calc(100vw + 400px))}55%,100%{transform:translateX(-400px)}}
@keyframes hw-bob{0%,100%{translate:0 0;rotate:-1.5deg}50%{translate:0 -14px;rotate:2deg}}
@keyframes hw-wave{from{translate:0 -26px}to{translate:0 26px}}
@keyframes hw-flap-l{from{transform:rotate(-34deg)}to{transform:rotate(26deg)}}
@keyframes hw-flap-r{from{transform:rotate(34deg)}to{transform:rotate(-26deg)}}
@keyframes hw-spark{0%{opacity:0;transform:translate(0,0) scale(1)}12%{opacity:1}100%{opacity:0;transform:translate(-120px,var(--y,26px)) scale(.2)}}
.sp:nth-child(2n){--y:-14px}.sp:nth-child(3n){--y:42px}
@keyframes hw-wobble{0%,100%{rotate:-10deg}50%{rotate:10deg}}
@keyframes hw-flicker{0%,100%{opacity:1}8%{opacity:.78}14%{opacity:1}42%{opacity:.88}47%{opacity:.7}52%{opacity:1}}

/* section soirée = scène de nuit */
.soiree{position:relative;overflow:hidden;background:linear-gradient(180deg,#0a0518 0%,#1d0b33 52%,#4a1d0a 100%);padding:clamp(5rem,9vw,8rem) 0 clamp(9rem,14vw,12rem);border-block:1px solid #e07b24}
.soiree-inner{position:relative;z-index:5}
.soiree p:not(.eyebrow),.soiree h2{text-shadow:0 2px 14px rgba(0,0,0,.65)}
.hw-scene{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hw-scene .stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;animation:twinkle var(--t) ease-in-out infinite;animation-delay:var(--w)}
@keyframes twinkle{0%,100%{opacity:.15}50%{opacity:1}}
.moon{position:absolute;right:9%;top:9%;width:min(240px,26vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 36% 34%,#fffbe0,#f7e6a6 55%,#d9c27a);box-shadow:0 0 60px 20px rgba(255,236,160,.28),0 0 160px 60px rgba(255,200,110,.14)}
.moon::after{content:"";position:absolute;left:24%;top:30%;width:18%;aspect-ratio:1;border-radius:50%;background:rgba(150,125,60,.25);box-shadow:70px 46px 0 -2px rgba(150,125,60,.2),24px 90px 0 6px rgba(150,125,60,.16)}
.sil-witch{width:230px;top:7%;animation:hw-fly 18s linear infinite 1s;transform:translateX(-340px)}
.sil-witch svg{filter:brightness(0)}
.sil-bat{width:46px;animation:hw-fly 17s linear infinite;transform:translateX(-140px)}
.sil-bat.sb1{top:30%;animation-delay:5s}
.sil-bat.sb2{top:18%;width:34px;animation-duration:21s;animation-delay:11s}
.sil-bat svg{filter:brightness(0)}
.fog{position:absolute;left:-20%;width:140%;height:34%;bottom:6%;background:radial-gradient(50% 60% at 50% 60%,rgba(190,160,230,.28),transparent 70%);filter:blur(14px);animation:fog 26s ease-in-out infinite alternate}
.fog.f2{bottom:0;height:26%;background:radial-gradient(50% 60% at 50% 60%,rgba(255,170,100,.22),transparent 70%);animation-duration:34s;animation-direction:alternate-reverse}
@keyframes fog{from{transform:translateX(-6%)}to{transform:translateX(6%)}}
.hills{position:absolute;left:0;bottom:0;width:100%;height:clamp(90px,14vw,170px)}
.hw-scene .pk{position:absolute;bottom:-4px}
.hw-scene .pk .face path{filter:drop-shadow(0 0 8px #ffb02e) drop-shadow(0 0 18px #ff7a00);animation:hw-flicker 3.6s infinite}
.hw-scene .pk::before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle,rgba(255,140,30,.35),transparent 60%);animation:hw-flicker 3.6s infinite;z-index:-1}
.pk1{left:7%;width:clamp(90px,11vw,150px)}
.pk2{left:17%;width:clamp(55px,6vw,86px)}
.pk3{right:11%;width:clamp(80px,10vw,136px)}
.pk2 .face path{animation-delay:-1.2s}.pk3 .face path{animation-delay:-2.2s}

@media(max-width:640px){
  .hw-banner{font-size:.68rem;letter-spacing:.06em;flex-wrap:wrap;gap:.2rem .6rem}
  .hw-witch{width:170px;top:21vh}
  .sil-witch{width:150px}
  .hw-spider.s1{left:10%}.hw-spider.s2{left:88%}
  .pk2{display:none}
}
@media(prefers-reduced-motion:reduce){.hw-sky{display:none}.hw-scene *,.hw-banner *,.hw-spider{animation:none!important}}
.hw-off .hw-sky{display:none}

/* sorcière / fantôme : parties animées */
.w-cape{transform-origin:122px 70px;animation:w-cape 1.5s ease-in-out infinite alternate}
.w-hair{transform-origin:150px 46px;animation:w-hair 1.1s ease-in-out infinite alternate}
.w-brist{transform-origin:34px 128px;animation:w-brist .9s ease-in-out infinite alternate}
.w-legs{transform-origin:130px 112px;animation:w-legs 1.8s ease-in-out infinite alternate}
.w-tip{transform-origin:150px 40px;animation:w-tip 2s ease-in-out infinite alternate}
.w-item{transform-origin:194px 76px;animation:w-item 2.2s ease-in-out infinite alternate}
.steam{opacity:0;animation:steam 2.6s ease-out infinite}
.steam.st2{animation-delay:.8s}.steam.st3{animation-delay:1.6s}
.bub circle{animation:bub 1s ease-in-out infinite alternate}
.bub circle:nth-child(2){animation-delay:.3s}.bub circle:nth-child(3){animation-delay:.6s}
.g-tray{transform-origin:62px 58px;animation:w-item 1.8s ease-in-out infinite alternate}
.g-body{transform-origin:38px 90px;animation:g-sway 2.6s ease-in-out infinite alternate}
@keyframes w-cape{from{transform:rotate(-5deg) skewX(2deg)}to{transform:rotate(7deg) skewX(-5deg)}}
@keyframes w-hair{from{transform:rotate(-6deg)}to{transform:rotate(7deg)}}
@keyframes w-brist{from{transform:skewY(-4deg) scaleX(1)}to{transform:skewY(5deg) scaleX(1.07)}}
@keyframes w-legs{from{transform:rotate(-4deg)}to{transform:rotate(5deg)}}
@keyframes w-tip{from{transform:rotate(-3deg)}to{transform:rotate(5deg)}}
@keyframes w-item{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@keyframes steam{0%{opacity:0;transform:translateY(8px) scaleY(.7)}25%{opacity:.8}100%{opacity:0;transform:translateY(-22px) scaleY(1.2)}}
@keyframes bub{from{transform:translateY(0) scale(1)}to{transform:translateY(-3px) scale(1.25)}}
@keyframes g-sway{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
.sil-witch.sw2{top:26%;width:210px;animation:hw-fly-back 24s linear infinite 9s;transform:translateX(calc(100vw + 400px))}
.sil-witch{width:260px}
.sil-witch svg .steam{display:none}
@media(max-width:640px){.hw-witch{width:200px}.hw-witch2{width:180px}.sil-witch{width:170px}.sil-witch.sw2{width:150px}.hw-ghost{width:80px}}
