:root {
            /* PARA USAR UM ARQUIVO LOCAL:
               1. Certifique-se de que a imagem (PNG ou CUR) está na mesma pasta que o seu index.html.
               2. Use a sintaxe url('nome-do-arquivo.png').
               3. O "16 16" define o "hotspot" (ponto de clique) no centro de uma imagem 32x32.
               4. É OBRIGATÓRIO ter um fallback (como ", auto") após o url().
            */
            --cursor-paw: url('patinha.png') 16 16, auto;
        }

        body {
            font-family: 'Poppins', sans-serif;
            scroll-behavior: smooth;
            /* Aplica o cursor de patinha configurado acima */
            cursor: var(--cursor-paw);
        }

        /* Garante que o cursor se mantém em elementos clicáveis */
        a, button, .pet-card, .logo-container, .floating-wa {
            cursor: var(--cursor-paw) !important;
        }


        .glass {
            background: rgba(255, 255, 255, 0.9);
            backdrop-filter: blur(10px);
        }
        
        .hero-bg {
            /* Imagem de fundo com sobreposição para leitura */
            background-image: linear-gradient(rgba(15, 23, 42, 0.6), rgba(15, 23, 42, 0.6)), 
                              url('https://lh3.googleusercontent.com/p/AF1QipPzr5Os8RT62Tqal8eps-ndJ1L7il-PopdGJhMq=s680-w680-h510-rw');
            background-size: cover;
            background-position: center;
        }

        .pet-card:hover {
            transform: translateY(-8px);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

        .floating-wa {
            animation: bounce 2s infinite;
        }

        @keyframes bounce {
            0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
            40% { transform: translateY(-10px); }
            60% { transform: translateY(-5px); }
        }

        /* Garantir que o mapa seja responsivo */
        @media (max-width: 768px) {
            .map-container {
                height: 300px;
            }
        }
        footer a {
            color: #4CAF50;
            font-weight: bold;
            text-decoration: none;
        }

        footer a:hover {
             color: #2e7d32;
             text-decoration: underline;
        }

        