
.ab-mascot{position:fixed;right:22px;bottom:18px;z-index:80;font-family:Segoe UI,Arial,sans-serif}.ab-character{border:0;background:none;padding:0;width:130px;height:174px;cursor:pointer;position:relative;display:block;transform-origin:bottom center}.ab-character img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 7px #0005)}.ab-character:hover{transform:translateY(-4px)}.ab-character:focus-visible{outline:3px solid #1683ff;border-radius:20px}.ab-character.busy{animation:ab-greet 1s ease-in-out infinite}.ab-bubble{position:absolute;bottom:185px;right:0;width:230px;padding:14px 32px 14px 16px;background:#fff;border:1px solid #c7dffa;border-radius:16px;box-shadow:0 8px 30px #08244325;font-size:13px;color:#173350;line-height:1.5}.ab-bubble:after{content:'';position:absolute;bottom:-8px;right:48px;width:14px;height:14px;background:white;border-right:1px solid #c7dffa;border-bottom:1px solid #c7dffa;transform:rotate(45deg)}.ab-dismiss{position:absolute;right:7px;top:5px;border:0;background:none;font-size:20px;color:#597087;cursor:pointer}.ab-item{position:absolute;left:48px;top:82px;width:36px;height:36px;color:#087cff;opacity:0;transform:translateY(20px) scale(.3);filter:drop-shadow(0 1px 2px #0009);pointer-events:none}.ab-item svg{width:36px;height:36px;fill:#eaf5ff;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.ab-item.show{animation:ab-take 2.3s ease-in-out both}.ab-chat{position:absolute;right:0;bottom:190px;width:330px;max-height:min(520px,70dvh);overflow:auto;background:white;border:1px solid #b5d8ff;border-radius:18px;box-shadow:0 14px 45px #0004;color:#19324d}.ab-chat[hidden],.ab-bubble[hidden]{display:none}.ab-chat-head{position:sticky;top:0;background:#081522;color:white;padding:15px;display:flex;align-items:center;justify-content:space-between}.ab-chat-head button{background:transparent;color:white;border:0;font-size:22px;cursor:pointer}.ab-chat-body{padding:18px;font-size:14px}.ab-choices{display:grid;gap:8px}.ab-choices button,.ab-chat a.ab-send{padding:11px;border:1px solid #c7dffa;border-radius:9px;background:#f1f7ff;color:#123f70;text-align:left;font:inherit;cursor:pointer;text-decoration:none}.ab-chat textarea{box-sizing:border-box;width:100%;min-height:95px;padding:10px;border:1px solid #a7c9ef;border-radius:9px;font:inherit;margin:10px 0}.ab-chat a.ab-send{display:block;background:#087cff;color:white;text-align:center}.ab-demo-note{font-size:11px;color:#60738b;margin-top:14px}.ab-replay{position:fixed;bottom:10px;left:10px;z-index:70;padding:8px 12px;background:#fff;border:1px solid #a8caf2;border-radius:8px;font:12px Segoe UI;color:#17416b;cursor:pointer}
@keyframes ab-greet{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}@keyframes ab-take{0%{opacity:0;transform:translateY(20px) scale(.3)}20%{opacity:1;transform:translate(-18px,-47px) scale(1.15) rotate(-8deg)}65%{opacity:1;transform:translate(-18px,-47px) scale(1.15) rotate(5deg)}100%{opacity:0;transform:translateY(20px) scale(.3)}}
@media(max-width:600px){.ab-mascot{right:9px;bottom:10px}.ab-character{width:82px;height:112px}.ab-bubble{bottom:122px;width:200px;font-size:12px}.ab-chat{bottom:122px;width:min(330px,calc(100vw - 22px))}.ab-item{left:24px;top:48px}.ab-item svg{width:28px;height:28px}.ab-replay{font-size:10px}}
@media(prefers-reduced-motion:reduce){.ab-character.busy,.ab-item.show{animation:none}.ab-item.show{opacity:1;transform:translateY(-30px)}}

/* Secuencia articulada: mano al bolsillo, extracción, muestra y devolución. */
.ab-character{background:url('mascota-manos.webp') 0 0/400% 200% no-repeat}
.ab-character>img{visibility:hidden}
.ab-character.busy{animation:none}
.ab-item{left:18%;top:32%;width:28%;height:25%;z-index:2}
.ab-item svg{width:100%;height:100%}
@keyframes ab-take{0%,23%{opacity:0;transform:translate(25px,30px) scale(.4)}32%,65%{opacity:1;transform:translate(-5px,-10px) scale(1) rotate(-5deg)}80%{opacity:1;transform:translate(18px,20px) scale(.65)}85%,100%{opacity:0;transform:translate(25px,30px) scale(.3)}}
@media(max-width:600px){.ab-item{left:18%;top:32%;width:28%;height:25%}.ab-item svg{width:100%;height:100%}}

/* El objeto conserva su tamaño y queda oculto por la boca del bolsillo. */
.ab-item.show{animation:ab-pocket-object 2.3s linear both;transform-origin:50% 90%}
@keyframes ab-pocket-object{
 0%,20%{left:39%;top:49%;opacity:0;transform:rotate(0deg);clip-path:inset(0 0 100% 0)}
 25%{left:37%;top:45%;opacity:1;transform:rotate(-3deg);clip-path:inset(0 0 65% 0)}
 34%{left:18%;top:27%;opacity:1;transform:rotate(-7deg);clip-path:inset(0 0 0 0)}
 63%{left:18%;top:27%;opacity:1;transform:rotate(-7deg);clip-path:inset(0 0 0 0)}
 71%{left:25%;top:34%;opacity:1;transform:rotate(-4deg);clip-path:inset(0 0 0 0)}
 80%{left:36%;top:44%;opacity:1;transform:rotate(-1deg);clip-path:inset(0 0 0 0)}
 85%{left:39%;top:47%;opacity:1;transform:rotate(0deg);clip-path:inset(0 0 35% 0)}
 91%{left:40%;top:50%;opacity:1;transform:rotate(0deg);clip-path:inset(0 0 80% 0)}
 96%,100%{left:40%;top:51%;opacity:1;transform:rotate(0deg);clip-path:inset(0 0 100% 0)}
}
@media(prefers-reduced-motion:reduce){.ab-item.show{animation:none;left:18%;top:27%;clip-path:none}}

/* Prueba A: objetos 3D realistas. */
.ab-item{background-image:url("objetos-estilo-a.webp");background-size:400% 300%;background-repeat:no-repeat;filter:drop-shadow(0 2px 2px #0007)}

/* Présentation lisible : agrandissement magique identique pour chaque objet. */
.ab-item{width:96px;height:96px;background:none!important;filter:none;transform-origin:center;overflow:visible}
.ab-prop{display:block;width:100%;height:100%;position:relative;z-index:1;background-image:url('objetos-estilo-a.webp');background-size:400% 300%;background-repeat:no-repeat;filter:drop-shadow(0 3px 2px #10253f45)}
.ab-item:before{content:'';position:absolute;inset:-8px;background:linear-gradient(145deg,#fff,#e6f2ff);border:2px solid #429cff;border-radius:18px;box-shadow:0 5px 20px #163d6b2b;animation:ab-prop-panel 4.2s linear both}
.ab-item.show{animation:ab-magic-readable 4.2s ease-in-out both;clip-path:none}
@keyframes ab-magic-readable{
 0%,10%{left:30%;top:39%;opacity:0;transform:scale(.12);clip-path:inset(0 0 100%)}
 16%{left:24%;top:27%;opacity:1;transform:scale(.3);clip-path:inset(0)}
 27%,70%{left:-108px;top:12px;opacity:1;transform:scale(1);clip-path:inset(-30px)}
 80%{left:4%;top:20%;opacity:1;transform:scale(.45);clip-path:inset(0)}
 88%{left:29%;top:38%;opacity:1;transform:scale(.22);clip-path:inset(0 0 30%)}
 96%,100%{left:30%;top:43%;opacity:0;transform:scale(.15);clip-path:inset(0 0 100%)}
}
@keyframes ab-prop-panel{0%,18%,82%,100%{opacity:0}27%,70%{opacity:1}}
@media(max-width:600px){.ab-item{width:90px;height:90px}.ab-bubble{bottom:132px}}
@media(prefers-reduced-motion:reduce){.ab-item.show{animation:none;left:-108px;top:12px;opacity:1;transform:none;clip-path:none}.ab-item:before{animation:none}}

/* Ancla física: centro de la abertura del bolsillo, no base del objeto. */
.ab-item.show{transform-origin:50% 50%;animation-name:ab-pocket-anchored}
@keyframes ab-pocket-anchored{
 0%,10%{left:50%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
 16%{left:46%;top:45%;opacity:1;transform:translate(-50%,-50%) scale(.26);clip-path:inset(0 0 45%)}
 23%{left:22%;top:32%;opacity:1;transform:translate(-50%,-50%) scale(.45);clip-path:inset(0)}
 30%,68%{left:-108px;top:12px;opacity:1;transform:translate(0,0) scale(1);clip-path:inset(-30px)}
 77%{left:22%;top:32%;opacity:1;transform:translate(-50%,-50%) scale(.45);clip-path:inset(0)}
 84%{left:46%;top:45%;opacity:1;transform:translate(-50%,-50%) scale(.26);clip-path:inset(0)}
 90%{left:50%;top:51%;opacity:1;transform:translate(-50%,-50%) scale(.2);clip-path:inset(0 0 65%)}
 96%,100%{left:50%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
}

/* Presentación apoyada en la palma extendida, conservando escala y estilo. */
.ab-character{background-image:url('mascota-brazo-extendido.webp')}
.ab-item.show{animation-name:ab-handheld}
@keyframes ab-handheld{
 0%,10%{left:65%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
 16%{left:59%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0 0 45%)}
 23%{left:34%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
 30%,68%{left:12%;top:44%;opacity:1;transform:translate(-50%,-91%) scale(1);clip-path:inset(-30px)}
 77%{left:34%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
 84%{left:59%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0)}
 90%{left:65%;top:51%;opacity:1;transform:translate(-50%,-50%) scale(.2);clip-path:inset(0 0 65%)}
 96%,100%{left:65%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
}

/* Fotogramas aislados y alineados: sin desplazamientos ni restos vecinos. */
.ab-character{background-image:url('robot-pose-0.webp');background-size:100% 100%;background-position:center}
.ab-character:hover{transform:none}
.ab-prop{background-size:contain;background-position:center;background-repeat:no-repeat}
.ab-item.show{animation-name:ab-handheld-fixed}
@keyframes ab-handheld-fixed{
 0%,10%{left:57%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
 16%{left:51%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0 0 45%)}
 23%{left:29%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
 30%,68%{left:7%;top:44%;opacity:1;transform:translate(-50%,-91%) scale(1);clip-path:inset(-30px)}
 77%{left:29%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
 84%{left:51%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0)}
 90%{left:57%;top:51%;opacity:1;transform:translate(-50%,-50%) scale(.2);clip-path:inset(0 0 65%)}
 96%,100%{left:57%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
}

/* Chaque pose contient le personnage entier, au même point d'ancrage. */
.ab-character{width:177px;height:174px;background-size:100% 100%;overflow:visible}
.ab-item.show{animation-name:ab-handheld-complete}
@media(max-width:600px){.ab-character{width:114px;height:112px}}
@keyframes ab-handheld-complete{
0%,10%{left:61%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
16%{left:55%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0 0 45%)}
23%{left:40%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
30%,68%{left:28%;top:44%;opacity:1;transform:translate(-50%,-91%) scale(1);clip-path:inset(-30px)}
77%{left:40%;top:43%;opacity:1;transform:translate(-50%,-88%) scale(.55);clip-path:inset(0)}
84%{left:55%;top:48%;opacity:1;transform:translate(-50%,-75%) scale(.26);clip-path:inset(0)}
90%{left:61%;top:51%;opacity:1;transform:translate(-50%,-50%) scale(.2);clip-path:inset(0 0 65%)}
96%,100%{left:61%;top:53%;opacity:0;transform:translate(-50%,-50%) scale(.12);clip-path:inset(0 0 100%)}
}

/* Saludo: torso inmóvil, solo el brazo separado oscila. */
.ab-character.waving-arm{background-image:none!important;transform:none!important}
.ab-character.waving-arm:before,.ab-character.waving-arm:after{content:'';position:absolute;inset:0;background:url('robot-saludo.webp?v=arm6') center/100% 100% no-repeat;pointer-events:none}
.ab-character.waving-arm:before{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,19% 29%,43% 29%,43% 56%,19% 56%,19% 29%)}
.ab-character.waving-arm:after{clip-path:polygon(19% 29%,43% 29%,43% 56%,19% 56%);transform-origin:40% 51%;animation:ab-hand-wave .42s ease-in-out infinite alternate}
@keyframes ab-hand-wave{from{transform:rotate(-9deg)}to{transform:rotate(10deg)}}
@media(prefers-reduced-motion:reduce){.ab-character.waving-arm:after{animation:none}}

.ab-mascot.ab-paused,.ab-mascot.ab-paused *,.ab-mascot.ab-paused *:before,.ab-mascot.ab-paused *:after{animation-play-state:paused!important}

/* Saludo corregido: máscara de la mano, sin recortar hombro ni torso. */
.ab-character.waving-arm:before{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,31.15% 27.34%,40.38% 27.34%,44.62% 31.25%,44.23% 35.16%,41.35% 40.04%,40.38% 43.36%,34.04% 44.92%,31.54% 41.41%,30.38% 34.77%,31.15% 27.34%)}
.ab-character.waving-arm:after{clip-path:polygon(31.15% 27.34%,40.38% 27.34%,44.62% 31.25%,44.23% 35.16%,41.35% 40.04%,40.38% 43.36%,34.04% 44.92%,31.54% 41.41%,30.38% 34.77%,31.15% 27.34%);transform-origin:36.54% 43.95%;animation:ab-hand-wave .42s ease-in-out infinite alternate}
@keyframes ab-hand-wave{from{transform:rotate(-8deg)}to{transform:rotate(9deg)}}

.ab-character.waving-arm:after{animation:ab-hand-wave .7s ease-in-out 4 normal both}
@keyframes ab-hand-wave{0%,100%{transform:rotate(0deg)}25%{transform:rotate(-8deg)}75%{transform:rotate(9deg)}}

/* Placa de nombre: vista previa, sin cambiar la animación. */
.ab-nameplate{position:absolute;left:61.5%;top:100%;transform:translate(-50%,-2px);display:block;background:#081522;color:#fff;border:1px solid #429cff;border-radius:7px;padding:2px 11px;font:700 12px/18px Segoe UI,Arial,sans-serif;letter-spacing:.4px;white-space:nowrap;box-shadow:0 2px 7px #0003;pointer-events:none;z-index:5}
.ab-mascot{bottom:30px}
@media(max-width:600px){.ab-mascot{bottom:26px}.ab-nameplate{font-size:11px;line-height:17px;padding:2px 10px}}

.ab-nameplate .ab-name-blue{color:#008fff}

/* Proporción de podio en escritorio; móvil conserva su placa aprobada. */
@media(min-width:601px){.ab-nameplate{min-width:96px;box-sizing:border-box;text-align:center;font-size:16px;line-height:24px;padding:3px 12px;border-radius:8px;border-width:1.5px;transform:translate(-50%,-3px)}.ab-mascot{bottom:39px}}

.abtron-contact{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:38px;padding:28px 30px;background:#fff;border:1px solid #cbdff5;border-radius:16px;box-shadow:0 6px 24px #173d6808}
.abtron-contact h3{margin:0 0 9px;color:#142c4f;font-size:23px;line-height:1.3}
.abtron-contact p{margin:0;max-width:730px;color:#586a80;font-size:15px;line-height:1.75}
.abtron-contact button{border:0;cursor:pointer;flex-shrink:0;font-family:inherit}
@media(max-width:700px){.abtron-contact{align-items:flex-start;flex-direction:column;padding:24px;gap:20px}.abtron-contact h3{font-size:21px}}
.abtron-contact{flex-direction:column;align-items:flex-start;gap:18px}.abtron-contact button{position:relative;z-index:1}

/* Poses persistantes: aucun fond vide pendant le changement d'image. */
.ab-character{background-image:none!important}
.ab-pose-layer{position:absolute;inset:0;display:block;pointer-events:none}
.ab-pose-layer .ab-pose{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;object-fit:fill;visibility:visible;filter:none;transition:none;pointer-events:none}
.ab-character.waving-arm .ab-pose-layer{visibility:hidden}
.ab-character.waving-arm:before,.ab-character.waving-arm:after{background-image:url('robot-saludo.webp?v=saludo4')}

/* El saludo y las poses de objetos son capas mutuamente excluyentes. */
.ab-character.waving-arm .ab-pose-layer{display:none!important}
