.hero-motion { overflow: hidden; isolation: isolate; }
.hero-motion .hero-motion-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; pointer-events: none; transition: opacity .8s ease; }
.hero-motion .hero-motion-canvas.is-ready { opacity: 1; }
.hero-motion.overlay::before { z-index: 1; pointer-events: none; }
.hero-motion > .container { position: relative; z-index: 2; }
.hero-motion .hero-motion-toggle { position: absolute; z-index: 3; bottom: 25px; right: 28px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 10px 15px; border: 1px solid #ffffff70; border-radius: 24px; background: #103541a6; color: #fff; font: 500 13px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; cursor: pointer; }
.hero-motion .hero-motion-toggle[hidden] { display: none; }
.hero-motion .hero-motion-toggle:hover { background: #103541e6; }
.hero-motion .hero-motion-toggle:focus-visible { outline: 3px solid #f2c766; outline-offset: 4px; }
.hero-motion-symbol { width: 14px; font-size: 17px; }
@media (max-width: 650px) { .hero-motion .hero-motion-toggle { right: 16px; bottom: 20px; } }
@media (prefers-reduced-motion: reduce) { .hero-motion .hero-motion-canvas { transition: none; } }