/* Fone4U seasonal theme: Halloween. Loaded only while the theme is on (app/season.php). */
@font-face{font-family:"Grenze Gotisch";font-weight:700;font-display:swap;src:url(grenze-700.woff2) format("woff2")}
body.hw{--hw-plum:#211230;--hw-plum2:#2e1942;--hw-night:#120a1b;--hw-bone:#f1e7d6;--hw-pumpkin:#f2701d;--hw-candle:#ffc46b;--hw-gothic:"Grenze Gotisch",Georgia,serif}

/* staff test bar */
.hw-testbar{position:relative;z-index:5;background:#2e1942;color:#ffc46b;text-align:center;font:600 13px/1.4 system-ui,sans-serif;padding:7px 12px}
.hw-testbar a{color:#fff;margin-left:6px}
body.navopen .hw-testbar{display:none}

/* top banner */
body.hw .topnote,body.hw.luxe .topnote{background:var(--hw-pumpkin);color:var(--hw-night);font-weight:700}

/* sale tags */
body.hw-tags .pc-save:not(.none){background:var(--hw-plum)!important;color:var(--hw-candle)!important}
body.hw-tags .pc-save:not(.none)::before{content:"🎃 "}

/* speaker button in the header */
.hw-snd{border:0;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;cursor:pointer;background:var(--hw-plum2);color:var(--hw-bone);margin-left:6px}
.hw-snd svg{width:20px;height:20px}
.hbar .hw-snd{order:2}

/* ---------- lights-out homepage top ---------- */
.hw-hero{position:relative;overflow:hidden;color:var(--hw-bone);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:24px;
  min-height:min(620px,88vh);padding:56px max(16px,6vw) 76px;margin:0 0 8px;
  background:radial-gradient(60% 80% at 78% 30%,#4a2a5e 0%,transparent 60%),linear-gradient(180deg,var(--hw-plum) 0%,var(--hw-night) 100%)}
.hw-moon{position:absolute;right:9%;top:46px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle at 38% 38%,#fff4d8,#f3d9a0 60%,#d9b46f);box-shadow:0 0 90px 30px rgba(255,214,140,.25)}
.hw-moon::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 60%,rgba(170,130,70,.35) 0 9%,transparent 10%),radial-gradient(circle at 62% 30%,rgba(170,130,70,.25) 0 7%,transparent 8%),radial-gradient(circle at 65% 70%,rgba(170,130,70,.2) 0 5%,transparent 6%)}
.hw-web{position:absolute;left:0;top:0;width:260px;opacity:.35;pointer-events:none}
.hw-copy{position:relative;z-index:2;max-width:620px}
.hw-h1{font-family:var(--hw-gothic);font-weight:700;font-size:clamp(54px,8.4vw,112px);line-height:.9;margin:0 0 22px;color:var(--hw-bone);text-shadow:0 4px 30px rgba(242,112,29,.25)}
.hw-copy>p:not(.hw-h1){font-size:clamp(17px,1.6vw,20px);line-height:1.55;max-width:34ch;margin:0 0 30px;color:#d9cce4}
.hw-btns{display:flex;flex-wrap:wrap;gap:12px}
.hw-btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:14px;padding:15px 22px;font-weight:800;font-size:16px;cursor:pointer;text-decoration:none}
.hw-btn.pk{background:var(--hw-pumpkin);color:var(--hw-night);box-shadow:0 10px 30px -8px rgba(242,112,29,.7)}
.hw-btn.gh{background:transparent;color:var(--hw-bone);box-shadow:inset 0 0 0 2px rgba(241,231,214,.35)}
.hw-art{position:relative;z-index:1;display:flex;justify-content:center}
.hw-art .hw-ph{width:min(300px,62vw);height:auto;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));transform:rotate(-6deg)}
.hw-photo img{max-width:min(380px,70vw);max-height:460px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 40px 50px rgba(0,0,0,.6))}
.hw-dark{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(circle var(--r,190px) at var(--x,30%) var(--y,40%),rgba(10,5,16,0) 0%,rgba(10,5,16,.25) 45%,rgba(8,4,13,.93) 100%);transition:opacity 1.4s ease}
.hw-hero.lit .hw-dark{opacity:0}
.hw-eyes{position:absolute;z-index:4;display:flex;gap:9px;pointer-events:none;transition:opacity .8s}
.hw-eyes i{width:11px;height:7px;border-radius:50% 50% 45% 45%;background:var(--hw-candle);box-shadow:0 0 10px 2px rgba(255,196,107,.8);animation:hwblink 4.5s infinite}
.hw-hero.lit .hw-eyes{opacity:0}
@keyframes hwblink{0%,44%,50%,100%{transform:scaleY(1)}47%{transform:scaleY(.1)}}
.hw-lightbtn{position:absolute;z-index:5;left:50%;bottom:20px;transform:translateX(-50%);border:0;border-radius:99px;padding:11px 18px;background:rgba(241,231,214,.12);color:var(--hw-bone);font-weight:700;font-size:14px;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(241,231,214,.3);transition:opacity .6s;white-space:nowrap}
.hw-hero.lit .hw-lightbtn{opacity:0;pointer-events:none}
.hw-flash{position:absolute;inset:0;z-index:6;background:#e9e0ff;opacity:0;pointer-events:none}
.hw-flash.go{animation:hwflash 1s}
@keyframes hwflash{0%{opacity:0}5%{opacity:.7}12%{opacity:0}20%{opacity:.45}30%,100%{opacity:0}}
@media(max-width:820px){
  .hw-hero{grid-template-columns:1fr;padding-top:40px;min-height:auto}
  .hw-moon{width:96px;height:96px;right:6%;top:24px}
  .hw-art .hw-ph{width:150px}.hw-photo img{max-width:220px;max-height:260px}
}

/* ---------- hanging spider over the first product row ---------- */
.hw-dangle{position:absolute;top:0;right:16%;z-index:2;display:flex;flex-direction:column;align-items:center;transform-origin:top center;animation:hwswing 4s ease-in-out infinite;pointer-events:none}
.hw-dangle i{width:1.2px;height:var(--l,96px);background:linear-gradient(#bfb3c7,#857a8f)}
.hw-dangle svg{width:38px;margin-top:-3px}
@keyframes hwswing{0%,100%{transform:rotate(3deg)}50%{transform:rotate(-3deg)}}

/* ---------- Pick a pumpkin ---------- */
.hw-patch{position:relative;overflow:hidden;text-align:center;color:var(--hw-bone);padding:72px 16px 64px;margin:24px 0;
  background:radial-gradient(70% 60% at 50% 110%,rgba(242,112,29,.28),transparent 70%),linear-gradient(180deg,var(--hw-night),var(--hw-plum) 120%)}
.hw-h2{font-family:var(--hw-gothic);font-weight:700;font-size:clamp(44px,6.4vw,84px);line-height:.95;margin:0 0 14px;color:var(--hw-bone)}
.hw-sub{max-width:46ch;margin:0 auto 40px;color:#d4c6df;font-size:18px;line-height:1.5}
.hw-pumps{display:flex;justify-content:center;gap:clamp(8px,4vw,56px);align-items:flex-end}
.hw-pump{border:0;background:none;padding:0;cursor:pointer;width:clamp(96px,22vw,210px);transition:transform .35s cubic-bezier(.3,1.6,.5,1),opacity .5s,filter .5s}
.hw-pump:nth-child(2){width:clamp(110px,26vw,250px)}
.hw-pump svg{width:100%;height:auto;display:block;overflow:visible}
.hw-pump:hover{transform:translateY(-8px) rotate(-3deg)}
.hw-pump:focus-visible{outline:3px solid var(--hw-candle);outline-offset:6px;border-radius:20px}
.hw-pump .glow{animation:hwflick 2.2s infinite;filter:drop-shadow(0 0 5px #ffb347) drop-shadow(0 0 14px rgba(255,170,60,.8))}
.hw-pump:nth-child(2) .glow{animation-delay:-.7s}.hw-pump:nth-child(3) .glow{animation-delay:-1.4s}
@keyframes hwflick{0%,100%{opacity:.75}20%{opacity:.95}35%{opacity:.6}55%{opacity:1}80%{opacity:.7}}
.hw-pumps.done .hw-pump{cursor:default}
.hw-pumps.done .hw-pump:not(.pick){opacity:.25;filter:grayscale(.6);transform:scale(.9)}
.hw-pump.pick{transform:scale(1.08)}
.hw-pump.pick .glow{animation:none;opacity:1}
.hw-pump .lid{transition:transform .4s}
.hw-pump.pick .lid{transform:translate(8px,-34px) rotate(16deg);transition:transform .6s cubic-bezier(.3,1.6,.5,1)}
.hw-shadow{height:18px;margin:6px auto 0;width:70%;border-radius:50%;background:radial-gradient(rgba(0,0,0,.5),transparent 70%)}
.hw-prize{max-width:460px;margin:34px auto 0;background:var(--hw-bone);color:#1d1424;border-radius:22px;padding:24px 22px;text-align:left;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);animation:hwpop .5s cubic-bezier(.3,1.5,.5,1)}
@keyframes hwpop{from{transform:translateY(20px) scale(.96);opacity:0}}
.hw-prize .w1{font-size:14px;color:#6f6478;font-weight:700}
.hw-prize .w2{font-family:var(--hw-gothic);font-weight:700;font-size:40px;line-height:1;color:var(--hw-plum);margin:4px 0 12px}
.hw-prize .cd{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:800;font-size:26px;letter-spacing:.08em;background:#fff;border:2px dashed var(--hw-pumpkin);border-radius:14px;padding:10px 10px 10px 16px;color:var(--hw-plum)}
.hw-prize .cd button{border:0;background:#f5efe5;border-radius:10px;padding:8px 12px;font-weight:700;font-size:13px;letter-spacing:0;cursor:pointer;color:#1d1424}
.hw-prize .st{display:flex;gap:10px;align-items:flex-start;margin:14px 0 4px;font-weight:600;font-size:15px;color:#2f7d4f;line-height:1.4}
.hw-prize .st svg{flex:none;margin-top:2px}
.hw-prize .st.warn{color:#8a5a00}
.hw-prize .hw-btn{width:100%;margin-top:12px}
.hw-prize .ex{font-size:13px;color:#6f6478;margin:10px 0 0}
.hw-fine{font-size:13px;color:#b9abc6;max-width:60ch;margin:30px auto 0;line-height:1.5}
.hw-err{color:#ffb4a0;font-weight:600;margin-top:20px}

/* floating "Pick a pumpkin" button */
.hw-fab{position:fixed;left:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:8px;background:var(--hw-plum);color:var(--hw-bone);border-radius:99px;padding:8px 18px 8px 8px;font-weight:800;font-size:15px;text-decoration:none;box-shadow:0 16px 34px -10px rgba(18,10,27,.7)}
.hw-fab span{width:36px;height:36px;border-radius:50%;background:var(--hw-pumpkin);display:grid;place-items:center;font-size:20px}
@media(max-width:600px){.hw-fab{padding-right:8px}.hw-fab b{display:none}}

/* basket note */
.hwtreat{display:flex;gap:8px;align-items:flex-start;background:#fff7ee;border:1px solid #f6cfa8;border-radius:12px;padding:10px 12px;font-size:14px;margin-top:12px}

/* spiders */
.hw-spc{position:fixed;inset:0;width:100%;height:100%;z-index:58;pointer-events:none}

@media (prefers-reduced-motion:reduce){.hw-spc,.hw-dangle,.hw-eyes{display:none}.hw-pump .glow{animation:none}.hw-dark{display:none}}
@media(max-width:900px){.hw-snd{position:fixed;left:18px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:60;border-radius:50%;margin:0;box-shadow:0 10px 24px -8px rgba(18,10,27,.6)}}


/* ---------- Scarier look (Seasonal theme → Look: Scarier) ---------- */
.hw-drips,.hw-fog,.hw-ghost,.hw-bigsp,.hw-crack,.hw-vig{display:none}
body.hw-scary .topnote,body.hw-scary.luxe .topnote{background:#8e0f14;color:#fff}
body.hw-scary .hw-hero{background:radial-gradient(55% 70% at 78% 28%,#3d0a10 0%,transparent 62%),linear-gradient(180deg,#140608 0%,#050203 100%)}
body.hw-scary .hw-moon{background:radial-gradient(circle at 38% 38%,#ffb4a0,#d4402c 55%,#6e0f0f);box-shadow:0 0 120px 46px rgba(214,40,30,.33)}
body.hw-scary .hw-moon::after{opacity:.6}
body.hw-scary .hw-h1{color:#f4e8e2;text-shadow:0 0 22px rgba(225,30,30,.6),0 0 2px #fff;animation:hwneon 7s infinite}
@keyframes hwneon{0%,17%,21%,24%,58%,61%,100%{opacity:1}19%,23%,60%{opacity:.18}}
body.hw-scary .hw-copy>p:not(.hw-h1){color:#d8c4c4}
body.hw-scary .hw-btn.pk{background:#c4161c;color:#fff;box-shadow:0 10px 30px -8px rgba(196,22,28,.75)}
body.hw-scary .hw-eyes i{background:#ff2b1c;box-shadow:0 0 12px 3px rgba(255,30,20,.85)}
body.hw-scary .hw-eyes{transition:opacity .8s,translate .25s}
body.hw-scary .hw-web{opacity:.5}
body.hw-scary .hw-drips{display:block;position:absolute;left:0;top:0;width:100%;height:120px;z-index:4;pointer-events:none}
body.hw-scary .hw-drips path.d{transform-origin:top;animation:hwdrip 9s ease-in infinite}
@keyframes hwdrip{0%{transform:scaleY(.15)}70%,100%{transform:scaleY(1)}}
body.hw-scary .hw-fog{display:block;position:absolute;left:-30%;right:-30%;bottom:-50px;height:230px;z-index:2;pointer-events:none;opacity:.5;
  background:radial-gradient(40% 60% at 25% 70%,rgba(190,180,190,.35),transparent 70%),radial-gradient(35% 55% at 70% 80%,rgba(190,180,190,.3),transparent 70%);filter:blur(16px);animation:hwfog 16s ease-in-out infinite alternate}
body.hw-scary .hw-fog.b{animation-duration:23s;animation-direction:alternate-reverse;opacity:.35;bottom:-80px}
@keyframes hwfog{to{transform:translateX(14%)}}
body.hw-scary .hw-ghost{display:block;position:absolute;z-index:4;width:120px;opacity:0;pointer-events:none;transition:opacity .9s ease;filter:blur(.6px) drop-shadow(0 0 24px rgba(220,220,255,.35))}
body.hw-scary .hw-ghost.on{opacity:.55}
body.hw-scary .hw-art{position:relative}
body.hw-scary .hw-crack{display:block;position:absolute;left:50%;top:0;width:min(300px,62vw);height:auto;transform:translateX(-50%) rotate(-6deg);pointer-events:none}
body.hw-scary .hw-crack path{stroke-dasharray:3000;stroke-dashoffset:3000}
body.hw-scary .hw-crack.go path{animation:hwcrack 1.1s cubic-bezier(.2,.9,.3,1) forwards}
@keyframes hwcrack{to{stroke-dashoffset:0}}
body.hw-scary .hw-bigsp{display:flex;position:absolute;top:0;left:62%;z-index:5;flex-direction:column;align-items:center;transform:translateY(-110%);pointer-events:none}
body.hw-scary .hw-bigsp i{width:2px;height:230px;background:linear-gradient(#ccc0d0,#7d7280)}
body.hw-scary .hw-bigsp svg{width:92px;margin-top:-4px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.6))}
body.hw-scary .hw-bigsp.drop{animation:hwbigdrop 4.2s cubic-bezier(.2,.9,.25,1) forwards}
@keyframes hwbigdrop{0%{transform:translateY(-110%)}9%{transform:translateY(0)}13%{transform:translateY(-7%)}17%{transform:translateY(0)}72%{transform:translateY(0)}100%{transform:translateY(-110%)}}
body.hw-scary .hw-vig{display:block;position:fixed;inset:0;z-index:57;pointer-events:none;background:radial-gradient(ellipse at center,transparent 58%,rgba(120,0,8,.28) 100%);animation:hwbeat 1.1s infinite;opacity:0;transition:opacity 2s}
body.hw-scary .hw-vig.on{opacity:1}
@keyframes hwbeat{0%,40%,100%{filter:brightness(1)}12%{filter:brightness(1.6)}24%{filter:brightness(1.25)}}
body.hw-scary .hw-hero.cut{filter:brightness(.25)}
body.hw-scary .hw-patch{background:radial-gradient(70% 60% at 50% 110%,rgba(200,20,20,.3),transparent 70%),linear-gradient(180deg,#0a0405,#1d070a 120%)}
body.hw-scary .hw-pump .glow{filter:drop-shadow(0 0 5px #ff5a2a) drop-shadow(0 0 16px rgba(255,40,20,.85))}
body.hw-scary .hw-pumps:not(.done) .hw-pump:hover{animation:hwshake .35s linear infinite}
@keyframes hwshake{0%,100%{transform:translate(0,-6px) rotate(-3deg)}25%{transform:translate(-2px,-6px) rotate(2deg)}50%{transform:translate(2px,-7px) rotate(-2deg)}75%{transform:translate(-1px,-6px) rotate(3deg)}}
body.hw-scary.hw-tags .pc-save:not(.none){background:#2a0a0e!important;color:#ff8a70!important}
body.hw-scary .hw-fab span{background:#c4161c}
.hw-bat{position:fixed;left:0;top:0;z-index:60;width:46px;pointer-events:none;fill:#0c0507;filter:drop-shadow(0 0 3px rgba(255,70,40,.95))}
@media(max-width:820px){body.hw-scary .hw-crack{width:150px}body.hw-scary .hw-bigsp svg{width:64px}body.hw-scary .hw-bigsp i{height:170px}}
@media (prefers-reduced-motion:reduce){body.hw-scary .hw-vig,body.hw-scary .hw-ghost,body.hw-scary .hw-bigsp{display:none}body.hw-scary .hw-drips path.d,body.hw-scary .hw-h1{animation:none}}