/* =====================================================
   Beneemm Primal Investments - Responsive Styles
===================================================== */

@media (max-width: 1024px) {
    .grid-3 { grid-template-columns: repeat(2, 1fr); }
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .hero-content h1 { font-size: 42px; }
    .slider-arrow.prev { left: 0; }
    .slider-arrow.next { right: 0; }
}

@media (max-width: 900px) {
    .dashboard-sidebar { width: 220px; }
    .dashboard-main { padding: 30px 20px; }
    .grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .navbar-menu {
        position: fixed;
        top: 78px; left: 0;
        width: 100%;
        background: var(--cream);
        flex-direction: column;
        align-items: flex-start;
        padding: 20px 24px 30px;
        gap: 18px;
        box-shadow: 0 10px 20px rgba(15,42,74,0.08);
        display: none;
    }
    .navbar-menu.active { display: flex; }
    .navbar-toggle { display: flex; }
    .nav-dropdown-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; display: none; padding-left: 10px; }
    .nav-dropdown.active .nav-dropdown-menu { display: block; }

    .hero { min-height: auto; padding: 130px 0 70px; text-align: center; }
    .hero-content { max-width: 100%; }
    .hero-content h1 { font-size: 34px; }
    .hero-buttons { justify-content: center; }

    .page-hero { padding: 130px 0 60px; }
    .page-hero h1 { font-size: 30px; }

    .section { padding: 60px 0; }
    .section-title h2 { font-size: 28px; }

    .grid-3, .grid-4 { grid-template-columns: 1fr; }

    .dashboard-wrap { flex-direction: column; }
    .dashboard-sidebar { width: 100%; display: flex; overflow-x: auto; padding: 12px 0; }
    .dashboard-sidebar a { flex-direction: column; gap: 4px; font-size: 12px; padding: 10px 16px; white-space: nowrap; border-left: none; border-bottom: 3px solid transparent; }
    .dashboard-sidebar a.active, .dashboard-sidebar a:hover { border-left: none; border-bottom-color: var(--gold); }

    .form-box { padding: 32px 24px; }

    .footer-container { grid-template-columns: 1fr !important; text-align: center; }
    .footer-social { justify-content: center; }

    .cta-band { margin: 0 16px; padding: 50px 24px; }

    .slider-arrow { display: none; }
}

@media (max-width: 480px) {
    .hero-content h1 { font-size: 28px; }
    .navbar-logo img { height: 42px; }
    .btn { padding: 12px 24px; font-size: 14px; }
    .stat-card { flex-direction: column; text-align: center; }
    table th, table td { padding: 12px; font-size: 13px; }
}