/* 떠있는 말풍선 효과 */
.floating-bubble {
    position: fixed;
    bottom: 15px;
    left: 20px;
    z-index: 1000;
    animation: floatBubble 3s ease-in-out infinite;
}

@keyframes floatBubble {
    0% {
        transform: translateX(0) translateY(0);
    }
    50% {
        transform: translateX(10px) translateY(-5px);
    }
    100% {
        transform: translateX(0) translateY(0);
    }
}

/* 말풍선 호버 효과 */
.floating-bubble button:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

/* 모바일 대응 */
@media (max-width: 768px) {
    .floating-bubble {
        bottom: 12px;
        left: 10px;
    }
}