/* ==========================================================================
   Barra de contacto sticky — SOLO mobile
   Patrón de conversión para lead-gen: CTAs grandes, con texto, fijos al pie.
   Se revela al pasar el hero (que ya tiene WhatsApp + Llamar). En desktop no
   se muestra. El tracking lo dispara GTM por la URL del enlace.

   IMPORTANTE (iOS): el elemento position:fixed NO lleva transform —en Safari,
   un transform sobre un fixed lo despega del bottom—. El slide va en el wrapper
   interno (.mobile-cta-bar__inner).
   ========================================================================== */

.mobile-cta-bar {
    display: none;
}

@media (max-width: 991.98px) {
    /* Contenedor: fijo al pie, SIN transform (para que iOS lo mantenga pegado) */
    .mobile-cta-bar {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9998;
        pointer-events: none; /* cuando está oculta no intercepta taps */
    }

    /* Wrapper interno: acá va el slide (transform) y el estilo visual */
    .mobile-cta-bar__inner {
        display: flex;
        gap: 1px;
        /* Respeta el "home indicator" / notch en iPhone */
        padding-bottom: env(safe-area-inset-bottom, 0);
        box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.18);
        /* Arranca oculta abajo; se desliza al pasar el hero */
        transform: translateY(110%);
        transition: transform 0.28s ease;
        will-change: transform;
        pointer-events: auto;
    }

    .mobile-cta-bar.is-visible .mobile-cta-bar__inner {
        transform: translateY(0);
    }

    .mobile-cta-bar__btn {
        flex: 1 1 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        min-height: 56px;
        padding: 0 0.5rem;
        font-size: 1.05rem;
        font-weight: 600;
        line-height: 1;
        text-decoration: none;
        color: #fff;
        transition: background-color 0.15s ease;
    }

    .mobile-cta-bar__btn i {
        font-size: 1.2rem;
    }

    /* WhatsApp = acción primaria (más ancha y en verde de marca) */
    .mobile-cta-bar__wa {
        flex-grow: 1.6;
        background-color: #25d366;
    }

    .mobile-cta-bar__wa:hover,
    .mobile-cta-bar__wa:focus {
        background-color: #1ebe5b;
        color: #fff;
    }

    /* Llamar = acción secundaria */
    .mobile-cta-bar__call {
        background-color: #1f2937;
    }

    .mobile-cta-bar__call:hover,
    .mobile-cta-bar__call:focus {
        background-color: #111827;
        color: #fff;
    }

    /* Que la barra no tape el contenido del footer al final del scroll */
    body {
        padding-bottom: 56px;
    }

    /* Evitar duplicar el WhatsApp: ocultar el circulito flotante en mobile */
    .whatsapp-float {
        display: none !important;
    }

    /* Subir el botón "ir arriba" para que no quede debajo de la barra */
    .scroll-top {
        bottom: 72px;
    }
}