/* v49 persona cursors: cogitable.ai's six personas, their colours, arrow, name tags and timings (owner's request,
   2026-10-24): In a hurry darts and taps (12s, snappy), Screen reader jumps between focus targets (4.8s, steps),
   Non-native speaker drifts (26s), Explorer wanders the whole hero (34s), First visit looks around (22s), Low vision
   reads the headline word by word with a large pointer (24s). Paths are fitted to Elevate's hero. Pure CSS paths,
   paused off screen, hidden under reduced motion; three of them on phones. */
.vc,.vcw{--vc-stroke:#fcfcfc;--ink:#fcfcfc}.vc{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none}
.vc[hidden]{display:none}
.vc-layer{position:absolute;inset:0;opacity:0;transform:var(--start);animation:var(--travel);will-change:transform;transition:opacity .5s cubic-bezier(.22,1,.36,1)}
.vc.is-ready .vc-layer{opacity:1}
.vc.is-paused .vc-layer,.vc.is-paused .vc-press{animation-play-state:paused}
.vc-cursor{position:absolute;top:0;left:0;width:0;height:0}
.vc-press{position:absolute;top:0;left:0;transform-origin:2px 2px;animation:var(--press)}
.vc-ptr{display:block;width:20px;height:22px;fill:var(--c);stroke:var(--vc-stroke);stroke-width:1.5px;stroke-linejoin:round;filter:drop-shadow(0 1px 1.5px rgb(0 0 0/.18))}
.vc-tag{position:absolute;top:20px;left:12px;padding:2px 7px;border-radius:2px;background:var(--c);color:var(--ink);font:500 12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;white-space:nowrap}
.vc-large .vc-press{transform-origin:0 0;scale:1.45}
.vc-large .vc-tag{top:30px;left:16px}
/* the screen reader's focus ring, placed on real elements by script */
.vc-focus{position:absolute;top:0;left:0;border:2px solid #6741ca;border-radius:8px;opacity:0;transition:opacity .25s,transform .35s cubic-bezier(.22,1,.36,1),width .35s cubic-bezier(.22,1,.36,1),height .35s cubic-bezier(.22,1,.36,1)}
.vc-focus.on{opacity:1}
.vc-focus span{position:absolute;bottom:calc(100% + 6px);left:-2px;max-width:min(460px,82vw);overflow:hidden;padding:2px 7px;border-radius:2px;background:#6741ca;color:#fcfcfc;font:500 12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;white-space:nowrap;text-overflow:ellipsis}
.vc-focus span i{margin-left:6px;font-style:normal;font-weight:400;opacity:.86}

/* personas (cogitable's colours and timings) */
.vc-hurry{--start:translate(86%,14%);--travel:vc-hurry 12s cubic-bezier(.2,.9,.25,1) infinite;--press:vc-press-hurry 12s linear infinite;--c:#cc361e}
.vc-reader{--start:translate(47%,61%);--travel:vc-reader 4.8s steps(1,end) infinite;--press:vc-press-reader 4.8s linear infinite;--c:#6741ca}
.vc-language{--start:translate(9%,62%);--travel:vc-language 26s ease-in-out infinite;--press:vc-press-language 26s linear infinite;--c:#0064b9}
.vc-explorer{--start:translate(14%,34%);--travel:vc-explorer 34s ease-in-out infinite;--press:vc-press-explorer 34s linear infinite;--c:#007e4b}
.vc-first{--start:translate(22%,16%);--travel:vc-first 22s cubic-bezier(.45,0,.25,1) infinite;--press:vc-press-first 22s linear infinite;--c:#e19b1b;--ink:#211910}
.vc-vision{--start:translate(30%,47%);--travel:vc-vision 24s ease-in-out infinite;--press:vc-press-vision 24s linear infinite;--c:#bd247b}

@keyframes vc-hurry{0%,8%{transform:translate(86%,14%)}14%,22%{transform:translate(57%,79%)}28%{transform:translate(64%,70%)}32%,44%{transform:translate(66%,63%)}52%,62%{transform:translate(78%,52%)}72%{transform:translate(90%,30%)}86%,100%{transform:translate(86%,14%)}}
@keyframes vc-press-hurry{0%,100%{transform:scale(1)}20%{transform:scale(1)}21%{transform:scale(.82)}23%{transform:scale(1)}40%{transform:scale(1)}41%{transform:scale(.82)}43%{transform:scale(1)}}
@keyframes vc-reader{0%{transform:translate(47%,61%)}50%{transform:translate(47.2%,62.4%)}100%{transform:translate(47%,61%)}}
@keyframes vc-press-reader{0%,100%{transform:scale(1)}1%{transform:scale(.82)}3%{transform:scale(1)}}
@keyframes vc-explorer{0%{transform:translate(14%,34%)}10%{transform:translate(30%,31%)}20%{transform:translate(52%,33%)}30%{transform:translate(74%,38%)}38%{transform:translate(86%,50%)}48%{transform:translate(72%,66%)}58%{transform:translate(44%,80%)}66%{transform:translate(26%,72%)}76%{transform:translate(12%,58%)}88%{transform:translate(8%,44%)}100%{transform:translate(14%,34%)}}
@keyframes vc-press-explorer{0%,100%{transform:scale(1)}57%{transform:scale(1)}58%{transform:scale(.82)}60%{transform:scale(1)}}
@keyframes vc-language{0%{transform:translate(9%,62%)}25%{transform:translate(18%,70%)}50%{transform:translate(14%,82%)}75%{transform:translate(5%,74%)}100%{transform:translate(9%,62%)}}
@keyframes vc-press-language{0%,100%{transform:scale(1)}49%{transform:scale(1)}50%{transform:scale(.82)}53%{transform:scale(1)}}
/* Low vision reads the headline in hops with a large pointer, then checks the Ask box */
@keyframes vc-vision{0%,6%{transform:translate(30%,47%)}10%,16%{transform:translate(42%,47%)}20%,26%{transform:translate(54%,47%)}30%,36%{transform:translate(68%,47%)}44%,56%{transform:translate(48%,64%)}68%{transform:translate(70%,24%)}84%{transform:translate(40%,22%)}100%{transform:translate(30%,47%)}}
@keyframes vc-press-vision{0%,100%{transform:scale(1)}49%{transform:scale(1)}50%{transform:scale(.82)}52%{transform:scale(1)}}
@keyframes vc-first{0%{transform:translate(22%,16%)}20%{transform:translate(46%,22%)}40%{transform:translate(36%,40%)}60%{transform:translate(60%,74%)}80%{transform:translate(40%,86%)}100%{transform:translate(22%,16%)}}
@keyframes vc-press-first{0%,100%{transform:scale(1)}59%{transform:scale(1)}60%{transform:scale(.82)}62%{transform:scale(1)}}

/* Our work: cursors driven by script toward real cards (transform transitions, persona easing) */
.vcw{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none}
.vcw .vc-cursor{transition:transform var(--dur,1.6s) var(--ease,cubic-bezier(.45,0,.25,1)),opacity .4s;opacity:0}
.vcw.is-on .vc-cursor{opacity:1}
.vcw .vc-press.tap{animation:vc-tap .32s ease-out}
@keyframes vc-tap{0%,100%{transform:scale(1)}40%{transform:scale(.78)}}
.mo-card.mo-flip .mo-in{transform:rotateY(180deg)}

@media (max-width:760px){
  .vc-language,.vc-first,.vc-reader{display:none}
  .vc-tag{font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  .vc,.vcw{display:none}
}
