/* Konn3kt — shared animated icon system (glyphs + logo mark)
   Depends on host page defining --lime and (optionally) --sw. */

svg.ico{fill:none;stroke:currentColor;stroke-width:var(--sw,1.6);stroke-linecap:round;stroke-linejoin:round;overflow:visible;display:block;}
svg.ico .fill{fill:currentColor;stroke:none;}
svg.ico .sec{opacity:.40;}
svg.ico *{transform-box:fill-box;transform-origin:center;}

/* motion is paused by default; a wrapping .alwaysfx or .hoverfx:hover enables it */
svg.ico [class*="mv-"]{animation-play-state:paused;}
.alwaysfx [class*="mv-"]{animation-play-state:running;}
.hoverfx:hover [class*="mv-"]{animation-play-state:running;}

.mv-spin,.mv-spinB{transform-box:view-box;transform-origin:12px 12px;}
.mv-tas{transform-box:view-box;transform-origin:18.6px 9px;}
.mv-eq1,.mv-eq2,.mv-eq3,.mv-eq4,.mv-eq5{transform-origin:50% 100%;}

.mv-eq1{animation:kk-eq .92s ease-in-out infinite}
.mv-eq2{animation:kk-eq .74s ease-in-out infinite -.3s}
.mv-eq3{animation:kk-eq 1.08s ease-in-out infinite -.5s}
.mv-eq4{animation:kk-eq .66s ease-in-out infinite -.15s}
.mv-eq5{animation:kk-eq .86s ease-in-out infinite -.6s}
@keyframes kk-eq{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.5)}}

.mv-spin{animation:kk-spin 3.6s linear infinite}
.mv-spinB{animation:kk-spin 2.6s linear infinite}
@keyframes kk-spin{to{transform:rotate(360deg)}}

.mv-rip1{animation:kk-ripple 2.4s ease-out infinite}
.mv-rip2{animation:kk-ripple 2.4s ease-out infinite 1.2s}
@keyframes kk-ripple{0%{transform:scale(.2);opacity:0}18%{opacity:.85}100%{transform:scale(1.04);opacity:0}}

.mv-breath{animation:kk-breath 4s ease-in-out infinite}
@keyframes kk-breath{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
.mv-nd1{animation:kk-node 1.8s ease-in-out infinite}
.mv-nd2{animation:kk-node 1.8s ease-in-out infinite .12s}
.mv-nd3{animation:kk-node 1.8s ease-in-out infinite .24s}
.mv-nd4{animation:kk-node 1.8s ease-in-out infinite .36s}
.mv-nd5{animation:kk-node 1.8s ease-in-out infinite .48s}
.mv-nd6{animation:kk-node 1.8s ease-in-out infinite .60s}
.mv-nd7{animation:kk-node 1.8s ease-in-out infinite .72s}
@keyframes kk-node{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.6);opacity:.5}}

.mv-fd1{animation:kk-fad 2.1s ease-in-out infinite}
.mv-fd2{animation:kk-fad 2.1s ease-in-out infinite -.9s}
.mv-fd3{animation:kk-fad 2.1s ease-in-out infinite -1.5s}
@keyframes kk-fad{0%,100%{transform:translateY(-2.6px)}50%{transform:translateY(2.6px)}}

.mv-key1{animation:kk-keyp 1.4s ease-in-out infinite}
.mv-key2{animation:kk-keyp 1.4s ease-in-out infinite .18s}
.mv-key3{animation:kk-keyp 1.4s ease-in-out infinite .36s}
@keyframes kk-keyp{0%,72%,100%{transform:translateY(0)}82%{transform:translateY(1.5px)}}

.mv-wb1{animation:kk-wb 1.0s ease-in-out infinite}
.mv-wb2{animation:kk-wb .8s  ease-in-out infinite}
.mv-wb3{animation:kk-wb 1.2s ease-in-out infinite}
.mv-wb4{animation:kk-wb .7s  ease-in-out infinite}
.mv-wb5{animation:kk-wb 1.1s ease-in-out infinite}
.mv-wb6{animation:kk-wb .9s  ease-in-out infinite}
.mv-wb7{animation:kk-wb 1.0s ease-in-out infinite}
.mv-wb8{animation:kk-wb .78s ease-in-out infinite}
@keyframes kk-wb{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.45)}}

.mv-rec{animation:kk-rec 1.8s ease-out infinite}
@keyframes kk-rec{0%{transform:scale(.34);opacity:0}30%{opacity:.7}100%{transform:scale(1);opacity:0}}

.mv-pen{animation:kk-pen .95s ease-in-out infinite}
@keyframes kk-pen{0%,100%{transform:translate(0,0)}50%{transform:translate(-.7px,.7px)}}

.mv-rw1{animation:kk-wave 1.8s ease-out infinite}
.mv-rw2{animation:kk-wave 1.8s ease-out infinite}
.mv-rw3{animation:kk-wave 1.8s ease-out infinite .5s}
.mv-rw4{animation:kk-wave 1.8s ease-out infinite .5s}
@keyframes kk-wave{0%,100%{opacity:.18}45%{opacity:1}}
.mv-bcn{animation:kk-bcn 1.8s ease-in-out infinite}
@keyframes kk-bcn{0%,100%{transform:scale(1);opacity:.65}50%{transform:scale(1.45);opacity:1}}

.mv-bd0,.mv-bd3,.mv-bd6{animation:kk-step .9s steps(1,end) infinite}
.mv-bd1,.mv-bd4,.mv-bd7{animation:kk-step .9s steps(1,end) infinite .3s}
.mv-bd2,.mv-bd5,.mv-bd8{animation:kk-step .9s steps(1,end) infinite .6s}
@keyframes kk-step{0%,66%{opacity:.26}67%,100%{opacity:1}}

.mv-tas{animation:kk-swing 2.2s ease-in-out infinite}
@keyframes kk-swing{0%,100%{transform:rotate(0)}25%{transform:rotate(11deg)}75%{transform:rotate(-11deg)}}

.mv-trav{animation:kk-trav 3s linear infinite;offset-rotate:0deg;}
@keyframes kk-trav{to{offset-distance:100%}}

.mv-orbit{animation:kk-orbit 4.5s linear infinite;transform-box:view-box;transform-origin:12px 12px;}
@keyframes kk-orbit{to{transform:rotate(360deg)}}

.mv-bob{animation:kk-bob 2.4s ease-in-out infinite}
@keyframes kk-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(1.4px)}}

@media (prefers-reduced-motion: reduce){
  svg.ico [class*="mv-"]{animation:none!important;}
  .mv-trav{offset-distance:8%;}
  .mv-rip1,.mv-rip2,.mv-rec{opacity:0;}
}

/* -------- logo mark (node-link) + wordmark, "Connect" animation -------- */
.logo-anim{display:inline-flex;align-items:center;gap:11px;color:inherit;text-decoration:none;cursor:pointer;}
.lg-mark{display:block;color:var(--lime);overflow:visible;transform-origin:center;}
.lg-word{font-family:"IBM Plex Sans",sans-serif;font-weight:700;letter-spacing:.02em;display:inline-flex;line-height:1;}
.lg-3{color:var(--lime);}
.lg-link{stroke-dasharray:8;animation:kk-lgDraw 2.6s ease-in-out infinite;}
@keyframes kk-lgDraw{0%{stroke-dashoffset:8}40%,75%{stroke-dashoffset:0}100%{stroke-dashoffset:-8}}
.lg-n1{animation:kk-lgPing 2.6s ease-out infinite;transform-box:fill-box;transform-origin:center;}
.lg-n2{animation:kk-lgPing 2.6s ease-out infinite .35s;transform-box:fill-box;transform-origin:center;}
@keyframes kk-lgPing{0%,55%{transform:scale(1)}68%{transform:scale(1.5)}100%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){
  .lg-link,.lg-n1,.lg-n2{animation:none!important;}
}