/* WhatsApp floating bubble — responsivo (desktop / tablet / celular) */
.whats-app-bubble {
    position: fixed;
    z-index: 900;
    /* Desktop (padrão) */
    width: 96px;
    height: 96px;
    bottom: 28px;
    right: 28px;
    transition: transform 0.2s;
}

.whats-app-bubble:hover {
    transform: scale(1.06);
}

.whats-app-bubble:focus-visible {
    outline: 3px solid var(--teal-dark);
    outline-offset: 3px;
}

.wa-icon {
    display: block;
    object-fit: contain;
    flex-shrink: 0;
    mix-blend-mode: screen;
}

.wa-icon--header {
    mix-blend-mode: normal;
}

.wa-icon--bubble {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 6px 16px rgba(0, 131, 97, 0.4));
}

.wa-icon--contact {
    width: 24px;
    height: 24px;
}

.btn .wa-icon {
    width: 18px;
    height: 18px;
}

.btn--whatsapp .wa-icon,
.btn--whatsapp .btn__wa-icon {
    mix-blend-mode: normal;
    flex-shrink: 0;
}

.cta-final__actions .btn--whatsapp {
    gap: 8px;
}

/* Tablet */
@media (max-width: 1024px) {
    .whats-app-bubble {
        width: 112px;
        height: 112px;
        bottom: 24px;
        right: 24px;
    }
}

/* Celular */
@media (max-width: 768px) {
    .whats-app-bubble {
        width: 104px;
        height: 104px;
        bottom: 18px;
        right: 18px;
    }
}

/* Celular pequeno */
@media (max-width: 480px) {
    .whats-app-bubble {
        width: 96px;
        height: 96px;
        bottom: 14px;
        right: 14px;
    }
}

/* Em zoom alto no mobile, evita cobrir CTAs do rodapé */
@media (max-width: 767px) and (min-resolution: 1.5dppx) {
    .whats-app-bubble {
        bottom: 12px;
        right: 12px;
    }
}
