.compo-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: .65rem;
    background: #FFFFFF;
    color: #262D40;
    border: 1px solid rgba(238, 241, 245, .9);
    border-radius: 14px;
    padding: .75rem .95rem;
    box-shadow: 0 18px 40px -14px rgba(8, 11, 20, .45);
    text-align: left;
    z-index: 2;
    animation: sat-flotar 5s ease-in-out infinite alternate;
    transition: transform .25s ease, box-shadow .25s ease;
}

.compo-card:hover {
    animation: none;
    transform: translateY(-10px) scale(1.05);
    box-shadow: 0 30px 56px -16px rgba(8, 11, 20, .55);
    z-index: 4;
}

.sat-icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    flex-shrink: 0;
}
.sat-icono .icono { width: 17px; height: 17px; }
.fondo-verde { background: #E3F3EC; color: #3D9B76; }
.fondo-azul { background: #E1ECF7; color: #4A79B0; }
.fondo-ambar { background: #F9EDD0; color: #B98728; }
.fondo-coral { background: #FFE7E3; color: #E85555; }

.sat-info { display: flex; flex-direction: column; line-height: 1.3; }
.sat-info strong { font-size: .8rem; font-weight: 700; white-space: nowrap; }
.sat-info span { font-size: .7rem; color: #8A94A6; white-space: nowrap; }

.sat-venta  { left: -120px; top: 64px; animation-delay: 0s; }
.sat-receta { left: -150px; top: 42%;  animation-delay: 1s; }
.sat-stock  { right: -126px; top: 26px; animation-delay: .5s; }

.sat-bot { left: -120px; bottom: -28px; width: 205px; display: block; animation-delay: 1.5s; }

.hero-fono {
    position: absolute;
    right: -22px;
    bottom: -52px;
    --fono-w: 150px;
    z-index: 5;
    animation: sat-flotar 5s ease-in-out infinite alternate;
    animation-delay: .8s;
}
.compo-bot-head { display: flex; align-items: center; gap: .5rem; font-size: .76rem; font-weight: 700; }
.compo-bot-logo { width: 30px; height: 30px; }
.compo-burbuja { border-radius: 11px; padding: .4rem .65rem; font-size: .72rem; margin-top: .5rem; line-height: 1.35; }
.burbuja-user { background: #323850; color: #FFFFFF; border-bottom-right-radius: 4px; margin-left: 1.3rem; }
.burbuja-bot { background: #F7F8FA; border: 1px solid #EEF1F5; border-bottom-left-radius: 4px; margin-right: 1.3rem; }

@keyframes sat-flotar {
    from { transform: translateY(0); }
    to   { transform: translateY(-9px); }
}

@media (prefers-reduced-motion: reduce) {
    .compo-card, .hero-fono { animation: none; }
}

@media (max-width: 1199.98px) {
    .sat-venta { left: -20px; }
    .sat-receta { left: -30px; }
    .sat-bot { left: -20px; }
    .sat-stock { right: -24px; }
    .hero-fono { right: -12px; }
}

@media (max-width: 767.98px) {
    .sat-venta, .sat-receta, .sat-stock { display: none; }
    .sat-bot { left: -6px; bottom: -36px; width: 185px; }
    .hero-fono { left: auto; right: -4px; bottom: -58px; --fono-w: 112px; }
}