/* kv3-ai-flow — source: V3.0/option-3-hive-v2.html (AI flow diagram)
 * Each node highlights in turn: cycle = steps x step time (CSS vars --kv3-n / --kv3-step). */
.kv3-flow{--kv3-n:5;--kv3-step:1.2s;--kv3-cycle:calc(var(--kv3-n) * var(--kv3-step));position:relative;margin:0;display:flex;flex-direction:column;gap:10px;padding:18px 16px 18px;border-radius:22px;color:#fff}
.kv3-flow--dark{background:radial-gradient(circle at 80% 0,rgba(247,161,26,.18),transparent 55%),var(--navy-2);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 24px 40px -20px rgba(0,0,0,.6)}
.kv3-flow--plain{background:transparent;padding-inline:0}
.kv3-flow__head{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.04em;color:#AEB7BF}
.kv3-flow__dot{width:8px;height:8px;border-radius:50%;background:#3BD16F;box-shadow:0 0 0 4px rgba(59,209,111,.18);animation:kv3-pulse 1.8s ease-in-out infinite;flex-shrink:0}
.kv3-flow__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;flex:1;justify-content:space-between;position:relative}
.kv3-flow__list::before{content:"";position:absolute;inset-inline-start:21px;top:22px;bottom:22px;border-inline-start:2px dashed rgba(247,161,26,.55)}
.kv3-flow__node{position:relative;display:flex;align-items:center;gap:12px;padding:6px 0;margin:0}
.kv3-flow__hex{position:relative;z-index:1;isolation:isolate;width:44px;height:50px;flex-shrink:0;display:grid;place-items:center;clip-path:var(--hex);background:var(--orange);color:var(--orange);font-family:var(--f-head);font-weight:800;font-size:14px;animation:kv3-flow-txt var(--kv3-cycle) var(--ease) infinite;animation-delay:calc(var(--i) * var(--kv3-step))}
.kv3-flow__hex::before{content:"";position:absolute;inset:2.5px;clip-path:var(--hex);background:#26323D;z-index:-1;animation:kv3-flow-on var(--kv3-cycle) var(--ease) infinite;animation-delay:inherit}
.kv3-flow__txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.kv3-flow__txt b{font-family:var(--f-head);font-size:15.5px;color:#fff;font-weight:700}
.kv3-flow__txt small{font-size:12.5px;color:#AEB7BF}
.kv3-flow figcaption{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#fff;line-height:1.3;margin-top:4px}
.kv3-flow figcaption::before{content:"";flex-shrink:0;width:12px;height:14px;background:var(--orange);clip-path:var(--hex)}
/* horizontal */
@media (min-width:761px){
  .kv3-flow--h .kv3-flow__list{flex-direction:row;align-items:flex-start;gap:12px}
  .kv3-flow--h .kv3-flow__list::before{inset-inline:calc(50% / var(--kv3-n));top:24px;bottom:auto;border-inline-start:0;border-top:2px dashed rgba(247,161,26,.55)}
  .kv3-flow--h .kv3-flow__node{flex:1 1 0;flex-direction:column;text-align:center;min-width:0}
  .kv3-flow--h .kv3-flow__txt{align-items:center}
}
@keyframes kv3-flow-on{0%,100%{opacity:1}8%,18%{opacity:0}}
@keyframes kv3-flow-txt{0%,100%{color:var(--orange)}8%,18%{color:var(--navy)}}
@media (prefers-reduced-motion:reduce){.kv3-flow__hex,.kv3-flow__hex::before,.kv3-flow__dot{animation:none}}