/* The sky is one continuous field, extending the blue gradient way farther down behind the lounge scene and resolving cleanly to linen at the base. */
.hero-sky { position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(180deg,#7baad0 0%,#8eb9db 28%,#a3c9e1 52%,#bfdbec 74%,#daeaf2 88%,var(--linen) 100%); -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 78%,rgba(0,0,0,0.45) 92%,transparent 100%); mask-image:linear-gradient(180deg,#000 0%,#000 78%,rgba(0,0,0,0.45) 92%,transparent 100%); }
.hero-sky canvas { display:block; width:100%; height:100%; opacity:0; }
.hero-sky canvas.is-ready { opacity:.85; }
.hero-foliage { z-index:1; }
.hero-stage-grid { z-index:3; }
.hero-bottom-scene { z-index:2; }
@media(prefers-reduced-motion:reduce) { .hero-sky { will-change:auto; } }

.campaign-header,.campaign-header__bar { transition:background-color 220ms ease,border-color 220ms ease; }
.campaign-header.is-over-sky:not(.is-open),.campaign-header.is-over-sky:not(.is-open) .campaign-header__bar { background:transparent; }
.campaign-header.is-over-sky:not(.is-open) .campaign-header__bar { border-bottom-color:transparent; }
@media(prefers-reduced-motion:reduce) { .campaign-header,.campaign-header__bar { transition:none; } }