.hero:has(#particleCanvas) {
  background:#000;
}
#particleCanvas {pointer-events:none}
.hero:has(#particleCanvas) .hero-content {will-change:opacity}
.hero:has(#particleCanvas) .hero-content.particle-copy-hidden {pointer-events:none}
@media(prefers-reduced-motion:reduce) {
  .hero:has(#particleCanvas) .hero-content {opacity:1!important;will-change:auto}
}
.particle-motion-toggle {
  position:absolute;right:24px;bottom:20px;z-index:2;
  font:500 11px 'Inter',sans-serif;color:#aaa;background:rgba(17,19,23,.75);
  border:1px solid #343842;border-radius:5px;padding:7px 10px;cursor:pointer;
}
.particle-motion-toggle:hover {color:#fff;border-color:#5599ed}
.particle-motion-toggle:focus-visible {outline:2px solid #5599ed;outline-offset:4px}
.particle-motion-toggle[hidden] {display:none}
@media(max-width:768px) {
  .hero:has(#particleCanvas) .hero-content {padding:0 20px;box-sizing:border-box;width:100%}
  .particle-motion-toggle {right:16px;bottom:12px;font-size:10px}
}