/* Tablet Styles (768px - 1024px) */
@media screen and (max-width: 1024px) {
    .hero-inner {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .hero-cta {
        justify-content: center;
    }
    
    .hero-image {
        max-width: 500px;
        margin: 0 auto;
    }
    
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .categories-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile Styles (320px - 767px) */
@media screen and (max-width: 767px) {
    :root {
        --header-height: 64px;
    }
    
    .container {
        padding: 0 16px;
    }
    
    .primary-menu {
        display: none;
    }
    
    .mobile-menu-toggle {
        display: flex;
    }
    
    .hero-section {
        padding: 48px 0;
    }
    
    .hero-content h1 {
        font-size: clamp(1.75rem, 8vw, 2.5rem);
    }
    
    .section {
        padding: 48px 0;
    }
    
    .section-title {
        font-size: 1.75rem;
    }
    
    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    
    .category-card {
        padding: 24px 16px;
    }
    
    .products-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .blog-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .deals-grid {
        grid-template-columns: 1fr;
    }
    
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    
    .newsletter-form {
        flex-direction: column;
    }
    
    .pros-cons-grid {
        grid-template-columns: 1fr;
    }
    
    .whatsapp-float {
        bottom: 16px;
        right: 16px;
    }
    
    .whatsapp-button {
        padding: 12px 20px;
    }
    
    .whatsapp-button .whatsapp-text {
        display: none;
    }
    
    .hero-cta {
        flex-direction: column;
    }
    
    .hero-float-card {
        display: none;
    }
    
    .comparison-table-wrapper {
        margin: 0 -16px;
        padding: 0 16px;
    }
    
    .search-overlay {
        top: var(--header-height);
    }
}

/* Small Mobile (320px - 480px) */
@media screen and (max-width: 480px) {
    .categories-grid {
        grid-template-columns: 1fr;
    }
    
    .product-actions {
        flex-direction: column;
    }
    
    .section-title {
        font-size: 1.5rem;
    }
}