/* Keep the illustration's moving layers on the same 600 × 600 coordinate plane. */
.sd-hero-art .sd-art-network { color:var(--ink,#22241f); }
.sd-hero-art .sd-art-field { fill:var(--lemon,#e9ef73); }
.sd-hero-art .sd-art-tissue { fill:var(--paper,#f7f5ef); stroke:var(--ink,#22241f); stroke-width:1.4; }
.sd-hero-art .sd-art-orbit { stroke:var(--electric,#3c4be0); stroke-width:1.3; transform-box:view-box; transform-origin:282px 285px; }
.sd-hero-art .sd-art-orbit-accent { stroke:var(--coral,#f4856f); stroke-width:3.4; stroke-linecap:round; }
.sd-hero-art .sd-art-orbit-outer { animation:sd-hero-orbit-reverse 40s linear infinite; }
.sd-hero-art .sd-art-orbit-inner { animation:sd-hero-orbit 31s linear infinite; }
.sd-hero-art .sd-art-spokes { animation:sd-hero-orbit 54s linear infinite; transform-box:view-box; transform-origin:282px 285px; }
.sd-hero-art .sd-art-link { stroke:var(--electric,#3c4be0); stroke-width:1.35; }
.sd-hero-art .sd-art-node,.sd-hero-art .sd-art-core { fill:var(--electric,#3c4be0); }
.sd-hero-art .sd-art-signal { stroke:var(--lemon,#e9ef73); stroke-width:2.4; stroke-linecap:round; stroke-dasharray:8 192; stroke-dashoffset:8; animation:sd-hero-signal 5.2s linear infinite; animation-delay:var(--sd-signal-delay,0s); }
.sd-hero-art .sd-art-node-ring { stroke:var(--electric,#3c4be0); stroke-width:1; opacity:.3; transform-box:fill-box; transform-origin:center; animation:sd-hero-node-ring 5.2s ease-in-out infinite; }
.sd-hero-art .sd-art-triangle { fill:var(--coral,#f4856f); stroke:var(--ink,#22241f); stroke-width:1; transform-box:fill-box; transform-origin:center; animation:sd-hero-triangle-drift 6.4s ease-in-out infinite; }
.sd-hero-art .sd-art-triangle-two { animation-duration:7s; animation-delay:-2.2s; }
.sd-hero-art .sd-art-triangle-three { animation-duration:5.8s; animation-delay:-4.1s; }
.sd-hero-art .sd-art-triangle-four { animation-duration:6.8s; animation-delay:-1.7s; }
.sd-hero-art .sd-art-satellites { fill:var(--ink,#22241f); transform-box:view-box; transform-origin:282px 285px; animation:sd-hero-satellite-drift 24s ease-in-out infinite; }
.sd-hero-art .sd-art-core-halo { fill:var(--electric,#3c4be0); opacity:.09; transform-box:fill-box; transform-origin:center; animation:sd-hero-core-breathe 4.8s ease-in-out infinite; }
.sd-hero-art .sd-art-tag { animation:sd-hero-tag-float 7s ease-in-out infinite; }
.sd-hero-art .sd-art-badge { animation:sd-hero-badge-float 6s ease-in-out infinite; }
.sd-hero-art :is(.sd-art-animated,.sd-art-tag,.sd-art-badge) { animation-play-state:paused; }
.sd-hero-art[data-motion="running"] :is(.sd-art-animated,.sd-art-tag,.sd-art-badge) { animation-play-state:running; }

.sd-hero-art .sd-art-motion-toggle { position:absolute; right:18px; bottom:18px; z-index:2; display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:30px; padding:6px 10px; border:1px solid #22241f36; border-radius:30px; background:var(--paper,#f7f5ef); color:var(--ink,#22241f); box-shadow:2px 2px 0 #22241f17; font:500 10px/1.4 var(--font-ui,sans-serif); cursor:pointer; transition:background 180ms,box-shadow 180ms; }
.sd-hero-art .sd-art-motion-toggle:hover { background:var(--white,#fff); box-shadow:3px 3px 0 #22241f24; }
.sd-hero-art .sd-art-motion-toggle:focus-visible { outline:2px solid var(--electric,#3c4be0); outline-offset:4px; }
.sd-hero-art .sd-art-motion-toggle:disabled { opacity:.65; cursor:default; box-shadow:none; }
.sd-hero-art .sd-art-toggle-icon { width:13px; height:13px; flex:none; }
.sd-hero-art .sd-art-icon-play { display:none; }
.sd-hero-art[data-motion-user-paused="true"] .sd-art-icon-pause,.sd-hero-art[data-motion-reduced="true"] .sd-art-icon-pause { display:none; }
.sd-hero-art[data-motion-user-paused="true"] .sd-art-icon-play,.sd-hero-art[data-motion-reduced="true"] .sd-art-icon-play { display:block; }

@keyframes sd-hero-orbit { to { transform:rotate(360deg); } }
@keyframes sd-hero-orbit-reverse { to { transform:rotate(-360deg); } }
@keyframes sd-hero-signal { 0% { stroke-dashoffset:8; } 76%,100% { stroke-dashoffset:-108; } }
@keyframes sd-hero-node-ring { 0%,100% { transform:scale(.94); opacity:.1; } 50% { transform:scale(1.12); opacity:.32; } }
@keyframes sd-hero-triangle-drift { 0%,100% { transform:translate(0,0) rotate(-2deg); } 50% { transform:translate(2px,-5px) rotate(4deg); } }
@keyframes sd-hero-satellite-drift { 0%,100% { transform:rotate(-5deg); } 50% { transform:rotate(5deg); } }
@keyframes sd-hero-core-breathe { 0%,100% { transform:scale(.9); opacity:.08; } 50% { transform:scale(1.22); opacity:.15; } }
@keyframes sd-hero-tag-float { 0%,100% { transform:translateY(0) rotate(7deg); } 50% { transform:translateY(-5px) rotate(5deg); } }
@keyframes sd-hero-badge-float { 0%,100% { transform:translateY(0) rotate(-10deg); } 50% { transform:translateY(4px) rotate(-7deg); } }

@media (max-width:480px) {
  .sd-hero-art .sd-art-motion-toggle { right:12px; bottom:12px; min-height:28px; padding:5px 8px; font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
  .sd-hero-art :is(.sd-art-animated,.sd-art-tag,.sd-art-badge) { animation:none!important; }
  .sd-hero-art .sd-art-signal { display:none; }
  .sd-hero-art .sd-art-motion-toggle { transition:none; }
}