/* Badri Bot — roaming mascot + chat (restored from previous design) */
.bbot,.bchat{--navy:#17364D;--navy-2:#122B3E;--navy-3:#1E4561;--gold:#22A447;--ink:#0B1424;--white:#FFFFFF;--font:var(--sans,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif)}
.bbot{position:absolute;top:0;left:0;z-index:90;width:96px;transition:top 1.1s cubic-bezier(.65,0,.35,1),left 1.1s cubic-bezier(.65,0,.35,1);pointer-events:none}
.bbot.docked{position:fixed;left:20px!important;top:auto!important;bottom:20px;width:70px}
.bbot-body{pointer-events:auto;cursor:pointer;position:relative;animation:bob 3s ease-in-out infinite;filter:drop-shadow(0 14px 24px rgba(0,0,0,.45))}
.bbot-body img{width:100%;height:auto;user-select:none;-webkit-user-drag:none;transition:transform .4s}
.bbot.moving .bbot-body img{transform:rotate(-12deg) scale(.95)}
.bbot-body:hover img{transform:scale(1.07) rotate(4deg)}
@keyframes bob{50%{transform:translateY(-10px)}}
.bbot.happy .bbot-body{animation:jump .7s cubic-bezier(.3,1.6,.5,1) 2}
@keyframes jump{30%{transform:translateY(-26px) rotate(-8deg) scale(1.08)}60%{transform:translateY(0) rotate(6deg)}}
.bbot-hifi{position:absolute;top:-6px;right:-18px;font-size:2rem;opacity:0;transform:scale(.2) rotate(-30deg);pointer-events:none}
.bbot.happy .bbot-hifi{animation:hifi 1.3s ease forwards}
@keyframes hifi{25%{opacity:1;transform:scale(1.3) rotate(10deg)}45%{transform:scale(1) rotate(-12deg)}75%{opacity:1;transform:scale(1.1) rotate(0)}100%{opacity:0;transform:scale(.6) translateY(-20px)}}
.bbot-spark{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--gold);top:40%;left:50%;opacity:0;pointer-events:none}
.bbot.happy .bbot-spark{animation:spark .9s ease-out forwards}
@keyframes spark{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.3)}}
.bbot-bubble{pointer-events:auto;position:absolute;bottom:calc(100% + 6px);right:40%;width:max-content;max-width:270px;background:var(--white);color:var(--ink);padding:14px 16px;border-radius:18px 18px 4px 18px;font-size:.86rem;line-height:1.45;font-weight:500;box-shadow:0 18px 40px rgba(0,0,0,.35);opacity:0;transform:translateY(10px) scale(.9);transform-origin:bottom right;transition:.35s cubic-bezier(.2,.8,.2,1);visibility:hidden}
.bbot.left-side .bbot-bubble{right:auto;left:40%;border-radius:18px 18px 18px 4px;transform-origin:bottom left}
.bbot.talk .bbot-bubble{opacity:1;transform:none;visibility:visible}
.bbot-bubble b{color:#9a6a12}
.bbot-bubble .bb-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.bbot-bubble .bb-actions a,.bbot-bubble .bb-actions button{font:600 .75rem var(--font);padding:7px 11px;border-radius:100px;background:var(--navy);color:var(--white);border:0;cursor:pointer}
.bbot-bubble .bb-actions a.gold-btn{background:var(--gold);color:var(--navy)}
.bbot-bubble form{display:flex;gap:6px;margin-top:10px}
.bbot-bubble input{flex:1;min-width:0;border:1px solid #d6dbe3;border-radius:100px;padding:8px 12px;font:500 .8rem var(--font);color:var(--ink)}
.bbot-bubble input:focus{outline:none;border-color:var(--gold)}
.bbot-bubble form button{border:0;background:var(--gold);color:var(--navy);border-radius:100px;padding:0 12px;font:700 .8rem var(--font);cursor:pointer}
.bbot-close{position:absolute;top:6px;right:8px;background:none;border:0;color:#8a96aa;font-size:1rem;cursor:pointer;line-height:1}
.bbot-name{display:block;font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9a6a12;margin-bottom:4px}
@media (max-width:640px){.bbot{width:66px}.bbot-bubble{max-width:220px;font-size:.8rem}}
@media (prefers-reduced-motion:reduce){.split-h .w>span,.fx,.fx-scale,.anim-ready .eyebrow{opacity:1!important;transform:none!important}}
.bbot.below .bbot-bubble{bottom:auto;top:calc(100% + 4px);border-radius:4px 18px 18px 18px;transform-origin:top right}
.bbot.below:not(.left-side) .bbot-bubble{border-radius:18px 4px 18px 18px}
.bbot.below .bbot-hifi{top:-6px}
@media (max-width:640px){.bbot{width:56px}}
.bbot-body{touch-action:none}
.bbot.dragging{position:fixed!important;bottom:auto!important;transition:none!important;z-index:120}
.bbot.dragging .bbot-body{cursor:grabbing;animation:none;transform:scale(1.1) rotate(-8deg)}
.bbot.docked .bbot-body{cursor:grab}

/* ===== Bot tricks ===== */
.bbot.tricking .bbot-body{animation:none}
.bbot-fx{position:absolute;left:50%;top:18%;font-size:1.7rem;transform:translate(-50%,0) scale(0);opacity:0;pointer-events:none;z-index:2}
.bbot.tricking .bbot-fx{animation:fxPop 1.6s ease forwards}
@keyframes fxPop{15%{opacity:1;transform:translate(-50%,-70%) scale(1.3)}70%{opacity:1;transform:translate(-50%,-110%) scale(1)}100%{opacity:0;transform:translate(-50%,-150%) scale(.7)}}
.bbot.tr-spin img{animation:trSpin 1s cubic-bezier(.5,0,.3,1)}
@keyframes trSpin{to{transform:rotate(360deg)}}
.bbot.tr-flip img{animation:trFlip 1.1s cubic-bezier(.4,0,.3,1)}
@keyframes trFlip{0%{transform:translateY(0)}40%{transform:translateY(-60px) rotate(-180deg)}80%{transform:translateY(0) rotate(-360deg)}90%{transform:scaleY(.85)}100%{transform:none}}
.bbot.tr-dance img{animation:trDance 1.6s ease-in-out}
@keyframes trDance{0%,100%{transform:none}12%{transform:rotate(-15deg) translateX(-8px)}25%{transform:rotate(15deg) translateX(8px) translateY(-8px)}37%{transform:rotate(-15deg) translateX(-8px)}50%{transform:rotate(15deg) translateX(8px) translateY(-8px)}62%{transform:scaleX(-1)}75%{transform:scaleX(1) translateY(-12px)}87%{transform:rotate(-10deg)}}
.bbot.tr-shades .bbot-fx{top:24%;font-size:2.2rem;animation:shades 1.8s ease forwards}
@keyframes shades{0%{opacity:0;transform:translate(-50%,-120px)}25%{opacity:1;transform:translate(-50%,0)}85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,0)}}
.bbot.tr-shades img{animation:trNod 1.8s ease}
@keyframes trNod{30%,60%{transform:rotate(-6deg) translateY(4px)}45%{transform:rotate(6deg)}}
.bbot.tr-boing img{animation:trBoing 1.1s cubic-bezier(.3,1.8,.5,1)}
@keyframes trBoing{0%{transform:none}20%{transform:scale(1.3,.7) translateY(12px)}45%{transform:scale(.8,1.3) translateY(-50px)}70%{transform:scale(1.1,.9)}100%{transform:none}}
.bbot.tr-love img{animation:trLove 1.5s ease}
@keyframes trLove{25%,75%{transform:scale(1.12) rotate(-4deg)}50%{transform:scale(1.18) rotate(4deg)}}
.bbot.tr-love .bbot-fx{animation:hearts 1.6s ease forwards}
@keyframes hearts{0%{opacity:0;transform:translate(-50%,0) scale(.3)}30%{opacity:1;transform:translate(-50%,-60%) scale(1.4)}60%{transform:translate(-50%,-80%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-160%) scale(1.3)}}
.bbot.tr-dizzy img{animation:trDizzy 1.6s ease}
@keyframes trDizzy{0%,100%{transform:none}20%{transform:rotate(-20deg) translateX(-6px)}40%{transform:rotate(18deg) translateX(6px)}60%{transform:rotate(-12deg)}80%{transform:rotate(8deg)}}
.bbot.tr-dizzy .bbot-fx{top:0;animation:orbit 1.6s linear forwards}
@keyframes orbit{0%{opacity:1;transform:translate(-50%,0) rotate(0) translateX(34px) rotate(0)}100%{opacity:.2;transform:translate(-50%,0) rotate(720deg) translateX(34px) rotate(-720deg)}}
.bbot.tr-sneeze img{animation:trSneeze 1.4s ease}
@keyframes trSneeze{0%{transform:none}35%{transform:rotate(12deg) translateY(-4px) scale(1.04)}50%{transform:rotate(-18deg) translateX(-10px) scale(.95)}60%{transform:rotate(-18deg) translateX(-10px)}100%{transform:none}}
.bbot.tr-sneeze .bbot-fx{animation:sneeze 1.4s ease forwards}
@keyframes sneeze{0%,45%{opacity:0;transform:translate(-50%,0) scale(.3)}55%{opacity:1;transform:translate(-160%,-10%) scale(1.8)}100%{opacity:0;transform:translate(-260%,10%) scale(2.2)}}
.bbot.tr-rocket img{animation:trRocket 1.7s cubic-bezier(.5,0,.5,1)}
@keyframes trRocket{0%{transform:none}15%{transform:translateY(6px) scale(1,.9)}20%,25%{transform:translateX(-2px) translateY(4px)}22%,27%{transform:translateX(2px) translateY(4px)}55%{transform:translateY(-140px) rotate(-8deg);opacity:1}56%{opacity:0}57%{transform:translateY(40px);opacity:0}70%{opacity:1}100%{transform:none}}
.bbot.tr-rocket .bbot-fx{top:85%;animation:flame 1s ease forwards}
@keyframes flame{0%{opacity:0;transform:translate(-50%,0) rotate(135deg) scale(.4)}20%{opacity:1;transform:translate(-50%,0) rotate(135deg) scale(1.2)}100%{opacity:0;transform:translate(-50%,-160px) rotate(135deg) scale(.6)}}
.bbot.tr-shy img{animation:trShy 1.6s ease}
@keyframes trShy{0%,100%{transform:none}30%,70%{transform:scale(.85) rotate(-10deg) translateX(-10px)}}
.bbot.tr-hifi img{animation:jump .7s cubic-bezier(.3,1.6,.5,1) 2}

/* ===== Bot v3: roaming ===== */
.bbot{transition:none!important}
.bbot-flip{transition:transform .35s ease;transform-origin:50% 60%}
.bbot.moving .bbot-body{animation:none}
.bbot.moving .bbot-body img{transform:none}
.bbot.perch .bbot-body{animation:perchBob 2.4s ease-in-out infinite}
@keyframes perchBob{50%{transform:translateY(-4px) scaleY(1.02)}}
.bbot.peek-r .bbot-body,.bbot.peek-l .bbot-body{animation:peek 3s ease-in-out infinite}
@keyframes peek{0%,100%{transform:translateX(0)}50%{transform:translateX(6px) rotate(3deg)}}
.bbot.in-chat{position:fixed!important;z-index:1001}
.bbot-badge{position:absolute;top:4px;right:2px;width:22px;height:22px;border-radius:50%;background:#e5484d;color:#fff;font:800 .72rem/22px var(--font);text-align:center;box-shadow:0 0 0 3px var(--navy);pointer-events:none}
.bbot.nudge .bbot-badge{animation:badgePulse 1.6s ease-in-out infinite}
@keyframes badgePulse{50%{transform:scale(1.25)}}
.bbot.tr-spin .bbot-flip img,.bbot.tr-flip .bbot-flip img{transform-origin:50% 50%}

/* ===== Chat window ===== */
.bchat{position:fixed;right:24px;bottom:96px;z-index:1000;width:360px;max-width:calc(100vw - 32px);height:min(560px,calc(100vh - 170px));background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(0,0,0,.45);display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(30px) scale(.96);transform-origin:bottom right;transition:.35s cubic-bezier(.2,.8,.2,1);font-family:var(--font);color:var(--ink)}
.bchat.open{opacity:1;visibility:visible;transform:none}
.bchat-head{display:flex;align-items:center;gap:12px;padding:16px 18px;background:linear-gradient(120deg,var(--navy),var(--navy-3));color:#fff}
.bchat-head img{width:40px;height:40px;object-fit:contain;background:rgba(255,255,255,.08);border-radius:50%;padding:3px}
.bchat-head b{display:block;font-size:1rem}
.bchat-head small{font-size:.75rem;color:#b9c3d3;display:flex;align-items:center;gap:6px}
.bchat-head small i{width:8px;height:8px;border-radius:50%;background:#3ddc84;display:inline-block}
.bchat-x{margin-left:auto;background:rgba(255,255,255,.1);border:0;color:#fff;width:32px;height:32px;border-radius:50%;font-size:1.3rem;cursor:pointer;line-height:1}
.bchat-x:hover{background:var(--gold);color:var(--navy)}
.bchat-msgs{flex:1;overflow-y:auto;padding:18px 16px 8px;background:#f4f6fa;display:flex;flex-direction:column;gap:10px}
.bm{max-width:85%;padding:11px 14px;border-radius:16px;font-size:.88rem;line-height:1.5;animation:bmIn .3s ease}
@keyframes bmIn{from{opacity:0;transform:translateY(8px)}}
.bm.bot{background:#fff;border:1px solid #e3e8ef;border-bottom-left-radius:4px;align-self:flex-start}
.bm.me{background:var(--navy);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.bm a{color:#9a6a12;font-weight:700}
.bm .bm-wa{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;background:#25D366;color:#fff!important;padding:10px 14px;border-radius:100px;font-weight:700;text-decoration:none}
.bm .bm-wa:hover{background:#1ebe5a}
.bm.typing{display:flex;gap:4px;padding:14px}
.bm.typing span{width:7px;height:7px;border-radius:50%;background:#9aa6b8;animation:dot 1s infinite}
.bm.typing span:nth-child(2){animation-delay:.15s}.bm.typing span:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-4px);opacity:.4}}
.bchat-chips{display:flex;flex-wrap:wrap;gap:7px;padding:8px 14px 10px;background:#f4f6fa;max-height:150px;overflow-y:auto}
.bchat-chips:empty{display:none}
.bchat-chips button{border:1.5px solid var(--gold);background:#fff;color:var(--ink);padding:8px 13px;border-radius:100px;font:600 .8rem var(--font);cursor:pointer;transition:.2s}
.bchat-chips button:hover{background:var(--gold);color:var(--navy)}
.bchat-input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #e3e8ef;background:#fff}
.bchat-input input{flex:1;min-width:0;border:1px solid #d6dbe3;border-radius:100px;padding:11px 16px;font:500 .88rem var(--font);color:var(--ink)}
.bchat-input input:focus{outline:none;border-color:var(--gold)}
.bchat-input button{width:42px;height:42px;border-radius:50%;border:0;background:var(--gold);color:var(--navy);font-size:1rem;cursor:pointer}
.bchat-wa{display:block;text-align:center;font-size:.78rem;font-weight:600;color:#1a8f4a;padding:0 0 12px;background:#fff}
.bchat-wa:hover{text-decoration:underline}
@media (max-width:640px){.bchat{right:8px;left:8px;bottom:84px;width:auto;max-width:none;height:min(540px,calc(100vh - 150px))}}

/* v2: keep Badri Bot always on screen (fixed to the viewport, above all sections) */
.bbot{position:fixed;z-index:9990}
.bchat{z-index:9995}
.bbot.in-chat{z-index:9999}
