/* Seasonal layer for the home only. The classic styles and artwork stay intact. */
body.slx-home-halloween {
  --home-night: #17121f;
  background: var(--home-night);
}
.slx-home-halloween :is(.slx-navbar, #contenuto, .slx-footer) {
  --ink: #f8eddd;
  --muted: #c1b4c9;
  --surface: #241c2e;
  --bg: #1d1726;
  --border: #493950;
  --brand-blue: #ffad62;
  --brand-blue-dark: #ffc38a;
  --brand-blue-soft: #ffad621a;
  --brand-yellow: #ffd699;
  --bs-body-color: #f8eddd;
  --bs-body-bg: #241c2e;
  --bs-border-color: #493950;
  --bs-secondary-rgb: 193, 180, 201;
  --bs-light-rgb: 45, 35, 55;
  --bs-primary-rgb: 255, 173, 98;
  --bs-link-color: #ffc38a;
  --bs-link-hover-color: #ffdbb5;
  --bs-link-color-rgb: 255, 195, 138;
  --bs-link-hover-color-rgb: 255, 219, 181;
  color: var(--ink);
}
.slx-home-halloween .slx-navbar {
  --bs-navbar-toggler-border-color: #a18baf;
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23f8eddd' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  background: #1c1524;
  box-shadow: 0 1px 0 #ffffff06;
}
.slx-home-halloween .dropdown-menu {
  --bs-dropdown-bg: #241c2e;
  --bs-dropdown-color: #f8eddd;
  --bs-dropdown-border-color: #604b6b;
  --bs-dropdown-link-color: #f8eddd;
  --bs-dropdown-link-hover-bg: #38283f;
  --bs-dropdown-link-hover-color: #ffd699;
  --bs-dropdown-link-active-bg: #ffad62;
  --bs-dropdown-link-active-color: #25182d;
  --bs-dropdown-header-color: #c1b4c9;
}
.slx-home-halloween .slx-hero { background: var(--home-night); }
.slx-home-halloween .slx-hero-bg {
  background:
    radial-gradient(ellipse at 87% 35%, #a9653638, transparent 46%),
    radial-gradient(ellipse at 20% 10%, #65457838, transparent 65%),
    linear-gradient(180deg, #17121f, #20182b 80%, #17121f);
}
.slx-home-halloween .slx-hero-bg::before {
  content: '';
  position: absolute;
  width: clamp(65px, 8vw, 115px);
  aspect-ratio: 1;
  right: 12%;
  top: 10%;
  border-radius: 50%;
  background: #f2cea0;
  opacity: .22;
  box-shadow: 0 0 85px 30px #efb57429;
}
.slx-home-halloween .slx-hero-bg::after {
  content: '';
  position: absolute;
  inset: 40% -5% -5%;
  background: radial-gradient(ellipse at 60% 90%, #b396ca13, transparent 62%);
  animation: home-halloween-mist 18s ease-in-out infinite alternate;
}
.slx-home-halloween .slx-hero > .container {
  animation: home-halloween-enter .65s ease-out both;
}
.slx-home-halloween .slx-hero h1 {
  color: #fff2df;
  text-shadow: 0 2px 22px #17121f, 0 1px 4px #17121f;
}
.slx-home-halloween .slx-hero-img {
  opacity: .85 !important;
  position: relative;
  z-index: 0;
  mask-image: linear-gradient(90deg, #0008, #000b 35%, #000 65%);
}
.slx-home-halloween #contenuto .card {
  --bs-card-color: #f8eddd;
  --bs-card-bg: #241c2e;
  --bs-card-border-color: #493950;
}
.slx-home-halloween :is(.slx-navbar, #contenuto, .slx-footer) .btn-primary {
  --bs-btn-color: #25182d;
  --bs-btn-bg: #ffad62;
  --bs-btn-border-color: #ffad62;
  --bs-btn-hover-color: #25182d;
  --bs-btn-hover-bg: #ffc38a;
  --bs-btn-hover-border-color: #ffc38a;
  --bs-btn-active-color: #25182d;
  --bs-btn-active-bg: #ffd4aa;
  --bs-btn-active-border-color: #ffd4aa;
  --bs-btn-focus-shadow-rgb: 255, 173, 98;
}
.slx-home-halloween :is(.slx-navbar, #contenuto, .slx-footer) .btn-outline-primary {
  --bs-btn-color: #ffc38a;
  --bs-btn-border-color: #b0774b;
  --bs-btn-hover-color: #25182d;
  --bs-btn-hover-bg: #ffad62;
  --bs-btn-hover-border-color: #ffad62;
  --bs-btn-active-color: #25182d;
  --bs-btn-active-bg: #ffd4aa;
  --bs-btn-active-border-color: #ffd4aa;
  --bs-btn-focus-shadow-rgb: 255, 173, 98;
}
.slx-home-halloween #contenuto .text-bg-primary { color: #25182d !important; }
.slx-home-halloween .slx-hero .btn-outline-primary { --bs-btn-bg: #211729eb; }
.slx-home-halloween #contenuto .text-bg-light { color: #e2d2ea !important; }
.slx-home-halloween #contenuto .text-bg-secondary { color: #f8eddd !important; background-color: #5c4569 !important; }
.slx-home-halloween #contenuto .btn-outline-secondary {
  --bs-btn-color: #d0bed9;
  --bs-btn-border-color: #a18baf;
  --bs-btn-hover-bg: #44334f;
  --bs-btn-hover-color: #fff2df;
}
.slx-home-halloween #contenuto :is(.slx-cta, .slx-home-castle-section, .slx-home-castle-date, .slx-home-event-bands-section, .slx-home-street-photo-panel, .slx-dashboard-street-card) {
  background: #241c2e;
  border-color: var(--border);
}
.slx-home-halloween #contenuto .slx-dashboard-street-card:hover { border-color: #b0774b; }
.slx-home-halloween #contenuto .slx-membership-official-wrap {
  background: radial-gradient(ellipse at 70% 50%, #ffad6215, transparent 70%);
}
.slx-home-halloween .slx-festival-home { background: #1d1726; }
.slx-home-halloween .slx-festival-home-card { background: #241c2e; border-color: #604b6b; }
.slx-home-halloween .slx-festival-home-card:hover { border-color: #b0774b; }
.slx-home-halloween .slx-festival-home-main,
.slx-home-halloween .slx-festival-home-main:hover { color: #f8eddd; }
.slx-home-halloween .slx-festival-home-heading > div > p:last-child,
.slx-home-halloween .slx-festival-home-copy p,
.slx-home-halloween .slx-festival-home-note { color: #c1b4c9; }
.slx-home-halloween .slx-festival-home-preview { color: #c1b4c9; border-color: #7c6589; }
.slx-home-halloween .slx-festival-home-join { color: #ffc38a; border-color: #604b6b; }
.slx-home-halloween .slx-festival-home-invitation { background: #30213b; }
.slx-home-halloween .slx-footer { margin-top: 3rem; }
.slx-home-halloween .slx-footer .slx-footer-bottom { background: #100d16; }
.slx-home-halloween :is(.slx-navbar, #contenuto, .slx-footer) :focus-visible {
  outline-color: #ffd699;
}
.slx-home-halloween .slx-hero .btn { transition: color .18s ease, background-color .18s ease, border-color .18s ease; }
@keyframes home-halloween-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes home-halloween-mist {
  from { opacity: .45; transform: translateX(-2%); }
  to { opacity: 1; transform: translateX(2%); }
}
@media (max-width: 991.98px) {
  .slx-home-halloween .slx-hero-bg::before { right: 8%; top: 7%; width: 65px; }
}
@media (prefers-reduced-motion: reduce) {
  .slx-home-halloween .slx-hero > .container,
  .slx-home-halloween .slx-hero-bg::after { animation: none; }
  .slx-home-halloween .slx-hero .btn { transition: none; }
}