.subp-banner { position: fixed; left: 0; right: 0; z-index: 999999; background: #ffffff; box-shadow: 0 -4px 20px rgba(0,0,0,0.1); padding: 12px 20px; font-family: system-ui, -apple-system, sans-serif; border-top: 1px solid #eee; }
.subp-banner-top { top: 0; border-top: none; border-bottom: 1px solid #eee; }
.subp-banner-bottom { bottom: 0; }
.subp-container { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.subp-message { font-weight: 600; color: #1e293b; font-size: 15px; display: flex; align-items: center; gap: 10px; }
.subp-pulse { width: 10px; height: 10px; min-width: 10px; min-height: 10px; flex-shrink: 0; background: #ef4444; border-radius: 50%; display: inline-block; animation: subpPulse 1.5s infinite; }
@keyframes subpPulse { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); } }
.subp-actions { display: flex; gap: 10px; }
.subp-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: 12px; text-decoration: none; font-weight: 700; font-size: 14px; transition: transform 0.2s; color: #fff; }
.subp-btn:hover { transform: translateY(-2px); }
.subp-btn-phone { background: #e74d27; }
.subp-btn-wa { background: #25d366; }

/* Animaciones de Entrada */
.subp-anim-slide.subp-banner-bottom { animation: subpSlideUp 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.subp-anim-slide.subp-banner-top { animation: subpSlideDown 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.subp-anim-fade { animation: subpFadeIn 0.8s ease; }
.subp-anim-bounce { animation: subpBounce 0.8s cubic-bezier(0.36, 0, 0.66, -0.56); }

@keyframes subpSlideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes subpSlideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }
@keyframes subpFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes subpBounce { 
    0% { transform: scale(0.3); opacity: 0; }
    50% { transform: scale(1.05); opacity: 1; }
    70% { transform: scale(0.9); }
    100% { transform: scale(1); }
}

@media (max-width: 768px) {
    .subp-container { flex-direction: column; text-align: center; gap: 12px; }
    .subp-actions { width: 100%; }
    .subp-btn { flex: 1; justify-content: center; padding: 12px; }
}
/* [CODE_COMPLETE] */