/* Mix Planet - Responsive.css */

@media (max-width: 1024px) {
    .container { padding: 0 1rem; }
    .hero-content h2 { font-size: 3rem; }
    .content-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
    .movies-grid, .series-grid, .geek-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
    .form-row { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    :root {
        --spacing-md: 1.5rem;
        --spacing-lg: 2rem;
        --spacing-xl: 2.5rem;
    }

    .main-header { padding: 1rem 0; }
    .logo-glow { gap: 0.5rem; }
    .logo-text { font-size: 1.5rem; }
    .logo-planet { font-size: 1.5rem; }

    .main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--roxo-mix-dark);
        padding: 1rem 0;
        box-shadow: var(--shadow-medium);
    }

    .main-nav.active { display: block; }
    .main-nav ul { flex-direction: column; gap: 1rem; text-align: center; }
    .main-nav a { display: block; padding: 0.75rem 0; }

    .menu-toggle { display: flex; }
    .header-actions { gap: 1rem; }

    .hero-section { min-height: 85vh; margin-top: 70px; padding: 2rem 0; }
    .hero-content h2 { font-size: 2.5rem; margin-bottom: 1rem; }
    .hero-subtitle { font-size: 1rem; margin-bottom: 1.5rem; }
    .hero-features { flex-direction: column; gap: 1rem; margin-bottom: 1.5rem; }

    .feature-item { padding: 0.875rem 1.25rem; font-size: 0.95rem; }
    .cta-button { padding: 1rem 2rem; font-size: 1rem; }

    .section { padding: 2rem 0; }
    .section-nav { flex-direction: column; align-items: center; }
    .nav-btn { width: 100%; max-width: 300px; }

    .content-grid { grid-template-columns: 1fr; gap: 1rem; }
    .music-card.featured { grid-column: span 1; }

    .movies-grid, .series-grid, .geek-grid { grid-template-columns: 1fr; }
    .top10-tabs { flex-direction: column; align-items: center; }
    .top10-tab { width: 100%; max-width: 300px; }

    .newsletter-content h2 { font-size: 1.5rem; }
    .newsletter-content p { font-size: 0.95rem; }

    .footer-content { grid-template-columns: 1fr; gap: 1.5rem; text-align: center; }
    .social-links { justify-content: center; }
    .authority-links-footer a { display: block; margin: 0.5rem 0; }

    .whatsapp-float {
        width: 55px;
        height: 55px;
        bottom: 15px;
        right: 15px;
    }
    .whatsapp-float img { width: 27px; height: 27px; }
}

@media (max-width: 480px) {
    .hero-content h2 { font-size: 2rem; }
    .hero-subtitle { font-size: 0.95rem; }
    .feature-item { padding: 0.75rem 1rem; font-size: 0.9rem; }
    .cta-button { padding: 0.875rem 1.5rem; font-size: 0.95rem; }

    .card-content { padding: 1rem; }
    .movie-content, .series-content, .geek-content { padding: 1rem; }

    .top10-list { padding: 1.25rem; }
    .form-row input, .form-row select { padding: 0.75rem; }
    .form-row button { padding: 0.75rem 1.25rem; font-size: 0.95rem; }

    .whatsapp-float { width: 50px; height: 50px; }
    .whatsapp-float img { width: 24px; height: 24px; }
}