/* Responsive */
@media (max-width: 768px) {
    header {
        padding: 20px 30px;
    }
    
    .header-logo {
        font-size: 0.85rem;
        letter-spacing: 2px;
    }
    
    .hamburger-menu {
        right: 30px;
    }
    
    .menu-close {
        top: 20px;
        right: 30px;
        font-size: 1.8rem;
    }
    
    .menu-content {
        padding: 100px 30px 40px;
    }
    
    .menu-nav a {
        font-size: 2.5rem;
    }
    
    .hamburger-menu span {
        width: 25px;
    }

    .hero h1 {
        font-size: 3rem;
        letter-spacing: 4px;
    }

    .hero h2 {
        font-size: 1rem;
        letter-spacing: 2px;
    }
    
    .portfolio {
        padding: 80px 30px;
    }
    
    .portfolio-title {
        font-size: 2rem;
        margin-bottom: 40px;
    }
    
    .portfolio-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .footer-links {
        flex-direction: column;
        gap: 15px;
    }
    
    .modal-content {
        padding: 30px 20px;
        max-height: 95vh;
    }
    
    .modal-body h1 {
        font-size: 2rem;
    }
    
    .modal-close {
        right: 10px;
        top: 10px;
        font-size: 1.5rem;
    }
}