/* HALLOWEEN THEME (temporary) - remove the two <!-- HALLOWEEN --> lines in each page's <head> to disable */
::selection { background: #ff7a1a; color: #1b0f26; }

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 850;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0) 55%, rgba(70,20,90,.22) 100%);
}

.site-header { border-bottom: 3px solid #ff7a1a !important; box-shadow: 0 4px 18px rgba(255,122,26,.35); }
.hero h1, .hero .hero-title { text-shadow: 0 0 18px rgba(255,122,26,.55), 0 2px 0 rgba(40,10,60,.6); }
.btn-primary:hover { box-shadow: 0 0 16px rgba(255,122,26,.75) !important; }
.info-card:hover, .city-card:hover { box-shadow: 0 0 18px rgba(255,122,26,.35); }
.site-footer { position: relative; border-top: 3px solid #ff7a1a; }

#hw-layer {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 900;
}

.hw-web { position: absolute; top: 0; width: 230px; height: 230px; opacity: .6; filter: drop-shadow(0 0 1px rgba(255,255,255,.7)); }
.hw-web-l { left: 0; }
.hw-web-r { right: 0; transform: scaleX(-1); }
.hw-web path { fill: none; stroke: #2e2438; stroke-width: 1.1; }

.hw-spider {
  position: absolute;
  top: 0;
  width: 44px;
  transform-origin: 50% 0;
  animation: hw-swing 4.5s ease-in-out infinite alternate;
}
.hw-spider .hw-thread { display: block; width: 1px; margin: 0 auto -12px; background: #2e2438; }
.hw-spider svg { display: block; width: 44px; height: 36px; }
@keyframes hw-swing { from { transform: rotate(-7deg); } to { transform: rotate(7deg); } }

.hw-witch {
  position: absolute;
  top: 18%;
  left: 0;
  width: 150px;
  filter: drop-shadow(0 0 8px rgba(255,122,26,.6));
  animation: hw-fly 34s linear infinite;
  animation-delay: 4s;
  transform: translateX(-200px);
}
@keyframes hw-fly {
  0%   { transform: translate(-200px, 0) rotate(-4deg); }
  12%  { transform: translate(18vw, -30px) rotate(3deg); }
  24%  { transform: translate(42vw, 20px) rotate(-3deg); }
  36%  { transform: translate(68vw, -20px) rotate(3deg); }
  48%  { transform: translate(calc(100vw + 200px), 10px) rotate(-2deg); }
  100% { transform: translate(calc(100vw + 200px), 10px); }
}

.hw-bat {
  position: absolute;
  width: 34px;
  transform: translateX(-80px);
  animation: hw-bat-fly 19s linear infinite;
}
.hw-bat svg { display: block; width: 100%; animation: hw-flap .35s ease-in-out infinite alternate; transform-origin: 50% 60%; }
@keyframes hw-flap { from { transform: scaleY(1); } to { transform: scaleY(.45); } }
@keyframes hw-bat-fly {
  0%   { transform: translate(-80px, 0); }
  25%  { transform: translate(25vw, -40px); }
  50%  { transform: translate(52vw, 30px); }
  75%  { transform: translate(78vw, -30px); }
  100% { transform: translate(calc(100vw + 80px), 20px); }
}

.hw-pumpkins {
  position: absolute;
  left: 0;
  right: 0;
  top: -34px;
  display: flex;
  justify-content: space-around;
  pointer-events: none;
}
.hw-pumpkin { width: 54px; height: 48px; animation: hw-glow 2.6s ease-in-out infinite alternate; }
.hw-pumpkin:nth-child(even) { width: 42px; height: 37px; animation-delay: -1.3s; }
@keyframes hw-glow { from { filter: drop-shadow(0 0 3px rgba(255,170,40,.5)); } to { filter: drop-shadow(0 0 12px rgba(255,170,40,.95)); } }

@media (max-width: 700px) {
  .hw-web { width: 130px; height: 130px; }
  .hw-spider.hw-extra, .hw-bat.hw-extra { display: none; }
  .hw-witch { width: 100px; }
  .hw-pumpkins .hw-pumpkin:nth-child(n+4) { display: none; }
}

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


/* Buttons: original look + cobweb corner + pumpkin face */
.btn, .hero-vote-btn, .pagination-btn, .skill-tab-btn, .discord-join { position: relative; overflow: hidden; isolation: isolate; }
.btn::before, .hero-vote-btn::before, .skill-tab-btn::before, .discord-join::before {
  content: ""; position: absolute; top: 0; left: 0; width: 30px; height: 30px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M0 0L40 0M0 0L34 14M0 0L22 28M0 0L8 40M0 0L0 40M0 10Q9 9 10 0M0 20Q15 17 20 0M0 30Q21 25 30 0' fill='none' stroke='white' stroke-width='1.3' stroke-opacity='.75'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}
.btn::after, .hero-vote-btn::after, .skill-tab-btn::after, .discord-join::after {
  content: ""; position: absolute; right: 0; bottom: 0; width: 30px; height: 30px; pointer-events: none; transform: scale(-1,-1);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M0 0L40 0M0 0L34 14M0 0L22 28M0 0L8 40M0 0L0 40M0 10Q9 9 10 0M0 20Q15 17 20 0M0 30Q21 25 30 0' fill='none' stroke='white' stroke-width='1.3' stroke-opacity='.75'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}
.btn:not(.btn-small):not(.btn-block), .hero-vote-btn { padding-right: 1em; }
.pagination-btn::before { content: ""; position: absolute; top: 0; left: 0; width: 16px; height: 16px; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M0 0L40 0M0 0L34 14M0 0L22 28M0 0L8 40M0 0L0 40M0 10Q9 9 10 0M0 20Q15 17 20 0M0 30Q21 25 30 0' fill='none' stroke='white' stroke-width='1.3' stroke-opacity='.75'/%3E%3C/svg%3E") no-repeat 0 0 / contain; }
.hw-web-br { top: auto; bottom: 0; right: 0; transform: scale(-1,-1); }


.hw-web-bl { top: auto; bottom: 0; left: 0; transform: scaleY(-1); }
.hw-pumpkins { display: none !important; }


/* Halloween discount: highlighted Donate nav link + banner */
.main-nav a[href$="donate/"] {
  position: relative;
  background: linear-gradient(180deg, #ff8a2a, #c9500a);
  color: #1b0f26 !important;
  font-weight: 800;
  border-radius: 999px;
  padding: .35em 1.5em .35em 1em;
  box-shadow: 0 0 0 2px #3a1450, 0 0 14px rgba(255,122,26,.85);
  animation: hw-donate-pulse 1.8s ease-in-out infinite;
}
.main-nav a[href$="donate/"]::after {
  content: "+20%";
  position: absolute; top: -9px; right: -10px;
  background: #6d1fb3; color: #ffd9a0; font-size: .62rem; font-weight: 800;
  padding: 1px 6px; border-radius: 999px; border: 1px solid #ff7a1a; line-height: 1.4;
}
@keyframes hw-donate-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.07); box-shadow: 0 0 0 2px #3a1450, 0 0 22px rgba(255,150,40,1); } }
@media (prefers-reduced-motion: reduce) { .main-nav a[href$="donate/"] { animation: none; } }

.hw-sale { margin: 0 auto 1.6rem; max-width: 760px; text-align: center; padding: 1.1rem 1rem; border-radius: 14px;
  background: linear-gradient(135deg, #2a1240, #4a1a7a); color: #ffd9a0; border: 2px solid #ff7a1a; box-shadow: 0 0 20px rgba(255,122,26,.5); }
.hw-sale h3 { margin: 0 0 .5rem; font-size: 1.4rem; color: #ff9a3c; }
.hw-sale ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }
.hw-sale li { background: rgba(0,0,0,.3); border: 1px solid #ff7a1a; border-radius: 999px; padding: .3rem .9rem; font-weight: 700; }
.hw-sale li b { color: #ff9a3c; }
.hw-sale li { display: flex; flex-direction: column; gap: .15rem; border-radius: 14px; padding: .6rem 1rem; min-width: 170px; }
.hw-sale .hw-price { font-size: 1.05rem; color: #fff; }
.hw-sale .hw-old { text-decoration: line-through; opacity: .7; font-weight: 400; }
.hw-sale .hw-total { font-size: 1.15rem; color: #ffd34a; }
.hw-card-note { margin-top: .8rem; padding: .6rem; text-align: center; border-radius: 10px; background: linear-gradient(135deg, #2a1240, #4a1a7a); color: #ffd9a0; border: 1px solid #ff7a1a; }
.hw-card-note b { color: #ffd34a; font-size: 1.15rem; }