/* ==========================================
   RESPONSIVE STYLES
   All Media Queries and Mobile Optimizations
   ========================================== */

@media (max-width: 768px) {
    /* Navigation */
    nav ul li {
        margin-bottom: 0.3rem;
    }

    .logo h1 {
        font-size: 1.5rem;
    }

    .dropdown-toggle {
        font-size: 0.9rem;
        padding: 0.7rem 0.8rem;
    }

    .dropdown-menu li a {
        padding: 0.6rem 0.8rem;
        font-size: 0.9rem;
    }

    nav ul li a {
        padding: 0.7rem 0.8rem;
        font-size: 0.95rem;
    }

    /* Modal */
    .modal-content {
        padding: 2rem;
        width: 95%;
    }
}