.rcg{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;color:#f4f5f7;--blue:#3b7cff;--bg:#0b0c0f;--card:#141821;--card2:#1c1f26;--ink:#f4f5f7;--mute:#9aa0ab;--line:rgba(255,255,255,.1);--green:#2f8f63;--amber:#d99323}
.rcg *{box-sizing:border-box}
.rcg .ab{position:absolute;left:0;top:0;width:800px;height:600px;transform-origin:0 0;transform:scale(var(--s,1))}
.rcg .ab *{font-family:inherit}

.rcg .k{font:500 12px/1 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:#7ea6f8}
.rcg .card{position:absolute;background:var(--card);border-radius:20px;box-shadow:0 20px 50px rgba(0,0,0,.45);box-sizing:border-box}
.rcg .ai{box-shadow:0 0 0 1.5px rgba(59,124,255,.55),0 20px 50px rgba(0,0,0,.45)}
.rcg .av{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:19px;font-weight:700;color:#0b0c0f;flex:none;position:relative}
.rcg .av .ph{position:absolute;right:-4px;bottom:-4px;width:24px;height:24px;border-radius:50%;background:var(--card);display:grid;place-items:center;box-shadow:0 0 0 3px var(--bg)}.av .ph svg{width:13px;height:13px;color:#5fcf8f}
.rcg .orb{border-radius:50%;background:#080808 url(assets/wrapstart-w-mark.png) 52% 50%/58% auto no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.12);position:absolute}
.rcg .orb:before,.rcg .orb:after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(59,124,255,.5);animation:ring 3s ease-out infinite}.orb:after{animation-delay:1.5s}
@keyframes ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.rcg .bub{position:absolute;padding:18px 22px;border-radius:20px;font-size:22px;line-height:1.35;font-weight:500;box-sizing:border-box;text-wrap:pretty}
.rcg .bub.me{background:var(--card2);color:#e6e8ec;border-top-left-radius:6px}
.rcg .bub.bot{background:var(--blue);color:#fff;border-top-right-radius:6px}
.rcg .pill{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:999px;background:var(--card2);color:#e6e8ec;font-size:16px;font-weight:600}
.rcg .chk{width:34px;height:34px;border-radius:50%;background:var(--blue);display:grid;place-items:center;flex:none}.chk svg{width:18px;height:18px;color:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.rcg .wave{display:flex;align-items:center;gap:4px;height:28px}.wave i{width:4px;border-radius:2px;background:#7ea6f8;animation:wv 1.1s ease-in-out infinite}
.rcg .wave i:nth-child(1){animation-delay:0s}.wave i:nth-child(2){animation-delay:.12s}.wave i:nth-child(3){animation-delay:.24s}.wave i:nth-child(4){animation-delay:.08s}.wave i:nth-child(5){animation-delay:.3s}.wave i:nth-child(6){animation-delay:.18s}.wave i:nth-child(7){animation-delay:.05s}.wave i:nth-child(8){animation-delay:.22s}
@keyframes wv{0%,100%{height:6px}50%{height:26px}}
.rcg .dots{display:flex;gap:6px}.dots i{width:9px;height:9px;border-radius:50%;background:#fff;animation:dt 1s ease-in-out infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dt{0%,100%{transform:translateY(0);opacity:.6}50%{transform:translateY(-5px);opacity:1}}
.rcg .spark{position:absolute;width:30px;height:30px;color:#ffcf3d;opacity:0}.spark.b{color:var(--blue)}
/* 1 — during the call */
.rcg .g1 .caller{left:60px;top:64px;width:480px;padding:18px 20px;display:flex;align-items:center;gap:16px}
.rcg .g1 .caller .n{white-space:nowrap;font-size:20px;font-weight:700}.g1 .caller .s{font-size:15px;color:var(--mute);margin-top:4px;font-variant-numeric:tabular-nums}
.rcg .g1 .caller .wave{margin-left:auto}
.rcg .g1 .orb{left:600px;top:62px;width:96px;height:96px}
.rcg .g1 .list{left:60px;top:214px;width:680px;padding:26px 28px 14px}
.rcg .g1 .row{display:flex;align-items:center;gap:18px;height:76px;border-top:1px solid var(--line);opacity:0}.g1 .row:first-of-type{border-top:0}
.rcg .g1 .row .t{font-size:26px;font-weight:600;letter-spacing:-.01em}.g1 .row .pill{margin-left:auto}
.rcg .g1 .r1{animation:g1r 6s ease-out infinite;--a:14%}.g1 .r2{animation:g1r2 6s ease-out infinite}.g1 .r3{animation:g1r3 6s ease-out infinite}
.rcg .g1 .row .chk{animation:g1c 6s ease-out infinite}.g1 .r2 .chk{animation-name:g1c2}.g1 .r3 .chk{animation-name:g1c3}
@keyframes g1r{0%,12%{opacity:0;transform:translateY(10px)}18%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g1r2{0%,30%{opacity:0;transform:translateY(10px)}36%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g1r3{0%,48%{opacity:0;transform:translateY(10px)}54%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g1c{0%,16%{transform:scale(0)}21%{transform:scale(1.25)}25%,100%{transform:scale(1)}}
@keyframes g1c2{0%,34%{transform:scale(0)}39%{transform:scale(1.25)}43%,100%{transform:scale(1)}}
@keyframes g1c3{0%,52%{transform:scale(0)}57%{transform:scale(1.25)}61%,100%{transform:scale(1)}}
/* 2 — answers + new client */
.rcg .g2 .q{left:60px;top:56px;display:flex;gap:16px;align-items:flex-start;animation:g2a 6s ease-out infinite}
.rcg .g2 .q .bub{position:relative;width:420px}
.rcg .g2 .a{left:230px;top:196px;width:420px;animation:g2b 6s ease-out infinite}
.rcg .g2 .typing{position:absolute;left:230px;top:196px;width:110px;height:64px;border-radius:20px;border-top-right-radius:6px;background:var(--blue);display:grid;place-items:center;animation:g2t 6s linear infinite}
.rcg .g2 .orb{left:672px;top:204px;width:72px;height:72px}
.rcg .g2 .ntf{left:60px;top:410px;width:680px;padding:24px 26px;display:flex;align-items:center;gap:22px;animation:g2n 6s cubic-bezier(.2,.8,.2,1) infinite}
.rcg .g2 .app{width:76px;height:76px;border-radius:18px;background:var(--blue);display:grid;place-items:center;flex:none}.g2 .app img{width:48px}
.rcg .g2 .ntf .t{font-size:26px;white-space:nowrap;font-weight:700;letter-spacing:-.02em;line-height:1.2}.g2 .ntf .s{font-size:17px;color:var(--mute);margin-top:6px}.g2 .ntf .now{position:absolute;right:24px;top:20px;font-size:15px;color:var(--mute)}
.rcg .g2 .spark{animation:g2s 6s ease-in-out infinite}
@keyframes g2a{0%,4%{opacity:0;transform:translateY(12px)}10%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g2t{0%,14%{opacity:0}18%,32%{opacity:1}34%,100%{opacity:0}}
@keyframes g2b{0%,32%{opacity:0;transform:translateY(12px)}38%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g2n{0%,54%{opacity:0;transform:translateY(40px) scale(.96)}62%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g2s{0%,60%{opacity:0;transform:scale(.3)}68%{opacity:1;transform:scale(1.15) rotate(20deg)}82%{opacity:1;transform:scale(.95) rotate(30deg)}92%,100%{opacity:0;transform:scale(.4)}}
/* 3 — follow-up task */
.rcg .g3 .cal{left:300px;top:50px;width:560px;height:520px;padding:26px 26px;background:#12151c}
.rcg .g3 .days{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;font-size:18px;font-weight:700;color:var(--mute);text-align:center;margin-bottom:16px}
.rcg .g3 .grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,76px);gap:14px}
.rcg .g3 .blk{border-radius:10px;background:#1f2430;padding:12px;box-sizing:border-box}.g3 .blk i{display:block;height:8px;border-radius:4px;background:#2c3342;margin-bottom:8px;width:70%}.g3 .blk i+i{width:45%}
.rcg .g3 .slot{border:2px dashed rgba(59,124,255,.7);border-radius:10px;background:rgba(59,124,255,.08);animation:g3sl 6s linear infinite}
.rcg .g3 .drop{border-radius:10px;background:var(--blue);color:#fff;font-size:14px;font-weight:700;padding:10px 12px;box-sizing:border-box;line-height:1.3;opacity:0;animation:g3d 6s cubic-bezier(.2,.8,.2,1) infinite;box-shadow:0 12px 26px rgba(59,124,255,.45)}.g3 .drop small{display:block;font-weight:500;opacity:.85}
.rcg .g3 .task{left:50px;top:84px;width:350px;padding:26px 26px 24px}
.rcg .g3 .task h3{margin:0;font-size:24px;font-weight:700;letter-spacing:-.01em}
.rcg .g3 .done{display:flex;align-items:center;gap:12px;margin-top:18px;font-size:18px;color:#d7dae0}
.rcg .g3 .box{width:28px;height:28px;border-radius:7px;border:2px solid #4a5160;display:grid;place-items:center;box-sizing:border-box;animation:g3b 6s linear infinite}.g3 .box svg{width:16px;height:16px;color:#fff}.g3 .box svg use{stroke-dasharray:24;stroke-dashoffset:24;animation:g3tick 6s ease-out infinite}
.rcg .g3 .lbl{font-size:16px;font-weight:700;margin-top:20px}.g3 .sum{font-size:17px;line-height:1.4;color:#b8bcc4;margin-top:6px;text-wrap:pretty}
.rcg .g3 .who{display:inline-flex;margin-top:8px;height:34px;align-items:center;padding:0 14px;border-radius:999px;background:var(--card2);font-size:15px;color:#d7dae0}
.rcg .g3 .listen{margin-top:22px;height:52px;border-radius:14px;border:1.5px solid rgba(59,124,255,.7);display:flex;align-items:center;justify-content:center;gap:14px;font-size:17px;font-weight:700;color:#cfe0ff}
.rcg .g3 .listen .play{width:0;height:0;border-left:12px solid #7ea6f8;border-top:8px solid transparent;border-bottom:8px solid transparent}
@keyframes g3b{0%,20%{background:transparent;border-color:#4a5160}24%,100%{background:var(--blue);border-color:var(--blue)}}
@keyframes g3tick{0%,22%{stroke-dashoffset:24}30%,100%{stroke-dashoffset:0}}
@keyframes g3sl{0%,34%{opacity:1}40%,100%{opacity:0}}
@keyframes g3d{0%,34%{opacity:0;transform:translate(-160px,-40px) scale(.8)}40%{opacity:1}54%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
/* 4 — transfer */
.rcg .g4 .q{left:50px;top:52px;display:flex;gap:16px;align-items:flex-start}
.rcg .g4 .q .bub{position:relative;width:390px}.g4 .q b{font-weight:800}
.rcg .g4 svg.flow{position:absolute;left:0;top:0;width:800px;height:600px;overflow:visible}
.rcg .g4 .flow path{fill:none;stroke:#3b7cff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:520;stroke-dashoffset:520;animation:g4l 6s ease-in-out infinite}
.rcg .g4 .tp{position:absolute;left:92px;top:262px;height:66px;padding:0 34px;border-radius:999px;background:var(--blue);color:#fff;font-size:24px;font-weight:700;display:flex;align-items:center;gap:12px;opacity:0;animation:g4p 6s ease-out infinite}.g4 .tp svg{width:22px;height:22px;color:#fff}
.rcg .g4 .dev{position:absolute;left:470px;top:100px;width:270px;height:560px;border-radius:44px;background:#050608;box-shadow:0 0 0 8px #1a1c22,0 0 0 10px #2e313a,0 30px 70px rgba(0,0,0,.6);animation:g4sh 6s linear infinite}
.rcg .g4 .scr{position:absolute;inset:0;border-radius:44px;background:linear-gradient(180deg,#0f1a2e,#0b1220);overflow:hidden}
.rcg .g4 .isl{position:absolute;left:50%;top:14px;width:96px;height:28px;border-radius:16px;background:#000;transform:translateX(-50%)}
.rcg .g4 .date{position:absolute;left:0;right:0;top:78px;text-align:center;font-size:17px;color:#cfd6e4;font-weight:500}
.rcg .g4 .time{position:absolute;left:0;right:0;top:102px;text-align:center;font-size:84px;font-weight:600;letter-spacing:-.03em;color:#e8edf6;font-variant-numeric:tabular-nums}
.rcg .g4 .ntf{left:360px;top:372px;width:410px;padding:18px 20px;display:flex;gap:16px;align-items:center;opacity:0;animation:g4n 6s cubic-bezier(.2,.8,.2,1) infinite}
.rcg .g4 .ic{width:58px;height:58px;border-radius:14px;background:var(--green);display:grid;place-items:center;flex:none}.g4 .ic svg{width:30px;height:30px;color:#fff}
.rcg .g4 .ntf .t{font-size:19px;font-weight:700}.g4 .ntf .s{font-size:16px;color:#b8bcc4;margin-top:3px}.g4 .ntf .now{position:absolute;right:18px;top:14px;font-size:13px;color:var(--mute)}
@keyframes g4l{0%,14%{stroke-dashoffset:520}50%,92%{stroke-dashoffset:0}98%,100%{stroke-dashoffset:520}}
@keyframes g4p{0%,22%{opacity:0;transform:scale(.7)}28%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g4n{0%,48%{opacity:0;transform:translateX(40px)}56%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g4sh{0%,56%,72%,100%{transform:none}58%,62%,66%,70%{transform:rotate(-1.2deg)}60%,64%,68%{transform:rotate(1.2deg)}}
/* 5 — after hours */
.rcg .g5 .clock{left:60px;top:60px;width:310px;padding:26px}
.rcg .g5 .clock .big{white-space:nowrap;font-size:48px;font-weight:700;letter-spacing:-.03em;margin-top:14px;font-variant-numeric:tabular-nums}
.rcg .g5 .clock .sub{font-size:17px;color:var(--mute);margin-top:6px}
.rcg .g5 .moon{position:absolute;right:20px;top:16px;width:30px;height:30px;width:40px;height:40px;border-radius:50%;box-shadow:-10px 6px 0 0 #ffcf3d;transform:rotate(-20deg)}
.rcg .g5 .closed{left:60px;top:282px;width:310px;padding:20px 26px;display:flex;align-items:center;gap:14px;font-size:20px;font-weight:700}
.rcg .g5 .closed i{width:12px;height:12px;border-radius:50%;background:#c0392f;box-shadow:0 0 0 5px rgba(192,57,47,.25)}
.rcg .g5 .log{left:396px;top:60px;width:350px;padding:22px 24px 8px}
.rcg .g5 .lr{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);opacity:0}.g5 .lr:first-of-type{border-top:0}
.rcg .g5 .lr .ic{width:40px;height:40px;border-radius:50%;background:rgba(47,143,99,.2);display:grid;place-items:center;flex:none}.g5 .lr .ic svg{width:18px;height:18px;color:#5fcf8f}
.rcg .g5 .lr .n{white-space:nowrap;font-size:18px;font-weight:700}.g5 .lr .s{white-space:nowrap;font-size:14px;color:#b8bcc4;margin-top:3px}.g5 .lr .tm{white-space:nowrap;margin-left:auto;font-size:14px;color:var(--mute);font-variant-numeric:tabular-nums;align-self:flex-start;padding-top:3px}
.rcg .g5 .l1{animation:g5a 6s ease-out infinite}.g5 .l2{animation:g5b 6s ease-out infinite}.g5 .l3{animation:g5c 6s ease-out infinite}.g5 .l4{animation:g5d 6s ease-out infinite}
.rcg .g5 .zero{left:60px;top:470px;width:680px;padding:24px 28px;display:flex;align-items:center;justify-content:space-between;opacity:0;animation:g5z 6s ease-out infinite}
.rcg .g5 .zero .t{font-size:26px;font-weight:700;letter-spacing:-.01em}.g5 .zero .t span{color:#5fcf8f}
@keyframes g5a{0%,8%{opacity:0;transform:translateX(20px)}14%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g5b{0%,22%{opacity:0;transform:translateX(20px)}28%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g5c{0%,36%{opacity:0;transform:translateX(20px)}42%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g5d{0%,50%{opacity:0;transform:translateX(20px)}56%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g5z{0%,62%{opacity:0;transform:translateY(16px)}70%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
/* 6 — trained on your shop */
.rcg .g6 .kn{left:56px;width:330px;padding:16px 20px;opacity:0}
.rcg .g6 .kn .v{font-size:18px;font-weight:600;margin-top:8px;line-height:1.3}
.rcg .g6 .n1{top:56px;animation:g6a 6s ease-out infinite}.g6 .n2{top:176px;animation:g6b 6s ease-out infinite}.g6 .n3{top:296px;animation:g6c 6s ease-out infinite}.g6 .n4{top:416px;animation:g6d 6s ease-out infinite}
.rcg .g6 svg.flow{position:absolute;inset:0;width:800px;height:600px}
.rcg .g6 .flow path{fill:none;stroke:rgba(59,124,255,.6);stroke-width:2.5;stroke-dasharray:6 10;animation:g6f 1.2s linear infinite}
.rcg .g6 .orb{left:520px;top:210px;width:140px;height:140px}
.rcg .g6 .greet{left:430px;top:400px;width:330px;font-size:19px;opacity:0;animation:g6g 6s ease-out infinite}
@keyframes g6f{to{stroke-dashoffset:-32}}
@keyframes g6a{0%,4%{opacity:0;transform:translateX(-16px)}10%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g6b{0%,14%{opacity:0;transform:translateX(-16px)}20%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g6c{0%,24%{opacity:0;transform:translateX(-16px)}30%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g6d{0%,34%{opacity:0;transform:translateX(-16px)}40%,92%{opacity:1;transform:none}98%,100%{opacity:0}}
@keyframes g6g{0%,54%{opacity:0;transform:translateY(14px)}62%,92%{opacity:1;transform:none}98%,100%{opacity:0}}


.feat-row .fr-media.fr-rcg{padding:0;display:block;position:relative;min-width:0}
.feat-row .fr-media.fr-rcg .rcg{position:absolute;inset:0;width:auto;height:auto;aspect-ratio:auto}
@media (max-width:900px){.feat-row .fr-media.fr-rcg{padding:0;aspect-ratio:4/3}}
@media (prefers-reduced-motion:reduce){.rcg *{animation:none!important}.rcg .g1 .row,.rcg .g2 .ntf,.rcg .g2 .a,.rcg .g3 .drop,.rcg .g4 .tp,.rcg .g4 .ntf,.rcg .g5 .lr,.rcg .g5 .zero,.rcg .g6 .kn,.rcg .g6 .greet{opacity:1}.rcg .g4 .flow path{stroke-dashoffset:0}}