.blog-hero {
    position: relative;
    padding: 160px 0 100px;
    border-bottom: 1px solid rgba(13, 22, 48, 0.05);
}

.blog-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    bottom: -80px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    animation: heroZoom 20s ease-in-out infinite alternate;
    z-index: 0;
}

.blog-hero-ia::before {
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        url('../img/bg-ia.jpg');
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        image-set(
            url('../img/bg-ia.avif') type('image/avif'),
            url('../img/bg-ia.webp') type('image/webp')
        );
}

.blog-hero-ciber::before {
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        url('../img/bg-ciber.jpg');
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        image-set(
            url('../img/bg-ciber.avif') type('image/avif'),
            url('../img/bg-ciber.webp') type('image/webp')
        );
}

.blog-hero-nube::before {
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        url('../img/bg-nube.jpg');
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        image-set(
            url('../img/bg-nube.avif') type('image/avif'),
            url('../img/bg-nube.webp') type('image/webp')
        );
}

/* ===== Botones flotantes en Blog (alineados con index) ===== */
.whatsapp-float {
    right: 20px;
    bottom: 20px;
    width: 55px;
    height: 55px;
}

#btnTop {
    right: 20px;
    bottom: 92px;
    width: 55px;
    height: 55px;
}

.az-chat-fab {
    right: 20px;
    bottom: 160px;
    width: 55px;
    height: 55px;
}

.az-chat-panel {
    right: 20px;
}

@media (max-width: 768px) {
    .whatsapp-float {
        right: 16px;
        bottom: 16px;
        width: 50px;
        height: 50px;
    }

    #btnTop {
        right: 16px;
        bottom: 78px;
        width: 50px;
        height: 50px;
    }

    .az-chat-fab {
        right: 16px;
        bottom: 142px;
        width: 50px;
        height: 50px;
    }
}

.blog-hero-desarrollo::before {
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        url('../img/bg-desarrollo.jpg');
}

.blog-hero-chatbots::before {
    background-image:
        linear-gradient(rgba(248, 250, 252, 0.55), rgba(248, 250, 252, 0.35)),
        url('../img/bg-chatbots.jpg');
}