/* Fall / Halloween theme - layered over site.css when Admin > Settings > Theme is "Fall / Halloween".
   Harvest palette (pumpkin, burnt orange, cranberry, olive) with a moonlit night hero. */
:root {
  --ivory: #faf2e6;
  --paper: #fffcf7;
  --ink: #2b1a11;
  --ink-soft: #5f4433;
  --muted: #8d7261;
  --gold: #cf7a2b;
  --gold-deep: #9b4517;
  --gold-soft: #f3dcc0;
  --blush: #f8e0c6;
  --blush-deep: #ecc39b;
  --sage: #6d7334;
  --sage-soft: #ecead5;
  --line: #ecd7bf;
  --danger: #9e2f24;
  --night: #170d08;
  --night-2: #3a1d0e;
  --pumpkin: #e8822f;
  --cranberry: #7a2a22;
  --leaves: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg opacity='.16'%3E%3Cpath d='M30 20c9 8 12 19 0 38-12-19-9-30 0-38z' fill='%23cf7a2b' transform='rotate(25 30 40)'/%3E%3Cpath d='M150 40c8 7 11 17 0 34-11-17-8-27 0-34z' fill='%237a2a22' transform='rotate(-35 150 57)'/%3E%3Cpath d='M95 120c10 9 13 21 0 42-13-21-10-33 0-42z' fill='%23b8862b' transform='rotate(60 95 141)'/%3E%3Cpath d='M185 160c7 6 9 15 0 30-9-15-7-24 0-30z' fill='%23cf7a2b' transform='rotate(-10 185 175)'/%3E%3Cpath d='M40 175c7 7 10 16 0 31-10-15-7-24 0-31z' fill='%236d7334' transform='rotate(140 40 190)'/%3E%3C/g%3E%3C/svg%3E");
  --leaves-bright: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg opacity='.55'%3E%3Cpath d='M30 20c9 8 12 19 0 38-12-19-9-30 0-38z' fill='%23cf7a2b' transform='rotate(25 30 40)'/%3E%3Cpath d='M150 40c8 7 11 17 0 34-11-17-8-27 0-34z' fill='%237a2a22' transform='rotate(-35 150 57)'/%3E%3Cpath d='M95 120c10 9 13 21 0 42-13-21-10-33 0-42z' fill='%23b8862b' transform='rotate(60 95 141)'/%3E%3Cpath d='M185 160c7 6 9 15 0 30-9-15-7-24 0-30z' fill='%23cf7a2b' transform='rotate(-10 185 175)'/%3E%3Cpath d='M40 175c7 7 10 16 0 31-10-15-7-24 0-31z' fill='%236d7334' transform='rotate(140 40 190)'/%3E%3C/g%3E%3C/svg%3E");
  --bat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 22'%3E%3Cpath fill='%23120905' d='M27 6c1.2 0 2-1.6 2.4-3 .5 1.5 1 2.6 1.8 3.4 3.6-3.6 9.8-5.6 15.4-3.3 2.6 1.1 5 3 7.4 5.9-3.3-1-6.1-.9-8.2.6-1.6-1.2-4-1.4-6 .1-1.5-1-3.8-.9-5.4.5-1.4 1.3-2.4 3.4-2.8 6.1-.6-2-1.6-3.3-2.6-3.8-1 .5-2 1.8-2.6 3.8-.4-2.7-1.4-4.8-2.8-6.1-1.6-1.4-3.9-1.5-5.4-.5-2-1.5-4.4-1.3-6-.1-2.1-1.5-4.9-1.6-8.2-.6 2.4-2.9 4.8-4.8 7.4-5.9 5.6-2.3 11.8-.3 15.4 3.3.8-.8 1.3-1.9 1.8-3.4.4 1.4 1.2 3 2.4 3z'/%3E%3C/svg%3E");
  --pumpkin-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 30'%3E%3Cpath d='M16 7c1-3 3-5 6-5' stroke='%235a4a1f' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Cellipse cx='9.5' cy='18' rx='7.5' ry='10' fill='%23d9702a'/%3E%3Cellipse cx='22.5' cy='18' rx='7.5' ry='10' fill='%23d9702a'/%3E%3Cellipse cx='16' cy='18' rx='7' ry='11' fill='%23ec8a37'/%3E%3Cpath d='M23 4c3 0 5 2 5 4-3 0-5-1-5-4z' fill='%236d7334'/%3E%3C/svg%3E");
}

/* Banner + announcement bar */
.site-banner { background: var(--night); color: var(--pumpkin); border-bottom: 2px solid var(--pumpkin); }
.announce { background: linear-gradient(90deg, var(--cranberry), var(--gold-deep) 50%, var(--cranberry)); color: #fff4e6; }
.site-header { border-bottom: 2px solid var(--gold); }
body { background-color: var(--ivory); background-image: linear-gradient(rgba(250, 242, 230, .6), rgba(250, 242, 230, .6)), var(--leaves); background-attachment: fixed; }

/* Hero: night sky, the logo as a glowing harvest moon, a few bats */
.hero {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 72% 42%, #6a3415 0%, var(--night-2) 38%, var(--night) 100%);
  border-bottom: 3px solid var(--pumpkin);
  color: #f7eadb;
}
.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 90px;
  background: var(--leaves-bright) repeat-x bottom / 200px;
  opacity: .8;
  pointer-events: none;
}
.hero-inner { position: relative; z-index: 1; }
.hero .eyebrow { color: var(--pumpkin); }
.hero .hero-title { color: #fbf1e3; }
.hero .script-line { color: #f2b56b; }
.hero .btn-primary { background: var(--pumpkin); color: var(--night); }
.hero .btn-primary:hover { background: #ffa04f; color: var(--night); }
.hero .btn-ghost { border-color: #f2b56b; color: #fbf1e3; }
.hero .btn-ghost:hover { background: #f2b56b; color: var(--night); }
.hero-art { position: relative; }
.hero-art img {
  border-radius: 50%;
  box-shadow: 0 0 40px 8px rgba(255, 196, 120, .45), 0 0 140px 50px rgba(232, 130, 47, .22);
}
.hero-bats { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.hero-bats span { position: absolute; display: block; background: var(--bat) no-repeat center / contain; animation: bat-drift 7s ease-in-out infinite alternate; }
.hero-bats span:nth-child(1) { width: 64px; height: 26px; top: 4%; left: -6%; }
.hero-bats span:nth-child(2) { width: 42px; height: 17px; top: 18%; right: -2%; animation-delay: -2s; }
.hero-bats span:nth-child(3) { width: 30px; height: 12px; top: -2%; right: 26%; animation-delay: -4s; }
.hero-bats span:nth-child(4) { width: 24px; height: 10px; bottom: 14%; left: 2%; animation-delay: -1s; }
@keyframes bat-drift { from { transform: translate(0, 0) rotate(-4deg); } to { transform: translate(10px, -12px) rotate(5deg); } }
@media (prefers-reduced-motion: reduce) { .hero-bats span { animation: none; } }

/* Section headings get a little pumpkin */
.section-head h2::before {
  content: "";
  display: inline-block;
  width: 1.05em;
  height: 1em;
  margin-right: .4em;
  vertical-align: -.1em;
  background: var(--pumpkin-icon) no-repeat center / contain;
}
.rule { background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--cranberry) 50%, var(--gold) 70%, transparent); }

/* Cards and tiles: warm edges */
.tile:hover, .card:hover { border-color: var(--pumpkin); }
.badge:not(.badge-sale):not(.badge-muted) { background: var(--cranberry); }
.btn-primary:hover { background: var(--gold-deep); }

/* Footer: a band of leaves */
.site-footer { background: linear-gradient(var(--paper) 0, var(--paper) 100%) no-repeat 0 70px / 100% 100%, var(--leaves-bright) repeat-x top / 200px, var(--paper); border-top: 2px solid var(--gold); }
.site-footer { padding-top: 92px; }
.site-footer .footer-grid { position: relative; }