/* The luminous field sits behind the existing dot typography and copy. */
.hero{background:#0c0914;overflow:clip}
.hero .light-field{z-index:-3;animation:none;filter:blur(35px);opacity:.85}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}
.hero-canvas[hidden]{display:none}
.hero::after{background:linear-gradient(0deg,#08090e 0%,#08090e10 26%,transparent 56%,#08090e25),linear-gradient(90deg,#08090e08 20%,#08090e42 57%,#08090e22);z-index:-1}
.hero .grid-lines{opacity:.48;mask-image:linear-gradient(180deg,#0009,transparent 90%)}
.hero-layout h1{text-shadow:0 2px 25px #10071245}
.hero-copy h2{text-shadow:0 2px 24px #10071280}
.hero-copy p{color:#ded0e6;text-shadow:0 1px 14px #100712a0}
.hero-meta,.hero-bottom{color:#d5c5df}
.hero .edition{color:#dfbce8}
.hero[data-renderer=css].is-animating .light-field{animation:light-drift 70s ease-in-out infinite alternate!important}
@media(max-width:700px){
 .hero::after{background:linear-gradient(0deg,#08090e 0%,#08090e99 17%,#08090e48 45%,transparent 80%)}
 .hero .hero-copy{position:relative}
 .hero .hero-copy::before{content:'';position:absolute;inset:-18px -20px;z-index:-1;background:linear-gradient(180deg,#09091200,#09091250 22%,#09091270);pointer-events:none}
}
/* Clip the backdrop layer to the glass pill above the animated canvas. */
.hero .glass{clip-path:inset(-1px round 999px)}