/*!
 * SVI Landing — Custom Styles
 * Estilos específicos de la landing page jsmdesignweb.com
 * Separado del tema base new-age.css para facilitar mantenimiento.
 */

/* ============================================================
   1. BADGE DE VERSIÓN (hero)
   ============================================================ */
.badge-version {
    display: inline-block;
    font-size: 0.9rem;
    padding: 6px 12px;
    margin-bottom: 15px;
    background-color: #fdcc52;
    color: #1d1f20;
    border-radius: 4px;
    font-weight: 600;
}

/* ============================================================
   2. BOTÓN FLOTANTE DE WHATSAPP
   ============================================================ */
.whatsapp-float {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 9999;
    width: 60px;
    height: 60px;
    background: #25D366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.whatsapp-float:hover,
.whatsapp-float:focus {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
    color: #fff;
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* ============================================================
   3. REDES SOCIALES — COLORES DE FONDO
   ============================================================ */
.social-whatsapp-bg { background: #25D366; }
.social-android-bg  { background: #A4C639; }
.social-meli-bg     { background: #FFE600; }
.social-meli-bg .social-icon { color: #2D3277; }

/* ============================================================
   4. HERO IMAGE — performance
   ============================================================ */
.hero-img {
    width: 100%;
    height: auto;
}
