/* Responsividade para tablets */
@media (max-width: 768px) {
    .hero h1 {
        font-size: 2rem;
    }

    .hero p {
        font-size: 1rem;
    }

    .content-section {
        padding: 2rem 1.5rem;
    }

    .content-section h2 {
        font-size: 1.5rem;
    }

    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .sitemap-links {
        grid-template-columns: 1fr;
    }

    .whatsapp-float {
        bottom: 20px;
        right: 20px;
    }

    .whatsapp-button {
        padding: 12px 20px; /* Ajuste o padding para telas menores */
        font-size: 1rem;
        width: auto; /* Permite que o botão se ajuste ao conteúdo */
    }

    .whatsapp-button .whatsapp-icon {
        font-size: 1.8rem; /* Ícone um pouco maior em tablets */
    }

    .whatsapp-button span {
        font-size: 1rem;
    }

    .whatsapp-text {
        font-size: 1rem;
    }
}

/* Responsividade para celulares */
@media (max-width: 480px) {
    .hero {
        padding: 3rem 15px;
    }

    .hero h1 {
        font-size: 1.6rem;
    }

    .hero p {
        font-size: 0.95rem;
    }

    .cta-button {
        padding: 12px 30px;
        font-size: 1rem;
    }

    .content-section {
        padding: 1.5rem 1rem;
        margin: 1rem 0;
    }

    .content-section h2 {
        font-size: 1.3rem;
    }

    .logo {
        font-size: 1.4rem;
    }

    .logo-emoji {
        font-size: 1.6rem;
    }

    .whatsapp-float {
        bottom: 15px;
        right: 15px;
    }

    .whatsapp-button {
        padding: 10px; /* Reduz o padding para celulares */
        width: 50px; /* Define uma largura fixa para o ícone */
        height: 50px; /* Define uma altura fixa para o ícone */
        border-radius: 50%; /* Faz com que seja um círculo */
    }

    .whatsapp-button .whatsapp-icon {
        font-size: 2rem; /* Aumenta o tamanho do ícone para celulares */
        margin-right: 0; /* Remove a margem para centralizar o ícone */
    }

    .whatsapp-button span:not(.whatsapp-icon) {
        display: none; /* Esconde qualquer texto que não seja o ícone */
    }

    .whatsapp-text {
        display: none; /* Mantém escondido caso use esta classe especificamente */
    }

    footer {
        padding: 2rem 15px 1rem;
    }

    .footer-content {
        gap: 1.5rem;
    }

    .footer-section h3 {
        font-size: 1.1rem;
    }

    .sitemap-container h1 {
        font-size: 1.8rem;
    }

    .sitemap-category {
        padding: 1.5rem 1rem;
    }

    .sitemap-category h2 {
        font-size: 1.4rem;
    }
}

/* Responsividade para telas grandes */
@media (min-width: 1400px) {
    .hero h1 {
        font-size: 3rem;
    }

    .hero p {
        font-size: 1.3rem;
    }

    .content-section h2 {
        font-size: 2.2rem;
    }
}