/* ===== RESPONSIVE (DigitalOcean Breakpoints) ===== */

@media (max-width: 1024px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .feature-card:nth-child(2n) { border-right: none; }
    .feature-card:nth-child(n+3) { border-top: 1px solid var(--color-gray-100); }

    .earn-redeem-section .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .earn-redeem-section .feature-card:nth-child(2n) { border-right: none; }
    .earn-redeem-section .feature-card:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,0.08); }

    .steps-grid { grid-template-columns: repeat(2, 1fr); }
    .step-card:nth-child(2n) { border-right: none; }
    .step-card:nth-child(n+3) { border-top: 1px solid var(--color-gray-100); }
}

@media (max-width: 900px) {
    .hero {
        flex-direction: column;
        text-align: center;
        padding: 100px var(--content-padding-x) var(--space-12);
    }
    .hero-content { max-width: 100%; }
    .hero-subtitle { max-width: 100%; }
    .hero-actions { justify-content: center; }
    .hero-stats-mini { justify-content: center; }
    .hero-visual { display: none; }

    .section-header { text-align: center; max-width: 100%; }
    .section-desc { margin: 0 auto; }

    .packages-grid {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }

    .profile-dropdown-menu { width: 100%; }

    .footer-content {
        grid-template-columns: 1fr;
        gap: var(--space-8);
        text-align: center;
    }
    .footer-links { align-items: center; }
    .footer-brand { align-items: center; }
}

@media (max-width: 680px) {
    :root { --section-padding: 60px 0; }

    .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--color-gray-0);
        flex-direction: column;
        padding: var(--space-5) var(--space-6);
        gap: var(--space-4);
        border-bottom: 1px solid var(--color-border);
    }
    .nav-links.active { display: flex; }
    .nav-toggle { display: flex; }

    .hero-title { font-size: 1.8rem; }

    .features-grid { grid-template-columns: 1fr; }
    .feature-card {
        border-right: none !important;
        border-top: 1px solid var(--color-gray-100) !important;
    }
    .feature-card:first-child { border-top: none !important; }

    .earn-redeem-section .features-grid { grid-template-columns: 1fr; }
    .earn-redeem-section .feature-card {
        border-top-color: rgba(255,255,255,0.08) !important;
    }
    .earn-redeem-section .feature-card:first-child { border-top: none !important; }

    .packages-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-3);
    }
    .package-card { padding: var(--space-4); }
    .package-price { font-size: var(--text-xl); }

    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .stat-card { border-bottom: 1px solid var(--color-gray-100); }

    .steps-grid { grid-template-columns: 1fr; }
    .step-card {
        border-right: none !important;
        border-top: 1px solid var(--color-gray-100) !important;
    }
    .step-card:first-child { border-top: none !important; }

    .user-input-bar { flex-direction: column; }

    .hero-stats-mini { flex-direction: column; gap: var(--space-3); }
    .hero-stat-divider { width: 50px; height: 1px; }

    .leaderboard-table { font-size: var(--text-sm); }
    .leaderboard-table thead th,
    .leaderboard-table td { padding: 10px var(--space-3); }

    .hero-command { font-size: var(--text-xs); padding: 8px var(--space-3); }
}

@media (max-width: 400px) {
    .packages-grid { grid-template-columns: 1fr; }
}
