.carousel-title-container.Halloween[data-aveo-title-animation="halloween"] {
    position: relative;
    margin-bottom: 20px;
    isolation: isolate;
    overflow: visible;
}

.carousel-title-container.Halloween[data-aveo-title-animation="halloween"] .aveo-halloween-scene > a {
    position: relative;
    display: inline-block;
    max-width: none;
    white-space: nowrap;
    font-size: 100px;
    line-height: 1.2;
    z-index: 3;
}

.aveo-halloween-frame {
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding: 0;
    border: 0;
}

.aveo-halloween-scene {
    position: absolute;
    display: inline-block;
    width: max-content;
    max-width: none;
    left: 0;
    top: 0;
    padding: 0;
    border: 0;
    line-height: 1.2;
    overflow: visible;
    transform-origin: left top;
}

.aveo-halloween-pumpkin {
    position: absolute;
    z-index: 7;
    top: var(--aveo-pumpkin-y);
    left: var(--aveo-pumpkin-x);
    width: var(--aveo-pumpkin-size);
    height: var(--aveo-pumpkin-size);
    pointer-events: none;
    transform-origin: center bottom;
    animation: aveo-halloween-pumpkin-glow 3.8s ease-in-out infinite;
}

.aveo-halloween-pumpkin--small-one { transform: rotate(-7deg); animation-delay: .4s; }
.aveo-halloween-pumpkin--small-two { transform: rotate(5deg); animation-delay: 1.5s; }
.aveo-halloween-pumpkin--large { transform: rotate(-4deg) scaleX(-1); animation-delay: 2.2s; }

.aveo-halloween-pumpkin img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(1px 4px 3px rgba(42, 16, 0, .35));
}

.aveo-halloween-web {
    position: absolute;
    z-index: 5;
    top: var(--aveo-web-y);
    left: var(--aveo-web-x);
    width: var(--aveo-web-width, 74px);
    height: var(--aveo-web-height, 74px);
    pointer-events: none;
    transform-origin: top left;
}

.aveo-halloween-web svg,
.aveo-halloween-spider svg,
.aveo-halloween-bat svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.aveo-halloween-web__line {
    fill: none;
    stroke: rgba(238, 233, 208, .92);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

.aveo-halloween-web--hanging .aveo-halloween-web__line {
    stroke-width: 1.8;
}

.aveo-halloween-spider {
    position: absolute;
    z-index: 7;
    top: var(--aveo-spider-y);
    left: var(--aveo-spider-x);
    width: 64px;
    height: 136px;
    pointer-events: none;
}

.aveo-halloween-spider__thread {
    position: absolute;
    top: 0;
    left: 32px;
    width: 1px;
    height: 22px;
    background: rgba(238, 233, 208, .92);
    transform: translateX(-50%);
    animation: aveo-halloween-thread-climb 4.8s ease-in-out infinite;
}

.aveo-halloween-spider svg {
    position: absolute;
    top: 12px;
    left: 0;
    height: 34px;
    animation: aveo-halloween-spider-climb 4.8s ease-in-out infinite;
}

.aveo-halloween-spider__leg {
    fill: none;
    stroke: #201718;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3.5;
}

.aveo-halloween-spider__body { fill: #251b1c; }
.aveo-halloween-spider__eye { fill: #e9ba2f; }

.aveo-halloween-bat {
    position: absolute;
    z-index: 6;
    top: var(--aveo-bat-y);
    left: var(--aveo-bat-x);
    width: 34px;
    height: 20px;
    pointer-events: none;
    opacity: 0;
}

.aveo-halloween-bat.is-flying { animation: aveo-halloween-bat-flight var(--aveo-bat-duration) cubic-bezier(.45, .1, .55, .9) both; }
.aveo-halloween-bat--0 { width: 34px; height: 20px; }
.aveo-halloween-bat--1 { width: 26px; height: 15px; }
.aveo-halloween-bat--2 { width: 23px; height: 13px; }
.aveo-halloween-bat--3 { width: 20px; height: 12px; }
.aveo-halloween-bat--4 { width: 17px; height: 10px; }
.aveo-halloween-bat__wing { fill: #2a2024; }
.aveo-halloween-bat__body { fill: #130e10; }

@keyframes aveo-halloween-pumpkin-glow {
    0%, 100% { filter: drop-shadow(1px 3px 2px rgba(43, 15, 1, .35)); }
    50% { filter: drop-shadow(0 0 8px rgba(255, 159, 22, .65)) drop-shadow(1px 3px 2px rgba(43, 15, 1, .28)); }
}

@keyframes aveo-halloween-thread-climb {
    0%, 100% { height: 22px; }
    50% { height: 46px; }
}

@keyframes aveo-halloween-spider-climb {
    0%, 100% { top: 12px; transform: rotate(-3deg); }
    50% { top: 36px; transform: rotate(3deg); }
}

@keyframes aveo-halloween-bat-flight {
    0% { opacity: .9; transform: translate(0, 0) rotate(-7deg) scaleX(var(--aveo-bat-facing)) scale(.84); }
    12% { opacity: .9; transform: translate(var(--aveo-bat-x-1), var(--aveo-bat-y-1)) rotate(6deg) scaleX(var(--aveo-bat-facing)) scale(1); }
    26% { opacity: .9; transform: translate(var(--aveo-bat-x-2), var(--aveo-bat-y-2)) rotate(-4deg) scaleX(var(--aveo-bat-facing)) scale(.94); }
    40% { opacity: .9; transform: translate(var(--aveo-bat-x-3), var(--aveo-bat-y-3)) rotate(5deg) scaleX(var(--aveo-bat-facing)) scale(.98); }
    55% { opacity: .9; transform: translate(var(--aveo-bat-x-4), var(--aveo-bat-y-4)) rotate(-6deg) scaleX(var(--aveo-bat-facing)) scale(.93); }
    70% { opacity: .9; transform: translate(var(--aveo-bat-x-5), var(--aveo-bat-y-5)) rotate(4deg) scaleX(var(--aveo-bat-facing)) scale(.97); }
    84% { opacity: .9; transform: translate(var(--aveo-bat-x-6), var(--aveo-bat-y-6)) rotate(-3deg) scaleX(var(--aveo-bat-facing)) scale(.91); }
    100% { opacity: .9; transform: translate(var(--aveo-bat-travel), var(--aveo-bat-y-travel)) rotate(-4deg) scaleX(var(--aveo-bat-facing)) scale(.82); }
}

@media (prefers-reduced-motion: reduce) {
    .aveo-halloween-pumpkin,
    .aveo-halloween-spider__thread,
    .aveo-halloween-spider svg,
    .aveo-halloween-bat { animation: none; }
}