/* Independent side layers reuse the original three artworks; the center stays calm. */
.hero-art-layer{background-image:none;background-color:var(--hero-scene)}
.hero-art-night{--hero-image:url("assets/hero.webp");--hero-scene:#000;--hero-floor:#0b0b0e;--hero-shade:#0b0b0e15}
.hero-art-morning{--hero-image:url("assets/hero-morning.webp");--hero-scene:#f5f7fb;--hero-floor:#f7f8fb;--hero-shade:transparent}
.hero-art-afternoon{--hero-image:url("assets/hero-afternoon.webp");--hero-scene:#f5e4d0;--hero-floor:#f6e9dc;--hero-shade:transparent}
.hero-feather,.hero-crystals{position:absolute;inset:-2%;background-image:var(--hero-image);background-size:cover;background-position:center;background-repeat:no-repeat;pointer-events:none;animation-play-state:var(--hero-animation-state,paused)!important}
.hero-feather{mask-image:linear-gradient(90deg,#000 0 28%,transparent 47%);-webkit-mask-image:linear-gradient(90deg,#000 0 28%,transparent 47%);transform-origin:17% 75%;animation:hero-feather-drift 14s ease-in-out infinite}
.hero-crystals{mask-image:linear-gradient(90deg,transparent 53%,#000 72% 100%);-webkit-mask-image:linear-gradient(90deg,transparent 53%,#000 72% 100%);transform-origin:86% 48%;animation:hero-crystal-drift 18s ease-in-out infinite}
.hero-art-layer:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--hero-floor),transparent 32%,transparent 76%,var(--hero-shade));pointer-events:none}
.hero[data-motion-state="playing"]{--hero-animation-state:running}
.hero[data-motion-state="paused"]{--hero-animation-state:paused}
.hero-particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.hero-content{z-index:2}
.theme-preview{z-index:3}
.hero-motion-toggle{position:absolute;z-index:3;top:80px;right:max(24px,calc((100% - 1316px)/2));display:flex;align-items:center;gap:7px;min-height:34px;padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--muted);font-size:10px;box-shadow:0 4px 18px #00000009}
.hero-motion-toggle svg{width:12px;height:12px;fill:currentColor;stroke:none}
.hero-motion-toggle:hover{color:var(--text);border-color:var(--red)}
.hero-motion-toggle:disabled{cursor:default;opacity:.8}
@keyframes hero-feather-drift{0%,100%{transform:translate3d(-2px,7px,0) rotate(-.65deg) scale(1.012)}50%{transform:translate3d(5px,-7px,0) rotate(.55deg) scale(1.018)}}
@keyframes hero-crystal-drift{0%,100%{transform:translate3d(2px,-7px,0) rotate(.5deg) scale(1.012)}50%{transform:translate3d(-5px,8px,0) rotate(-.55deg) scale(1.02)}}
@media(max-width:760px){.hero-feather,.hero-crystals{background-size:auto 104%;inset:-1%}.hero-feather{background-position:left center;mask-image:linear-gradient(90deg,#0009 0,#0005 20%,transparent 43%);-webkit-mask-image:linear-gradient(90deg,#0009 0,#0005 20%,transparent 43%)}.hero-crystals{background-position:right center;mask-image:linear-gradient(90deg,transparent 57%,#0005 80%,#0009);-webkit-mask-image:linear-gradient(90deg,transparent 57%,#0005 80%,#0009)}.hero-motion-toggle{top:77px;right:20px;min-height:36px}.hero-content{padding-top:139px}}
@media(prefers-reduced-motion:reduce){.hero-feather,.hero-crystals{animation:none!important;transform:none!important}}