/* RMenuOnline v3: estilos de Homepage, pagos y microinteracciones. */
.rmo-hero-icon{max-width:190px;width:45%;margin:0 auto 1.5rem;display:block;filter:drop-shadow(0 18px 30px rgba(0,0,0,.16));animation:rmoFloat 4s ease-in-out infinite}.rmo-btn-green{background:linear-gradient(310deg,#17ad37,#98ec2d)!important;color:#fff!important;border:0!important;box-shadow:0 12px 24px rgba(23,173,55,.28)}.rmo-btn-green:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(23,173,55,.35)}.rmo-feature-icon{width:86px;height:86px;object-fit:contain;margin-bottom:1rem;filter:drop-shadow(0 12px 22px rgba(0,0,0,.12))}.rmo-soft-card{border:0;border-radius:1.25rem;box-shadow:0 20px 45px rgba(0,0,0,.08);transition:.25s ease}.rmo-soft-card:hover{transform:translateY(-5px)}.rmo-price-badge{font-size:3rem;font-weight:800;line-height:1}.rmo-steps{counter-reset:rmoStep}/* Separación de los números del bloque “Tu menú digital en tres pasos”.
   Usamos !important porque la clase Bootstrap .p-4 aplica padding con !important. */.rmo-step-card{position:relative;padding-left:6.25rem!important}.rmo-step-card:before{counter-increment:rmoStep;content:counter(rmoStep);position:absolute;left:1rem;top:1.25rem;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(310deg,#7928ca,#ff0080);color:#fff;font-weight:800}.rmo-payment-secret{display:none;font-weight:800;letter-spacing:.02em}.rmo-home-motion{animation:rmoPulse 3.5s ease-in-out infinite}@keyframes rmoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes rmoPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
