/* One gated appearance layer; removing the root attribute restores the base site. */
.seasonal-banner, .seasonal-scene, .seasonal-ribbon { display: none; }
.seasonal-banner[hidden], #seasonal-theme-toggle[hidden] { display: none !important; }

html[data-seasonal-theme="halloween"] {
  --green: #51345c;
  --deep: #261b31;
  --sand: #e7cbb2;
  --cream: #fff7e9;
  --ink: #352a3b;
  --orange: #ffad58;
  --line: #e3d6de;
  --muted: #6d5c70;
}
html[data-seasonal-theme="halloween"] body { background: #fff7e9; }
html[data-seasonal-theme="halloween"] .header {
  background: #2b2036;
  box-shadow: 0 1px 0 #ffad5838;
}
html[data-seasonal-theme="halloween"] .header.scrolled { box-shadow: 0 3px 25px #25192b40; }
html[data-seasonal-theme="halloween"] .mobile-nav { background: #2b2036; }
html[data-seasonal-theme="halloween"] .button { color: #2b2036; background: #ffad58; }
html[data-seasonal-theme="halloween"] .button:hover { background: #ffc17e; }
html[data-seasonal-theme="halloween"] .button.green { color: #fff7e9; background: #51345c; }
html[data-seasonal-theme="halloween"] .button.green:hover { background: #392340; }
html[data-seasonal-theme="halloween"] .hero-shade {
  background: linear-gradient(90deg, #231529d9, #24192b65 78%), linear-gradient(0deg, #25182beb, transparent 75%);
}
html[data-seasonal-theme="halloween"] .hero-copy,
html[data-seasonal-theme="halloween"] .hero-explore,
html[data-seasonal-theme="halloween"] .hero-note { z-index: 2; }
html[data-seasonal-theme="halloween"] .hero-copy { max-width: 64%; }
html[data-seasonal-theme="halloween"] .hero-copy h1 { font-size: clamp(76px, 7.7vw, 112px); }
html[data-seasonal-theme="halloween"] .hero-copy h1 em { color: #ffc184; }
html[data-seasonal-theme="halloween"] .hero::before,
html[data-seasonal-theme="halloween"] .hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  width: 180px;
  aspect-ratio: 1;
  background: url('assets/halloween-cobweb.svg') top left / contain no-repeat;
  pointer-events: none;
  opacity: .65;
}
html[data-seasonal-theme="halloween"] .hero::before { left: 0; }
html[data-seasonal-theme="halloween"] .hero::after { right: 0; transform: scaleX(-1); }
html[data-seasonal-theme="halloween"] .seasonal-scene {
  display: block;
  position: absolute;
  z-index: 1;
  right: 3%;
  bottom: 100px;
  width: min(44%, 600px);
  aspect-ratio: 600 / 340;
  background: url('assets/halloween-pumpkins-v2.svg') center / contain no-repeat;
  pointer-events: none;
}
.seasonal-bat {
  position: absolute;
  aspect-ratio: 2;
  background: url('assets/halloween-bat.svg') center / contain no-repeat;
  filter: drop-shadow(0 3px 5px #10091bcc);
  animation: seasonal-bat-drift 7s ease-in-out infinite alternate;
}
.seasonal-bat-one { left: 1%; top: 13%; width: 24%; --bat-angle: -14deg; }
.seasonal-bat-two { left: 35%; top: 1%; width: 21%; --bat-angle: 12deg; animation-delay: -3s; }
.seasonal-bat-three { right: 0; top: 26%; width: 22%; --bat-angle: 15deg; animation-delay: -5s; }
.seasonal-bat-four { left: 25%; top: 40%; width: 17%; --bat-angle: -9deg; animation-delay: -2s; }
@keyframes seasonal-bat-drift {
  from { transform: translateY(0) rotate(var(--bat-angle)); }
  to { transform: translateY(-7px) rotate(calc(var(--bat-angle) + 5deg)); }
}
html[data-seasonal-theme="halloween"] .seasonal-banner {
  position: absolute;
  z-index: 3;
  top: 20px;
  left: 7.3%;
  right: 7.3%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.seasonal-greeting {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 15px;
  border: 1px solid #ffc18465;
  border-radius: 100px;
  background: #2b2036e8;
  color: #ffe6c5;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .035em;
}
.seasonal-pumpkin { width: 23px; height: 23px; flex-shrink: 0; }
.seasonal-classic-button {
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid #fff7e970;
  border-radius: 100px;
  background: #2b2036e8;
  color: #fff7e9;
  font-size: 12px;
  line-height: 1.4;
}
.seasonal-classic-button:hover { background: #51345c; }
.seasonal-classic-button:focus-visible,
#seasonal-theme-toggle:focus-visible { outline: 3px solid #ffad58; outline-offset: 4px; }
html[data-seasonal-theme="halloween"] .seasonal-ribbon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 36px;
  padding: 19px 24px;
  color: #ffdeaa;
  background: #36203f;
  border-top: 1px solid #f8ae5d60;
  border-bottom: 1px solid #f8ae5d60;
}
.seasonal-ribbon p { display: flex; align-items: center; gap: 22px; margin: 0; }
.seasonal-ribbon b { font-family: Georgia, serif; font-size: 28px; font-weight: 400; }
.seasonal-ribbon p > span { color: #ead9ee; font-size: 13px; }
.seasonal-ribbon-bat {
  width: 48px;
  aspect-ratio: 2;
  flex: 0 0 48px;
  background: url('assets/halloween-bat.svg') center / contain no-repeat;
  transform: rotate(-12deg);
}
.seasonal-ribbon-bat:last-child { transform: rotate(12deg); }
html[data-seasonal-theme="halloween"] .quick-facts { background: #f4e0cb; color: #3b2b3f; }
html[data-seasonal-theme="halloween"] .stay-copy { background: #f5e9db; }
html[data-seasonal-theme="halloween"] .gallery-section {
  position: relative;
  isolation: isolate;
  background: radial-gradient(ellipse at 96% 0, #55304e75, transparent 55%), #261b31;
}
html[data-seasonal-theme="halloween"] .gallery-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  width: 210px;
  aspect-ratio: 1;
  background: url('assets/halloween-cobweb.svg') center / contain no-repeat;
  transform: scaleX(-1);
  opacity: .45;
  pointer-events: none;
}
html[data-seasonal-theme="halloween"] .gallery-heading h2 em { color: #ffc184; }
html[data-seasonal-theme="halloween"] .plan-section { background: #493153; }
html[data-seasonal-theme="halloween"] .footer { background: #21182b; }
html[data-seasonal-theme="halloween"] .footer > p { color: #d9c9df; }
html[data-seasonal-theme="halloween"] .mobile-bar { background: #fff7e9f5; border-color: #dac5d4; }
html[data-seasonal-theme="halloween"] .plan-form input:focus,
html[data-seasonal-theme="halloween"] .plan-form textarea:focus { outline-color: #754184; }

@media (max-width: 1000px) {
  html[data-seasonal-theme="halloween"] .seasonal-banner { left: 6%; right: 6%; }
}
@media (max-width: 900px) {
  html[data-seasonal-theme="halloween"] .hero {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
    max-height: none;
    padding: 80px 6% 75px;
  }
  html[data-seasonal-theme="halloween"] .seasonal-scene {
    position: relative;
    right: auto;
    bottom: auto;
    flex: 0 0 auto;
    width: min(480px, 100%);
    margin: 0 auto 18px;
  }
  html[data-seasonal-theme="halloween"] .hero-copy {
    position: relative;
    bottom: auto;
    width: 100%;
    max-width: none;
    padding: 0;
  }
  html[data-seasonal-theme="halloween"] .hero-copy h1 { font-size: clamp(62px, 10vw, 90px); }
  html[data-seasonal-theme="halloween"] .hero-note { display: none; }
  html[data-seasonal-theme="halloween"] .hero-shade {
    background: linear-gradient(0deg, #25182bf5, #25182bb3 50%, #25182b73);
  }
}
@media (max-width: 640px) {
  html[data-seasonal-theme="halloween"] .hero { padding: 80px 20px 75px; }
  html[data-seasonal-theme="halloween"] .seasonal-banner { top: 14px; left: 20px; right: 20px; gap: 8px; }
  html[data-seasonal-theme="halloween"] .hero::before,
  html[data-seasonal-theme="halloween"] .hero::after { width: 110px; opacity: .5; }
  html[data-seasonal-theme="halloween"] .hero-copy h1 { font-size: clamp(58px, 16vw, 88px); }
  html[data-seasonal-theme="halloween"] .hero-explore { left: 20px; right: 20px; }
  .seasonal-greeting { padding: 9px 11px; gap: 7px; font-size: 10px; letter-spacing: 0; }
  .seasonal-pumpkin { width: 20px; height: 20px; }
  .seasonal-classic-button { padding: 9px 11px; font-size: 11px; flex-shrink: 0; }
  html[data-seasonal-theme="halloween"] .seasonal-ribbon { gap: 16px; padding: 17px 20px; }
  .seasonal-ribbon p { flex-direction: column; gap: 4px; text-align: center; }
  .seasonal-ribbon b { font-size: 25px; }
  .seasonal-ribbon p > span { font-size: 11px; line-height: 1.5; }
  .seasonal-ribbon-bat { width: 35px; flex-basis: 35px; }
  html[data-seasonal-theme="halloween"] .gallery-section::before { width: 140px; }
}
@media (max-width: 360px) {
  html[data-seasonal-theme="halloween"] .seasonal-banner { left: 15px; right: 15px; }
  .seasonal-greeting { font-size: 9px; padding: 9px; gap: 5px; }
  .seasonal-classic-button { font-size: 10px; padding: 9px 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .seasonal-bat { animation: none; transform: rotate(var(--bat-angle)); }
}
