/* Spooky season decorations for the zomgthehandyman.com HOMEPAGE only.
   Injected by patch-index-spooky.py; everything is decorative:
   pointer-events none, aria-hidden, never covers the hero text or buttons.
   Motion is transform/opacity only and stops for prefers-reduced-motion. */

.spk-layer{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.spk-layer *{pointer-events:none}
.spk-layer svg{display:block}

/* Cobwebs in the hero's top corners */
.spk-web{position:absolute;top:0;width:190px;height:190px;opacity:.55}
.spk-web--l{left:0}
.spk-web--r{right:0;transform:scaleX(-1)}

/* Spider on a thread, bobbing */
.spk-spider{position:absolute;top:0;right:132px;width:34px;display:flex;flex-direction:column;align-items:center;
  animation:spk-bob 4.6s ease-in-out infinite;transform-origin:top center}
.spk-spider i{display:block;width:1px;height:120px;background:rgba(255,255,255,.55)}
@keyframes spk-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(26px)}}

/* Garland of little ornaments hanging under the menu */
.spk-garland{position:absolute;top:-6px;left:0;right:0;height:92px;display:flex;justify-content:space-around;padding:0 6%}
.spk-garland::before{content:"";position:absolute;top:0;left:-2%;right:-2%;height:46px;border-bottom:2px solid rgba(251,188,4,.55);
  border-radius:0 0 50% 50%/0 0 100% 100%}
.spk-orn{position:relative;display:flex;flex-direction:column;align-items:center;transform-origin:top center;animation:spk-sway 3.8s ease-in-out infinite}
.spk-orn i{display:block;width:1px;background:rgba(251,188,4,.7)}
.spk-orn:nth-child(2n){animation-duration:4.4s;animation-delay:-1.2s}
.spk-orn:nth-child(3n){animation-duration:5s;animation-delay:-2.1s}
@keyframes spk-sway{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}

/* Jack-o'-lanterns in the bottom corners, glowing */
.spk-pumpkins{position:absolute;bottom:0;display:flex;align-items:flex-end;gap:4px}
.spk-pumpkins--l{left:10px}
.spk-pumpkins--r{right:10px}
.spk-pumpkin{filter:drop-shadow(0 0 10px rgba(255,140,0,.55));animation:spk-glow 2.8s ease-in-out infinite}
.spk-pumpkin:nth-child(2){animation-delay:-.9s}
.spk-pumpkin:nth-child(3){animation-delay:-1.7s}
@keyframes spk-glow{0%,100%{filter:drop-shadow(0 0 8px rgba(255,140,0,.45))}50%{filter:drop-shadow(0 0 18px rgba(255,160,20,.85))}}

/* Skeleton peeking in from the right edge, waving */
.spk-skel{position:absolute;right:-14px;bottom:70px;width:120px;animation:spk-peek 9s ease-in-out infinite}
.spk-skel .spk-arm{transform-origin:78px 64px;animation:spk-wave 1.1s ease-in-out infinite alternate}
@keyframes spk-peek{0%,100%{transform:translateX(70px)}18%,70%{transform:translateX(0)}}
@keyframes spk-wave{from{transform:rotate(-18deg)}to{transform:rotate(22deg)}}

/* Bats crossing the hero now and then */
.spk-bat{position:absolute;left:-60px;width:46px;opacity:0;animation:spk-fly 14s linear infinite}
.spk-bat .spk-wings{transform-origin:23px 12px;animation:spk-flap .28s ease-in-out infinite alternate}
.spk-bat--1{top:22%}
.spk-bat--2{top:34%;width:32px;animation-delay:-5s;animation-duration:17s}
.spk-bat--3{top:14%;width:38px;animation-delay:-10s;animation-duration:20s}
@keyframes spk-fly{0%{opacity:0;transform:translate(0,0)}6%{opacity:.9}50%{transform:translate(55vw,-30px)}94%{opacity:.9}100%{opacity:0;transform:translate(112vw,10px)}}
@keyframes spk-flap{from{transform:scaleY(1)}to{transform:scaleY(.45)}}

/* Small "spooky season" ribbon under the hero heading area */
.spk-ribbon{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;
  background:rgba(20,10,30,.72);border:1px solid rgba(255,140,0,.55);color:#ffb347;border-radius:999px;padding:6px 14px;
  font:800 .74rem/1 'Montserrat',system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}

/* Phones: keep it light so nothing crowds the hero text or the Book button */
@media (max-width:768px){
  .spk-web{width:110px;height:110px}
  .spk-spider{right:70px}
  .spk-spider i{height:70px}
  .spk-garland{height:64px}
  .spk-garland .spk-orn:nth-child(n+6){display:none}
  .spk-pumpkin{width:44px !important}
  .spk-pumpkins .spk-pumpkin:nth-child(3){display:none}
  .spk-skel,.spk-bat--3,.spk-ribbon{display:none}
}

@media (prefers-reduced-motion:reduce){
  .spk-layer *{animation:none !important}
  .spk-bat{display:none}
  .spk-skel{transform:none}
}