/* The date-controlled class is removed along with the holiday image on Nov 1. */
.hero.is-halloween{background:linear-gradient(180deg,#193b38 0%,#102c2c 100%);color:#fff5de}
.hero.is-halloween .scene{background:#102c2c}
.hero.is-halloween h1{color:#fff5de}
.hero.is-halloween h1 span{color:#ffc376}
.hero.is-halloween .eyebrow{color:#f5ce97}
.hero.is-halloween .hero-intro{color:#f7ead5}
.hero.is-halloween .pill,.hero.is-halloween .home-social-links a{border-color:#e8b77e;color:#fff5de;background:transparent}
.hero.is-halloween .pill:hover,.hero.is-halloween .home-social-links a:hover{background:#ffc376;color:#173632}
.hero.is-halloween a:focus-visible{outline:3px solid #ffc376;outline-offset:4px}
/* Carry the night scene behind the heading, blending into the full-width artwork. */
.hero.is-halloween{position:relative;isolation:isolate;background:#08292b}
.hero.is-halloween::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#102f31 0%,#08292b 65%,#04262a 100%)}
.hero.is-halloween .scene{background:transparent}
.hero.is-halloween .scene .hero-art{mask-image:linear-gradient(to bottom,transparent 0%,#000 24%,#000 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 24%,#000 100%)}
@media(max-width:760px){.hero.is-halloween .scene .hero-art{mask-image:linear-gradient(to bottom,transparent 0%,#000 20%,#000 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 20%,#000 100%)}}

/* Keep the moon opaque all the way to its upper rim. */
.hero.is-halloween .scene .hero-art{mask-image:none;-webkit-mask-image:none}