/* Asistente flotante SCC — avatar + recorrido guiado (compartido entre páginas) */
.as-fab { position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 68px; height: 68px; border-radius: 50%; border: 3px solid #fff; padding: 0; background: #faf1ec; box-shadow: 0 8px 24px rgba(11,31,78,.28); cursor: pointer; overflow: visible; }
.as-fab img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.as-fab::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid #8CC63F; animation: as-pulse 2.2s ease-out infinite; }
.as-fab .as-dot { position: absolute; right: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #8CC63F; border: 2px solid #fff; }
@keyframes as-pulse { 0% { transform: scale(.9); opacity: .9; } 100% { transform: scale(1.25); opacity: 0; } }

.as-bubble { position: fixed; right: 20px; bottom: 100px; z-index: 92; width: 320px; max-width: calc(100vw - 40px); background: #fff; color: #0f172a; border-radius: 16px; padding: 16px 16px 14px; box-shadow: 0 16px 48px rgba(11,31,78,.28); font-family: 'Jost', 'Segoe UI', Arial, sans-serif; display: none; }
.as-bubble.open { display: block; animation: as-in .22s ease-out; }
.as-bubble::after { content: ""; position: absolute; right: 26px; bottom: -8px; width: 16px; height: 16px; background: #fff; transform: rotate(45deg); }
@keyframes as-in { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
.as-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.as-head img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.as-name { font-weight: 600; font-size: 14px; line-height: 1.2; }
.as-role { font-size: 11.5px; color: #64748b; }
.as-close { margin-left: auto; border: none; background: #eef1f5; color: #64748b; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 13px; }
.as-text { font-size: 14.5px; line-height: 1.5; }
.as-foot { display: flex; align-items: center; gap: 8px; margin-top: 14px; }
.as-step { font-size: 12px; color: #64748b; margin-right: auto; }
.as-btn { border: none; border-radius: 9px; padding: 8px 14px; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.as-btn.pri { background: #0B1F4E; color: #fff; }
.as-btn.sec { background: #eef1f5; color: #334155; }

.as-spot { position: fixed; z-index: 85; border-radius: 14px; box-shadow: 0 0 0 9999px rgba(11,31,78,.55); pointer-events: none; transition: all .3s ease; display: none; outline: 3px solid #8CC63F; outline-offset: 4px; }
.as-spot.on { display: block; }

@media (max-width: 560px) {
  .as-fab { width: 58px; height: 58px; right: 14px; bottom: 14px; }
  .as-bubble { right: 14px; bottom: 84px; width: auto; left: 14px; max-width: none; }
}