/* Custom CSS for Giovanni's Cleaning Service */
@import "tailwindcss";

.glass-card { background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.3); }

/* Hamburguesa con Contorno y Líneas de 3px */
#menu-btn { border: 2px solid #1e293b; gap: 5px; transition: 0.3s; padding: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.hamburger-line { display: block; width: 24px; height: 3px; background: #1e293b; border-radius: 2px; transition: 0.3s; }

/* Estilo de Marca en Navbar */
.site-title { font-family: 'Inter', sans-serif; letter-spacing: -0.025em; color: #1e293b; }

/* Botones Flotantes */
.whatsapp-float, .email-float { position: fixed; width: 60px; height: 60px; right: 40px; border-radius: 50%; color: white; display: flex; align-items: center; justify-content: center; font-size: 30px; z-index: 1000; box-shadow: 2px 2px 10px rgba(0,0,0,0.2); transition: 0.3s; }
.whatsapp-float { bottom: 40px; background: #25D366; }
.email-float { bottom: 110px; background: #4285F4; }
.whatsapp-float:hover, .email-float:hover { transform: scale(1.1); }

/* Botones Minimal */
.minimal-button { background: #3b82f6; transition: 0.3s; color: white; }
.minimal-button:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(59, 130, 246, 0.5); }

/* Hero Overlay */
.hero-image-overlay { background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('../img/hero-bg.jpg') center/cover fixed; }

@media (max-width: 768px) {
    .whatsapp-float, .email-float { width: 50px; height: 50px; right: 20px; font-size: 24px; }
    .email-float { bottom: 80px; }
    .whatsapp-float { bottom: 20px; }
}

/* --- NUEVO: ESTILOS PARA LAS BURBUJAS --- */
.bubble-effect {
    position: fixed;
    bottom: -50px; /* Aparecen desde abajo de la pantalla visual */
    background: rgba(173, 216, 230, 0.4); /* Color azul claro transparente */
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    pointer-events: none; /* No interfieren con los clics */
    z-index: 999;
    animation: floatUp 4s linear infinite;
}

@keyframes floatUp {
    0% {
        transform: translateY(0) translateX(0);
        opacity: 0.8;
    }
    100% {
        transform: translateY(-100vh) translateX(50px);
        opacity: 0;
    }
}