/* Wooden Woodworks Fall + Thanksgiving look, November 2026.
   Only active when <html> has the class "ww-fall" (set by ww-fall.js between Nov 1 and Nov 30, Central time).
   No Halloween imagery: warm harvest colours, falling leaves, a thank-you strip. Remove both files on Dec 1 if wanted;
   the theme already switches itself off on its own after Nov 30. */

html.ww-fall {
  --color-accent:        #A65A2A;   /* harvest rust */
  --color-accent-dark:   #7E4220;
  --color-accent-light:  #E0A848;   /* golden wheat */
  --color-accent-subtle: #F6E7D3;
  --color-paper:         #F6EADB;
}

/* Thank-you strip, sits on top of the fixed nav */
.ww-fall-strip { display: none; }
html.ww-fall .ww-fall-strip {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  position: fixed; top: 0; left: 0; right: 0; z-index: 1001;
  height: 34px; padding: 0 16px;
  background: linear-gradient(90deg, #7E4220, #A65A2A 50%, #7E4220);
  color: #FFF4E2; font-size: 13px; letter-spacing: .04em; text-align: center;
  font-family: var(--font-body, 'Inter', sans-serif);
}
html.ww-fall .ww-fall-strip svg { width: 15px; height: 15px; fill: #E0A848; flex: 0 0 auto; }
html.ww-fall .nav { top: 34px; }
html.ww-fall body { padding-top: 0; }
@media (max-width: 560px) {
  html.ww-fall .ww-fall-strip { font-size: 11.5px; height: 30px; }
  html.ww-fall .nav { top: 30px; }
  html.ww-fall .ww-fall-strip .ww-fall-long { display: none; }
}

/* Warm the hero photo overlay */
html.ww-fall .hero::before {
  background: linear-gradient(160deg,
    rgba(60, 30, 12, 0.74) 0%,
    rgba(48, 30, 20, 0.48) 50%,
    rgba(40, 22, 12, 0.80) 100%);
}
html.ww-fall .hero::after {
  background: linear-gradient(to bottom, transparent, #E0A848 30%, #E0A848 70%, transparent);
  opacity: .45;
}

/* Falling leaves layer (hero only, decorative) */
.ww-fall-leaves { display: none; }
html.ww-fall .ww-fall-leaves {
  display: block; position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden;
}
.ww-fall-leaves span {
  position: absolute; top: -40px; width: 30px; height: 30px; opacity: .85;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23C8692A' d='M32 3C16 14 9 34 29 55l-5 7h4l4-6 4 6h4l-5-7C55 34 48 14 32 3zm0 8v40'/%3E%3C/svg%3E");
  animation: ww-leaf-fall linear infinite;
}
.ww-fall-leaves span:nth-child(3n)   { filter: hue-rotate(18deg) saturate(1.2); width: 22px; height: 22px; }
.ww-fall-leaves span:nth-child(3n+1) { filter: hue-rotate(-12deg) brightness(.85); }
.ww-fall-leaves span:nth-child(1) { left: 8%;  animation-duration: 15s; animation-delay: 0s; }
.ww-fall-leaves span:nth-child(2) { left: 22%; animation-duration: 19s; animation-delay: 4s; }
.ww-fall-leaves span:nth-child(3) { left: 37%; animation-duration: 17s; animation-delay: 9s; }
.ww-fall-leaves span:nth-child(4) { left: 55%; animation-duration: 21s; animation-delay: 2s; }
.ww-fall-leaves span:nth-child(5) { left: 70%; animation-duration: 16s; animation-delay: 7s; }
.ww-fall-leaves span:nth-child(6) { left: 84%; animation-duration: 20s; animation-delay: 11s; }
.ww-fall-leaves span:nth-child(7) { left: 93%; animation-duration: 18s; animation-delay: 5s; }
@keyframes ww-leaf-fall {
  0%   { transform: translate(0, 0) rotate(0deg); }
  50%  { transform: translate(40px, 55vh) rotate(180deg); }
  100% { transform: translate(-20px, 110vh) rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .ww-fall-leaves span { animation: none; top: auto; bottom: 12%; opacity: .35; }
}

/* Leaf garland line above the footer */
html.ww-fall footer, html.ww-fall .footer {
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, #7E4220, #E0A848, #A65A2A, #E0A848, #7E4220) 1;
}
