/* The brand artwork remains the no-WebGL fallback. Its outer ring textures
   and light accents move while the atom and company lettering stay intact. */
.hero{isolation:isolate}
.hero-art{animation:none;transition:opacity .6s ease}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;opacity:0;transition:opacity .6s ease;z-index:0}
.hero.has-motion .hero-canvas{opacity:.92}
.hero.has-motion .hero-art{opacity:0}
.hero-shade,.hero-grid{z-index:1;pointer-events:none}
.hero-content,.hero-bottom{z-index:2}
.hero-bottom-actions{display:flex;align-items:center;gap:25px}
.hero-motion-toggle{color:#b8afa1;border:1px solid #d5b2713d;background:#080a0c75;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:8px 12px;font-size:.875rem;line-height:1.3;min-height:38px;backdrop-filter:blur(5px);transition:border-color .2s,color .2s}
.hero-motion-toggle[hidden]{display:none}
.hero-motion-toggle:hover{color:var(--gold-bright);border-color:#d5b27190}
.motion-symbol{display:block;position:relative;width:12px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.hero-motion-toggle[aria-pressed=true] .motion-symbol{border:0}
.hero-motion-toggle[aria-pressed=true] .motion-symbol:after{content:'';position:absolute;left:2px;top:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
@media(max-width:960px){.hero.has-motion .hero-canvas{opacity:.8}}
@media(max-width:760px){.hero-bottom-actions{gap:13px}.hero-motion-toggle{font-size:.875rem;padding:8px 10px}.hero-bottom>a{gap:10px}}
@media(max-width:500px){.hero-bottom{align-items:flex-end;gap:15px}.hero-bottom-actions{flex-direction:column;align-items:flex-end;gap:7px}.hero-bottom-actions>a{gap:10px}.hero-motion-toggle{min-height:36px}.hero-bottom .mono{max-width:145px}}
@media(prefers-reduced-motion:reduce){.hero-canvas,.hero-art{transition:none}}