/* ==========================================================
   VeSix Halloween theme — seasonal overlay.
   Everything is scoped under html.halloween, which halloween.js
   adds only during the season. Delete the two include lines
   (this file + halloween.js) from each page to remove it fully.
   ========================================================== */

html.halloween{
  --accent:#FF8A1F;
  --accent-dim:#FFA54D;
  --accent-tint:rgba(255,138,31,0.12);
  --accent-grad-1:#FFB347;
  --accent-grad-2:#FF6A00;
  --line:#2E2A31;
  --num-stroke:#5A4636;
  --creator-gradient-end:#1A1620;
  --hw-purple:#9B6BFF;
  --hw-orange:#FF8A1F;
}

/* Fixed glow layer instead of background-attachment:fixed, which repaints the page on every scroll */
html.halloween body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(155,107,255,0.10), transparent 60%),
    radial-gradient(900px 500px at -10% 30%, rgba(255,138,31,0.07), transparent 60%);
}

html.halloween ::selection{background:var(--hw-orange);color:#0A0A0B;}

/* Hero silk ribbons → pumpkin + witch purple */
html.halloween #silkA stop:nth-child(2){stop-color:#FF7A1A;}
html.halloween #silkA stop:nth-child(1),
html.halloween #silkA stop:nth-child(3){stop-color:#7A3A00;}
html.halloween #silkB stop:nth-child(2){stop-color:#8B5CF6;}
html.halloween #silkB stop:nth-child(1),
html.halloween #silkB stop:nth-child(3){stop-color:#3B2470;}

/* Hero dots become glowing embers */
html.halloween .hero-dot{
  background:var(--hw-orange);
  box-shadow:0 0 8px 2px rgba(255,138,31,0.55);
}

/* Inline grey colors on stats/process icons → seasonal palette */
html.halloween .stat-card:nth-child(odd) .stat-number,
html.halloween .timeline-item:nth-child(odd) .timeline-node{color:#FF9A3C !important;}
html.halloween .stat-card:nth-child(even) .stat-number,
html.halloween .timeline-item:nth-child(even) .timeline-node{color:#B48CFF !important;}

html.halloween .floating-cta::after{box-shadow:0 0 0 8px rgba(255,138,31,0.45);}

/* ---------- Spider webs (corners of first section) ---------- */
html.halloween header ~ section:first-of-type{position:relative;}
.hw-web{
  position:absolute;
  top:0;
  width:220px;
  height:220px;
  pointer-events:none;
  z-index:1;
  opacity:0.28;
  color:#E9E2D6;
}
.hw-web-left{left:0;}
.hw-web-right{right:0;transform:scaleX(-1);}
@media (max-width:640px){
  .hw-web{width:130px;height:130px;}
}

/* ---------- Hanging spider ---------- */
.hw-spider{
  position:absolute;
  top:0;
  right:14%;
  z-index:2;
  pointer-events:none;
  transform-origin:top center;
  animation:hwSpiderDrop 7s ease-in-out infinite;
}
.hw-spider-thread{
  display:block;
  width:1px;
  height:110px;
  margin:0 auto;
  background:linear-gradient(#E9E2D600, #E9E2D6AA);
}
.hw-spider svg{display:block;margin-top:-2px;}
@keyframes hwSpiderDrop{
  0%,100%{transform:translateY(-40px) rotate(0deg);}
  45%{transform:translateY(10px) rotate(3deg);}
  60%{transform:translateY(4px) rotate(-2deg);}
}
@media (max-width:640px){
  .hw-spider{right:8%;}
  .hw-spider-thread{height:70px;}
}

/* ---------- Bats ---------- */
.hw-bats{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:55;
  overflow:hidden;
}
.hw-bat{
  position:absolute;
  left:-80px;
  color:#2A1F2E;
  will-change:transform;
  animation:hwBatFly linear forwards;
}
.hw-bat svg{display:block;animation:hwFlap .22s ease-in-out infinite alternate;transform-origin:center;will-change:transform;}
@keyframes hwFlap{
  from{transform:scaleY(1);}
  to{transform:scaleY(0.35);}
}
@keyframes hwBatFly{
  0%  {transform:translate(0,0);}
  25% {transform:translate(30vw,-6vh);}
  50% {transform:translate(60vw,4vh);}
  75% {transform:translate(90vw,-8vh);}
  100%{transform:translate(calc(100vw + 160px),-2vh);}
}

/* ---------- Footer pumpkins ---------- */
.hw-pumpkins{
  display:flex;
  justify-content:center;
  gap:18px;
  margin:0 auto 28px;
  opacity:0.9;
}
/* Static glow + opacity flicker (animating filter repainted every frame) */
.hw-pumpkins svg{filter:drop-shadow(0 0 6px rgba(255,138,31,0.55));animation:hwGlow 3.2s ease-in-out infinite;}
.hw-pumpkins svg:nth-child(2){animation-delay:.8s;}
.hw-pumpkins svg:nth-child(3){animation-delay:1.6s;}
@keyframes hwGlow{
  0%,100%{opacity:0.75;}
  50%{opacity:1;}
}

@media (prefers-reduced-motion: reduce){
  .hw-spider,.hw-pumpkins svg,.hw-bat svg{animation:none !important;}
  .hw-bats{display:none;}
}