/* W&J Halloween theme — loaded after style.css only when build.py SEASON == 'halloween' */
:root{--navy:#24103a; --blue:#4a1a78; --red:#ff7518; --red-dark:#e05d00; --hw-black:#0d0612; --hw-purple:#3b1660; --hw-orange:#ff7518; --hw-glow:#ffb21a}
::selection{background:var(--hw-orange);color:var(--hw-black)}

/* header: candy-corn-meets-caution-tape stripe + glowing nav */
.site-header{background:radial-gradient(ellipse at 50% 120%,#3d1a5e 0,var(--navy) 70%)}
.site-header::before{height:8px;background:repeating-linear-gradient(-45deg,var(--hw-orange) 0 12px,var(--hw-black) 12px 24px,#8a4fd0 24px 36px,var(--hw-black) 36px 48px)}
.site-header::after{border-bottom:0;height:4px;background:var(--hw-orange);box-shadow:0 2px 10px rgba(255,117,24,.55)}
.site-nav__link{transition:color .2s,text-shadow .2s}
.site-nav__link:hover,.site-nav__link:focus{color:var(--hw-glow);text-shadow:0 0 8px rgba(255,140,26,.8)}
.site-nav__link:hover .site-nav__label,.site-nav__link:focus .site-nav__label{border-bottom-color:var(--hw-orange)}
.site-nav__dropdown a:hover{color:var(--hw-orange)}
.mobile-nav a:hover,.mobile-nav summary:hover{color:#e05d00}

/* witch hat perched on the logo */
.site-header__logo a{position:relative}
.site-header__logo a::before{content:"";position:absolute;left:-28px;top:-15px;width:96px;height:75px;background:url(../images/seasonal/witch-hat.svg) center/contain no-repeat;transform:rotate(-18deg);pointer-events:none;filter:drop-shadow(0 0 1.5px rgba(214,180,255,.9)) drop-shadow(0 2px 2px rgba(0,0,0,.4))}

/* floating decorations (bats, web, spider) */
.season-deco{position:absolute;top:0;left:0;right:0;height:0;z-index:55;pointer-events:none}
.season-deco>span{position:absolute;display:block}
.season-bat{width:46px;height:20px;background:url(../images/seasonal/bat.svg) center/contain no-repeat;animation:wj-bob 3.2s ease-in-out infinite alternate;filter:drop-shadow(0 0 3px rgba(190,140,255,.6))}
.season-bat--1{top:18px;left:calc(50% - 175px)}
.season-bat--2{top:28px;left:calc(50% + 25px);width:34px;height:15px;animation-duration:2.6s;animation-delay:-1.2s}
.season-web{top:8px;right:0;width:96px;height:96px;background:url(../images/seasonal/web.svg) center/contain no-repeat}
.season-spider{top:8px;right:28px;width:24px;height:78px;filter:drop-shadow(0 0 3px rgba(255,178,26,.55));transform-origin:50% 0;animation:wj-swing 4s ease-in-out infinite alternate;
  background:url(../images/seasonal/spider.svg) center bottom/24px auto no-repeat,linear-gradient(rgba(233,221,255,.75),rgba(233,221,255,.75)) center top/1px calc(100% - 14px) no-repeat}
@keyframes wj-bob{from{transform:translateY(-5px) rotate(-6deg)}to{transform:translateY(6px) rotate(5deg)}}
@keyframes wj-swing{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}

/* the banner */
.season-banner{position:relative;background:var(--hw-orange);color:var(--hw-black);text-align:center;padding:9px 70px;border-bottom:3px solid var(--hw-black);
  background-image:radial-gradient(circle at 12px 12px,rgba(13,6,18,.08) 3px,transparent 4px);background-size:24px 24px}
.season-banner__text{margin:0;font-family:var(--cond,var(--head));font-weight:600;font-size:17px;line-height:26px;letter-spacing:.06em;text-transform:uppercase;text-shadow:1px 1px 0 rgba(255,210,120,.7)}
.season-banner::before,.season-banner::after{content:"";position:absolute;top:50%;margin-top:-11px;width:50px;height:22px;background:url(../images/seasonal/bat.svg) center/contain no-repeat;animation:wj-bob 2.8s ease-in-out infinite alternate}
.season-banner::before{left:6%}
.season-banner::after{right:6%;transform:scaleX(-1);animation-delay:-1.4s;animation-name:wj-bob-r}
@keyframes wj-bob-r{from{transform:scaleX(-1) translateY(-4px) rotate(6deg)}to{transform:scaleX(-1) translateY(4px) rotate(-5deg)}}

/* spooky fog drifting along the bottom of the hero */
.slideshow::after{content:"";position:absolute;left:-10%;right:-10%;bottom:0;height:170px;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse 30% 55% at 20% 100%,rgba(196,170,235,.38),transparent 70%),radial-gradient(ellipse 35% 50% at 65% 100%,rgba(196,170,235,.32),transparent 70%),radial-gradient(ellipse 25% 45% at 95% 100%,rgba(196,170,235,.3),transparent 70%),linear-gradient(transparent,rgba(36,16,58,.45));
  animation:wj-fog 14s ease-in-out infinite alternate}
@keyframes wj-fog{from{transform:translateX(-4%)}to{transform:translateX(4%)}}
.slideshow__dots button[aria-current="true"]{color:var(--hw-orange)}

/* buttons: pumpkin orange, purple when you hover */
.btn{background:var(--hw-orange);color:var(--hw-black);font-weight:700;box-shadow:inset 0 -3px 0 rgba(0,0,0,.2),0 0 0 rgba(255,117,24,0);transition:background-color .2s,color .2s,box-shadow .2s}
.btn:hover,.btn:focus{background:#6b2fa0;color:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 14px rgba(255,140,26,.75)}

/* headings + links */
.intro h2::after,.page h1::after{content:"\1F383\00a0\1F987\00a0\1F383";background:none;width:auto;height:auto;letter-spacing:.3em;font-size:18px}
a:not(.btn):hover{color:#e05d00}
.site-footer a:hover{color:var(--hw-glow)}

/* shop circles: dripping purple band, wiggle on hover */
.home-cats::before{background:var(--hw-purple)}
.home-cats::after{content:"";position:absolute;left:0;right:0;top:40%;height:40px;background:url(../images/seasonal/drip.svg) left top/120px 44px repeat-x;z-index:-1;margin-top:-1px}
.homecats a:hover img{animation:wj-wiggle .5s ease-in-out}
@keyframes wj-wiggle{0%,100%{transform:scale(.96) rotate(0)}25%{transform:scale(.96) rotate(-4deg)}75%{transform:scale(.96) rotate(4deg)}}

/* footer: haunted-house purple over the usual photo */
.site-footer{background:linear-gradient(rgba(24,8,38,.9),rgba(24,8,38,.9)),#1a0828 url(../images/footer-bg.jpg) center top/cover no-repeat;border-top:6px solid var(--hw-orange);box-shadow:inset 0 6px 0 var(--hw-black),inset 0 12px 0 #6b2fa0}
.site-footer h4,
.site-footer h2.h4{color:var(--hw-orange)}

@media (max-width:999px){.season-deco>.season-bat{display:none}}
@media (max-width:1150px){.season-web{width:64px;height:64px}.season-spider{right:22px;height:56px}}
@media (max-width:749px){
  .season-deco>.season-bat,.season-deco>.season-spider{display:none}
  .season-web{width:40px;height:40px}
  .site-header__logo a::before{left:-14px;top:-17px;width:54px;height:42px}
  .season-banner{padding:8px 14px}
  .season-banner__text{font-size:14px;line-height:21px;letter-spacing:.04em}
  .season-banner::before,.season-banner::after{display:none}
  .slideshow::after{height:110px}
  .home-cats::after{display:none}
  .header-listen{color:var(--hw-black);box-shadow:inset 0 -2px 0 rgba(0,0,0,.25),0 0 10px rgba(255,117,24,.55)}
  .header-listen::before{background:var(--hw-black)}
  .header-listen:hover,.header-listen:focus{background:#6b2fa0;color:#fff}
}
@media (prefers-reduced-motion:reduce){
  .season-bat,.season-spider,.season-banner::before,.season-banner::after,.slideshow::after,.homecats a:hover img{animation:none}
}